:root{
    --ink:#1B2438;--ink-2:#243050;--ink-3:#2D3A5C;--line:rgba(244,234,210,.12);--line-2:rgba(244,234,210,.22);
    --paper:#F4EAD2;--paper-2:#E9DDBF;--paper-sh:#B9A981;--text:#F4EAD2;--text-2:#A9B4CC;--text-3:#7C889F;--onpaper:#211B12;--onpaper-2:#6A5D45;
    --gold:#F2B637;--gold-sh:#B8841A;--ember:#F0603F;--sky:#8FC6F2;--violet:#B48CF2;--mint:#7FD8A8;--mint-sh:#4E9A72;
    --accent:var(--gold);--accent-sh:var(--gold-sh);--accent-on:#211B12;
    --t1:#FBF4E2;--t2:var(--paper);--tsh:var(--paper-sh);--tink:var(--onpaper);--tsm:var(--onpaper-2);
    --tw:clamp(40px,calc((100vw - 74px)/7),52px);--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--r-tile:10px;--r-surf:16px;
    --fd:'Fraunces',Georgia,serif;--fu:'Nunito',system-ui,-apple-system,sans-serif;
    --ease:cubic-bezier(.2,.8,.2,1);--pop:cubic-bezier(.2,1.6,.3,1);
  }
  .mode-daily{--accent:var(--mint);--accent-sh:var(--mint-sh);--accent-on:#0F2A1D}
  .mode-blitz{--accent:var(--ember);--accent-sh:#A33A22;--accent-on:#fff}
  .mode-friend{--accent:var(--violet);--accent-sh:#7B4FB5;--accent-on:#fff}
  .theme-slate{--t1:#DDE3EC;--t2:#B9C4D4;--tsh:#6F7F97;--tink:#1B2230;--tsm:#4A566A}
  .theme-rose{--t1:#FFE1E6;--t2:#F7B8C4;--tsh:#B9727F;--tink:#4A1E27;--tsm:#8C4B58}
  .theme-mint{--t1:#DDF8EA;--t2:#A9E6C7;--tsh:#5FA684;--tink:#143526;--tsm:#3E6E56}
  .theme-midnight{--t1:#3A4466;--t2:#252C48;--tsh:#11162B;--tink:#F4EAD2;--tsm:#B9C2E0}
  .theme-gold{--t1:#FFE9A8;--t2:#F2C64B;--tsh:#A57B15;--tink:#3A2A05;--tsm:#7A5A0E}
  *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
  html,body{margin:0;background:var(--ink);color:var(--text);font-family:var(--fu);height:100%;overscroll-behavior:none}
  body{height:100dvh;display:flex;justify-content:center;overflow:hidden}
  .app{width:100%;max-width:440px;height:100dvh;background:var(--ink);display:flex;flex-direction:column;position:relative;overflow:hidden;padding-bottom:env(safe-area-inset-bottom);touch-action:manipulation;
    background-image:radial-gradient(120% 60% at 50% -10%,rgba(242,182,55,.10),transparent 60%)}
  .app.heat1{background-image:radial-gradient(120% 60% at 50% -10%,rgba(242,182,55,.18),transparent 60%)}
  .app.heat2{background-image:radial-gradient(120% 60% at 50% -10%,rgba(240,96,63,.26),transparent 60%)}
  .app.shake1{animation:shk .25s}.app.shake2{animation:shk .4s}.app.shake3{animation:shk2 .6s}
  @keyframes shk{25%{transform:translate(2px,-2px)}50%{transform:translate(-3px,2px)}75%{transform:translate(2px,1px)}}
  @keyframes shk2{15%{transform:translate(5px,-4px) rotate(.4deg)}30%{transform:translate(-6px,4px) rotate(-.4deg)}45%{transform:translate(5px,3px)}60%{transform:translate(-4px,-3px)}80%{transform:translate(2px,2px)}}
  button{font-family:var(--fu);cursor:pointer;border:0;color:inherit}
  button:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
  svg.ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}

  /* header */
  .top{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--s2) + env(safe-area-inset-top)) var(--s4) 0}
  .brand{font-family:var(--fd);font-weight:900;font-size:24px;letter-spacing:-.02em;font-variation-settings:'SOFT' 100;background:transparent;padding:var(--s1) 0;color:var(--text)}
  .topr{display:flex;gap:var(--s2);align-items:center}
  .coins{font-family:var(--fd);font-weight:800;font-size:15px;color:var(--gold);background:var(--ink-2);padding:6px 12px;border-radius:99px;display:flex;align-items:center;gap:6px;border:1px solid var(--line)}
  .coins i{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:inset -2px -2px 0 var(--gold-sh)}
  .coins.pulse{animation:coinpulse .5s var(--pop)}@keyframes coinpulse{40%{transform:scale(1.18)}}
  .icon{background:var(--ink-2);color:var(--text-2);padding:8px;border-radius:99px;min-height:36px;min-width:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}
  .icon:active{background:var(--ink-3)}

  .round{display:flex;justify-content:space-between;align-items:baseline;padding:var(--s3) var(--s4) 0;font-size:13px;color:var(--text-2);font-weight:700}
  .round b{color:var(--text);font-weight:800}
  .round #target{font-family:var(--fd);font-size:20px;color:var(--text)}
  .boss{margin:var(--s2) var(--s4) 0;background:linear-gradient(90deg,rgba(240,96,63,.18),rgba(180,140,242,.14));border:1px solid rgba(240,96,63,.5);border-radius:var(--r-surf);padding:var(--s2) var(--s3);font-size:12px;font-weight:700;color:#FFD3C6}
  .boss b{color:var(--ember)}.boss i{display:block;color:#FFB9A6;font-weight:600}
  .boss[hidden],.blitzbar[hidden]{display:none}
  .blitzbar{margin:var(--s2) var(--s4) 0;background:rgba(240,96,63,.12);border:1px solid rgba(240,96,63,.4);border-radius:var(--r-surf);padding:var(--s2) var(--s3);font-size:12px;font-weight:700;color:#FFD3C6}
  .targetbar{margin:var(--s2) var(--s4) 0;height:10px;border-radius:5px;background:var(--ink-2);overflow:hidden;position:relative;border:1px solid var(--line)}
  .targetbar i{display:block;height:100%;width:0;background:var(--accent);border-radius:5px;transition:width .5s var(--ease);box-shadow:0 0 10px var(--accent)}
  .targetbar i.over{background:linear-gradient(90deg,var(--accent),var(--gold))}
  .targetbar em{position:absolute;top:0;bottom:0;width:2px;background:var(--line-2)}
  .pips{display:flex;justify-content:space-between;align-items:center;padding:var(--s2) var(--s4) 0;font-size:12px;color:var(--text-2);font-weight:700}
  .pips span{display:flex;align-items:center;gap:6px}
  .pip{width:12px;height:12px;border-radius:50%;background:var(--accent);box-shadow:inset -2px -2px 0 rgba(0,0,0,.25);transition:transform .2s,background .2s}
  .pip.swap{background:var(--sky)}.pip.off{background:var(--ink-3);box-shadow:none;transform:scale(.75)}
  .totals{display:flex;justify-content:space-between;padding:var(--s2) var(--s4) 0;font-size:13px;color:var(--text-2);font-weight:700}
  .totals b{color:var(--text)}.rank{color:var(--gold)}

  /* hero */
  .hero{padding:var(--s2) var(--s4) 0;text-align:center;position:relative}
  .formula{display:flex;align-items:baseline;justify-content:center;gap:var(--s2);font-family:var(--fd);font-weight:800;font-size:30px;line-height:1}
  .chips{color:var(--sky)}.mult{color:var(--ember)}.xm{color:var(--violet);font-size:20px}.op{color:var(--text-3);font-size:20px;font-weight:400}
  .lbl{font-family:var(--fu);font-size:10px;font-weight:800;color:var(--text-3);margin-left:2px;letter-spacing:.02em}
  .bump{animation:bump .18s var(--pop)}@keyframes bump{40%{transform:scale(1.25)}}
  .result{transition:font-size .15s var(--pop);font-family:var(--fd);font-weight:900;font-size:48px;line-height:1.05;color:var(--gold);letter-spacing:-.03em;min-height:52px;text-shadow:0 2px 0 rgba(0,0,0,.35);font-variation-settings:'SOFT' 60}
  .result.pop{animation:pop .5s var(--pop)}
  .result.hot{color:#FFB25A;text-shadow:0 0 18px rgba(255,140,50,.6),0 2px 0 rgba(0,0,0,.35);font-size:54px}
  .result.inferno{background:linear-gradient(90deg,#FFE066,#FF6A3D,#FF2D95,#FFE066);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:pop .5s var(--pop),flame 1.2s linear infinite;font-size:58px;text-shadow:none;filter:drop-shadow(0 0 14px rgba(255,90,40,.8))}
  @keyframes pop{0%{transform:scale(.6)}100%{transform:scale(1)}}
  @keyframes flame{to{background-position:300% 0}}
  .hint{font-size:12px;color:var(--text-2);min-height:16px;font-weight:700}.hint.bad{color:var(--ember)}
  .def{font-size:12px;color:var(--sky);min-height:34px;font-weight:600;padding:0 var(--s4) var(--s1);text-align:center;font-style:italic;opacity:.9;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .note{font-family:var(--fd);font-style:italic;font-size:13px;color:var(--text);text-align:center;padding:2px var(--s4) var(--s1);opacity:.9}
  .callout{position:absolute;left:50%;font-family:var(--fd);font-weight:900;font-size:18px;padding:3px 10px;border-radius:99px;background:var(--ink-2);border:1px solid var(--line-2);white-space:nowrap;pointer-events:none;z-index:4;animation:callout .9s var(--ease) forwards;transform:translateX(-50%)}
  .callout.c{color:var(--sky)}.callout.m{color:var(--ember)}.callout.x{color:var(--violet)}
  @keyframes callout{0%{opacity:0;transform:translate(-50%,10px) scale(.7)}20%{opacity:1;transform:translate(-50%,0) scale(1.05)}70%{opacity:1;transform:translate(-50%,-14px) scale(1)}100%{opacity:0;transform:translate(-50%,-30px)}}

  /* perks strip */
  .perks{padding:var(--s2) 0 0 var(--s4)}
  .perklist{display:flex;gap:var(--s2);overflow-x:auto;padding:12px var(--s4) var(--s2) 0;margin-top:-6px;scrollbar-width:none}.perklist::-webkit-scrollbar{display:none}
  .perk{flex:none;max-width:172px;background:var(--ink-2);border:1px solid var(--line);border-left:3px solid var(--text-3);border-radius:var(--r-tile);padding:6px 10px;font-size:10px;font-weight:700;color:var(--text-2);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:42px;transition:transform .15s}
  .perk b{display:block;color:var(--text);font-size:12px;font-family:var(--fd);font-weight:800}
  .perk.fire{border-color:var(--gold);animation:glow .55s var(--pop)}
  @keyframes glow{0%{background:rgba(242,182,55,.35);transform:translateY(-3px) scale(1.06)}100%{background:var(--ink-2);transform:none}}
  .perk.empty{color:var(--text-3);border-style:dashed;border-left-width:1px;max-width:none;white-space:normal}
  .perk.r-uncommon{border-left-color:var(--sky)}.perk.r-rare{border-left-color:var(--violet)}.perk.r-legendary{border-left-color:var(--gold);box-shadow:0 0 12px rgba(242,182,55,.25)}
  .rar{display:inline-block;font-size:10px;font-weight:800;padding:1px 7px;border-radius:99px;margin-left:6px;vertical-align:middle;color:#fff}
  .rar.common{background:#6B7A94}.rar.uncommon{background:#3E7EB5}.rar.rare{background:#7B4FB5}.rar.legendary{background:var(--gold-sh)}

  /* bottom zone */
  .spacer{flex:1 1 0;min-height:0;display:flex;flex-direction:column;justify-content:center;justify-content:safe center;overflow-y:auto;scrollbar-width:none}.spacer::-webkit-scrollbar{display:none}.bottom{flex:none;margin-top:auto;padding-bottom:var(--s2)}
  .def:empty{min-height:0;padding:0}.hero,.def,.note,.perks{flex:none}
  .next:empty,.ghost:empty{min-height:0;margin:0}
  .round{padding-top:var(--s2)}
  .formula{font-size:26px}
  .word{margin:0 var(--s4);min-height:72px;border-radius:var(--r-surf);background:var(--ink-2);border:2px dashed var(--line-2);display:flex;gap:6px;justify-content:center;align-items:center;padding:var(--s2);flex-wrap:wrap;transition:border-color .2s,box-shadow .2s,background .2s}
  .word.empty::before{content:'Tap or swipe letters to spell a word';color:var(--text-3);font-size:13px;font-weight:700}
  .word.valid{border-style:solid;border-color:var(--mint);box-shadow:0 0 0 3px rgba(127,216,168,.18),0 0 18px rgba(127,216,168,.25);background:rgba(127,216,168,.06)}
  .word.invalid{border-color:var(--line-2)}
  .tile{position:relative;width:var(--tw);height:calc(var(--tw)*1.15);border-radius:var(--r-tile);background:linear-gradient(180deg,var(--t1),var(--t2));box-shadow:0 5px 0 var(--tsh),0 8px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.6);color:var(--tink);font-family:var(--fd);font-weight:900;font-size:calc(var(--tw)*.54);display:flex;align-items:center;justify-content:center;transition:transform .12s var(--pop),box-shadow .12s;padding:0;user-select:none;touch-action:none;font-variation-settings:'SOFT' 40}
  .tile:active,.tile.press{transform:translateY(4px) scale(1.04,.94);box-shadow:0 1px 0 var(--tsh),0 3px 6px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.6)}
  .tile small{position:absolute;right:5px;bottom:3px;font-family:var(--fu);font-size:10px;font-weight:800;color:var(--tsm)}
  .tile .mod{position:absolute;left:5px;top:3px;font-size:10px;font-weight:800;color:var(--tsm)}
  .tile.rare small{color:var(--ember)}
  .tile.gold{background:linear-gradient(180deg,#FFE58A,#F2B637);box-shadow:0 5px 0 #B8841A,0 8px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.7);color:#3A2A05}.tile.gold small,.tile.gold .mod{color:#7A5A0E}
  .tile.foil{background:linear-gradient(135deg,#E6EEF9,#A9C0DB 45%,#EEF4FC);box-shadow:0 5px 0 #6D86A6,0 8px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.8);color:#1B2230}.tile.foil small,.tile.foil .mod{color:#4A566A}
  .tile.glass{background:linear-gradient(180deg,rgba(200,240,255,.35),rgba(140,200,240,.18));border:2px solid rgba(200,235,255,.8);color:#EAF7FF;box-shadow:0 5px 0 rgba(120,180,220,.5),0 8px 12px rgba(0,0,0,.35)}.tile.glass small,.tile.glass .mod{color:#BFE3FF}
  .tile.wild{background:linear-gradient(180deg,#EBD8FF,#B48CF2);box-shadow:0 5px 0 #7B4FB5,0 8px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.7);color:#2A1550}.tile.wild .mod{color:#4A2A80}
  .tile.locked{opacity:.35;filter:grayscale(1)}
  .tile.scored{animation:jolt .34s var(--pop)}@keyframes jolt{30%{transform:translateY(-12px) scale(1.12,.94)}60%{transform:translateY(0) scale(.96,1.06)}}
  .tile.shatter{animation:shatter .5s forwards}@keyframes shatter{to{transform:scale(1.5) rotate(15deg);opacity:0}}
  .tile.land{animation:land .28s var(--pop)}@keyframes land{0%{transform:translateY(-10px) scale(.9,1.1)}60%{transform:translateY(2px) scale(1.06,.94)}}
  .tile.breathe{animation:breathe 1.2s ease-in-out}@keyframes breathe{50%{transform:translateY(-4px) rotate(-2deg)}}
  .word .tile{width:calc(var(--tw)*.88);height:calc(var(--tw)*1.0);font-size:calc(var(--tw)*.46)}.word .tile.dragging{opacity:.5;transform:scale(1.08)}
  .rack{margin:var(--s3) var(--s4) 0;display:flex;gap:6px;justify-content:center;min-height:calc(var(--tw)*1.15);flex-wrap:nowrap}
  .rack .tile.inpath{transform:translateY(-8px);box-shadow:0 12px 0 var(--tsh),0 14px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.6)}
  .rack .slot{width:var(--tw);height:calc(var(--tw)*1.15);border-radius:var(--r-tile);background:var(--ink-2);border:1px dashed var(--line)}
  .next{font-size:12px;color:var(--text-3);font-weight:700;text-align:center;margin-top:var(--s2);min-height:16px}
  .ghost{font-size:12px;color:var(--violet);font-weight:800;text-align:center;min-height:16px;margin-top:var(--s1)}
  .actions{display:flex;gap:var(--s2);padding:var(--s3) var(--s4) 0}
  .btn{flex:1;min-height:58px;padding:var(--s2) var(--s3);border-radius:var(--r-surf);font-weight:800;font-size:17px;color:var(--onpaper);background:var(--paper);box-shadow:0 5px 0 var(--paper-sh);transition:transform .1s,box-shadow .1s,filter .2s}
  .btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--paper-sh)}
  .btn.play{background:var(--accent);color:var(--accent-on);box-shadow:0 5px 0 var(--accent-sh);flex:2;filter:saturate(.35) brightness(.85)}
  .btn.play.ready{filter:none;animation:ready .6s var(--pop)}@keyframes ready{40%{transform:scale(1.04)}}
  .btn.play:active{box-shadow:0 1px 0 var(--accent-sh)}
  .btn:disabled{opacity:.45;cursor:default;transform:none;filter:saturate(.35) brightness(.85)}
  .btn .count{display:block;font-size:13px;font-weight:700;opacity:.8;margin-top:2px}
  .clear,.hintbtn{background:transparent;color:var(--text-2);font-weight:800;font-size:13px;padding:6px 12px;min-height:34px;text-decoration:underline;text-underline-offset:3px}
  .hintbtn{color:var(--sky)}.hintbtn:disabled{opacity:.4;text-decoration:none}
  .lower .tile{text-transform:lowercase}.clearfont .tile,.clearfont .logo{font-family:var(--fu);letter-spacing:.02em}

  /* overlays */
  .overlay{position:absolute;inset:0;background:rgba(27,36,56,.97);display:flex;flex-direction:column;justify-content:center;justify-content:safe center;padding:var(--s5) var(--s4);z-index:5;overflow:auto}
  .overlay[hidden]{display:none}
  .overlay h2{font-family:var(--fd);font-weight:900;font-size:32px;margin:0 0 var(--s2);line-height:1.05;letter-spacing:-.02em;font-variation-settings:'SOFT' 100}
  .overlay p{color:var(--text-2);font-size:14px;line-height:1.5;margin:0 0 var(--s4);font-weight:600}.overlay p b{color:var(--text)}
  .cards{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s2)}
  .card{text-align:left;background:var(--paper);color:var(--onpaper);border-radius:var(--r-surf);padding:var(--s3) var(--s4);box-shadow:0 5px 0 var(--paper-sh);display:flex;justify-content:space-between;align-items:center;gap:var(--s3);width:100%;transition:transform .1s,box-shadow .1s}
  .card:active{transform:translateY(4px);box-shadow:0 1px 0 var(--paper-sh)}
  .card:disabled{opacity:.45;cursor:default;transform:none}
  .card .t{flex:1}.card b{display:block;font-family:var(--fd);font-size:18px;font-weight:800}
  .card span{font-size:12px;font-weight:700;color:var(--onpaper-2)}.card i{display:block;font-size:11px;color:var(--gold-sh);font-weight:600;margin-top:2px}
  .card .kind{display:inline-block;font-size:10px;font-weight:800;padding:2px 8px;border-radius:99px;margin-bottom:4px;color:#fff}
  .k-chips{background:#3E7EB5}.k-mult{background:var(--ember)}.k-x{background:#7B4FB5}.k-util{background:#3F9B6A}.k-tile{background:#8A6D2B}
  .price{font-family:var(--fd);font-weight:900;font-size:20px;color:var(--gold-sh);white-space:nowrap}
  .card.sold{opacity:.5}
  .big{padding:15px;border-radius:var(--r-surf);background:var(--accent);color:var(--accent-on);font-weight:800;font-size:16px;box-shadow:0 5px 0 var(--accent-sh);width:100%;transition:transform .1s,box-shadow .1s}
  .big:active{transform:translateY(4px);box-shadow:0 1px 0 var(--accent-sh)}
  .big.ghost{background:var(--ink-2);color:var(--text);box-shadow:none;border:1px solid var(--line-2)}.big.ghost:active{background:var(--ink-3);transform:none}
  .big small{display:block;font-size:11px;font-weight:700;opacity:.75}
  .row{display:flex;gap:var(--s2);margin-top:var(--s2)}.row .big{flex:1}
  .stat{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;font-weight:700}
  .stat b{font-family:var(--fd);color:var(--gold);font-size:18px;text-align:right}
  .how li{margin:0 0 9px;font-size:14px;line-height:1.5;font-weight:600}.how ul{padding-left:18px;margin:0 0 var(--s4)}.how li b{color:var(--gold)}
  .grid{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:var(--s3)}
  .grid .tile{width:44px;height:50px;font-size:22px}
  .shopcoins{font-family:var(--fd);font-weight:900;font-size:28px;color:var(--gold)}
  .part{position:absolute;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:4;animation:part 1.1s ease-out forwards}
  @keyframes part{to{transform:translate(var(--dx),var(--dy)) rotate(540deg);opacity:0}}
  .coinfly{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--gold);box-shadow:inset -2px -2px 0 var(--gold-sh);pointer-events:none;z-index:8;transition:transform .55s var(--ease),opacity .55s}
  .banner{position:absolute;left:var(--s4);right:var(--s4);top:40%;text-align:center;z-index:6;pointer-events:none;font-family:var(--fd);font-weight:900;font-size:30px;color:var(--gold);text-shadow:0 3px 0 rgba(0,0,0,.4);animation:banner 1.3s forwards;font-variation-settings:'SOFT' 100;background:var(--ink-2);border:1px solid rgba(242,182,55,.5);border-radius:var(--r-surf);padding:var(--s3) var(--s4);box-shadow:0 12px 30px rgba(0,0,0,.45),0 0 30px rgba(242,182,55,.25)}
  .banner small{display:block;font-family:var(--fu);font-size:14px;color:var(--text);font-weight:800}
  @keyframes banner{0%{transform:scale(.5);opacity:0}15%{transform:scale(1.1);opacity:1}30%{transform:scale(1)}85%{opacity:1}100%{opacity:0;transform:translateY(-20px)}}
  .first{position:absolute;inset:0;z-index:9;background:var(--ink);background-image:radial-gradient(circle at 50% 40%,rgba(242,182,55,.35),transparent 55%);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--s5);animation:fadein .4s}
  .first h1{font-family:var(--fd);font-weight:900;font-size:44px;margin:0;line-height:1;letter-spacing:-.03em;color:var(--gold);text-shadow:0 0 30px rgba(242,182,55,.6);font-variation-settings:'SOFT' 100}
  .first small{display:block;font-size:14px;font-weight:800;color:var(--text);margin:var(--s2) 0 var(--s4)}
  @keyframes fadein{from{opacity:0}}

  /* title */
  .title{text-align:center;justify-content:flex-start;padding-top:calc(40px + env(safe-area-inset-top));background:var(--ink);background-image:radial-gradient(120% 60% at 50% -10%,rgba(242,182,55,.10),transparent 60%)}
  .logo{display:flex;justify-content:center;gap:5px;margin-bottom:var(--s3)}
  .logo .tile{width:44px;height:50px;font-size:24px;pointer-events:none;animation:land .5s var(--pop) both}
  .logo .tile:nth-child(2){animation-delay:.05s}.logo .tile:nth-child(3){animation-delay:.1s}.logo .tile:nth-child(4){animation-delay:.15s}.logo .tile:nth-child(5){animation-delay:.2s}.logo .tile:nth-child(6){animation-delay:.25s}.logo .tile:nth-child(7){animation-delay:.3s}
  .tag{font-family:var(--fd);font-weight:800;font-size:18px;margin:0 0 var(--s4);font-variation-settings:'SOFT' 100}
  .menu{display:flex;flex-direction:column;gap:var(--s2);margin:0 auto;width:100%;max-width:320px}
  .titles{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin:var(--s2) 0}.titles span{font-size:11px;font-weight:800;padding:3px 9px;border-radius:99px;background:rgba(242,182,55,.14);color:var(--gold);border:1px solid rgba(242,182,55,.4)}
  .ach{display:flex;gap:var(--s3);align-items:center;padding:var(--s3);border-radius:var(--r-surf);background:var(--ink-2);margin-bottom:var(--s2);text-align:left;border:1px solid var(--line)}
  .ach .sw{width:34px;height:38px;border-radius:7px;flex:none;background:linear-gradient(180deg,var(--t1),var(--t2));box-shadow:0 3px 0 var(--tsh)}
  .ach.locked .sw{filter:grayscale(1);opacity:.4}
  .ach b{display:block;font-size:14px}.ach span{font-size:12px;color:var(--text-2);font-weight:700}
  .ach button{margin-left:auto;background:var(--paper);color:var(--onpaper);font-weight:800;font-size:12px;padding:6px 10px;border-radius:99px}
  .ach.on button{background:var(--gold)}
  .seg{display:flex;gap:6px}.seg button{flex:1;padding:10px;border-radius:var(--r-tile);background:var(--ink-2);color:var(--text);font-weight:800;font-size:13px;border:1px solid var(--line)}
  .seg button small{display:block;font-size:10px;font-weight:700;opacity:.7}
  .seg button.on{background:var(--paper);color:var(--onpaper);border-color:var(--paper)}
  .setrow{margin-bottom:var(--s4)}.setrow label{display:block;font-size:12px;color:var(--text-2);font-weight:800;margin-bottom:6px}
  .deckgrid{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin-bottom:var(--s3)}
  .deckgrid .tile{width:34px;height:38px;font-size:17px;border-radius:6px;pointer-events:none}.deckgrid .tile small{font-size:8px;right:3px;bottom:2px}.deckgrid .tile.used{opacity:.3}
  .share{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-surf);padding:var(--s3);font-family:ui-monospace,Menlo,monospace;font-size:12px;white-space:pre-wrap;color:var(--text);text-align:left;margin-bottom:var(--s3);line-height:1.5}
  .ladder{display:flex;gap:4px;margin:6px 0 var(--s4);justify-content:center}
  .ladder span{padding:4px 9px;border-radius:99px;font-size:11px;font-weight:800;background:var(--ink-2);color:var(--text-3);border:1px solid var(--line)}
  .ladder span.on{background:var(--gold);color:var(--onpaper);border-color:var(--gold)}
  .quote{font-family:var(--fd);font-style:italic;font-size:15px;color:var(--text);margin:0 0 var(--s4)}
  .peak{display:flex;gap:5px;justify-content:center;margin:6px 0 2px}.peak .tile{width:40px;height:46px;font-size:20px;pointer-events:none}
  .peakscore{font-family:var(--fd);font-weight:900;font-size:40px;color:var(--gold);text-align:center;letter-spacing:-.03em}
  .coach{background:rgba(143,198,242,.10);border-left:3px solid var(--sky);padding:var(--s2) var(--s3);border-radius:0 var(--r-tile) var(--r-tile) 0;font-size:13px;font-weight:700;color:var(--text);margin-bottom:var(--s3)}
  .league div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;font-weight:700}.league div.me{color:var(--gold)}.league b{font-family:var(--fd)}
  .shelf{max-height:38vh;overflow:auto;margin:var(--s2) 0}.shelf div{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-tile);padding:var(--s2) var(--s3);margin-bottom:6px;font-size:12px;font-weight:700}.shelf b{color:var(--gold)}
  .tabs{display:flex;gap:6px;margin-bottom:var(--s3)}.tabs button{flex:1;padding:9px;border-radius:var(--r-tile);background:var(--ink-2);color:var(--text);font-weight:800;font-size:13px;border:1px solid var(--line)}.tabs button.on{background:var(--paper);color:var(--onpaper);border-color:var(--paper)}
  .hist{max-height:50vh;overflow:auto;margin-bottom:var(--s3)}.hist div{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px;font-weight:700}.hist b{color:var(--gold);font-family:var(--fd)}
  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
  .marks{display:flex;justify-content:space-between;padding:4px var(--s4) 0;font-size:10px;font-weight:800;color:var(--text-3)}
  .marks span{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:52px}.marks span b{color:var(--text-2);font-family:var(--fd);font-size:13px}
  .marks span.on{color:var(--gold)}.marks span.on b{color:var(--gold)}
  .why{font-size:12px;color:var(--text-2);font-weight:700;min-height:16px;margin-top:2px}.why b{color:var(--text)}
  .coin{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#FFF1B0,#F2B637 45%,#B8841A 100%);box-shadow:0 1px 0 #7A5A0E,inset 0 0 0 2px rgba(255,255,255,.25);position:relative}
  .coin::after{content:'';position:absolute;inset:3px;border-radius:50%;border:1px solid rgba(122,90,14,.5)}
  .coins.pulse .coin{animation:spin .5s var(--pop)}@keyframes spin{50%{transform:rotateY(180deg) scale(1.2)}}
  .coinfly{background:radial-gradient(circle at 35% 30%,#FFF1B0,#F2B637 45%,#B8841A 100%);box-shadow:0 1px 0 #7A5A0E}
  .perkhead{display:flex;justify-content:space-between;align-items:baseline;padding:0 var(--s4) 6px 0;font-size:11px;font-weight:800;color:var(--text-3)}.perkhead span:first-child{color:var(--text-2)}
  .perk{flex:none;width:156px;max-width:156px;background:var(--ink-2);border:1px solid var(--line);border-left:3px solid var(--text-3);border-radius:var(--r-tile);padding:7px 10px 6px;font-size:10px;font-weight:700;color:var(--text-2);text-align:left;white-space:normal;overflow:visible;min-height:56px;position:relative;line-height:1.25;transition:transform .15s,border-color .2s,box-shadow .2s}
  .perk .d{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .perk .k{position:absolute;right:8px;top:6px;width:8px;height:8px;border-radius:50%}
  .perk .k.chips{background:var(--sky)}.perk .k.mult{background:var(--ember)}.perk .k.x{background:var(--violet)}.perk .k.util{background:var(--mint)}
  .perk.live{border-color:var(--mint);background:rgba(127,216,168,.10);box-shadow:0 0 0 2px rgba(127,216,168,.2)}
  .perk .tag{position:absolute;top:-9px;right:6px;font-family:var(--fd);font-weight:900;font-size:12px;padding:1px 8px;border-radius:99px;background:var(--mint);color:#0F2A1D;box-shadow:0 2px 0 var(--mint-sh)}
  .perk .tag.c{background:var(--sky);color:#0E2A44;box-shadow:0 2px 0 #4F7FA8}.perk .tag.m{background:var(--ember);color:#fff;box-shadow:0 2px 0 #A33A22}.perk .tag.x{background:var(--violet);color:#fff;box-shadow:0 2px 0 #7B4FB5}
  .perk.empty{width:auto;max-width:none;min-height:40px}
  .word .tile.used{box-shadow:0 5px 0 var(--tsh),0 0 0 3px var(--mint),0 8px 12px rgba(0,0,0,.35)}
  .scoretab{display:flex;gap:6px;margin:0 0 var(--s3)}.scoretab div{flex:1;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-tile);padding:8px 4px;text-align:center;font-family:var(--fd);font-weight:800;font-size:15px;color:var(--ember)}.scoretab div b{display:block;font-family:var(--fu);font-size:10px;color:var(--text-2);font-weight:800}
  .earn{display:flex;flex-direction:column;gap:4px;margin:0 0 var(--s3)}.earn div{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--text-2)}.earn div b{color:var(--gold);font-family:var(--fd);font-size:15px}.earn div.total{border-top:1px solid var(--line);padding-top:4px;color:var(--text)}
  .scorebox{display:flex;align-items:baseline;gap:6px}.scorebox #roundScore{font-family:var(--fd);font-size:24px;color:var(--text)}.scorebox .rank{font-size:13px}
  .round #target{display:none}
  .marks{position:relative;height:34px;margin:2px var(--s4) 0;padding:0;display:block}
  .marks span{position:absolute;top:2px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:0;min-width:0;white-space:nowrap}
  .marks span:last-child{transform:translateX(-100%)}
  .marks span.lock{opacity:.4}.marks span.lock b::after{content:' 🔒';font-size:9px}
  .totals{min-height:16px}
  .perks{padding:var(--s2) 0 0 var(--s4)}
  .perklist{display:flex;gap:var(--s2);overflow-x:auto;padding:14px var(--s4) var(--s3) 0;margin-top:-6px;scrollbar-width:none;align-items:flex-end}
  .pcard{flex:none;width:118px;height:130px;border-radius:12px;background:linear-gradient(180deg,#FBF4E2,#F4EAD2);color:var(--onpaper);box-shadow:0 4px 0 var(--paper-sh),0 8px 12px rgba(0,0,0,.35);position:relative;padding:0 9px 8px;text-align:left;display:flex;flex-direction:column;transition:transform .2s var(--pop),box-shadow .2s;overflow:visible}
  .pcard .band{height:24px;margin:0 -9px 7px;border-radius:12px 12px 0 0;display:flex;align-items:center;justify-content:space-between;padding:0 9px;color:#fff;font-size:10px;font-weight:800;letter-spacing:.01em}
  .pcard .band svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  .pcard.r-common .band{background:#6B7A94}.pcard.r-uncommon .band{background:#3E7EB5}.pcard.r-rare .band{background:#7B4FB5}.pcard.r-legendary .band{background:linear-gradient(90deg,#B8841A,#F2B637)}
  .pcard.r-legendary{box-shadow:0 4px 0 var(--paper-sh),0 0 16px rgba(242,182,55,.45)}
  .pcard b{font-family:var(--fd);font-size:13.5px;line-height:1.1;font-weight:800}
  .pcard .d{font-size:9.5px;color:var(--onpaper-2);line-height:1.3;margin-top:4px;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .pcard .n{margin-top:auto;font-size:9px;color:var(--onpaper-2);font-weight:800;opacity:.8}
  .pcard.live{transform:translateY(-8px);box-shadow:0 12px 0 var(--paper-sh),0 0 0 3px var(--mint),0 14px 16px rgba(0,0,0,.4)}
  .pcard.fire{animation:pfire .55s var(--pop)}@keyframes pfire{0%{transform:translateY(-14px) scale(1.08);box-shadow:0 18px 0 var(--paper-sh),0 0 0 4px var(--gold)}100%{transform:none}}
  .pcard .tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);font-family:var(--fd);font-weight:900;font-size:13px;padding:2px 10px;border-radius:99px;background:var(--mint);color:#0F2A1D;box-shadow:0 2px 0 var(--mint-sh);white-space:nowrap}
  .pcard .tag.c{background:var(--sky);color:#0E2A44;box-shadow:0 2px 0 #4F7FA8}.pcard .tag.m{background:var(--ember);color:#fff;box-shadow:0 2px 0 #A33A22}.pcard .tag.x{background:var(--violet);color:#fff;box-shadow:0 2px 0 #7B4FB5}
  .pcard.empty{background:transparent;border:2px dashed var(--line-2);box-shadow:none;color:var(--text-3);justify-content:center;align-items:center;text-align:center;font-size:11px;font-weight:700;padding:8px;width:150px}
  .perk{display:none}
  /* stamp tray */
  .tray{display:flex;gap:10px;overflow-x:auto;padding:16px var(--s4) var(--s2) 0;margin-top:-8px;scrollbar-width:none;align-items:flex-start}.tray::-webkit-scrollbar{display:none}
  .stamp{flex:none;width:64px;background:transparent;padding:0;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;transition:transform .2s var(--pop)}
  .stamp .face{width:56px;height:56px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#FBF4E2,#E9DDBF 70%,#D2C39C);box-shadow:0 4px 0 var(--paper-sh),0 6px 10px rgba(0,0,0,.35),inset 0 0 0 4px var(--ring),inset 0 0 0 6px #F4EAD2;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--onpaper);position:relative;transition:transform .15s var(--pop),box-shadow .15s}
  .stamp .face svg{width:14px;height:14px;fill:none;stroke:var(--ring);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:-1px}
  .stamp .face b{font-family:var(--fd);font-weight:900;font-size:14px;line-height:1;letter-spacing:-.02em;color:var(--onpaper);white-space:nowrap;max-width:42px}
  .stamp .face b.sm{font-size:11px}.stamp .face b.xs{font-size:9px;letter-spacing:-.03em}
  .stamp .face .fc{position:absolute;right:-2px;bottom:-2px;font-size:9px;font-weight:800;background:var(--ink-2);color:var(--text-2);border:1px solid var(--line-2);border-radius:99px;padding:1px 5px}
  .stamp .nm{font-size:9px;font-weight:800;color:var(--text-2);text-align:center;line-height:1.1;max-width:68px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:20px}
  .stamp.r-common{--ring:#6B7A94}.stamp.r-uncommon{--ring:#3E7EB5}.stamp.r-rare{--ring:#7B4FB5}.stamp.r-legendary{--ring:#B8841A}
  .stamp.r-legendary .face{box-shadow:0 4px 0 var(--paper-sh),0 0 14px rgba(242,182,55,.5),inset 0 0 0 4px var(--ring),inset 0 0 0 6px #F4EAD2}
  .stamp.live{transform:translateY(-6px)}.stamp.live .face{box-shadow:0 10px 0 var(--paper-sh),0 0 0 3px var(--mint),0 12px 14px rgba(0,0,0,.4),inset 0 0 0 4px var(--ring),inset 0 0 0 6px #F4EAD2}
  .stamp.live .nm{color:var(--mint)}
  .stamp .tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-family:var(--fd);font-weight:900;font-size:12px;padding:1px 8px;border-radius:99px;background:var(--mint);color:#0F2A1D;box-shadow:0 2px 0 var(--mint-sh);white-space:nowrap;z-index:2}
  .stamp .tag.c{background:var(--sky);color:#0E2A44;box-shadow:0 2px 0 #4F7FA8}.stamp .tag.m{background:var(--ember);color:#fff;box-shadow:0 2px 0 #A33A22}.stamp .tag.x{background:var(--violet);color:#fff;box-shadow:0 2px 0 #7B4FB5}
  .stamp.fire .face{animation:press .5s var(--pop)}@keyframes press{0%{transform:translateY(-10px) scale(1.1)}40%{transform:translateY(6px) scale(.92)}100%{transform:none}}
  .stamp.empty{width:auto}.stamp.empty .face{width:auto;height:auto;border-radius:var(--r-tile);background:transparent;border:2px dashed var(--line-2);box-shadow:none;color:var(--text-3);font-size:11px;font-weight:700;padding:10px 12px;text-align:left}
  .pcard{display:none}
  /* ink impressions on the word */
  .ink{position:absolute;font-family:var(--fd);font-weight:900;font-size:22px;color:var(--ember);border:3px solid var(--ember);border-radius:8px;padding:0 8px;line-height:1.3;opacity:0;pointer-events:none;z-index:4;letter-spacing:.02em;mix-blend-mode:screen;animation:inkpress .9s var(--pop) forwards;-webkit-mask-image:radial-gradient(circle at 30% 30%,#000 60%,transparent 62%),radial-gradient(circle at 70% 70%,#000 55%,transparent 57%),linear-gradient(#000,#000);-webkit-mask-composite:source-over}
  .ink.c{color:var(--sky);border-color:var(--sky)}.ink.x{color:var(--violet);border-color:var(--violet)}
  @keyframes inkpress{0%{opacity:0;transform:rotate(var(--rot)) scale(1.6)}25%{opacity:.95;transform:rotate(var(--rot)) scale(1)}100%{opacity:0;transform:rotate(var(--rot)) scale(1) translateY(-10px)}}
  /* premium positions */
  .premium{display:flex;gap:6px;justify-content:center;margin:6px var(--s4) 0;min-height:18px}
  .premium i{width:var(--tw);height:16px;border-radius:4px;border:1px dashed var(--line);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:8px;letter-spacing:-.02em;font-weight:800;color:var(--text-3);white-space:nowrap;overflow:hidden;transition:background .2s,color .2s,border-color .2s}
  .premium i.want{border-style:solid;border-color:var(--ring);color:var(--ring)}
  .premium i.hit{background:var(--ring);color:#fff;border-color:var(--ring)}
  .premium[hidden]{display:none}
  .tile.want::after{content:'';position:absolute;left:8px;right:8px;bottom:-1px;height:3px;border-radius:2px;background:var(--want)}
  /* round summary */
  .sumgrid{display:flex;gap:var(--s2);margin-bottom:var(--s3)}.sumbox{flex:1;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-surf);padding:var(--s2) var(--s3)}.sumbox span{display:block;font-size:11px;font-weight:800;color:var(--text-2)}.sumbox b{font-family:var(--fd);font-size:24px;color:var(--gold)}
  .sumwords{margin-bottom:var(--s3)}.sumwords div{display:flex;justify-content:space-between;font-size:13px;font-weight:700;padding:5px 0;border-bottom:1px solid var(--line);color:var(--text-2);opacity:0;animation:rowin .35s var(--ease) forwards}.sumwords div b{color:var(--text);font-family:var(--fd)}.sumwords div i{font-style:normal;color:var(--text-3);font-size:11px;margin-left:6px}
  .earn div{opacity:0;animation:rowin .35s var(--ease) forwards}
  @keyframes rowin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  .sumperks{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s4)}.sumperks span{font-size:11px;font-weight:800;padding:4px 9px;border-radius:99px;background:var(--ink-2);border:1px solid var(--line-2);color:var(--text-2)}.sumperks span b{color:var(--gold)}
  .tray{scroll-snap-type:x proximity;position:relative}.tray .stamp{scroll-snap-align:center}
  .perks{position:relative}.perks::after{content:'';position:absolute;right:0;top:0;bottom:0;width:36px;background:linear-gradient(90deg,transparent,var(--ink));pointer-events:none;opacity:0;transition:opacity .2s}
  .perks:has(.tray.more)::after{opacity:1}
  .perks:has(.tray.more)::before{content:'›';position:absolute;right:6px;top:34px;font-family:var(--fd);font-size:22px;color:var(--text-2);z-index:2;pointer-events:none;animation:nudgeR 1.4s ease-in-out infinite}
  @keyframes nudgeR{50%{transform:translateX(3px)}}
  .club{display:flex;flex-direction:column;gap:8px;margin-bottom:var(--s3)}.club div{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-tile);padding:8px 12px}.club b{display:block;font-family:var(--fd);font-size:15px;color:var(--gold)}.club span{font-size:12px;color:var(--text-2);font-weight:700;line-height:1.4}
  .mem{color:var(--gold);text-shadow:0 0 8px rgba(242,182,55,.6)}
  .dots{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin:6px 0 6px}
  .dots i{width:22px;height:22px;border-radius:50%;border:2px solid var(--line-2);background:transparent;box-shadow:inset 0 -3px 0 rgba(0,0,0,.18);animation:dotin .35s var(--pop) both}
  .dots i:nth-child(n){animation-delay:calc(var(--i,0)*40ms)}
  @keyframes dotin{from{transform:scale(.4);opacity:0}}
  .dots i.extra{border-style:dashed;width:18px;height:18px}
  .endlesstag{flex-basis:100%;text-align:center;font-size:11px;font-weight:800;color:var(--violet);margin-top:4px}
  .dotkey{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;font-size:10px;font-weight:800;color:var(--text-2);margin-bottom:var(--s3)}.dotkey span{display:flex;align-items:center;gap:4px}.dotkey i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--line-2);display:inline-block}
  .end-win{background:radial-gradient(120% 50% at 50% -10%,rgba(242,182,55,.28),transparent 60%),rgba(27,36,56,.985)}.end-win h2{color:var(--gold)}
  .end-lose{background:radial-gradient(120% 50% at 50% -10%,rgba(240,96,63,.16),transparent 60%),rgba(27,36,56,.985)}.end-lose h2{color:var(--text)}
  .big small{display:block;font-size:11px;font-weight:700;opacity:.75}
  .overlay>*{flex:none}
  #endOverlay,#sumOverlay,#shopOverlay,#clubOverlay{padding-top:calc(var(--s5) + env(safe-area-inset-top))}

  /* web-only additions */
  .installhint{margin:14px auto 0;max-width:320px;background:var(--ink-2);border:1px solid var(--line);border-radius:var(--r-surf);padding:10px 12px;font-size:12px;color:var(--text-2);font-weight:700;text-align:left;display:flex;gap:10px;align-items:center}
  .installhint b{color:var(--text)}.installhint button{margin-left:auto;background:var(--paper);color:var(--onpaper);font-weight:800;font-size:12px;padding:6px 10px;border-radius:99px;flex:none}
  .installhint[hidden]{display:none}
  .dictload{font-size:12px;color:var(--text-3);font-weight:700;margin-top:8px;min-height:16px}

  /* home */
  [hidden]{display:none!important}
  .title{padding-bottom:calc(var(--s5) + env(safe-area-inset-bottom))}
  .setter{color:var(--text-2);font-size:13px;font-weight:700;line-height:1.55;margin:var(--s1) 0 0}
  .setter b{color:var(--gold);font-family:var(--fd);font-weight:800}
  .setter i{font-family:var(--fd);font-style:italic;font-weight:500;color:var(--text);font-size:16px;font-variation-settings:'SOFT' 100}
  .done{background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-surf);padding:var(--s3);display:flex;flex-direction:column;gap:6px;align-items:center}
  .done .dots{margin:0}.done .dots i{width:18px;height:18px}
  .doneline{display:flex;gap:10px;align-items:baseline;font-family:var(--fd);font-weight:900;font-size:19px;color:var(--gold);letter-spacing:-.02em;font-variation-settings:'SOFT' 100}
  .doneline .streak{font-size:13px;color:var(--text-2);font-family:var(--fu);font-weight:800;letter-spacing:0}
  .done .big{padding:11px;font-size:14px}
  .countdown{font-size:12px;color:var(--text-2);font-weight:700}
  .link{background:none;color:var(--text-2);font-weight:800;font-size:12px;text-decoration:underline;text-underline-offset:3px;padding:8px 4px}
  .memnote{font-size:12px;color:var(--text-2);margin:0;font-weight:700}
  .today{margin:var(--s5) auto 0;width:100%;max-width:320px;text-align:left}
  .today h3{font-family:var(--fd);font-weight:900;font-size:20px;margin:0 0 2px;letter-spacing:-.02em;font-variation-settings:'SOFT' 100}
  .today .league div{font-size:13px}.today .league span:last-child{text-align:right;color:var(--text-2)}.today .league b{color:var(--text)}.today .league div.me span{color:var(--gold)}
  .today .link{display:block;margin:2px auto 0}
  .live{font-size:13px;color:var(--text-2);font-weight:700;margin-bottom:var(--s2)}.live b{color:var(--text)}
  .previewtag{font-size:11px;color:var(--text-3);font-weight:700;text-align:center;margin-top:2px}
  .wotd{margin:var(--s4) auto 0;width:100%;max-width:320px;background:var(--paper);color:var(--onpaper);border-radius:var(--r-surf);padding:var(--s3) var(--s4);box-shadow:0 5px 0 var(--paper-sh);text-align:left}
  .wotd span{display:block;font-size:11px;font-weight:800;color:var(--onpaper-2);text-transform:uppercase;letter-spacing:.06em}
  .wotd b{font-family:var(--fd);font-weight:900;font-size:26px;letter-spacing:-.02em;display:block;line-height:1.1;font-variation-settings:'SOFT' 100}
  .wotd small{font-size:12px;font-weight:700;color:var(--gold-sh)}
  .wotd p{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--onpaper);font-weight:600}
  .foot{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:var(--s5);color:var(--text-3);font-size:12px}
  .foot button{background:none;color:var(--text-2);font-weight:800;font-size:12px;padding:6px 4px;min-height:36px}.foot i{font-style:normal}
  .memline{display:block;width:100%;background:none;color:var(--text-2);font-size:12px;font-weight:700;line-height:1.5;padding:6px 0 2px;text-align:center}.memline:active{color:var(--text)}

  /* the run map */
  .runmap{display:flex;align-items:center;padding:6px var(--s4) 0}
  .runmap[hidden]{display:none}
  .runmap i{width:14px;height:14px;border-radius:50%;border:2px solid var(--line-2);background:transparent;flex:none;box-shadow:inset 0 -2px 0 rgba(0,0,0,.18);transition:background .3s,border-color .3s}
  .runmap i.now{border-color:var(--gold);box-shadow:0 0 0 3px rgba(242,182,55,.22)}
  .runmap i.pulse{animation:mappulse .9s var(--pop) 2}
  .runmap i.fill{animation:mapfill .45s var(--pop)}
  .runmap i.extra{border-style:dashed;width:11px;height:11px}
  .runmap s{flex:1;height:2px;background:var(--line);text-decoration:none;position:relative;overflow:hidden}
  .runmap s::after{content:'';position:absolute;inset:0;background:var(--paper);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
  .runmap s.lit::after{transform:scaleX(1)}
  @keyframes mapfill{0%{transform:scale(1)}50%{transform:scale(1.7)}100%{transform:scale(1)}}
  @keyframes mappulse{0%,100%{box-shadow:0 0 0 3px rgba(242,182,55,.22)}50%{box-shadow:0 0 0 6px rgba(242,182,55,.45)}}
  .app.final .round b{color:var(--gold)}
  /* banking is a state of the bar, not a button */
  .bankline{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:8px var(--s4) 0;padding:7px 12px;border-radius:var(--r-tile);background:rgba(242,182,55,.10);border:1px solid rgba(242,182,55,.35);font-size:12px;font-weight:700;color:var(--text-2)}
  .bankline b{color:var(--gold);font-family:var(--fd);font-weight:900;font-size:14px}
  .bankline button{background:none;color:var(--text);font-weight:800;font-size:13px;text-decoration:underline;text-underline-offset:3px;padding:4px 2px;min-height:32px;flex:none}
  .targetbar i.surge{animation:surge .9s var(--pop)}
  @keyframes surge{0%{box-shadow:0 0 10px var(--accent)}35%{box-shadow:0 0 22px var(--gold),0 0 40px rgba(242,182,55,.6);filter:brightness(1.4)}100%{box-shadow:0 0 10px var(--accent)}}
  /* plays and swaps live in the buttons */
  .btn{flex-direction:column;display:flex;align-items:center;justify-content:center;gap:4px}
  .btn .count{margin-top:0;opacity:1;display:flex;align-items:center;gap:8px;min-height:14px}
  .btn .pips{display:flex;gap:5px}
  .btn .pip{width:9px;height:9px;border-radius:50%;background:var(--onpaper);box-shadow:inset -1px -1px 0 rgba(0,0,0,.25);transition:transform .2s,background .2s}
  .btn .pip.off{background:transparent;border:1.5px solid rgba(33,27,18,.45);box-shadow:none}
  .btn .sub{font-size:11px;font-weight:800;opacity:.75}
  .btn .cost{display:flex;align-items:center;gap:3px;font-size:11px;font-weight:800;color:var(--onpaper-2)}
  .btn .cost .coin{width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:inset -2px -2px 0 var(--gold-sh);display:inline-block}
  .btn:disabled .pip{opacity:.55}
  /* the rank stamp */
  .rankstamp{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%) rotate(var(--rot)) scale(1);font-family:var(--fd);font-weight:900;font-size:44px;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);border:4px solid var(--gold);border-radius:10px;padding:2px 16px;line-height:1.1;pointer-events:none;z-index:7;mix-blend-mode:screen;animation:stampin 1.5s var(--pop) forwards;font-variation-settings:'SOFT' 100}
  .rankstamp.r-solid{color:var(--paper);border-color:var(--paper)}.rankstamp.r-strong{color:#F6DF8A;border-color:#F6DF8A}.rankstamp.r-genius{color:var(--mint);border-color:var(--mint)}
  @keyframes stampin{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--rot)) scale(2.2)}18%{opacity:1;transform:translate(-50%,-50%) rotate(var(--rot)) scale(.94)}26%{transform:translate(-50%,-50%) rotate(var(--rot)) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--rot)) scale(1)}}
  /* home additions */
  .setter .sw{display:block;font-size:12px;color:var(--gold);font-style:normal;font-weight:800;margin-top:4px}
  .setterline{font-size:12px;font-weight:800;color:var(--text-2)}
  .arc{font-size:12px;color:var(--text-3);font-weight:700;margin:6px 0 0;line-height:1.5}
  .yday{font-size:12px;color:var(--text-2);font-weight:700;margin:8px 0 0;line-height:1.5}.yday b{color:var(--text)}.yday i{color:var(--text-3);font-weight:600}

  /* the shop: header pinned, cards scroll, buttons pinned */
  #shopOverlay{justify-content:flex-start;overflow:hidden;padding-bottom:calc(var(--s3) + env(safe-area-inset-bottom))}
  #shopOverlay h2{font-size:26px;margin-bottom:4px}
  #shopOverlay .ladder{margin-bottom:var(--s2)}
  #shopOverlay #shopSub{margin-bottom:var(--s2)}
  #shopOverlay .cards{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:2px 2px 10px;margin:0 -2px;scrollbar-width:none;-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 18px),transparent)}
  #shopOverlay .cards::-webkit-scrollbar{display:none}
  #shopOverlay .card{padding:10px 14px}#shopOverlay .card b{font-size:16px}#shopOverlay .card span{font-size:11.5px}#shopOverlay .card i{font-size:10.5px}
  .shopbtns{flex:none;margin-top:var(--s2);align-items:stretch}
  .iconbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:9px 6px;flex:0 0 78px!important}
  .iconbtn .ic{font-size:20px;line-height:1;font-weight:800;display:flex}.iconbtn .ic svg{display:block}
  .iconbtn .lbl{font-size:11px;font-weight:800;opacity:.85}
  .delta{display:inline-flex;align-items:center;gap:4px;font-family:var(--fd);font-weight:900;font-size:13px;color:var(--text-2)}
  .delta.pos{color:var(--mint)}.delta.neg{color:var(--ember)}
  .cn{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:inset -2px -2px 0 var(--gold-sh);display:inline-block;vertical-align:-1px}
  .cn2{display:inline-flex}.cn2 .cn:last-child{margin-left:-5px}
  .price .cn{display:inline-block;width:11px;height:11px;margin:0 3px 0 0;vertical-align:0}
  .iconbtn:disabled{opacity:.45}

  /* two plays from losing and still short: the bar turns red until the round is passed */
  .targetbar.danger i{background:var(--ember);box-shadow:0 0 10px var(--ember);animation:dangerpulse 1.2s ease-in-out infinite}
  .targetbar.danger+.marks span:first-child,.targetbar.danger+.marks span:first-child b{color:var(--ember)}
  @keyframes dangerpulse{50%{box-shadow:0 0 16px var(--ember),0 0 26px rgba(240,96,63,.5)}}

  .league .band{display:block;padding:10px 0 2px;border-bottom:0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
  .league .band.star{color:var(--gold)}
  .league .band:first-child{padding-top:2px}

  /* account */
  .acct{position:absolute;top:calc(12px + env(safe-area-inset-top));right:14px;width:38px;height:38px;border-radius:50%;background:var(--ink-2);border:1px solid var(--line-2);color:var(--text-2);display:flex;align-items:center;justify-content:center;font-family:var(--fd);font-weight:900;font-size:16px;z-index:2}
  .acct.in{color:var(--text);border-color:var(--text-3)}
  .acct.mem{border-color:var(--gold);color:var(--gold);box-shadow:0 0 0 2px rgba(242,182,55,.25)}
  .acct svg{display:block}
  .namerow{display:flex;gap:8px}.namerow input{flex:1;min-width:0;background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-tile);color:var(--text);font-family:var(--fu);font-weight:700;font-size:15px;padding:11px 12px}
  .namerow input:focus{outline:2px solid var(--sky);outline-offset:1px}
  .namerow .big{width:auto;flex:none;padding:11px 16px}
  .namerow input:disabled{opacity:.5}
  .doors{display:flex;flex-direction:column;gap:8px;margin-top:var(--s2)}
  .tiny{font-size:12px;color:var(--text-2);margin:6px 0 0;font-weight:700;min-height:16px}
  .acch{font-family:var(--fd);font-weight:900;font-size:20px;margin:var(--s4) 0 4px;letter-spacing:-.02em;font-variation-settings:'SOFT' 100}
  .link.gold{color:var(--gold)}.link.inline{display:inline;padding:0;font-size:inherit}
  #acctOverlay{justify-content:flex-start;padding-top:calc(var(--s5) + env(safe-area-inset-top))}
  /* club plans */
  .plans{display:flex;gap:8px;margin:var(--s2) 0}
  .pl{flex:1;background:var(--ink-2);border:1px solid var(--line-2);border-radius:var(--r-surf);padding:10px 6px;text-align:center;font-size:11px;font-weight:800;color:var(--text-2);line-height:1.3}
  .pl b{display:block;font-family:var(--fd);font-weight:900;font-size:20px;color:var(--text);letter-spacing:-.02em}
  .pl small{display:block;font-size:10px;color:var(--text-3);font-weight:700}
  .pl.on{border-color:var(--gold);background:rgba(242,182,55,.12);color:var(--text)}.pl.on small{color:var(--gold)}
  .founders{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;background:var(--ink-2);border:1px dashed var(--line-2);border-radius:var(--r-tile);padding:9px 12px;font-size:12px;font-weight:700;color:var(--text-2);text-align:left;margin-bottom:var(--s2)}
  .founders b{color:var(--gold);font-family:var(--fd);font-weight:900;font-size:14px}
  .founders.on{border-style:solid;border-color:var(--gold);background:rgba(242,182,55,.12);color:var(--text)}
  #joinBtn:disabled{opacity:.55}
  .first .memtip{font-size:12px;color:var(--text-2);margin-top:-6px}