:root{color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}html{scroll-padding-top:env(safe-area-inset-top,0px)}body{margin:0;padding:0;font:14px -apple-system,BlinkMacSystemFont,sans-serif;background:#faf9f5;color:#141413}img{max-width:100%}[hidden]:not([hidden=until-found i]){display:none!important}

/* =========================================================
   bgc.bi — design system v3
   Soft lavender paper, ink type, electric violet → pink
   gradients. Mobile first, small motion, nothing shouting.
   ========================================================= */
:root{
  color-scheme: light;
  /* BGC shield: black & gold, pushed brighter for screens */
  --bg:#FAF7F0; --surface:#FFFFFF; --surface-2:#F4EEE1; --surface-3:#EAE1CC; --glass:rgba(250,247,240,.82);
  --ink:#15110A; --ink-2:#2F2716; --muted:#6F6553; --faint:#A79C86; --line:#ECE4D3; --line-2:#DDD2BB;
  --primary:#B47800; --primary-2:#E8A317; --primary-wash:#FFF1D2; --on-primary:#1A1405;
  --gold:#F5B53D; --gold-hi:#FFD46B; --gold-deep:#9A6400; --gold-wash:#FFF5DD; --amber:#FFB800; --ember:#FF7A1A;
  --night:#0F0C07; --night-2:#1C170E; --night-line:#30281A; --night-text:#FBF4E4; --night-muted:#BDAF92;
  --ok:#0F7A4F; --ok-wash:#E2F5EB; --warn:#9A5B00; --warn-wash:#FFF1D6; --err:#C02A3C; --err-wash:#FCE7EA;
  --flag-red:#CE1126; --flag-green:#1EB53A;
  --grad-hero:linear-gradient(135deg,#0F0C07 0%,#2B1F0B 38%,#9A6400 74%,#F5B53D 100%);
  --grad-gold:linear-gradient(135deg,#FFE7A0 0%,#F5B53D 48%,#D98E04 100%);
  --grad-primary:linear-gradient(135deg,#FFD46B 0%,#F5B53D 45%,#E39A0B 100%);
  --grad-ember:linear-gradient(135deg,#FFC23D 0%,#FF8A1A 60%,#E8590C 100%);
  --grad-night:linear-gradient(135deg,#2A2213 0%,#0F0C07 100%);
  --grad-bronze:linear-gradient(135deg,#C98A2B 0%,#7A4E0E 100%);
  --grad-cool:var(--grad-night); --grad-warm:var(--grad-ember); --grad-mint:linear-gradient(135deg,#25C26E,#0F8A55);
  --wash-grad:linear-gradient(135deg,#FFF6E0,#FFEBD1);
  --pattern-stroke:#C9BFA8; --pattern-op:.3;
  --f-display:"Unbounded","Archivo",system-ui,sans-serif;
  --f-body:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-card:"Barlow Condensed","Archivo Narrow","Arial Narrow",sans-serif;
  --f-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:14px; --r-lg:22px;
  --shadow:0 1px 2px rgba(40,28,5,.05),0 10px 30px -14px rgba(60,40,5,.28);
  --shadow-lg:0 2px 6px rgba(40,28,5,.07),0 30px 60px -24px rgba(60,40,5,.45);
  --top-h:60px; --tab-h:70px; --gut:16px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0B0906; --surface:#16120C; --surface-2:#211B12; --surface-3:#2C2418; --glass:rgba(11,9,6,.8);
  --ink:#F7EFDD; --ink-2:#E2D4B6; --muted:#A99A7C; --faint:#6F6450; --line:#2A2318; --line-2:#3A3122;
  --primary:#F5B53D; --primary-2:#FFC94D; --primary-wash:#2D2410; --on-primary:#1A1405;
  --gold-deep:#F5B53D; --gold-wash:#2A2110;
  --night:#1A150D; --night-2:#241D12; --night-line:#3A3122;
  --ok:#3BD38A; --ok-wash:#11291D; --warn:#F2B04A; --warn-wash:#2D2110; --err:#FF6B7D; --err-wash:#2E1418;
  --wash-grad:linear-gradient(135deg,#2A2110,#2A1A10);
  --pattern-stroke:#3A3122; --pattern-op:.3;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.7);
  --shadow-lg:0 2px 6px rgba(0,0,0,.5),0 30px 60px -24px rgba(0,0,0,.85);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  color-scheme: dark;
  --bg:#0B0906; --surface:#16120C; --surface-2:#211B12; --surface-3:#2C2418; --glass:rgba(11,9,6,.8);
  --ink:#F7EFDD; --ink-2:#E2D4B6; --muted:#A99A7C; --faint:#6F6450; --line:#2A2318; --line-2:#3A3122;
  --primary:#F5B53D; --primary-2:#FFC94D; --primary-wash:#2D2410; --on-primary:#1A1405;
  --gold-deep:#F5B53D; --gold-wash:#2A2110;
  --night:#1A150D; --night-2:#241D12; --night-line:#3A3122;
  --ok:#3BD38A; --ok-wash:#11291D; --warn:#F2B04A; --warn-wash:#2D2110; --err:#FF6B7D; --err-wash:#2E1418;
  --wash-grad:linear-gradient(135deg,#2A2110,#2A1A10);
  --pattern-stroke:#3A3122; --pattern-op:.3;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.7);
  --shadow-lg:0 2px 6px rgba(0,0,0,.5),0 30px 60px -24px rgba(0,0,0,.85);
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--top-h) + 12px)}

body{color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}
body.no-scroll{overflow:hidden}
html{background:var(--bg)}body{background:transparent}
/* BGC pattern: feathers (from the shield) + controllers, very light, behind everything */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-color:var(--pattern-stroke);opacity:var(--pattern-op);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E %3Cg transform='rotate%28-18 70 100%29'%3E%3Cpath d='M70 30c-26 18-40 58-38 120 18-30 36-62 38-120z'/%3E%3Cpath d='M70 30c10 40 4 84-38 120'/%3E%3Cpath d='M32 150l-10 26'/%3E%3Cpath d='M60 60l-14 10M64 80l-18 14M62 100l-20 16M56 120l-18 14'/%3E%3C/g%3E %3Cg transform='translate%28130 150%29 rotate%2812%29'%3E%3Cpath d='M18 8h56a20 20 0 0 1 19.4 24.8l-4 16.6a10 10 0 0 1-17.6 4L64 44H28l-7.8 9.4a10 10 0 0 1-17.6-4l-4-16.6A20 20 0 0 1 18 8z'/%3E%3Cpath d='M22 24v12M16 30h12'/%3E%3Ccircle cx='66' cy='26' r='2.6'/%3E%3Ccircle cx='74' cy='34' r='2.6'/%3E%3C/g%3E %3Cg transform='translate%28170 20%29 rotate%2828%29'%3E%3Cpath d='M30 6c-16 10-24 32-22 70 10-18 20-38 22-70z'/%3E%3Cpath d='M30 6c6 24 2 50-22 70'/%3E%3C/g%3E %3Cg transform='translate%2810 200%29 rotate%28-10%29'%3E%3Cpath d='M12 6h36a13 13 0 0 1 12.6 16l-2.6 10.8a6.5 6.5 0 0 1-11.4 2.6L42 30H18l-4.6 5.4A6.5 6.5 0 0 1 2 32.8L-.6 22A13 13 0 0 1 12 6z'/%3E%3C/g%3E %3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E %3Cg transform='rotate%28-18 70 100%29'%3E%3Cpath d='M70 30c-26 18-40 58-38 120 18-30 36-62 38-120z'/%3E%3Cpath d='M70 30c10 40 4 84-38 120'/%3E%3Cpath d='M32 150l-10 26'/%3E%3Cpath d='M60 60l-14 10M64 80l-18 14M62 100l-20 16M56 120l-18 14'/%3E%3C/g%3E %3Cg transform='translate%28130 150%29 rotate%2812%29'%3E%3Cpath d='M18 8h56a20 20 0 0 1 19.4 24.8l-4 16.6a10 10 0 0 1-17.6 4L64 44H28l-7.8 9.4a10 10 0 0 1-17.6-4l-4-16.6A20 20 0 0 1 18 8z'/%3E%3Cpath d='M22 24v12M16 30h12'/%3E%3Ccircle cx='66' cy='26' r='2.6'/%3E%3Ccircle cx='74' cy='34' r='2.6'/%3E%3C/g%3E %3Cg transform='translate%28170 20%29 rotate%2828%29'%3E%3Cpath d='M30 6c-16 10-24 32-22 70 10-18 20-38 22-70z'/%3E%3Cpath d='M30 6c6 24 2 50-22 70'/%3E%3C/g%3E %3Cg transform='translate%2810 200%29 rotate%28-10%29'%3E%3Cpath d='M12 6h36a13 13 0 0 1 12.6 16l-2.6 10.8a6.5 6.5 0 0 1-11.4 2.6L42 30H18l-4.6 5.4A6.5 6.5 0 0 1 2 32.8L-.6 22A13 13 0 0 1 12 6z'/%3E%3C/g%3E %3C/svg%3E");-webkit-mask-size:260px 260px;mask-size:260px 260px}
.pattern-light{position:relative;isolation:isolate}
.pattern-light::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-color:#fff;opacity:.07;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E %3Cg transform='rotate%28-18 70 100%29'%3E%3Cpath d='M70 30c-26 18-40 58-38 120 18-30 36-62 38-120z'/%3E%3Cpath d='M70 30c10 40 4 84-38 120'/%3E%3Cpath d='M32 150l-10 26'/%3E%3Cpath d='M60 60l-14 10M64 80l-18 14M62 100l-20 16M56 120l-18 14'/%3E%3C/g%3E %3Cg transform='translate%28130 150%29 rotate%2812%29'%3E%3Cpath d='M18 8h56a20 20 0 0 1 19.4 24.8l-4 16.6a10 10 0 0 1-17.6 4L64 44H28l-7.8 9.4a10 10 0 0 1-17.6-4l-4-16.6A20 20 0 0 1 18 8z'/%3E%3Cpath d='M22 24v12M16 30h12'/%3E%3Ccircle cx='66' cy='26' r='2.6'/%3E%3Ccircle cx='74' cy='34' r='2.6'/%3E%3C/g%3E %3Cg transform='translate%28170 20%29 rotate%2828%29'%3E%3Cpath d='M30 6c-16 10-24 32-22 70 10-18 20-38 22-70z'/%3E%3Cpath d='M30 6c6 24 2 50-22 70'/%3E%3C/g%3E %3Cg transform='translate%2810 200%29 rotate%28-10%29'%3E%3Cpath d='M12 6h36a13 13 0 0 1 12.6 16l-2.6 10.8a6.5 6.5 0 0 1-11.4 2.6L42 30H18l-4.6 5.4A6.5 6.5 0 0 1 2 32.8L-.6 22A13 13 0 0 1 12 6z'/%3E%3C/g%3E %3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E %3Cg transform='rotate%28-18 70 100%29'%3E%3Cpath d='M70 30c-26 18-40 58-38 120 18-30 36-62 38-120z'/%3E%3Cpath d='M70 30c10 40 4 84-38 120'/%3E%3Cpath d='M32 150l-10 26'/%3E%3Cpath d='M60 60l-14 10M64 80l-18 14M62 100l-20 16M56 120l-18 14'/%3E%3C/g%3E %3Cg transform='translate%28130 150%29 rotate%2812%29'%3E%3Cpath d='M18 8h56a20 20 0 0 1 19.4 24.8l-4 16.6a10 10 0 0 1-17.6 4L64 44H28l-7.8 9.4a10 10 0 0 1-17.6-4l-4-16.6A20 20 0 0 1 18 8z'/%3E%3Cpath d='M22 24v12M16 30h12'/%3E%3Ccircle cx='66' cy='26' r='2.6'/%3E%3Ccircle cx='74' cy='34' r='2.6'/%3E%3C/g%3E %3Cg transform='translate%28170 20%29 rotate%2828%29'%3E%3Cpath d='M30 6c-16 10-24 32-22 70 10-18 20-38 22-70z'/%3E%3Cpath d='M30 6c6 24 2 50-22 70'/%3E%3C/g%3E %3Cg transform='translate%2810 200%29 rotate%28-10%29'%3E%3Cpath d='M12 6h36a13 13 0 0 1 12.6 16l-2.6 10.8a6.5 6.5 0 0 1-11.4 2.6L42 30H18l-4.6 5.4A6.5 6.5 0 0 1 2 32.8L-.6 22A13 13 0 0 1 12 6z'/%3E%3C/g%3E %3C/svg%3E");-webkit-mask-size:200px 200px;mask-size:200px 200px}

a{color:inherit}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2.5px solid var(--primary);outline-offset:2px;border-radius:8px}
h1:focus{outline:none}
::selection{background:#FFE29A;color:#15110A}

/* ---------- layout ---------- */
.wrap{max-width:1160px;margin:0 auto;padding-inline:var(--gut)}
@media (min-width:700px){:root{--gut:24px}}
.page{padding-block:16px 24px}
.band{padding-block:28px}
.band-tight{padding-block:20px}
@media (min-width:900px){.band{padding-block:48px}.page{padding-block:28px 64px}}
.band-alt{background:var(--surface)}
.band-night{background:var(--night);color:var(--night-text)}
.band-night .muted{color:var(--night-muted)}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){.g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3{grid-template-columns:minmax(0,1fr)}.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.g1-sm{}
@media (max-width:640px){.g4.g1-sm{grid-template-columns:minmax(0,1fr)}}
.grid > *{min-width:0}
.stack{display:grid;gap:12px}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.between{justify-content:space-between}
.spacer{flex:1}
.hide{display:none!important}
@media (max-width:860px){.hide-md{display:none!important}}
@media (max-width:640px){.hide-sm{display:none!important}}
@media (min-width:641px){.only-sm{display:none!important}}

/* horizontal scrollers (carousels) */
.hscroll{display:grid;grid-auto-flow:column;grid-auto-columns:min(78%,300px);gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);padding:4px var(--gut) 12px;margin-inline:calc(var(--gut) * -1);scrollbar-width:none;overscroll-behavior-x:contain}
.hscroll::-webkit-scrollbar{display:none}
.hscroll > *{scroll-snap-align:start;min-width:0}
.hscroll.sm{grid-auto-columns:min(42%,170px)}
@media (min-width:900px){.hscroll{grid-auto-columns:calc((100% - (var(--cols,3) - 1) * 14px) / var(--cols,3));gap:14px;padding:4px 0 12px;margin:0;scroll-padding-inline:0}.hscroll.sm{--cols:5}}
/* carousel arrows (mouse & trackpad users) */
.hs-wrap{position:relative}
.hs-btn{position:absolute;top:calc(50% - 26px);z-index:3;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);display:none;place-items:center;cursor:pointer;box-shadow:var(--shadow);transition:opacity .2s,transform .2s}
.hs-btn svg{width:18px;height:18px}
.hs-btn.prev{left:-8px}.hs-btn.prev svg{transform:rotate(180deg)}
.hs-btn.next{right:-8px}
.hs-btn:hover{transform:scale(1.06)}
.hs-wrap.can-prev .hs-btn.prev,.hs-wrap.can-next .hs-btn.next{display:grid}
@media (hover:none){.hs-wrap .hs-btn{display:none!important}}
/* no colour overlay at the edge (it showed as a beige band over tiles): the half-visible next tile is the hint */

/* ---------- type ---------- */
h1,h2,h3,h4{margin:0;font-family:var(--f-display);text-wrap:balance;line-height:1.08;letter-spacing:-.02em;font-weight:700}
h1{font-size:clamp(28px,6.4vw,52px);font-weight:800}
h2{font-size:clamp(21px,3.6vw,32px)}
h3{font-size:18px}
h4{font-size:15.5px;font-family:var(--f-body);letter-spacing:0;font-weight:800}
p{margin:0}
.lede{font-size:15.5px;color:var(--muted);max-width:600px;line-height:1.55}
@media (min-width:900px){.lede{font-size:17px}}
.muted{color:var(--muted)}
.faint{color:var(--faint)}
.small{font-size:13px}
.tiny{font-size:12px}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--f-mono)}
.bold{font-weight:700}
.gold{color:var(--gold-deep)}
.band-night .gold{color:var(--gold)}
.grad-text{background:var(--grad-hero);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);font-weight:800}
.band-night .eyebrow{color:var(--gold-hi)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px 18px;flex-wrap:wrap;margin-bottom:14px}
.sec-head > div{min-width:0;max-width:680px}
.sec-head p{margin-top:6px}
.sec-head h2{font-size:clamp(19px,3.4vw,28px)}
.page-head{padding-block:12px 18px;margin-bottom:8px;position:relative}
.page-head h1{font-size:clamp(28px,6vw,48px)}
.page-head .lede{margin-top:8px}
@media (min-width:900px){.page-head{padding-block:24px 24px}}
.back{display:flex;width:fit-content;gap:6px;align-items:center;color:var(--muted);text-decoration:none;font-size:13.5px;font-weight:700;margin-bottom:10px}
.back:hover{color:var(--ink)}
.link{color:var(--primary);font-weight:700;text-decoration:none;font-size:14px;white-space:nowrap}
.link:hover{text-decoration:underline;text-underline-offset:3px}
.band-night .link{color:var(--gold-hi)}
.prose{max-width:68ch}
.prose p + p{margin-top:12px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:999px;border:1.5px solid transparent;font-weight:700;font-size:14.5px;text-decoration:none;cursor:pointer;line-height:1.1;white-space:nowrap;transition:transform .15s var(--ease),background .15s,border-color .15s,color .15s,box-shadow .2s,filter .15s}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn svg{width:17px;height:17px;flex:none}
.btn-gold,.btn-primary{background:var(--grad-primary);color:var(--on-primary);box-shadow:0 8px 20px -8px rgba(232,163,23,.55)}
.btn-gold:hover,.btn-primary:hover{filter:brightness(1.08);box-shadow:0 10px 26px -8px rgba(232,163,23,.65)}
.btn-ink{background:var(--ink);color:var(--bg)}
.btn-ink:hover{background:var(--ink-2)}
.btn-white{background:#fff;color:#15110A;box-shadow:0 8px 20px -10px rgba(0,0,0,.4)}
.btn-ghost{border-color:var(--line-2);background:var(--surface);color:var(--ink)}
.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}
.btn-glass{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28);color:#fff;backdrop-filter:blur(8px)}
.btn-glass:hover{background:rgba(255,255,255,.26)}
.band-night .btn-ghost,.night .btn-ghost{background:transparent;border-color:var(--night-line);color:var(--night-text)}
.btn-wa{background:#1FAF5F;color:#fff}
.btn-wa:hover{background:#178a4b}
.btn-sm{padding:8px 14px;font-size:13.5px}
.btn-lg{padding:15px 24px;font-size:15.5px}
.btn-block{width:100%}
.btn-link{background:none;border:0;padding:0;color:var(--primary);font-weight:700;cursor:pointer}
.icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;cursor:pointer;flex:none;color:var(--ink);text-decoration:none}
.icon-btn svg{width:19px;height:19px}

/* ---------- top bar ---------- */
.top{position:sticky;top:0;z-index:40;background:var(--glass);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);padding-top:env(safe-area-inset-top,0px)}
.top.scrolled{box-shadow:0 1px 0 var(--line)}
.top .wrap{display:flex;align-items:center;gap:12px;height:var(--top-h)}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none}
.brand img{width:32px;height:auto}
.brand b{font-family:var(--f-display);font-weight:800;font-size:19px;letter-spacing:-.02em;line-height:1}
.brand small{display:block;font-size:10.5px;color:var(--muted);font-weight:600;margin-top:2px}
.nav{display:flex;gap:2px;margin-left:14px;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px}
.nav a{text-decoration:none;padding:8px 13px;border-radius:999px;color:var(--ink-2);font-weight:650;font-size:14px;white-space:nowrap;transition:background .15s,color .15s}
.nav a:hover{background:var(--surface-2)}
.nav a[aria-current="page"]{background:var(--ink);color:var(--bg)}
.top-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.lang{display:flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--surface)}
.lang button{background:none;border:0;padding:5px 9px;border-radius:999px;font-size:11.5px;font-weight:800;color:var(--muted);cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.avatar{width:38px;height:38px;border-radius:50%;background:var(--grad-primary);color:var(--on-primary);display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:15px;text-decoration:none;flex:none;position:relative}
.avatar.prem{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--gold)}
.menu-btn{display:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);cursor:pointer;place-items:center}
.menu-btn svg{width:19px;height:19px}
.install-btn{display:none}
.install-btn.show{display:inline-flex}
@media (max-width:1100px){.nav a.n-x{display:none}}
@media (max-width:900px){.nav{display:none}.menu-btn{display:grid}.top .btn-join{display:none}}
@media (max-width:420px){.brand small{display:none}.lang button{padding:5px 7px}}

/* drawer */
.drawer-back{position:fixed;inset:0;z-index:60;background:rgba(12,9,4,.4);backdrop-filter:blur(3px);display:flex;justify-content:flex-end;animation:fade .2s ease}
.drawer{width:min(360px,88vw);height:100%;background:var(--surface);padding:18px 16px calc(24px + env(safe-area-inset-bottom,0px));overflow-y:auto;display:flex;flex-direction:column;gap:2px;animation:slideIn .25s var(--ease);border-radius:24px 0 0 24px}
@keyframes slideIn{from{transform:translateX(40px);opacity:.3}}
@keyframes fade{from{opacity:0}}
.drawer a{display:flex;gap:12px;align-items:center;padding:11px 10px;border-radius:14px;text-decoration:none;font-weight:650;font-size:15.5px}
.drawer a .di{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--primary);flex:none}
.drawer a .di svg{width:18px;height:18px}
.drawer a:hover,.drawer a[aria-current="page"]{background:var(--surface-2)}
.drawer .grp{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:800;margin:14px 10px 4px}

