/* Hybrid Pattern Studio — member page styles (C2 · 2026-11-03). Same design as the offline Pattern Studio. */
:root{
  --bg:#f6f3eb;--bg2:#fbf9f4;--card:#ffffff;--card2:#faf7f0;--card3:#ffffff;
  --line:rgba(26,32,54,.10);--line2:rgba(176,128,32,.35);
  --text:#161b2e;--muted:#5e6679;--dim:#8a91a3;
  --gold:#b8862b;--gold2:#8f6418;--gold3:#f3d58a;--goldtxt:#9a6d17;
  --hot:#e0452b;--cold:#2f6fd6;--due:#8a5cf0;--ok:#12996a;--bad:#d9364f;
  --t-focus:#b8860b;--t-top:#d97706;--t-hot:#e0452b;--t-strong:#2f6fd6;--t-full:#5b6780;
  --glass:rgba(250,248,242,.88);--shadow:0 10px 30px rgba(35,30,15,.08);--shadow2:0 2px 8px rgba(35,30,15,.06);
  --glow1:rgba(232,194,106,.22);--glow2:rgba(80,130,220,.08);--okbg:rgba(18,153,106,.08);--sigtxt:#0d7a53;
  --r:16px;
}
:root[data-theme="dark"]{
  --bg:#060a13;--bg2:#0b1120;--card:#0f172a;--card2:#141f37;--card3:#1a2744;
  --line:rgba(255,255,255,.07);--line2:rgba(232,194,106,.25);
  --text:#eef1f7;--muted:#8b95ab;--dim:#5d6780;
  --gold:#e8c26a;--gold2:#b8882c;--gold3:#fff1c9;--goldtxt:#e8c26a;
  --hot:#ff6b57;--cold:#4ea8ff;--due:#b38bff;--ok:#35d399;--bad:#ff5d73;
  --t-focus:#f5cf6b;--t-top:#ffb454;--t-hot:#ff7a59;--t-strong:#6aa8ff;--t-full:#9aa6c0;
  --glass:rgba(6,10,19,.88);--shadow:0 10px 30px rgba(0,0,0,.35);--shadow2:0 2px 6px rgba(0,0,0,.3);
  --glow1:rgba(232,194,106,.10);--glow2:rgba(78,168,255,.07);--okbg:rgba(53,211,153,.07);--sigtxt:#8fe9c4;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;
  background-image:radial-gradient(900px 500px at 85% -10%,var(--glow1),transparent 60%),radial-gradient(700px 500px at -10% 10%,var(--glow2),transparent 60%);background-attachment:fixed;line-height:1.45}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px}