/* floating pill tab bar */
.tabbar{display:none}
@media (max-width:900px){
  .tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;left:0;right:0;bottom:0;z-index:45;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));
    background:var(--glass);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border-top:1px solid var(--line)}
  .tabbar a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:2px 0;text-decoration:none;color:var(--muted);font-size:10.5px;font-weight:650;min-width:0;letter-spacing:.01em}
  .tabbar a .ti{width:44px;height:30px;border-radius:999px;display:grid;place-items:center;transition:background .25s,color .25s}
  .tabbar a span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .tabbar a[aria-current="page"]{color:var(--ink)}
  .tabbar a[aria-current="page"] .ti{background:var(--surface-3);color:var(--ink)}
  .tabbar svg{width:21px;height:21px}
  main{padding-bottom:calc(var(--tab-h) + 16px)}
  #toasts{bottom:calc(var(--tab-h) + 14px + env(safe-area-inset-bottom,0px))!important}
}
}

/* demo ribbon — quiet text, no dot */
.ribbon{background:transparent;color:var(--muted);font-size:12px}
.ribbon .wrap{display:flex;gap:10px;align-items:center;padding-block:6px;border-bottom:1px dashed var(--line-2)}
.ribbon a{color:var(--primary);font-weight:700;text-decoration:none;white-space:nowrap}

/* ---------- motion ---------- */
@keyframes rise{from{transform:translateY(14px);opacity:0}}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(var(--rot,0deg))}50%{transform:translateY(-7px) rotate(var(--rot,0deg))}}
@keyframes shine{from{transform:translateX(-120%) skewX(-18deg)}to{transform:translateX(220%) skewX(-18deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(255,255,255,.5)}100%{box-shadow:0 0 0 12px rgba(255,255,255,0)}}
.reveal{animation:rise .6s var(--ease) both}
.reveal.d1{animation-delay:.06s}.reveal.d2{animation-delay:.12s}.reveal.d3{animation-delay:.18s}.reveal.d4{animation-delay:.24s}
.float{animation:floaty 5s ease-in-out infinite}
.io{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.io.in{opacity:1;transform:none}

/* ---------- HOME ---------- */
.hello{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:6px;margin-bottom:12px}
.hello h1{font-size:clamp(22px,5.6vw,36px);font-weight:700}
.hello p{color:var(--muted);font-size:14px;margin-top:4px}

/* gradient hero card (next cup) */
.hero-cup{position:relative;overflow:hidden;border-radius:28px;background:var(--grad-hero);color:#fff;padding:20px;isolation:isolate;box-shadow:var(--shadow-lg);min-height:250px;display:grid;align-content:space-between;gap:18px;text-decoration:none}
.hero-cup::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(60% 50% at 100% 0%,rgba(255,255,255,.28),transparent 70%),
  radial-gradient(50% 60% at 0% 100%,rgba(255,184,0,.35),transparent 70%)}
.hero-cup .orb{position:absolute;z-index:-1;border-radius:50%;filter:blur(2px);opacity:.55}
.hero-cup .orb.o1{width:120px;height:120px;right:-30px;bottom:-34px;background:radial-gradient(circle at 30% 30%,#FFE7A0,#F5B53D 60%,transparent 70%);animation:floaty 7s ease-in-out infinite}
.hero-cup .orb.o2{width:56px;height:56px;right:34%;top:-18px;background:radial-gradient(circle at 30% 30%,#FFD2A8,#FF8A1A 60%,transparent 70%);animation:floaty 6s ease-in-out infinite .8s}
.hero-cup .float-ic{position:absolute;right:16px;top:16px;width:66px;height:66px;border-radius:20px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(10px);display:grid;place-items:center;--rot:8deg;animation:floaty 5s ease-in-out infinite}
.hero-cup .float-ic svg{width:34px;height:34px}
.hero-cup .tagline{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.18);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:700;width:fit-content}
.hero-cup h2{font-size:clamp(24px,6.6vw,40px);font-weight:800;letter-spacing:-.03em;max-width:13ch;margin-top:10px;padding-right:74px}
@media (min-width:900px){.hero-cup h2{padding-right:110px;max-width:16ch}}
.hero-cup .sub{font-size:14px;opacity:.88;margin-top:6px;max-width:34ch}
.cd{display:flex;gap:6px}
.cd div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.24);border-radius:14px;padding:8px 0;text-align:center;min-width:54px;backdrop-filter:blur(6px)}
.cd b{display:block;font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.05;font-variant-numeric:tabular-nums}
.cd span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;opacity:.8;font-weight:700}
.hero-cup .act{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
@media (min-width:900px){.hero-cup{padding:32px;min-height:300px}.hero-cup .float-ic{width:92px;height:92px;right:32px;top:32px}.hero-cup .float-ic svg{width:46px;height:46px}}

/* home 2-col on desktop */
.home-top{display:grid;gap:14px}
@media (min-width:900px){.home-top{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:stretch}}

/* champion spotlight */
.spot{position:relative;overflow:hidden;border-radius:28px;background:var(--night);color:var(--night-text);padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:10px;align-items:center;isolation:isolate;text-decoration:none}
.spot::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 80% at 100% 30%,rgba(245,184,61,.35),transparent 65%),radial-gradient(60% 60% at 0% 100%,rgba(255,122,26,.25),transparent 70%)}
.spot h3{font-size:clamp(20px,5.4vw,28px);font-weight:800;line-height:1.05;margin-top:8px}
.spot p{color:var(--night-muted);font-size:13.5px;margin-top:6px}
.spot .chips-s{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.spot .chips-s span{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:700}
.spot .chips-s b{color:var(--gold)}
.spot .pc-wrap{--rot:4deg;animation:floaty 5.5s ease-in-out infinite}
.spot .pc-wrap .pcard{width:150px}
@media (min-width:900px){.spot{grid-template-columns:minmax(0,1fr) 190px;padding:26px}.spot .pc-wrap .pcard{width:190px}}
@media (max-width:360px){.spot{grid-template-columns:minmax(0,1fr) 120px}.spot .pc-wrap .pcard{width:120px}}

/* podium */
.podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:end;background:var(--grad-cool);border-radius:26px;padding:20px 12px 0;color:#fff;position:relative;overflow:hidden;isolation:isolate}
.podium::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 50% at 50% 0%,rgba(255,255,255,.35),transparent 70%)}
.pod{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;text-decoration:none;min-width:0}
.pod .face{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.2);border:3px solid rgba(255,255,255,.85);display:grid;place-items:center;font-family:var(--f-display);font-weight:700;font-size:20px;overflow:hidden;position:relative}
.pod .face img{width:100%;height:100%;object-fit:cover;object-position:top}
.pod.p1 .face{width:76px;height:76px;border-color:var(--gold);box-shadow:0 0 0 4px rgba(245,184,61,.35)}
.pod .crown{color:var(--gold);width:24px;height:24px;margin-bottom:-4px}
.pod .crown svg{width:24px;height:24px}
.pod .nm{font-weight:800;font-size:13px;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pod .pts{font-size:12px;opacity:.85;font-weight:700}
.pod .step{width:100%;margin-top:6px;border-radius:16px 16px 0 0;background:rgba(255,255,255,.18);display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:26px}
.pod.p1 .step{height:92px;background:rgba(255,255,255,.3)}
.pod.p2 .step{height:66px}
.pod.p3 .step{height:48px}
@media (min-width:900px){.podium{padding:28px 28px 0;gap:18px}.pod .nm{font-size:15px}}

.list{border-radius:var(--r-lg);overflow:hidden;background:var(--surface);border:1px solid var(--line)}
.list > a,.list > div{display:grid;grid-template-columns:34px 36px minmax(0,1fr) auto;gap:10px;padding:11px 14px;border-top:1px solid var(--line);align-items:center;text-decoration:none}
.list > :first-child{border-top:0}
.list > a:hover{background:var(--surface-2)}
.list .mini{width:36px;height:36px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--primary);overflow:hidden}
.list .mini img{width:100%;height:100%;object-fit:cover;object-position:top}

/* quick tiles */
.qt{display:grid;gap:8px;justify-items:center;text-align:center;text-decoration:none;padding:14px 6px;border-radius:22px;background:var(--surface);border:1px solid var(--line);transition:transform .2s var(--ease),box-shadow .2s}
.qt:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.qt .ic{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;color:#fff;box-shadow:0 8px 18px -8px rgba(60,40,5,.6)}
.qt .ic svg{width:23px;height:23px}
.qt b{font-size:13px;font-weight:750;line-height:1.2}
.qt span{font-size:11.5px;color:var(--muted);line-height:1.2}
.qtiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:380px){.qtiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:900px){.qtiles{grid-template-columns:repeat(8,minmax(0,1fr))}}
.bg-primary{background:var(--grad-primary)}.bg-cool{background:var(--grad-cool)}.bg-warm{background:var(--grad-warm)}.bg-gold{background:var(--grad-gold);color:var(--ink)!important}.bg-mint{background:var(--grad-mint)}.bg-hero{background:var(--grad-hero)}.bg-ink{background:var(--ink)}

/* premium band */
.pband{position:relative;overflow:hidden;border-radius:26px;background:var(--night);color:#fff;padding:20px;display:grid;gap:14px;isolation:isolate}
.pband::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 90% at 100% 0%,rgba(255,138,26,.42),transparent 70%),radial-gradient(60% 80% at 0% 100%,rgba(255,184,0,.25),transparent 70%)}
.pband h3{font-size:clamp(19px,4.8vw,26px);font-weight:800}
.pband p{color:var(--night-muted);font-size:14px}
.pband .mini-plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pband .mini-plans div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:10px}
.pband .mini-plans b{display:block;font-family:var(--f-display);font-size:15px}
.pband .mini-plans span{font-size:11.5px;color:var(--night-muted);line-height:1.3;display:block;margin-top:3px}
.pband .mini-plans .hl{background:var(--grad-primary);border-color:transparent}
.pband .mini-plans .hl{color:var(--on-primary)}.pband .mini-plans .hl span{color:rgba(26,20,5,.75)}