header{padding:22px 0 10px}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:900;font-size:14px;color:#1a1206;background:linear-gradient(145deg,var(--gold3),var(--gold) 40%,var(--gold2));box-shadow:0 6px 20px rgba(232,194,106,.25);flex:none}
.brand h1{font-size:20px;font-weight:800}
.brand h1 span{background:linear-gradient(90deg,var(--gold2),var(--gold) 60%,var(--gold2));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand p{font-size:12px;color:var(--muted);letter-spacing:.4px;text-transform:uppercase}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;padding:3px 9px;border-radius:99px;border:1px solid var(--line2);color:var(--goldtxt);white-space:nowrap}
.hdr-r{margin-left:auto;display:flex;gap:8px;align-items:center}
.themeBtn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:99px;border:1px solid var(--line2);background:var(--card);font-size:12.5px;font-weight:700;color:var(--goldtxt);box-shadow:var(--shadow2);white-space:nowrap;flex:none}
.ctx{position:sticky;top:0;z-index:20;background:var(--glass);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:10px 0}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.seg{display:inline-flex;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:3px}
.seg button{padding:7px 14px;border-radius:9px;font-weight:700;font-size:14px;color:var(--muted)}
.seg button.on{background:linear-gradient(145deg,var(--gold3),var(--gold) 50%,var(--gold2));color:#1a1206;box-shadow:0 2px 10px rgba(232,194,106,.3)}
select,input[type=text],input[type=number],input[type=date],textarea{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:8px 11px;outline:none;min-width:0}
[data-theme=dark] input,[data-theme=dark] select{color-scheme:dark}
select:focus,input:focus,textarea:focus{border-color:var(--gold2)}
select{padding-right:28px;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%;background-size:5px 5px;background-repeat:no-repeat}
.tabs{display:flex;gap:4px;margin-top:10px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{padding:8px 14px;border-radius:10px;color:var(--muted);font-weight:600;font-size:14px;white-space:nowrap;border:1px solid transparent}
.tabs button.on{color:var(--goldtxt);border-color:var(--line2);background:rgba(232,194,106,.12)}
main{padding:16px 0 40px}
section.tab{display:none}
section.tab.on{display:block}
.card{background:linear-gradient(180deg,var(--card),var(--bg2));border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px}
.card{box-shadow:var(--shadow2)}
.card.gold{border-color:var(--line2);box-shadow:var(--shadow)}
.card h2{font-size:15px;font-weight:750;margin-bottom:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.n{font-size:11px;color:var(--goldtxt);border:1px solid var(--line2);border-radius:99px;padding:1px 8px;font-weight:600}
.sub{font-size:12.5px;color:var(--muted)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:640px){.grid2{grid-template-columns:1fr}.grid4{grid-template-columns:1fr 1fr}}
label.f{display:block;font-size:12px;color:var(--muted);margin:10px 0 5px;font-weight:600}
.full{width:100%}
.ball{width:30px;height:30px;border-radius:50%;display:inline-grid;place-items:center;font-weight:800;font-size:15px;color:#1b1408;flex:none;
  background:radial-gradient(circle at 32% 28%,#fff 0,#fbeec8 16%,#e8c26a 48%,#8f6418 100%);box-shadow:inset 0 -2px 4px rgba(0,0,0,.35),0 2px 6px rgba(0,0,0,.45)}
.ball.sig{background:radial-gradient(circle at 32% 28%,#fff 0,#d9fff0 16%,#35d399 50%,#0d6b49 100%);width:40px;height:40px;font-size:19px;box-shadow:inset 0 -2px 4px rgba(0,0,0,.35),0 0 18px rgba(53,211,153,.35)}
.ball.sm{width:25px;height:25px;font-size:13px}
.ball.xs{width:21px;height:21px;font-size:11.5px}
.sigbox{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border-radius:14px;background:var(--okbg);border:1px solid rgba(53,211,153,.3);margin-top:6px}
.sigbox .lbl{font-size:11px;color:var(--sigtxt);text-transform:uppercase;letter-spacing:.6px;font-weight:700;margin-right:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:12px;font-weight:750;font-size:15px}
.btn.primary{background:linear-gradient(145deg,var(--gold3),var(--gold) 45%,var(--gold2));color:#1a1206;box-shadow:0 6px 22px rgba(232,194,106,.28)}
.btn.ghost{border:1px solid var(--line);background:var(--card2)}
.btn.sm{padding:7px 12px;font-size:13px;border-radius:10px}
.btn[disabled]{opacity:.45;pointer-events:none}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;align-items:center}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.chip{font-size:12px;padding:4px 10px;border-radius:99px;background:var(--card2);border:1px solid var(--line);color:var(--muted)}
.chip b{color:var(--text)}
.chip.inc{border-color:rgba(53,211,153,.45);color:var(--ok)}
.chip.exc{border-color:rgba(255,93,115,.45);color:var(--bad)}
.toggle{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);cursor:pointer}
.toggle input{accent-color:var(--gold);width:16px;height:16px}

/* tier strip */
.tstrip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin-top:4px}
.tchip{border-radius:12px;padding:8px 6px;text-align:center;border:1px solid var(--line);background:var(--card2)}
.tchip .v{font-size:17px;font-weight:850;font-variant-numeric:tabular-nums}
.tchip .l{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.t-focus{--tc:var(--t-focus)}.t-top{--tc:var(--t-top)}.t-hot{--tc:var(--t-hot)}.t-strong{--tc:var(--t-strong)}.t-full{--tc:var(--t-full)}
.tchip[class*="t-"] .v{color:var(--tc)}
.tchip[class*="t-"]{border-color:color-mix(in srgb,var(--tc) 30%,transparent)}
.tier{margin-top:16px}
.tier-h{display:flex;align-items:center;gap:10px;margin-bottom:2px}
.tier-x{font-size:12px;color:var(--muted);margin-bottom:9px}
.tier-h .tl{font-size:13px;font-weight:850;letter-spacing:.8px;text-transform:uppercase;color:var(--tc)}
.tier-h .ts{font-size:11.5px;color:var(--dim)}
.tier-h::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,color-mix(in srgb,var(--tc) 40%,transparent),transparent)}
.tier-h .cp{order:3;font-size:11.5px;color:var(--goldtxt);border:1px solid var(--line2);border-radius:8px;padding:3px 9px;font-weight:700}
.sets{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:8px}
@media(max-width:420px){.sets{grid-template-columns:repeat(2,minmax(0,1fr))}}
.set{display:flex;align-items:center;gap:4px;padding:15px 8px 9px;border-radius:13px;background:var(--card2);border:1px solid var(--line);position:relative;justify-content:center;transition:.12s}
.set:active{transform:scale(.97)}
.set .rk{position:absolute;top:3px;left:8px;font-size:10px;font-weight:800;color:var(--tc,var(--dim))}
.set .ct{position:absolute;top:3px;right:8px;font-size:9px;font-weight:800;letter-spacing:.4px;color:var(--dim);text-transform:uppercase}
.set.shm{box-shadow:0 0 0 2px #1f9d55 inset}.set .shm{position:absolute;bottom:1px;left:8px;font-size:9px;font-weight:800;letter-spacing:.4px;color:#1f9d55}
.seattbl td,.seattbl th{white-space:nowrap}
.locked .card{opacity:.75}.t-extra{--tc:#7a5cc4}.badge.t-extra{background:rgba(122,92,196,.12);color:#7a5cc4}
.set .sc{position:absolute;bottom:1px;right:7px;font-size:9px;color:var(--dim)}
.set.pm{box-shadow:0 0 0 2px var(--gold) inset}.set.shm.pm{box-shadow:0 0 0 2px #1f9d55 inset,0 0 0 4px var(--gold) inset}
.set .pmk{position:absolute;bottom:1px;left:50%;transform:translateX(-50%);font-size:9px;font-weight:800;letter-spacing:.4px;color:var(--goldtxt)}
.pairbox{display:grid;gap:4px;margin:2px 0 0 24px}.pairbox input{max-width:220px}
.set{box-shadow:var(--shadow2)}
.set.t-focus{border-color:color-mix(in srgb,var(--t-focus) 50%,transparent);background:linear-gradient(160deg,rgba(245,207,107,.18),var(--card2) 60%)}
.set.found{outline:2px solid var(--ok);box-shadow:0 0 18px rgba(53,211,153,.35)}
details.more{margin-top:14px}
details.more>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--card2);font-weight:700;font-size:13.5px}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:"▾";margin-left:auto;color:var(--goldtxt)}
details.more[open]>summary::after{content:"▴"}
.empty{padding:22px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line);border-radius:14px}
.find{display:flex;gap:8px;margin-top:10px}
.find input{flex:1}
.findres{margin-top:10px;padding:12px;border-radius:12px;font-size:14px;display:none}
.findres.ok{display:block;background:var(--okbg);border:1px solid rgba(53,211,153,.3)}
.findres.no{display:block;background:var(--card2);border:1px solid var(--line);color:var(--muted)}
.bigtier{font-weight:850;color:var(--tc)}

/* digit board */
.board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:12px}
.tile{border-radius:14px;background:var(--card2);border:1px solid var(--line);padding:9px 5px 7px;text-align:center;position:relative;transition:.15s}
.tile .dg{font-size:26px;font-weight:850;line-height:1.1}
.tile .tag{font-size:9.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:1px 6px;border-radius:99px;display:inline-block;margin:2px 0 4px}
.tag.hot{background:rgba(255,107,87,.15);color:var(--hot)}
.tag.cold{background:rgba(78,168,255,.14);color:var(--cold)}
.tag.warm{background:color-mix(in srgb,var(--muted) 12%,transparent);color:var(--muted)}
.tile .od{position:absolute;top:5px;right:5px;width:8px;height:8px;border-radius:50%;background:var(--due);box-shadow:0 0 10px var(--due)}
.tile .st{font-size:10.5px;color:var(--muted);line-height:1.4}
.tile .au{position:absolute;top:4px;left:6px;font-size:8.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--gold)}
.tile .st b{color:var(--text)}
.tile .tb{display:flex;gap:4px;margin-top:7px}
.tile .tb button{flex:1;height:30px;border-radius:8px;background:var(--card);border:1px solid var(--line);font-weight:800;font-size:14px}
.tile .tb .ck{color:var(--ok)}
.tile .tb .cx{color:var(--bad)}
.tile.inc{border-color:var(--ok);box-shadow:0 0 0 1px var(--ok) inset,0 0 16px rgba(53,211,153,.18)}
.tile.inc .tb .ck{background:var(--ok);color:#04150e}
.tile.exc{opacity:.55;border-color:var(--bad)}
.tile.exc .tb .cx{background:var(--bad);color:#1a0508}
.tile.exc .dg{text-decoration:line-through;text-decoration-color:var(--bad)}
@media(max-width:480px){.board{gap:5px}.tile{padding:8px 3px 6px}.tile .dg{font-size:22px}.tile .st{font-size:9.5px}.tile .tag{font-size:8.5px;padding:1px 4px}}
.legend{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:middle}

/* back-test */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-top:12px}
.kpi{background:var(--card2);border:1px solid var(--line);border-radius:13px;padding:11px 12px}
.kpi .v{font-size:22px;font-weight:850;font-variant-numeric:tabular-nums}
.kpi .l{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.kpi .s{font-size:11.5px;color:var(--muted);margin-top:2px}
.kpi[class*="t-"] .v{color:var(--tc)}
.kpi[class*="t-"]{border-color:color-mix(in srgb,var(--tc) 28%,transparent)}
.bar{height:8px;border-radius:99px;background:var(--card2);overflow:hidden;margin-top:12px;display:none}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold2),var(--gold));transition:width .15s}
.lead{font-size:14.5px;margin-top:12px;line-height:1.5}
.lead b{color:var(--goldtxt)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:650;padding:7px 8px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--card);white-space:nowrap}
td{padding:7px 8px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;white-space:nowrap}
td.z{color:var(--dim)}
.tscroll{overflow:auto;max-height:460px;border-radius:12px;border:1px solid var(--line);margin-top:10px}
.tb-tier{font-weight:800;color:var(--tc)}
.rk-b{font-weight:800}
.b-str{color:var(--goldtxt);font-weight:800}
.b-box{color:var(--ok);font-weight:700}
.drop{border:1.5px dashed var(--line2);border-radius:14px;padding:22px;text-align:center;background:rgba(232,194,106,.03);cursor:pointer;margin-top:12px}
.drop.over{background:rgba(232,194,106,.09)}
.drop b{color:var(--goldtxt)}
textarea{width:100%;min-height:80px;resize:vertical;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.note{font-size:12px;color:var(--muted);margin-top:8px}
.warn{font-size:12.5px;color:#b26a00;background:rgba(255,190,90,.12);border:1px solid rgba(255,190,90,.35);padding:8px 11px;border-radius:10px;margin-top:10px}
.km{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin-top:10px}
.km div{display:flex;align-items:center;gap:6px;background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:6px 8px;font-size:13px}
.km input{width:44px;padding:4px 6px;text-align:center}
.sl{display:grid;grid-template-columns:150px 1fr 44px;gap:10px;align-items:center;margin-top:12px;font-size:13px}
@media(max-width:480px){.sl{grid-template-columns:1fr 44px}.sl>span{grid-column:1/-1}}
.sl input{accent-color:var(--gold)}
.qt{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:6px;margin-top:8px}
.qt label{display:flex;justify-content:space-between;align-items:center;gap:6px;background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:6px 8px;font-size:12.5px}
.qt input{width:52px;padding:4px 6px;text-align:center}
footer{border-top:1px solid var(--line);padding:18px 0 30px;font-size:11.5px;color:var(--dim)}
footer button{color:var(--dim);text-decoration:underline;font-size:11.5px}
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(30px);opacity:0;background:var(--card3);box-shadow:var(--shadow);border:1px solid var(--line2);padding:10px 16px;border-radius:12px;font-size:13.5px;transition:.25s;z-index:99;pointer-events:none;max-width:90vw}
#toast.on{opacity:1;transform:translateX(-50%)}
[data-theme=dark] .brand h1 span{background:linear-gradient(90deg,var(--gold3),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
body:not(.admin) .admin-only{display:none!important}
.admin-badge{display:none}
body.admin .admin-badge{display:inline-flex;background:rgba(179,139,255,.12);border-color:rgba(179,139,255,.35);color:#cdb6ff}
[hidden]{display:none!important}
.qv{display:flex;flex-wrap:wrap}
.qv button{flex:1;min-width:64px}
body.selmode .set{cursor:pointer}
.set.sel{outline:3px solid var(--gold);box-shadow:0 0 0 4px color-mix(in srgb,var(--gold) 25%,transparent)}
.set.sel::after{content:"✓";position:absolute;bottom:2px;left:8px;font-size:12px;font-weight:900;color:var(--goldtxt)}
.selbar{position:fixed;left:50%;transform:translateX(-50%);bottom:14px;z-index:60;display:none;gap:8px;align-items:center;flex-wrap:wrap;justify-content:center;
  background:var(--card3);border:1px solid var(--line2);box-shadow:var(--shadow);border-radius:16px;padding:10px 12px;max-width:calc(100vw - 24px)}
body.selmode .selbar{display:flex}
.selbar b{color:var(--goldtxt)}

/* generating animation */
.gen{padding:22px 16px;text-align:center}
.gen .roll{display:flex;gap:10px;justify-content:center;margin:6px 0 14px}
.gen .roll .ball{width:46px;height:46px;font-size:22px;animation:bob .5s ease-in-out infinite alternate}
.gen .roll .ball:nth-child(2){animation-delay:.12s}.gen .roll .ball:nth-child(3){animation-delay:.24s}.gen .roll .ball:nth-child(4){animation-delay:.36s}.gen .roll .ball:nth-child(5){animation-delay:.48s}
@keyframes bob{from{transform:translateY(0) rotate(-8deg)}to{transform:translateY(-10px) rotate(8deg)}}
.gen .step{font-weight:750;font-size:14.5px;min-height:22px}
.gen .gbar{height:6px;border-radius:99px;background:var(--card2);overflow:hidden;margin:12px auto 0;max-width:320px}
.gen .gbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold2),var(--gold));transition:width .25s linear}
.set.pop{animation:pop .38s cubic-bezier(.2,.9,.3,1.3) both;animation-delay:var(--d,0s)}
@keyframes pop{from{opacity:0;transform:translateY(10px) scale(.85)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.gen .roll .ball,.set.pop{animation:none}}

.pickrow{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center;margin-top:10px}
@media(max-width:480px){.pickrow{grid-template-columns:auto 1fr}.pickrow .rc{grid-column:1/-1}}
.asof{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--line2);background:var(--card2);font-size:13px}
.asof b{color:var(--goldtxt)}
.nextres{margin-top:12px;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--card2)}
.nextres .nr{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.nextres .nr:last-child{border-bottom:0}

/* recent results */
.recent{display:grid;gap:8px;margin-top:12px}
.rday{display:grid;grid-template-columns:52px 1fr;align-items:center;gap:8px}
.rday .rc{display:flex;gap:6px;flex-wrap:wrap}
.rday .dl{font-size:12px;font-weight:750;color:var(--muted);min-width:58px}
.rchip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px 6px 8px;border-radius:12px;border:1px solid var(--line);background:var(--card2);box-shadow:var(--shadow2);transition:.12s}
.rchip .ss{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.rchip.on{border-color:var(--gold);background:linear-gradient(145deg,rgba(243,213,138,.35),var(--card2));box-shadow:0 0 0 2px color-mix(in srgb,var(--gold) 35%,transparent)}
.rchip.on .ss{color:var(--goldtxt)}
/* simple back-test */
.hitlist{display:grid;gap:8px;margin-top:10px}
.hit{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;padding:10px 12px;border-radius:13px;border:1px solid var(--line);background:var(--card2)}
.hit .meta{font-size:12px;color:var(--muted)}
.hit .meta b{color:var(--text)}
.hit .bl{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.hit .rt{text-align:right}
.hit .rk{font-size:17px;font-weight:850}
.rgrp{display:flex;flex-direction:column;align-items:flex-start;gap:3px;width:100%}.rgrp .gl{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}.rgrp .gc{display:flex;gap:4px;flex-wrap:wrap}.rgrp .rchip{padding:4px 5px;gap:2px}.rgrp .rchip .ball{width:18px;height:18px;font-size:10.5px}
.play.multi .pd{grid-template-columns:68px auto 1fr}.mynums{display:flex;gap:6px}.mynums input{min-width:0}
.play{padding:11px 12px;border-radius:13px;border:1px solid var(--line);background:var(--card2)}
.play.won{border-color:color-mix(in srgb,var(--t-focus) 55%,transparent)}
.play .ph{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.play .ph .badge{flex:none;margin-top:1px}
.play .meta{font-size:12px;color:var(--muted)}.play .meta b{color:var(--text)}.play .pmh{color:var(--goldtxt)}
.play .pds{display:grid;gap:3px;margin-top:8px}
.play .pd{display:grid;grid-template-columns:68px 70px 1fr;gap:8px;align-items:center;font-size:12.5px;padding:4px 8px;border-radius:9px}
.play .pd.win{background:color-mix(in srgb,var(--t-focus) 14%,transparent)}.play .pd.oth{opacity:.75}
.play .pd .ps{color:var(--muted);font-weight:700}.play .pd .pr{font-size:15.5px;font-weight:850;letter-spacing:.6px;font-variant-numeric:tabular-nums}
.play .pd .pr.w{color:var(--dim);font-weight:600}.play .pd .pw{font-size:11.5px;color:var(--dim)}.play .pd .badge{justify-self:start}
.play .pol{font-size:10.5px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--dim);margin:5px 0 0 8px}
.play .pa{display:flex;gap:6px;justify-content:flex-end;margin-top:8px}
.hit .rk small{font-size:11px;color:var(--muted);font-weight:600}
.badge{display:inline-block;font-size:10.5px;font-weight:850;letter-spacing:.4px;text-transform:uppercase;padding:2px 8px;border-radius:99px;color:var(--tc);background:color-mix(in srgb,var(--tc) 14%,transparent);border:1px solid color-mix(in srgb,var(--tc) 35%,transparent)}
.big{font-size:18px;line-height:1.45;margin-top:8px}
.big b{color:var(--goldtxt)}
.wdesc{font-size:11.5px;color:var(--muted);grid-column:1/-1;margin-top:-4px}


/* ---------- website member page (C2) ---------- */
a{color:var(--goldtxt)}
a.btn{text-decoration:none}
.topline{display:flex;align-items:center;gap:10px;justify-content:space-between;padding-top:12px;font-size:13px}
.topline a{text-decoration:none;font-weight:700}
.topline a.back{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:99px;border:1px solid var(--line2);background:var(--card);color:var(--goldtxt);box-shadow:var(--shadow2);font-weight:800;font-size:13.5px}
.topline a.back:hover{border-color:var(--gold)}
.who{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:99px;border:1px solid var(--line2);color:var(--goldtxt);background:var(--card);white-space:nowrap}
.who.pro{background:linear-gradient(145deg,var(--gold3),var(--gold) 50%,var(--gold2));color:#1a1206;border-color:transparent}
.gate{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 14px;border-radius:14px;border:1px solid var(--line2);background:linear-gradient(160deg,rgba(243,213,138,.20),var(--card) 70%);margin-bottom:14px;font-size:13.5px}
.gate b{color:var(--goldtxt)}
.gate .actions{margin:0 0 0 auto}
.lk .sets{user-select:none;-webkit-user-select:none;pointer-events:none}
.lk .sets .ball,.blur{filter:blur(6px);opacity:.85;user-select:none;-webkit-user-select:none}
.lk .set .ct{filter:blur(3px)}
.lkbt .kpi .v,.lkbt .big b,.lkbt td:not(:first-child),.lkbt .note{filter:blur(6px);user-select:none;-webkit-user-select:none}
.cta{margin-top:16px;padding:18px 16px;border-radius:16px;border:1px solid var(--line2);text-align:center;
  background:linear-gradient(160deg,rgba(243,213,138,.28),var(--card2) 70%);box-shadow:var(--shadow)}
.cta .lock{font-size:24px;line-height:1}
.cta h3{font-size:17px;font-weight:800;margin:6px 0 4px}
.cta p{font-size:13.5px;color:var(--muted);max-width:520px;margin:0 auto}
.cta .actions{justify-content:center}
.n45{font-size:12px;color:var(--muted);margin-top:10px;padding:8px 11px;border-radius:10px;border:1px dashed var(--line2);background:rgba(232,194,106,.06)}
.wait{padding:22px;text-align:center;color:var(--muted);font-size:14px}
.wait b{color:var(--text)}
footer a{color:var(--dim)}
.qv button{white-space:nowrap}
.selbar{transition:top .12s}
@media(max-width:520px){
  .ctx .row{flex-wrap:nowrap;gap:8px}
  .ctx .seg button{padding:7px 10px;font-size:13.5px}
  #stateSel{flex:1;min-width:0;width:100%}
  .tabs{margin-top:8px}
  .qv button{padding:7px 4px;font-size:13px;min-width:58px}
  .gate .actions{margin-left:0}
}
/* bigger, richer numbers on computers */
@media(min-width:900px){
  .ball{width:36px;height:36px;font-size:18px}
  .ball.sm{width:31px;height:31px;font-size:16px}
  .ball.xs{width:25px;height:25px;font-size:13.5px}
  .sets{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:10px}
  .set{padding:20px 10px 12px;border-radius:15px}
  .set .rk{font-size:11px;top:5px;left:10px}.set .ct{font-size:9.5px;top:5px;right:10px}
  .rchip{padding:7px 12px 7px 10px}
  .brand h1{font-size:24px}
  .card h2{font-size:16.5px}
}
/* inside the homepage (desktop): the homepage panel shows the title, so the page header is hidden */
body.embed{background-image:none;background:transparent;min-height:0}
body.embed .topline,body.embed header{display:none}
body.embed .ctx{position:static;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:0;padding-top:0}
body.embed .wrap{max-width:none;padding:0 2px}
body.embed main{padding:12px 0 8px}
body.embed footer{padding-bottom:6px}
body.embed #toast,body.embed .selbar{position:absolute}