/* join card */
.join{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}
.qr{background:#fff;border-radius:20px;padding:12px;width:140px;height:140px;display:grid;place-items:center;box-shadow:var(--shadow-lg);position:relative;flex:none}
.qr svg{width:100%;height:100%;display:block}
.qr .qr-logo{position:absolute;width:34px;height:auto;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;padding:3px;border-radius:8px}
.join h2{font-size:clamp(20px,4.6vw,30px)}
@media (max-width:520px){.join{grid-template-columns:1fr}.join .qr{width:150px;height:150px}}
@media (min-width:900px){.qr{width:200px;height:200px;padding:16px}.qr .qr-logo{width:44px}}
.joincard{border-radius:26px;background:var(--surface);border:1px solid var(--line);padding:18px}

/* stats strip */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.stat{padding:12px;border-radius:18px;background:var(--surface);border:1px solid var(--line)}
.stat b{display:block;font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.1}
.stat span{font-size:11.5px;color:var(--muted);font-weight:600;line-height:1.25;display:block;margin-top:2px}
@media (max-width:520px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- cards ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;min-width:0}
@media (min-width:900px){.card{padding:22px}}
.card-hover{transition:border-color .15s,box-shadow .25s,transform .25s var(--ease);text-decoration:none;display:block}
.card-hover:hover{border-color:var(--line-2);box-shadow:var(--shadow);transform:translateY(-2px)}
.card-night{background:var(--night);color:var(--night-text);border-color:var(--night)}
.card-night .muted{color:var(--night-muted)}
.card-gold{background:var(--wash-grad);border-color:var(--line-2)}
.card-grad{background:var(--grad-hero);color:#fff;border:0}
.card-grad .muted{color:rgba(255,255,255,.8)}
.card h3{font-size:17px}
.card-title{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}

/* ---------- chips, tags, segmented ---------- */
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;max-width:100%;padding:2px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);padding:8px 14px;border-radius:999px;font-size:13.5px;font-weight:650;color:var(--ink-2);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.chip svg{width:15px;height:15px}
.chip:hover{border-color:var(--line-2)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chip .n{font-size:11px;background:var(--surface-2);color:var(--muted);border-radius:999px;padding:1px 7px;font-weight:800}
.chip[aria-pressed="true"] .n{background:rgba(127,127,127,.25);color:inherit}
.seg{display:inline-flex;background:var(--surface-2);border-radius:999px;padding:4px;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg button,.seg a{background:none;border:0;padding:8px 14px;border-radius:999px;font-weight:700;font-size:13.5px;color:var(--muted);cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .2s,color .2s}
.seg [aria-pressed="true"],.seg [aria-current="page"]{background:var(--surface);color:var(--ink);box-shadow:0 2px 8px -2px rgba(60,40,5,.2)}
.seg.big{display:flex;width:100%}
.seg.big > *{flex:1;padding:11px 10px;font-size:14.5px}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:650;border-radius:999px;padding:3px 9px;color:var(--ink-2);white-space:nowrap;background:var(--surface-2)}
.tag svg{width:13px;height:13px}
.tag-gold{background:var(--gold-wash);color:var(--gold-deep)}
.tag-ink{background:var(--ink);color:var(--bg)}
.tag-ok{background:var(--ok-wash);color:var(--ok)}
.tag-warn{background:var(--warn-wash);color:var(--warn)}
.tag-err{background:var(--err-wash);color:var(--err)}
.tag-primary{background:var(--primary-wash);color:var(--primary)}
.tag-grad{background:var(--grad-primary);color:var(--on-primary)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.pl{display:inline-block;font-size:11.5px;font-weight:800;border-radius:999px;padding:3px 9px;white-space:nowrap;color:var(--muted);background:var(--surface-2)}
.pl.W{background:var(--grad-gold);color:#4A2E00}
.pl.F{background:#15110A;color:var(--gold)}
.pl.T4{background:var(--primary-wash);color:var(--primary)}
.pl.T8{color:var(--ink-2)}
.pl.P{color:var(--muted)}
.tier{display:inline-block;font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:3px 8px;white-space:nowrap}
.tier.T1{background:#15110A;color:var(--gold)}.tier.TA{background:#CC0000;color:#fff}.tier.TB{background:#0A53A8;color:#fff}
.tier.T2{background:var(--grad-primary);color:var(--on-primary)}
.tier.T3{background:var(--surface-2);color:var(--ink-2)}
.tier.ON{background:var(--surface-2);color:var(--ink-2)}
.pill{display:inline-flex;align-items:center;font-size:12px;font-weight:750;border-radius:999px;padding:4px 10px;white-space:nowrap}
.pill-open{background:var(--ok-wash);color:var(--ok)}
.pill-soon{background:var(--warn-wash);color:var(--warn)}
.pill-done{background:var(--surface-2);color:var(--muted)}
.pill-live{background:var(--err-wash);color:var(--err)}

/* ---------- tables ---------- */
.tbl{border:1px solid var(--line);border-radius:var(--r-lg);overflow-x:auto;background:var(--surface)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;padding:11px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tr[data-href]{cursor:pointer}
tr[data-href]:hover td{background:var(--surface-2)}
.r{text-align:right}
.rk{font-family:var(--f-display);font-weight:700;font-size:16px;width:46px;color:var(--faint)}
.rk.g1{color:var(--gold-deep)}.rk.g2{color:#7D8496}.rk.g3{color:#B0703F}
.pname{font-weight:700;text-decoration:none}
.pname:hover{color:var(--primary)}
.pts{font-family:var(--f-display);font-weight:700;font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.calc{font-family:var(--f-mono);font-size:12px;color:var(--faint);white-space:nowrap}
.top3 td:first-child{box-shadow:inset 3px 0 0 var(--primary)}
.prow{display:flex;align-items:center;gap:10px;min-width:0}
.prow .mini{width:32px;height:32px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-weight:800;font-size:12px;color:var(--primary);overflow:hidden;flex:none}
.prow .mini img{width:100%;height:100%;object-fit:cover;object-position:top}
@media (max-width:640px){td,th{padding:10px 9px}.rk{width:34px;font-size:14px}}

/* ---------- forms ---------- */
.form{display:grid;gap:16px}
.fgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.fgrid .full{grid-column:1/-1}
@media (max-width:640px){.fgrid{grid-template-columns:minmax(0,1fr)}}
.field{display:grid;gap:6px;min-width:0}
.field > label,.label{font-size:13px;font-weight:700;color:var(--ink-2)}
.hint{font-size:12.5px;color:var(--muted)}
.input,.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea{background:var(--surface);border:1.5px solid var(--line-2);border-radius:14px;padding:11px 14px;width:100%;min-width:0;transition:border-color .15s,box-shadow .15s}
.input,.field input:not([type=checkbox]):not([type=radio]):not([type=file]),.field select{height:48px}
.field textarea{min-height:96px;resize:vertical}
.input:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 4px var(--primary-wash)}
.field input[type=file]{padding:10px;background:var(--surface-2)}
.field select,select.input{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312102A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:16px}
.checks{display:flex;flex-wrap:wrap;gap:8px}
.check{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line-2);border-radius:14px;padding:9px 12px;cursor:pointer;font-size:14px;font-weight:650;background:var(--surface)}
.check:has(input:checked){border-color:var(--primary);background:var(--primary-wash)}
.check input{accent-color:var(--primary)}
/* role picker (sign-up) */
.choice{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.choice label{display:grid;gap:6px;justify-items:center;text-align:center;padding:14px 8px;border:1.5px solid var(--line-2);border-radius:18px;cursor:pointer;font-weight:750;font-size:13.5px;background:var(--surface);transition:border-color .15s,background .15s,transform .15s}
.choice label svg{width:24px;height:24px;color:var(--primary)}
.choice label small{font-weight:500;color:var(--muted);font-size:11.5px;line-height:1.25}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice label:has(input:checked){border-color:var(--primary);background:var(--primary-wash);transform:translateY(-1px)}
fieldset{border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;margin:0;min-width:0;background:var(--surface)}
legend{font-family:var(--f-display);font-weight:700;font-size:16px;padding:0 8px}
.search{position:relative;flex:1 1 240px;min-width:0}
.search input{width:100%;height:46px;padding:0 14px 0 42px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface)}
.search input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-wash)}
.search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--faint)}

/* ---------- notices ---------- */
.notice{border-radius:18px;padding:14px 16px;background:var(--surface-2);display:grid;gap:6px}
.notice-ok{background:var(--ok-wash)}
.notice-warn{background:var(--warn-wash)}
.notice-err{background:var(--err-wash)}
.notice-gold{background:var(--wash-grad)}
.empty{padding:36px 18px;text-align:center;color:var(--muted);display:grid;gap:10px;justify-items:center}

/* ---------- toasts & modal ---------- */
#toasts{position:fixed;left:50%;transform:translateX(-50%);bottom:24px;z-index:90;display:grid;gap:8px;width:min(440px,calc(100vw - 32px))}
.toast{background:#15110A;color:#fff;padding:13px 16px;border-radius:16px;font-weight:650;font-size:14px;box-shadow:var(--shadow-lg);transition:opacity .4s,transform .4s;animation:rise .35s var(--ease)}
.toast-ok{background:linear-gradient(135deg,#0F8A5F,#12A87A)}
.toast-err{background:linear-gradient(135deg,#C42348,#E2456B)}
.toast.out{opacity:0;transform:translateY(8px)}
.modal-back{position:fixed;inset:0;z-index:80;background:rgba(12,9,4,.45);backdrop-filter:blur(4px);display:grid;align-items:end;justify-items:center;padding:0;overflow-y:auto;animation:fade .2s}
.modal{position:relative;background:var(--surface);border-radius:28px 28px 0 0;padding:24px 18px calc(24px + env(safe-area-inset-bottom,0px));width:100%;max-width:560px;box-shadow:var(--shadow-lg);max-height:92vh;overflow-y:auto;animation:sheet .3s var(--ease)}
.modal::before{content:"";display:block;width:40px;height:4px;border-radius:4px;background:var(--line-2);margin:-12px auto 14px}
@keyframes sheet{from{transform:translateY(40px);opacity:.3}}
@media (min-width:700px){.modal-back{align-items:center;padding:16px}.modal{border-radius:28px;padding:28px}.modal::before{display:none}}
.modal-wide{max-width:780px}
.modal h2{font-size:22px;margin-bottom:6px;padding-right:36px}
.modal-x{position:absolute;right:14px;top:14px;width:36px;height:36px;border-radius:50%;border:0;background:var(--surface-2);font-size:20px;line-height:1;cursor:pointer}

/* ---------- copy boxes ---------- */
.copybox{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.copybox code{font-family:var(--f-mono);font-weight:600;font-size:14.5px;background:var(--surface-2);border-radius:12px;padding:9px 13px;user-select:all;overflow-wrap:anywhere;min-width:0}
.band-night .copybox code,.night .copybox code{background:var(--night-2);color:#E9E2FF}
.refcode{font-family:var(--f-display);font-weight:800;font-size:28px;letter-spacing:.04em}

/* ---------- game tiles ---------- */
.gtile{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:16/10;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:14px;isolation:isolate;max-width:100%;background:linear-gradient(135deg,var(--gc,#333),var(--gc3,#111))}
.gtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.gtile::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(90% 80% at 90% 0%,var(--gc2,rgba(255,255,255,.3)),transparent 65%)}
.gtile.has-img::before{background:linear-gradient(to top,rgba(0,0,0,.75),transparent 60%)}
.gtile .gmark{position:absolute;right:12px;top:10px;font-family:var(--f-display);font-weight:800;font-size:40px;line-height:.9;opacity:.25;letter-spacing:-.04em}
.gtile b{font-family:var(--f-display);font-weight:700;font-size:17px;line-height:1.1}
.gtile span{font-size:12px;opacity:.85;font-weight:600}
.gtile-sm{aspect-ratio:auto;min-height:84px;padding:12px;border-radius:16px}
.gtile-sm b{font-size:14px}
.gtile-sm .gmark{display:none}

/* ---------- cup page ---------- */
.cup-hero{position:relative;overflow:hidden;border-radius:28px;background:var(--grad-hero);color:#fff;isolation:isolate;display:grid;gap:0}
.cup-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 60% at 100% 0%,rgba(255,255,255,.25),transparent 70%),radial-gradient(50% 60% at 0% 100%,rgba(255,184,0,.3),transparent 70%)}
.cup-hero .cl{padding:20px}
.cup-hero .cr{padding:20px;background:rgba(12,9,4,.28);display:flex;flex-direction:column;gap:14px}
.cup-hero h2{font-size:clamp(24px,6vw,44px);font-weight:800}
.cup-hero h2 span{color:#FFE29A}
.cup-hero .muted{color:rgba(255,255,255,.82)!important}
@media (min-width:900px){.cup-hero{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}.cup-hero .cl,.cup-hero .cr{padding:32px}}
.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.countdown div{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);border-radius:16px;padding:10px 4px;text-align:center}
.countdown b{display:block;font-family:var(--f-display);font-weight:700;font-size:24px;line-height:1;font-variant-numeric:tabular-nums}
.countdown span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;opacity:.8;font-weight:700}
.light .countdown div{background:var(--surface);border-color:var(--line)}
.light .countdown span{color:var(--muted)}
.prize-list{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.prize-list li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:9px;align-items:start;font-size:13px;line-height:1.35}
.prize-list li svg{width:16px;height:16px;color:var(--gold);margin-top:1px}
.enter-card{padding:14px 16px}
.enter-ic{width:30px;height:30px;border-radius:10px;background:var(--grad-gold);color:#1A1405;display:grid;place-items:center}.enter-ic svg{width:16px;height:16px}
.plan-rows{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.plan-rows li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:10px;align-items:center;font-size:13px;color:var(--muted)}
.plan-rows .pl{font-size:11px;font-weight:800;letter-spacing:.02em;text-align:center;border-radius:999px;padding:3px 0}
.plan-rows .pl.free{background:var(--surface-2);color:var(--ink);border:1px solid var(--line-2)}
.plan-rows .pl.prem{background:var(--grad-gold);color:#1A1405}
.plan-rows .pl.elite{background:var(--grad-night);color:var(--gold-hi);border:1px solid rgba(245,181,61,.5)}
.prize{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:center}
.prize .medal{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:16px;background:var(--grad-gold);color:#4A2E00}
.prize .medal.s{background:linear-gradient(135deg,#F1F3F8,#B9C0CF);color:#2E3442}
.feebox{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.14);border-radius:16px;padding:10px 14px}
.feebox b{font-family:var(--f-display);font-size:18px}
.cal{display:grid;gap:8px}
.cal-item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 10px;border:1px solid var(--line);border-radius:16px;text-decoration:none;background:var(--surface);transition:box-shadow .2s,transform .2s}
.cal-item:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.cal-date{text-align:center;border-radius:12px;background:var(--surface-2);padding:6px 0}
.cal-date b{display:block;font-family:var(--f-display);font-weight:800;font-size:18px;line-height:1}
.cal-item > div > b{font-size:14.5px}
.cal-date span{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}
@media (max-width:640px){.cal-item{grid-template-columns:48px minmax(0,1fr) auto}}

/* ---------- plans (Duolingo-style selector) ---------- */
.plans{display:grid;gap:12px}
@media (min-width:900px){.plans{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}}
.plan{border:2px solid var(--line);border-radius:26px;padding:20px;background:var(--surface);display:flex;flex-direction:column;gap:14px;position:relative;transition:transform .2s var(--ease),box-shadow .2s}
.plan:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.plan.hl{border:0;background:var(--grad-hero);color:#fff;box-shadow:var(--shadow-lg);padding:22px}
.plan.hl .muted{color:rgba(255,255,255,.82)}
.plan .ptop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.plan .pic{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;color:#fff;flex:none}
.plan .pic svg{width:22px;height:22px}
.plan.hl .pic{background:rgba(255,255,255,.2)}
.plan h3{font-size:19px}
.plan .price{font-family:var(--f-display);font-weight:800;font-size:30px;line-height:1;letter-spacing:-.03em}
.plan .price small{font-family:var(--f-body);font-size:13px;font-weight:600;opacity:.75;margin-left:4px;letter-spacing:0}
.plan ul{list-style:none;padding:0;margin:0;display:grid;gap:9px;font-size:14px}
.plan li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:8px;align-items:start}
.plan li::before{content:"";width:18px;height:18px;margin-top:1px;border-radius:50%;background:var(--primary-wash) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B47800' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/12px no-repeat}
.plan.hl li::before{background-color:rgba(255,255,255,.22);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E")}
.plan li.no{color:var(--faint)}
.plan li.no::before{background:var(--surface-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A29FBA' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M8 8l8 8M16 8l-8 8'/%3E%3C/svg%3E") center/11px no-repeat}
.plan .btn{margin-top:auto}
.plan.hl .btn-gold{background:var(--grad-primary);color:var(--on-primary)}
.plan .badge-top{position:absolute;top:-11px;right:18px;background:var(--grad-gold);color:#4A2E00;font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 11px;box-shadow:0 6px 14px -6px rgba(168,106,0,.6)}
.plan .current{position:absolute;top:-11px;left:18px;background:var(--ink);color:var(--bg);font-weight:800;font-size:11px;border-radius:999px;padding:5px 11px}
.steps{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:s}
.steps > li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;counter-increment:s}
.steps > li::before{content:counter(s);width:36px;height:36px;border-radius:12px;background:var(--grad-primary);color:#fff;font-family:var(--f-display);font-weight:700;font-size:15px;display:grid;place-items:center}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:8px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:0 16px;transition:box-shadow .2s}
.faq details[open]{box-shadow:var(--shadow)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;font-weight:750;font-size:15px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-size:18px;font-weight:600;color:var(--primary);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 16px;color:var(--muted);font-size:14.5px}

/* ---------- products ---------- */
.prod{display:flex;flex-direction:column;gap:8px;text-decoration:none;min-width:0}
.prod-img{position:relative;aspect-ratio:1/1;border-radius:24px;background:linear-gradient(160deg,var(--surface),var(--surface-2));overflow:hidden;display:grid;place-items:center;border:1px solid var(--line);transition:box-shadow .25s,transform .25s var(--ease)}
.prod-img img{width:100%;height:100%;object-fit:cover}
.prod-img svg{width:92%;height:92%}
.prod-img .ph{position:absolute;left:10px;top:10px;font-size:10.5px;font-weight:800;background:rgba(255,255,255,.92);border-radius:999px;padding:3px 9px;color:var(--primary)}
.prod:hover .prod-img{box-shadow:var(--shadow);transform:translateY(-2px)}
.prod b{font-weight:700;font-size:14px;line-height:1.25}
.prod .price{font-family:var(--f-display);font-weight:700;font-size:15px}
.prod .price small{font-family:var(--f-body);font-size:11.5px;color:var(--muted);font-weight:600}

/* ---------- marketplace ---------- */
.lst{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:10px;border:1px solid var(--line);border-radius:22px;background:var(--surface);text-decoration:none;transition:box-shadow .2s,transform .2s var(--ease)}
.lst:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.lst .thumb{aspect-ratio:1/1;border-radius:16px;background:linear-gradient(160deg,var(--surface-2),var(--surface-3));display:grid;place-items:center;overflow:hidden;color:var(--primary)}
.lst .thumb img{width:100%;height:100%;object-fit:cover}
.lst .thumb svg{width:50%;height:50%}
.lst h4{font-size:15px;line-height:1.3}
.lst .price{font-family:var(--f-display);font-weight:700;font-size:16px}
.lst .price small{font-family:var(--f-body);font-size:12px;color:var(--muted);font-weight:600}
@media (min-width:640px){.lst{grid-template-columns:120px minmax(0,1fr)}}
.checked{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:750;color:var(--ok)}
.checked svg{width:14px;height:14px}

/* ---------- opportunities ---------- */
.opp{display:grid;gap:8px;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--surface);min-width:0;transition:box-shadow .2s}
.opp:hover{box-shadow:var(--shadow)}
.opp h4{font-size:15.5px;line-height:1.3}
.opp .meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12.5px;color:var(--muted)}
.opp .meta span{display:inline-flex;align-items:center;gap:4px}
.opp .meta svg{width:14px;height:14px}
.opp .src{font-size:12px;color:var(--faint)}
.opp-type{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--primary)}
.opp-type.news{color:var(--gold-deep)}.opp-type.job{color:var(--ember)}.opp-type.brand{color:var(--gold-deep)}.opp-type.connection{color:var(--ok)}.opp-type.program{color:#C2410C}.opp-type.funding{color:#0F8A5F}.opp-type.event{color:#DB2777}.opp-type.competition{color:var(--primary)}
.deadline{font-weight:750;color:var(--ink)}
.deadline.soon{color:var(--err)}
.opp.closed{opacity:.92}
/* competition card */
.comp{position:relative;border-radius:26px;overflow:hidden;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;min-width:0;transition:transform .25s var(--ease),box-shadow .25s}
.comp:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.comp .cv{position:relative;height:132px;padding:14px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;isolation:isolate;background:linear-gradient(135deg,var(--gc,#9A6400),var(--gc3,#0F0C07))}
.comp .cv::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 90% at 100% 0%,rgba(255,255,255,.35),transparent 65%)}
.comp .cv img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.comp .cv .gm{position:absolute;right:12px;bottom:-8px;font-family:var(--f-display);font-weight:800;font-size:64px;opacity:.18;letter-spacing:-.05em;z-index:-1;line-height:1}
.comp .cv .ctop{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.comp .entry{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:800;border-radius:999px;padding:5px 10px;background:rgba(255,255,255,.95);color:var(--ok)}
.comp .entry.paid{color:var(--warn)}
.comp .datebox{background:rgba(12,9,4,.35);backdrop-filter:blur(6px);border-radius:14px;padding:5px 10px;text-align:center;line-height:1.05}
.comp .datebox b{display:block;font-family:var(--f-display);font-size:18px}
.comp .datebox span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.comp .gname{font-weight:800;font-size:13px;display:inline-flex;gap:6px;align-items:center;background:rgba(12,9,4,.3);border-radius:999px;padding:4px 10px;width:fit-content;backdrop-filter:blur(6px)}
.comp .bd{padding:14px;display:grid;gap:8px;flex:1;align-content:start}
.comp .bd h4{font-size:15.5px;line-height:1.3}
.comp .prz{display:flex;align-items:center;gap:8px;background:var(--wash-grad);border-radius:14px;padding:8px 10px;font-size:13px;font-weight:700;color:var(--gold-deep)}
.comp .prz svg{width:18px;height:18px;color:var(--gold-deep);flex:none}
.comp .ft{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 14px 14px}
.comp .bgc-pay{display:flex;gap:8px;align-items:center;font-size:12.5px;font-weight:700;color:var(--primary);background:var(--primary-wash);border-radius:12px;padding:7px 10px}
.comp .bgc-pay svg{width:16px;height:16px;flex:none}
.comp.closed .cv{filter:grayscale(.75) brightness(.85)}
.comp.closed .cv::after{content:attr(data-closed);position:absolute;inset:auto 12px 12px auto;background:rgba(12,9,4,.75);border-radius:999px;padding:4px 10px;font-size:11px;font-weight:800}

/* news card */
.newsrow{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;align-items:center;text-decoration:none;padding:10px;border-radius:20px;background:var(--surface);border:1px solid var(--line);transition:box-shadow .2s}
.newsrow:hover{box-shadow:var(--shadow)}
.newsrow .nimg{aspect-ratio:1/1;border-radius:14px;display:grid;place-items:center;color:#fff;overflow:hidden}
.newsrow .nimg svg{width:28px;height:28px}
.newsrow h4{font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.newsrow .src{font-size:11.5px;color:var(--faint);margin-top:4px}

/* ---------- ads (quiet) ---------- */
.ad{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;border-radius:20px;padding:12px 14px;background:var(--surface);border:1px solid var(--line);text-decoration:none;position:relative}
.ad{padding-top:22px}.ad .lab{position:absolute;top:7px;left:14px;font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:800}
.ad img{width:96px;height:52px;object-fit:cover;border-radius:12px}
.ad .ad-mark{width:52px;height:52px;border-radius:16px;background:var(--grad-hero);color:#fff;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:18px}
.ad b{font-weight:750}
@media (max-width:560px){.ad{grid-template-columns:auto minmax(0,1fr) auto}.ad > .btn{padding:0;width:34px;height:34px;border-radius:50%;font-size:0}.ad > .btn::after{content:"→";font-size:15px}}

/* creators */
.creator{display:grid;gap:8px;text-align:center;justify-items:center;padding:16px;border:1px solid var(--line);border-radius:22px;background:var(--surface);text-decoration:none}
.creator .face{width:72px;height:72px;border-radius:50%;background:var(--grad-hero);color:#fff;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:26px;overflow:hidden}
.creator .face img{width:100%;height:100%;object-fit:cover}

/* bars */
.bars{display:grid;gap:12px}
.bar-row{display:grid;grid-template-columns:110px minmax(0,1fr) 56px;gap:10px;align-items:center;font-size:13.5px}
.bar{height:10px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--grad-primary);border-radius:6px;transform-origin:left;animation:grow .9s var(--ease) both}
@keyframes grow{from{transform:scaleX(0)}}

/* kpis */
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.kpi{border:1px solid var(--line);border-radius:18px;padding:10px 12px;background:var(--surface);min-width:0}
.kpi b{display:block;font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.1}
.kpi span{font-size:11.5px;color:var(--muted);font-weight:650}
.kpi.dark{background:var(--grad-hero);border:0;color:#fff}
.kpi.dark span{color:rgba(255,255,255,.8)}
@media (min-width:900px){.kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* formula */
.formula{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font-family:var(--f-display);font-weight:700;font-size:clamp(18px,4vw,30px);padding:22px;border-radius:26px;background:var(--grad-hero);color:#fff;line-height:1.1}
.formula .op{color:#FFE29A}
.formula small{display:block;font-family:var(--f-body);font-size:12px;font-weight:600;opacity:.8;margin-top:4px}

/* soon tiles */
.soon-tile{display:grid;gap:8px;padding:18px;border-radius:22px;background:var(--surface);border:1px solid var(--line);text-decoration:none;transition:box-shadow .2s,transform .2s}
.soon-tile:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.soon-tile .ic{width:44px;height:44px;border-radius:15px;background:var(--grad-primary);color:#fff;display:grid;place-items:center}
.soon-tile .ic svg{width:22px;height:22px}
.soon-tile h3{font-size:16px}

/* footer */
footer.foot{background:var(--night);color:var(--night-text);padding-block:22px 16px;margin-top:28px}
.foot-row{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot-brand{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--night-muted)}
.foot-brand img{width:30px}
.foot-brand b{font-family:var(--f-display);font-size:15px;color:var(--night-text)}
.foot-links{display:flex;gap:4px 18px;flex-wrap:wrap}
.foot-links a{text-decoration:none;color:var(--night-muted);font-size:13.5px;padding:4px 0}
.foot-links a:hover{color:var(--gold)}
.foot-row .btn{padding:7px 12px;font-size:13px}
.foot-bottom{border-top:1px solid var(--night-line);margin-top:14px;padding-top:10px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--night-muted)}
/* the footer is for the website on a computer; on phones and in the installed app the tab bar is enough */
@media (max-width:900px){#footer{display:none}}
@media (display-mode:standalone){#footer{display:none}}

/* ---------- admin ---------- */
.admin{display:grid;grid-template-columns:236px minmax(0,1fr);gap:24px;align-items:start}
.admin-nav{position:sticky;top:calc(var(--top-h) + 14px);border:1px solid var(--line);border-radius:22px;padding:8px;background:var(--surface);max-height:calc(100vh - var(--top-h) - 30px);overflow-y:auto;scrollbar-width:thin}
.admin-nav a{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 8px;border-radius:14px;text-decoration:none;font-weight:650;font-size:14px;color:var(--ink-2)}
.admin-nav a:hover{background:var(--surface-2)}
.admin-nav a[aria-current="page"]{background:var(--ink);color:var(--bg)}
.admin-nav a[aria-current="page"] .ai{background:var(--gold);color:var(--on-primary)}
.admin-nav .ai{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:var(--surface-2);color:var(--gold-deep);flex:none}
.admin-nav .ai svg{width:16px;height:16px}
.admin-nav .count{background:var(--grad-ember);color:#fff;border-radius:999px;font-size:11px;font-weight:800;padding:1px 8px;min-width:22px;text-align:center}
.admin-grp{margin-top:4px}
.admin-grp summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;padding:9px 10px 5px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:800}
.admin-grp summary::-webkit-details-marker{display:none}
.admin-grp summary .chev{margin-left:auto;display:grid;transition:transform .2s}
.admin-grp summary .chev svg{width:13px;height:13px;transform:rotate(90deg)}
.admin-grp[open] summary .chev{transform:rotate(180deg)}
.admin-cur{display:none}
@media (max-width:1024px){
  .admin{grid-template-columns:1fr;gap:12px}
  .admin-nav{position:relative;top:auto;padding:6px;max-height:none;overflow:visible;z-index:20}
  .admin-cur{display:grid;grid-template-columns:30px minmax(0,1fr) auto auto;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;background:none;font-weight:750;font-size:15px;color:var(--ink);cursor:pointer;text-align:left}
  .admin-cur .chev{display:grid;transition:transform .2s}.admin-cur .chev svg{width:16px;height:16px;transform:rotate(90deg)}
  .admin-nav.open .admin-cur .chev{transform:rotate(180deg)}
  .admin-list{display:none;border-top:1px solid var(--line);margin-top:6px;padding-top:4px}
  .admin-nav.open .admin-list{display:block;animation:rise .25s var(--ease)}
}
.todo{display:grid;gap:8px}
.todo a{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border-radius:18px;background:var(--surface);border:1px solid var(--line);text-decoration:none;transition:box-shadow .2s}
.todo a:hover{box-shadow:var(--shadow)}
.todo .ic{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#fff}
.todo .ic svg{width:20px;height:20px}
.todo .n{font-family:var(--f-display);font-weight:700;font-size:18px}
.queue{display:grid;gap:10px}
.qi{border:1px solid var(--line);border-radius:20px;padding:16px;background:var(--surface);display:grid;gap:10px}
.qi-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;font-size:14px}
.kv dt{color:var(--muted)}
.kv dd{margin:0;font-weight:650;overflow-wrap:anywhere}

/* =========================================================
   PLAYER CARD — black & gold "ultimate" card, general to every game
   ========================================================= */
.pcard{--w:300px;width:var(--w);aspect-ratio:3/4.15;position:relative;container-type:inline-size;font-family:var(--f-card);color:#FBE7B0;filter:drop-shadow(0 20px 30px rgba(0,0,0,.45));flex:none;text-decoration:none;display:block}
.pcard .frame,.pcard .face-in{position:absolute;inset:0;clip-path:polygon(9% 0,91% 0,100% 6%,100% 86%,93% 92%,50% 100%,7% 92%,0 86%,0 6%)}
.pcard .frame{background:linear-gradient(160deg,#FFF1C2 0%,#E2B45A 18%,#8C5A12 38%,#F7D27A 55%,#A87420 75%,#FFE8A6 100%)}
.pcard .face-in{inset:1.6%;background:
  radial-gradient(70% 45% at 50% 30%,rgba(245,184,61,.35),transparent 70%),
  linear-gradient(115deg,transparent 40%,rgba(255,226,154,.10) 41%,transparent 47%),
  linear-gradient(65deg,transparent 55%,rgba(255,226,154,.08) 56%,transparent 62%),
  linear-gradient(180deg,#191510 0%,#0B0906 60%,#15110A 100%);overflow:hidden}
.pcard .face-in::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,240,200,.18) 45%,transparent 60%);transform:translateX(-120%) skewX(-18deg);animation:shine 5.5s ease-in-out infinite 1.2s;pointer-events:none}
.pcard .line-in{position:absolute;inset:4.2%;clip-path:polygon(9% 0,91% 0,100% 6%,100% 86%,93% 92%,50% 100%,7% 92%,0 86%,0 6%);background:linear-gradient(160deg,#F7D27A,#8C5A12 50%,#F7D27A);opacity:.55}
.pcard .line-in::before{content:"";position:absolute;inset:1px;clip-path:inherit;background:#100D08}
.pcard .photo{position:absolute;left:14%;right:6%;top:6%;height:56%;display:grid;place-items:end center;z-index:2}
.pcard .photo img{width:100%;height:100%;object-fit:contain;object-position:bottom;filter:drop-shadow(0 6px 10px rgba(0,0,0,.6))}
.pcard .photo .ini{width:62%;aspect-ratio:1;border-radius:50%;margin-bottom:8%;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:16cqw;color:#2A1D05;background:var(--grad-gold);box-shadow:inset 0 -6px 0 rgba(0,0,0,.18)}
.pcard .rating{position:absolute;left:10%;top:7%;z-index:3;text-align:center;line-height:.82}
.pcard .rating b{display:block;font-size:22cqw;font-weight:800;background:linear-gradient(180deg,#FFF4CF,#F5C35A 55%,#B9801F);-webkit-background-clip:text;background-clip:text;color:transparent}
.pcard .rating span{display:block;font-size:9.5cqw;font-weight:800;color:#F7D27A;letter-spacing:.02em;margin-top:2%}
.pcard .rating i{display:block;width:60%;height:1px;margin:7% auto;background:linear-gradient(90deg,transparent,#F7D27A,transparent)}
.pcard .rating .flag{width:12cqw;height:7.6cqw;margin:0 auto;border-radius:2px;overflow:hidden;display:block}
.pcard .rating .crest{width:11cqw;margin:6% auto 0;display:block}
.pcard .no1{position:absolute;right:9%;top:8%;z-index:5;display:flex;align-items:center;gap:1.5cqw;padding:1.6cqw 3.4cqw 1.6cqw 2.6cqw;border-radius:999px;background:rgba(12,10,6,.82);border:1px solid rgba(247,210,122,.6);color:#F5C35A;box-shadow:0 2px 8px rgba(0,0,0,.45)}
.pcard .no1 svg{width:7.5cqw;height:7.5cqw;display:block}
.pcard .no1 b{font-size:10cqw;font-weight:800;font-style:italic;letter-spacing:-.04em;background:linear-gradient(180deg,#FFE8A6,#C8901F);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:.9}
.pcard .no1.sm b{font-size:8.5cqw}
.pcard.sm .no1{padding:2.4cqw 4.4cqw 2.4cqw 3.4cqw}.pcard.sm .no1 b{font-size:13cqw}.pcard.sm .no1 svg{width:10cqw;height:10cqw}
.pcard .nm{position:absolute;left:5%;right:5%;top:59%;z-index:4;height:10.5%;display:grid;place-items:center;clip-path:polygon(4% 0,96% 0,100% 50%,96% 100%,4% 100%,0 50%);background:linear-gradient(180deg,#F7D27A,#8C5A12)}
.pcard .nm::before{content:"";position:absolute;inset:1.5px;clip-path:inherit;background:linear-gradient(180deg,#1E1810,#0C0A06)}
.pcard .nm b{position:relative;font-size:10cqw;font-weight:800;text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:88%;background:linear-gradient(180deg,#FFF4CF,#F5C35A 60%,#C8901F);-webkit-background-clip:text;background-clip:text;color:transparent}
.pcard .st{position:absolute;left:12%;right:12%;top:71%;z-index:3;display:grid;grid-template-columns:1fr 1px 1fr;gap:0 6%}
.pcard .st > i{background:linear-gradient(180deg,transparent,#F7D27A,transparent);opacity:.6}
.pcard .st div{display:grid;gap:.4cqw}
.pcard .st p{display:flex;justify-content:space-between;align-items:baseline;font-size:5.6cqw;line-height:1;color:#E8DCC0;font-weight:600}
.pcard .st p b{font-size:6.8cqw;font-weight:800;color:#F7D27A}
.pcard .ach{position:absolute;left:6%;right:6%;top:89.6%;z-index:3;text-align:center;white-space:nowrap;font-size:2.9cqw;letter-spacing:.2em;color:#C9A55E;font-weight:700;text-transform:uppercase}
.pcard.sm .st,.pcard.sm .ach{display:none}
.pcard.sm .nm{top:66%;height:13%}
.pcard.sm .nm b{font-size:9.6cqw;max-width:92%}
.pcard.sm .photo{height:60%}
/* rarity: rank 1–3 gold (default), 4–20 violet, others silver */
.pcard.rare .frame{background:linear-gradient(160deg,#FFE3C7 0%,#FF9A4D 22%,#7A2A05 42%,#FFC08A 58%,#C2410C 78%,#FFEBDA 100%)}
.pcard.rare .face-in{background:radial-gradient(70% 45% at 50% 30%,rgba(255,138,26,.3),transparent 70%),linear-gradient(180deg,#22120A,#0E0805 60%,#1C0F08)}
.pcard.rare .rating b,.pcard.rare .nm b,.pcard.rare .no1 b{background-image:linear-gradient(180deg,#FFFFFF,#FFC08A 60%,#FF7A1A)}
.pcard.rare .rating span,.pcard.rare .st p b{color:#FFC08A}
.pcard.rare .nm,.pcard.rare .line-in{background:linear-gradient(180deg,#FFC08A,#9A3412)}
.pcard.rare .no1{color:#FFB27A}
.pcard.base .frame{background:linear-gradient(160deg,#FFFFFF 0%,#C7CCD8 25%,#6B7385 45%,#E9ECF2 60%,#8C93A3 80%,#FFFFFF 100%)}
.pcard.base .face-in{background:radial-gradient(70% 45% at 50% 30%,rgba(255,255,255,.18),transparent 70%),linear-gradient(180deg,#22252E,#0E1015 60%,#1A1D24)}
.pcard.base .rating b,.pcard.base .nm b{background-image:linear-gradient(180deg,#FFFFFF,#C7CCD8 60%,#8C93A3)}
.pcard.base .rating span,.pcard.base .st p b{color:#E1E5EC}
.pcard.base .nm,.pcard.base .line-in{background:linear-gradient(180deg,#E1E5EC,#6B7385)}
.pcard.base .no1{display:none}
.pcard.rare .photo .ini{background:linear-gradient(135deg,#FFE3C7,#FF9A4D 55%,#C2410C);color:#fff}
.pcard.base .photo .ini{background:linear-gradient(135deg,#FFFFFF,#C7CCD8 55%,#8C93A3);color:#22252E}

/* player page header */
.phead{display:grid;gap:18px;align-items:center}
@media (min-width:800px){.phead{grid-template-columns:auto minmax(0,1fr);gap:32px}}
.phead .pcard{--w:min(300px,78vw);margin-inline:auto}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.io{opacity:1;transform:none}}

/* "peek": one item sharp, the next ones blurred, with a see-more button on top */
.peek{position:relative;display:grid;gap:10px}
.peek-more{display:grid;gap:10px;max-height:150px;overflow:hidden;filter:blur(3px);opacity:.7;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 10%,transparent 95%);mask-image:linear-gradient(180deg,#000 10%,transparent 95%)}
.peek-btn{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);box-shadow:var(--shadow-lg);white-space:nowrap}
@media (max-width:420px){.peek-btn{font-size:13px;padding:10px 14px}}

/* small selects in tables/admin rows: never clip the text */
select.input.sel-sm,.sel-sm{height:38px!important;padding:0 34px 0 12px!important;line-height:36px;width:auto;min-width:130px;font-size:14px;border-radius:12px;background-position:right 10px center}
.field select,select.input{line-height:1.2;padding-top:0;padding-bottom:0}
/* gold verified check */
.gold-check{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:750;color:var(--gold-deep);vertical-align:middle}
.gold-check svg{width:18px;height:18px;flex:none;filter:drop-shadow(0 1px 1px rgba(120,80,0,.25))}
.verify-toggle{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--line-2);border-radius:12px;padding:6px 12px;cursor:pointer;font-weight:700;font-size:13.5px;background:var(--surface);white-space:nowrap}
.verify-toggle input{position:absolute;opacity:0;pointer-events:none}
.verify-toggle .gold-check svg{opacity:.25;filter:grayscale(1)}
.verify-toggle:has(input:checked){border-color:var(--gold);background:var(--gold-wash)}
.verify-toggle:has(input:checked) .gold-check svg{opacity:1;filter:none}
.res-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1fr) minmax(0,.8fr);gap:6px}
.res-row .input{height:42px;font-size:14px}
@media (max-width:640px){.res-row{grid-template-columns:1fr 1fr}.res-row [name^="n|"]{grid-column:1/-1;order:-1}}

/* receipt */
.receipt{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.receipt::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:var(--grad-gold)}
.receipt header{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px dashed var(--line-2)}
.receipt header img{width:42px}
.receipt header b{display:block;font-size:15px}
.receipt header span{font-size:12.5px;color:var(--muted)}
.receipt .stamp{margin-left:auto;border:2.5px solid var(--ok);color:var(--ok);font-family:var(--f-display);font-weight:800;font-size:15px;letter-spacing:.12em;padding:4px 12px;border-radius:10px;transform:rotate(-6deg)}
.receipt h1{font-size:20px;margin-top:16px}
.receipt .amount{font-family:var(--f-display);font-weight:800;font-size:34px;margin:6px 0 14px;color:var(--gold-deep)}
.receipt dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px 18px;margin:0;font-size:14.5px}
.receipt dt{color:var(--muted)}
.receipt dd{margin:0;font-weight:650;text-align:right;overflow-wrap:anywhere}
.receipt footer{display:grid;gap:6px;margin-top:18px;padding-top:14px;border-top:1px dashed var(--line-2)}
@media print{
  body::before,.top,.ribbon,#footer,.tabbar,.no-print,#toasts{display:none!important}
  html,body{background:#fff!important}main{padding:0!important}
  .receipt{box-shadow:none;border-color:#ccc;color:#000;background:#fff}
}
.comp .cv.has-poster{height:170px}
.comp .cv.has-poster img{object-position:center 22%}
.comp .cv.has-poster::before{background:linear-gradient(to top,rgba(0,0,0,.65),transparent 55%)}
.comp.closed .cv.has-poster{filter:saturate(.7)}
.poster-btn{position:absolute;right:12px;bottom:12px;z-index:2;border:0;border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:800;background:rgba(255,255,255,.92);color:#15110A;cursor:pointer}
.comp.closed .cv.has-poster::after{right:auto;left:50%;bottom:auto;top:14px;transform:translateX(-50%)}
/* seller business card */
.biz{position:relative;overflow:hidden;border-radius:28px;background:var(--grad-hero);color:#fff;padding:20px;display:grid;gap:16px;isolation:isolate;box-shadow:var(--shadow-lg)}
.biz-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.biz h2{font-size:clamp(20px,5vw,28px);margin-top:4px}
.biz p{opacity:.85;font-size:14px;margin-top:4px}
.biz-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.biz-kpis div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:10px}
.biz-kpis b{display:block;font-family:var(--f-display);font-size:20px}
.biz-kpis span{font-size:11.5px;opacity:.8}
@media (max-width:480px){.biz-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pool{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--grad-gold);color:#1A1405;border-radius:16px;padding:10px 14px}
.pool span{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.pool b{font-family:var(--f-display);font-size:20px}
/* admin seller rows: same grid on every screen, no table overflow */
.vlist{display:grid;gap:8px}
.vrow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) auto;gap:10px 16px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.vmeta{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.vact{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
@media (max-width:760px){.vrow{grid-template-columns:minmax(0,1fr)}.vmeta{flex-direction:row;align-items:center;flex-wrap:wrap}.vact{justify-content:flex-start}}
.qi .tag{white-space:normal;max-width:100%}.qi .small{overflow-wrap:anywhere}

/* =========================================================
   v5 — lighter reading: compact heads, icon filters, slim rows
   ========================================================= */
.page-head.ph-tight{padding-block:6px 10px;margin-bottom:4px}
.page-head.ph-tight h1{font-size:clamp(24px,6vw,38px)}
.ph-meta{margin-top:6px;font-size:12.5px;font-weight:650;color:var(--muted);line-height:1.5}
.ph-meta > svg{width:14px;height:14px;color:var(--primary);vertical-align:-2px;margin-right:2px}
@media (max-width:640px){.page-head{padding-block:6px 12px}.page-head h1{font-size:28px}.page-head .lede{font-size:14px;margin-top:6px}}
.opp-bar{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.opp-bar .search{flex:1 1 auto}
.opp-bar .search input{height:42px}
.pill-select{position:relative;flex:none;display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 10px 0 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font-weight:700;font-size:13px;cursor:pointer}
.pill-select svg{width:16px;height:16px;flex:none;color:var(--muted)}
.pill-select select{appearance:none;-webkit-appearance:none;border:0;background:none;font:inherit;color:inherit;padding:0;cursor:pointer;max-width:96px}
.pill-select select:focus{outline:none}
.pill-select:focus-within{border-color:var(--primary)}
.chips-ic{margin-bottom:12px;flex-wrap:nowrap}
.chips-ic .chip{padding:7px 12px;font-size:13px}
.mini-note{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:var(--primary-wash);color:var(--ink);font-size:12.5px;font-weight:700;text-decoration:none;margin-bottom:12px}
.mini-note svg{width:14px;height:14px;color:var(--primary);flex:none}
.mini-note span{color:var(--primary)}
.mini-note.static{border-radius:14px;display:flex;align-items:flex-start;line-height:1.4}
.past-list{display:grid;gap:6px}
@media (min-width:900px){.past-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
.past-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 8px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.past-row b{display:block;font-size:13.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.past-row .small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.pthumb{width:44px;height:44px;border-radius:10px;overflow:hidden;display:grid;place-items:center;color:#fff;border:0;padding:0;cursor:pointer;filter:grayscale(.55)}
.pthumb img{width:100%;height:100%;object-fit:cover}
.pthumb svg{width:18px;height:18px}
.past-row .bell{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);display:grid;place-items:center;cursor:pointer}
.past-row .bell svg{width:16px;height:16px}
.past-row .bell.on{background:var(--primary-wash);border-color:transparent;color:var(--primary)}
.opp-foot{display:grid;gap:8px;margin-top:22px}
@media (min-width:900px){.opp-foot{grid-template-columns:1fr 1fr;align-items:start}}
.alert-strip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border-radius:16px;border:1px solid rgba(245,181,61,.25);background:var(--night);color:var(--night-text);text-decoration:none}
.alert-strip .ai{width:32px;height:32px;border-radius:10px;background:var(--grad-gold);color:#1A1405;display:grid;place-items:center}
.alert-strip .ai svg{width:16px;height:16px}
.alert-strip b{display:block;font-size:13.5px}
.alert-strip .small{color:var(--night-muted);font-size:12px}
.alert-strip .go{color:var(--gold)}
.submit-mini{border:1px solid var(--line);border-radius:16px;background:var(--surface);padding:10px 12px}
.submit-mini summary{list-style:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;cursor:pointer;font-weight:700;font-size:13.5px;min-height:32px}
.submit-mini summary::-webkit-details-marker{display:none}
.submit-mini summary svg{width:16px;height:16px;color:var(--primary)}
.submit-mini .plus{width:26px;height:26px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;font-size:16px;transition:transform .2s}
.submit-mini[open] .plus{transform:rotate(45deg)}
.submit-mini .field input,.submit-mini .field select{height:40px}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- Grand Compte: Joueur / Vendeur ---------- */
button.avatar{border:0;cursor:pointer;padding:0}
.avatar .mode-dot{position:absolute;right:-4px;bottom:-4px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1.5px solid var(--bg);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.25)}
.avatar .mode-dot.seller{background:var(--night);color:var(--gold)}
.avatar .mode-dot svg{width:11px;height:11px}
.mode-chip{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px 0 11px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font-weight:750;font-size:12.5px;cursor:pointer}
.mode-chip svg{width:15px;height:15px}
.mode-chip svg:last-child{width:13px;height:13px;color:var(--muted)}
.mode-chip.seller{background:var(--night);color:var(--gold-hi);border-color:rgba(245,181,61,.45)}
.acct-sheet{display:grid;gap:8px}
.acct-head{display:flex;align-items:center;gap:12px;padding-bottom:6px}
.acct-head b{display:block;font-size:16px}.acct-head small{color:var(--muted);font-size:12.5px}
.acct-lab{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:800;margin-top:6px}
.acct-row{display:grid;grid-template-columns:40px minmax(0,1fr) 22px;gap:12px;align-items:center;width:100%;text-align:left;padding:10px 12px;border-radius:16px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;font:inherit}
.acct-row.on{border-color:var(--primary);background:var(--primary-wash)}
.acct-row b{display:block;font-size:15px}.acct-row small{display:block;color:var(--muted);font-size:12.5px}
.acct-row .ai{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--grad-gold);color:#1A1405}
.acct-row .ai.seller{background:var(--night);color:var(--gold)}
.acct-row .ai svg{width:20px;height:20px}
.acct-row .ck svg{width:20px;height:20px;color:var(--primary)}
.acct-link{display:flex;align-items:center;gap:8px;margin-top:6px;padding:10px 4px;color:var(--ink);font-weight:650;font-size:14px;text-decoration:none}
.acct-link svg{width:18px;height:18px;color:var(--muted)}
.drawer-switch{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;margin:6px 0 4px;padding:10px 12px;border-radius:14px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--ink);font:inherit;font-weight:700;cursor:pointer;text-align:left}
.drawer-switch svg{width:20px;height:20px}.drawer-switch small{color:var(--primary);font-weight:800}
/* seller tab bar: black & gold, with a raised "Publier" button in the middle */
@media (max-width:900px){
  .tabbar.seller{background:rgba(14,11,6,.94);border-top-color:rgba(245,181,61,.25)}
  .tabbar.seller a{color:#B9AE97}
  .tabbar.seller a[aria-current="page"]{color:var(--gold-hi)}
  .tabbar.seller a[aria-current="page"] .ti{background:rgba(245,181,61,.16);color:var(--gold-hi)}
  .tabbar.seller a.tab-cta .ti{width:50px;height:50px;margin-top:-22px;border-radius:50%;background:var(--grad-gold);color:#1A1405;box-shadow:0 8px 20px -6px rgba(245,181,61,.7),0 0 0 4px rgba(14,11,6,.94)}
  .tabbar.seller a.tab-cta .ti svg{width:24px;height:24px}
  .tabbar.seller a.tab-cta{color:var(--gold-hi)}
}
.biz-cta{justify-content:center;width:100%}
@media (min-width:640px){.biz-cta{width:auto;justify-self:start}}
.sponsor-strip{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;margin-top:14px;padding:12px 14px;border-radius:18px;border:1px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none}
.sponsor-strip .ai{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--grad-ember);color:#fff}
.sponsor-strip .ai svg{width:20px;height:20px}
.sponsor-strip b{display:block;font-size:14.5px}.sponsor-strip small{display:block;color:var(--muted);font-size:12.5px}
.sponsor-strip .go{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#25D366;color:#fff}.sponsor-strip .go svg{width:17px;height:17px}
.tips-card{margin-top:12px;padding:12px 14px}
.tips-card summary{list-style:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;cursor:pointer;font-weight:700;font-size:14px}
.tips-card summary::-webkit-details-marker{display:none}
.tips-card summary svg{width:16px;height:16px;color:var(--primary)}
.tips-card .plus{width:26px;height:26px;border-radius:50%;background:var(--surface-2);display:grid;place-items:center;transition:transform .2s}
.tips-card[open] .plus{transform:rotate(45deg)}
@media (max-width:440px){.top .btn-join{display:none}.top-right{gap:6px}}
.mode-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:16px;padding:10px 12px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}