@font-face{font-family:"Ledger";src:url(../fonts/cormorant-600.woff2) format("woff2");font-weight:600;font-display:swap}
/* Idle Isle — site styles. Plain CSS, no build step.
   Two faces: Inter Tight (display) and Inter (text). Normal case throughout. */
@font-face{font-family:"Inter Tight";src:url(../fonts/intertight.woff2) format("woff2");font-weight:500 700;font-display:swap}
@font-face{font-family:"Inter";src:url(../fonts/inter.woff2) format("woff2");font-weight:400 650;font-display:swap}

:root{
  --bg:#070B12;--bg-2:#0B1019;--panel:#0E141E;
  --ink:#EEF2F6;--ink-2:#A8B3BF;--ink-3:#77838F;
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.14);
  --fill:rgba(255,255,255,.04);--fill-2:rgba(255,255,255,.08);
  --accent:#9CCBE4;--focus:#B9DCEF;--ok:#7FD1A6;--warn:#D9B56A;
  --display:"Inter Tight",Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --text:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r-sm:10px;--r:14px;--r-lg:20px;
  --wrap:1200px;--hdr:68px;
  color-scheme:dark;
}
[data-theme="rose"]{--accent:#E2A9C6;--focus:#F0C4DA}
[data-theme="hoard"]{--accent:#E2C27E;--focus:#F0D79E}
[data-theme="lilac"]{--accent:#C9B6F2;--focus:#DCCDF7}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
img,svg{display:block;max-width:100%}
a{color:inherit}
p a,.prose a,.hint a,.check a,.muted a,.small a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
h1,h2,h3{font-family:var(--display);font-weight:650;letter-spacing:-.02em;line-height:1.15;margin:0 0 .5em;color:var(--ink)}
h1{font-size:clamp(32px,4vw,44px)}
h2{font-size:22px}
h3{font-size:17px}
p{margin:0 0 1em}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
::selection{background:rgba(156,203,228,.35)}
code{font:500 .92em ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--fill-2);padding:.1em .35em;border-radius:5px}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 32px}
.muted{color:var(--ink-2)}
.small{font-size:14px}
.nowrap{white-space:nowrap}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:12px;z-index:400;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:8px;font-weight:600;text-decoration:none}
.skip:focus{left:16px}
[hidden]{display:none!important}

/* ---------- buttons, pills ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:999px;border:0;font:600 15px/1 var(--text);text-decoration:none;cursor:pointer;transition:background .15s,color .15s,opacity .15s;white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn-primary{background:#EEF2F6;color:#0A0F16}
.btn-primary:hover{background:#fff}
.btn-soft{background:var(--fill-2);color:var(--ink)}
.btn-soft:hover{background:rgba(255,255,255,.13)}
.btn-sm{height:36px;padding:0 15px;font-size:14px}
.btn-icon{width:44px;padding:0}
.btn-block{width:100%}
.btn:disabled{opacity:.42;cursor:default}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.pill{display:inline-flex;align-items:center;height:28px;padding:0 11px;border-radius:999px;background:var(--fill-2);color:var(--ink-2);font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap}
a.pill:hover{color:var(--ink);background:rgba(255,255,255,.12)}
.badge{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:999px;background:rgba(8,12,18,.66);color:var(--ink);font-size:12px;font-weight:550;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.link-arrow{color:var(--ink-2);font-size:14px;font-weight:500;text-decoration:none}
.link-arrow:hover{color:var(--ink)}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:50;height:var(--hdr);background:rgba(7,11,18,.78);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid var(--line)}
body.scene .site-header{position:absolute;left:0;right:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:0}
.hdr{max-width:var(--wrap);height:100%;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:36px}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;flex:none}
.logo .mark{width:26px;height:26px}
.logo .wm{font:650 19px/1 var(--display);letter-spacing:-.015em}
.nav{display:flex;gap:2px}
.nav a{padding:8px 12px;border-radius:8px;color:var(--ink-2);font-size:15px;font-weight:500;text-decoration:none;transition:color .15s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink)}
.hdr-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.spy-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);cursor:pointer;transition:color .15s,background .15s}
.spy-btn:hover{color:var(--ink);background:var(--fill)}
.spy-btn svg{width:18px;height:18px}
.m-games{display:none;color:var(--ink-2);font-size:15px;font-weight:500;text-decoration:none;padding:8px 6px}
.m-home{display:none;width:40px;height:40px;place-items:center;border-radius:50%;border:1px solid var(--line-2);color:var(--ink-2);transition:color .15s,background .15s}
.m-home:hover{color:var(--ink);background:var(--fill)}
.m-home svg{width:18px;height:18px}
body.room-page .m-home{color:var(--ink);border-color:rgba(255,255,255,.3)}
.pass-chip{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 5px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink);text-decoration:none;font-size:14px;font-weight:550;transition:background .15s}
.pass-chip:hover{background:var(--fill)}
.pass-chip .av{width:30px;height:30px}
.pass-chip .pc-txt{white-space:nowrap}
.pass-chip .pc-tier,.pass-chip .pc-pts{display:none}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);margin-top:96px;position:relative;z-index:1;background:var(--bg)}
body.scene .site-footer{margin-top:0}
.foot{display:flex;justify-content:space-between;gap:48px;padding-top:48px;padding-bottom:40px}
.brandcol p{margin:14px 0 0;color:var(--ink-3);font-size:14px}
.foot-links{display:grid;grid-template-columns:repeat(4,auto);gap:12px 40px;align-content:start}
.foot-links a{color:var(--ink-2);font-size:14px;text-decoration:none}
.foot-links a:hover{color:var(--ink)}
.foot-bottom{position:relative;display:flex;justify-content:space-between;gap:16px;padding-top:20px;padding-bottom:36px;color:var(--ink-3);font-size:13px}
.foot-bottom::before{content:"";position:absolute;top:0;left:32px;right:32px;border-top:1px solid var(--line)}
.foot-bottom .legal a{color:var(--ink-3);text-decoration:none;margin-left:18px}
.foot-bottom .legal a:hover{color:var(--ink)}

/* ---------- home scene ---------- */
.cove{position:relative;height:100vh;height:100svh;min-height:600px;max-height:1100px;overflow:clip;background:linear-gradient(180deg,#05080E 0%,#0B121C 58%,#0A1019 100%);touch-action:pan-y;user-select:none;-webkit-user-select:none}
.cove canvas.sea{position:absolute;inset:0;width:100%;height:100%;display:block}
.cove.no-gl canvas.sea{display:none}
.cove.sailing{cursor:grabbing}
.cove-copy{position:absolute;z-index:3;top:calc(var(--hdr) + clamp(36px,9vh,112px));left:max(32px,calc((100% - var(--wrap)) / 2 + 32px));max-width:640px;pointer-events:auto}
.cove-copy h1{font-size:clamp(40px,5.6vw,72px);line-height:1.02;letter-spacing:-.035em;font-weight:650;max-width:13ch;margin:0 0 18px;text-wrap:balance}
.cove-copy p{font-size:clamp(17px,1.5vw,20px);color:var(--ink-2);margin:0}
.salvage{position:absolute;inset:0;z-index:2;pointer-events:none}
.tile{position:absolute;left:0;top:0;width:var(--tw,300px);display:block;color:var(--ink);text-decoration:none;pointer-events:auto;will-change:transform;-webkit-tap-highlight-color:transparent;outline:none}
.t-card{position:absolute;left:0;top:0;width:var(--tw,300px);aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#111824;transform-origin:50% 100%;box-shadow:0 0 0 1px rgba(255,255,255,.07),0 22px 44px -22px rgba(0,0,0,.85);transition:box-shadow .3s}
.t-card img{width:100%;height:100%;object-fit:cover;-webkit-user-drag:none}
.t-card .badge{position:absolute;top:10px;left:10px}
.tile.is-hot .t-card{box-shadow:0 0 0 1px rgba(255,255,255,.22),0 30px 60px -24px rgba(0,0,0,.9)}
.tile:focus-visible .t-card{box-shadow:0 0 0 3px var(--focus),0 30px 60px -24px rgba(0,0,0,.9)}
.tile.is-spotted .t-card{box-shadow:0 0 0 2px var(--accent),0 30px 60px -24px rgba(0,0,0,.9)}
.t-refl{position:absolute;left:0;top:0;width:var(--tw,300px);aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;transform-origin:50% 0;opacity:.2;filter:blur(1.5px);-webkit-mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.35) 30%,transparent 60%);mask-image:linear-gradient(180deg,#000 0,rgba(0,0,0,.35) 30%,transparent 60%);pointer-events:none}
.t-refl img{width:100%;height:100%;object-fit:cover;transform:scaleY(-1)}
.t-cap{position:absolute;left:2px;top:22px;width:calc(var(--tw,300px) - 4px);display:block}
.t-cap b{display:block;font:600 17px/1.3 var(--display);letter-spacing:-.01em;text-shadow:0 1px 10px rgba(0,0,0,.6)}
.t-cap .t-sub,.t-cap .t-played{display:block;font-size:14px;line-height:1.4;color:var(--ink-2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.t-cap .t-played{color:var(--accent)}
.tile-more .t-card{background:rgba(255,255,255,.05);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--line-2)}
.tile-more .t-refl{background:rgba(255,255,255,.05)}
.t-more{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;text-align:center;padding:16px}
.t-more b{font:600 19px/1.2 var(--display)}
.t-more span{color:var(--ink-2);font-size:14px}
.tile.is-sunk{pointer-events:none}
.sea-nav{position:absolute;z-index:4;width:44px;height:44px;margin-top:-22px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-2);background:rgba(10,15,22,.62);color:var(--ink);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .15s}
.sea-nav:hover{background:rgba(22,30,42,.8)}
.sea-nav.prev{left:16px}.sea-nav.prev svg{transform:rotate(180deg)}
.sea-nav.next{right:16px}

/* library backdrop: a still, darkened frame of the same water */
.cove.backdrop{position:fixed;inset:0;height:auto;min-height:0;max-height:none;z-index:0;pointer-events:none}
.cove.backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,11,18,.5) 0%,rgba(7,11,18,.86) 45%,var(--bg) 80%)}
body.has-backdrop .lib{position:relative;z-index:1}
body.has-backdrop .site-header{position:sticky;z-index:50}

/* ---------- page heads ---------- */
.page-head{margin:56px 0 32px;max-width:760px}
.page-head h1{margin-bottom:12px}
.lead{font-size:18px;color:var(--ink-2);margin:0}
.kicker{font-size:14px;font-weight:600;color:var(--accent);margin:0 0 10px}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:20px}
.sec-head h2{font-size:24px;margin:0}
.sec-head p{margin:6px 0 0}
.section{padding:56px 0}
.section-tight{margin:56px 0}
.empty{text-align:center;padding:96px 20px;max-width:520px;margin:0 auto}
.empty h2{font-size:28px}
.empty p{color:var(--ink-2)}

/* ---------- library ---------- */
.lib .page-head{margin-bottom:24px}
.lib-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}
.filters{display:flex;flex-wrap:wrap;gap:8px}
.filters button,.view-toggle button{height:34px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);font-size:14px;font-weight:500;cursor:pointer;transition:background .15s,color .15s}
.filters button:hover,.view-toggle button:hover{color:var(--ink)}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.view-toggle{display:flex;padding:3px;border-radius:999px;border:1px solid var(--line-2);flex:none}
.view-toggle button{border:0;height:28px}
.view-toggle button[aria-pressed="true"]{background:var(--fill-2);color:var(--ink)}
.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:32px 24px}
.gtile{display:block;text-decoration:none;color:var(--ink)}
.gt-art{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#111824;box-shadow:0 0 0 1px rgba(255,255,255,.07);transition:transform .25s,box-shadow .25s}
.gt-art img{width:100%;height:100%;object-fit:cover}
.gt-art .badge{position:absolute;top:10px;left:10px}
.gtile:hover .gt-art{transform:translateY(-3px);box-shadow:0 0 0 1px rgba(255,255,255,.2),0 18px 36px -18px rgba(0,0,0,.8)}
.gtile:focus-visible{outline:none}
.gtile:focus-visible .gt-art{box-shadow:0 0 0 3px var(--focus)}
.gt-body{display:block;padding:12px 2px 0}
.gt-body b{display:block;font:600 17px/1.3 var(--display);letter-spacing:-.01em}
.gt-body span{display:block;color:var(--ink-2);font-size:14px;margin-top:2px}
.glist{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.glist a{display:grid;grid-template-columns:128px 1fr auto;gap:20px;align-items:center;padding:14px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.glist a:hover{background:var(--fill)}
.glist img{width:128px;aspect-ratio:16/9;height:auto;object-fit:cover;border-radius:8px}
.gl-body b{font:600 16px/1.3 var(--display);margin-right:8px}
.gl-body .badge{background:var(--fill-2);vertical-align:2px}
.gl-body .t{display:block;color:var(--ink-2);font-size:14px;margin-top:2px}
.glist .k{color:var(--ink-3);font-size:13px;text-align:right}

/* ---------- game page ---------- */
.gbar{display:flex;align-items:center;gap:16px;padding:28px 0 14px;flex-wrap:wrap}
.back{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line-2);color:var(--ink-2);text-decoration:none;flex:none}
.back:hover{color:var(--ink);background:var(--fill)}
.back svg{width:18px;height:18px}
.gt{display:flex;align-items:center;gap:14px;flex-wrap:wrap;min-width:0}
.gt h1{font-size:28px;margin:0}
.status{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border-radius:999px;background:var(--fill-2);color:var(--ink-2);font-size:13px;font-weight:500}
.status .dot{width:7px;height:7px;border-radius:50%;background:var(--ink-3)}
.status.ready{color:var(--ink)}
.status.ready .dot{background:var(--ok);box-shadow:0 0 0 3px rgba(127,209,166,.18)}
.actions{margin-left:auto;display:flex;gap:10px}
.stats{display:flex;flex-wrap:wrap;gap:28px;margin:0 0 14px}
.stats:empty{display:none}
.stat b{display:block;font:600 18px/1.2 var(--display)}
.stat span{font-size:13px;color:var(--ink-3)}
.stage-wrap{position:relative}
.stage{position:relative;width:100%;aspect-ratio:16/9;max-height:calc(100vh - 180px);margin:0 auto;border-radius:var(--r-lg);overflow:hidden;background:#000;box-shadow:0 0 0 1px var(--line)}
.stage[data-orientation="portrait"]{aspect-ratio:9/16;max-width:min(100%,calc((100vh - 180px) * .5625))}
.stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.stage:fullscreen{border-radius:0;max-height:none;max-width:none}
.stage.is-focus{position:fixed;inset:0;z-index:300;border-radius:0;max-height:none;max-width:none;aspect-ratio:auto}
.focus-close{display:none}
.stage.is-focus+.focus-close{display:inline-flex;position:fixed;top:14px;right:14px;z-index:301}
.under-stage{margin:14px 0 0;color:var(--ink-3);font-size:14px}
.gdetail{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:48px;margin-top:48px;align-items:start}
.g-tagline{font:500 21px/1.4 var(--display);letter-spacing:-.01em;color:var(--ink);margin-bottom:12px}
.gabout>p{color:var(--ink-2)}
.gabout h2{margin-top:36px;font-size:19px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 12px}
.meta{display:flex;flex-wrap:wrap;gap:6px 0;color:var(--ink-3);font-size:14px}
.meta span:not(:last-child)::after{content:"·";margin:0 10px}
.controls{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.controls li{display:flex;align-items:baseline;gap:14px;color:var(--ink-2);font-size:15px}
.kbd{display:inline-block;min-width:28px;text-align:center;padding:2px 9px;border-radius:7px;border:1px solid var(--line-2);border-bottom-width:2px;background:var(--fill);color:var(--ink);font-size:13px;font-weight:550;white-space:nowrap}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;margin-bottom:20px}
.panel.quiet{background:transparent}
.panel h2{font-size:18px;margin-bottom:14px}
.panel>p:last-child{margin-bottom:0}
.count{color:var(--ink-3);font:500 15px var(--text);margin-left:6px;letter-spacing:0}
.ach-grid{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:8px}
.ach{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--fill);min-width:0}
.ach .ai{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:9px;background:var(--fill-2);color:var(--ink-3);font:650 15px/1 var(--display)}
.ach .ai svg{width:16px;height:16px}
.ach.got .ai{background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent)}
.ach .at{min-width:0;flex:1}
.ach b{display:block;font-size:15px;font-weight:550;line-height:1.35}
.ach small{display:block;color:var(--ink-3);font-size:13px;line-height:1.4}
.ach .ap{margin-left:auto;padding-left:6px;font-size:13px;color:var(--ink-3);white-space:nowrap}
.ach.got .ap{color:var(--ink-2)}
.ach.locked b{color:var(--ink-2)}
.ach.secret b{letter-spacing:.08em}
.ach-toggle{margin:4px 0 14px}
.game-ach .ach-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.ga-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:10px}
.ga-head h3{margin:0;font-size:19px}
.ga-head h3 a{text-decoration:none}
.ga-head h3 a:hover{text-decoration:underline}
.ga-sum{color:var(--ink-3);font-size:14px}
.ga-bar{height:4px;border-radius:999px;background:var(--fill-2);overflow:hidden;margin-bottom:18px}
.ga-bar i{display:block;height:100%;background:var(--accent);border-radius:inherit}
.more{margin-top:72px}
.more .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}

/* ---------- toasts ---------- */
.toasts{position:fixed;right:24px;bottom:24px;z-index:250;display:grid;gap:10px;pointer-events:none}
.toast{display:flex;gap:12px;align-items:center;min-width:280px;max-width:360px;padding:14px 16px;border-radius:var(--r);background:#121A26;border:1px solid var(--line-2);box-shadow:0 18px 40px -16px rgba(0,0,0,.8);animation:tin .3s ease-out both}
.toast.out{opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.toast .ti{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:10px;background:var(--fill-2);font-size:18px}
.toast small{display:block;font-size:12px;color:var(--ink-3)}
.toast b{display:block;font-size:15px;font-weight:600}
.toast span{display:block;font-size:13px;color:var(--ink-2)}
@keyframes tin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- Logbook ---------- */
.narrow-top{padding-top:48px}
.pass-hero{display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;padding:28px 32px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);margin-bottom:20px}
.bigav{width:88px;height:88px}
.ph-main h1{font-size:34px;margin:0 0 6px}
.ph-main .sub{display:flex;flex-wrap:wrap;gap:6px 14px;color:var(--ink-2);font-size:15px;margin-bottom:16px}
#pTier{color:var(--ink);font-weight:600}
.progress .bar{height:6px;border-radius:999px;background:var(--fill-2);overflow:hidden;max-width:520px}
.progress .bar i{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .6s}
.progress .pl{display:flex;justify-content:space-between;gap:12px;max-width:520px;margin-top:8px;color:var(--ink-3);font-size:13px}
.pts-big{text-align:right}
.pts-big b{display:block;font:650 44px/1 var(--display);letter-spacing:-.03em}
.pts-big span{color:var(--ink-3);font-size:14px}
.note{display:flex;gap:14px;padding:16px 20px;border-radius:var(--r);background:var(--fill);border:1px solid var(--line);color:var(--ink-2);font-size:15px}
.note p{margin:0 0 6px}.note p:last-child{margin:0}
.note b{color:var(--ink)}
.note.warn{background:rgba(217,181,106,.07);border-color:rgba(217,181,106,.22)}
.note.preview{margin:32px 0 0}
.form-msg .note{margin-top:14px}
.ladder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.rung{position:relative;padding:18px;border-radius:var(--r);border:1px solid var(--line);background:var(--fill)}
.rung .ra{width:44px;height:44px}
.rung.locked .ra{filter:grayscale(1) brightness(.75)}
.rung b{display:block;font:600 16px/1.3 var(--display);margin-top:12px}
.rung .rp{display:block;font-size:13px;color:var(--ink-3)}
.rung .rr{display:block;font-size:13px;color:var(--ink-2);margin-top:8px;line-height:1.45}
.rung.current{border-color:color-mix(in srgb,var(--accent) 55%,transparent);background:var(--panel)}
.rung.locked{opacity:.6}
.rung .you{position:absolute;top:16px;right:16px;font-size:12px;font-weight:600;color:var(--accent)}
.rw-h{font:600 15px/1.3 var(--text);color:var(--ink-2);margin:24px 0 10px;letter-spacing:0}
.rewards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.reward{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line)}
.reward .sw{width:34px;height:34px;flex:none;border-radius:50%}
.reward b{display:block;font-size:15px;font-weight:550}
.reward small{display:block;font-size:13px;color:var(--ink-3)}
.reward .btn,.reward>.muted{margin-left:auto}
.reward>.muted svg{width:18px;height:18px}
.reward.locked{opacity:.6}
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.two .panel{margin:0}


/* ---------- Logbook: progress details, showcase, badge case ---------- */
.next-req{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--ink-2);font-size:14px}
.next-req:empty{display:none}
.next-req li:first-child::before{display:none}
.next-req li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--ink-3);margin:0 8px 2px 0}
.bar{height:6px;border-radius:999px;background:var(--fill-2);overflow:hidden}
.bar i{display:block;height:100%;border-radius:inherit;background:var(--accent)}
.top-req{margin:16px 0 0}
.top-req h3{font-size:17px;margin-bottom:8px}
.top-req>p{max-width:760px;font-size:15px}
.gate-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;max-width:640px}
.gate-list li{display:grid;grid-template-columns:minmax(120px,200px) 1fr auto;gap:14px;align-items:center;font-size:14px}
.showcase{margin-bottom:20px}
.showcase .sec-head{margin-bottom:16px}
.sc-slots{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.sc-slot{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;padding:18px 10px 14px;border-radius:var(--r);background:var(--fill);min-width:0}
.sc-slot .bdg-art{width:72px;height:72px;margin-bottom:8px}
.sc-slot b{font-size:14px;font-weight:600;line-height:1.3}
.sc-slot small{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.sc-slot.sc-empty{background:transparent;border:1px dashed var(--line-2);color:var(--ink-3)}
.sc-slot.sc-empty .bdg-art{color:var(--line-2)}
.sc-x{position:absolute;top:6px;right:6px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;border:0;background:transparent;color:var(--ink-3);cursor:pointer;opacity:0;transition:opacity .15s,background .15s}
.sc-slot:hover .sc-x,.sc-x:focus-visible{opacity:1}
.sc-x:hover{background:var(--fill-2);color:var(--ink)}
.sc-x svg{width:14px;height:14px}
@media (hover:none){.sc-x{opacity:1}}
.case-group{margin-bottom:28px}
.cg-head{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.cg-head h3{margin:0;font-size:17px}
.case-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.bdg{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:var(--r);border:1px solid var(--line);min-width:0}
.bdg .bdg-art{width:52px;height:52px;flex:none}
.bdg.locked .bdg-art{filter:grayscale(1) brightness(.7);opacity:.45}
.bdg-txt{min-width:0;flex:1}
.bdg-txt b{display:block;font-size:15px;font-weight:600;line-height:1.3}
.bdg.locked .bdg-txt b{color:var(--ink-2)}
.bdg-txt small{display:block;font-size:13px;color:var(--ink-3);line-height:1.45}
.pin{flex:none;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);font-size:13px;font-weight:550;cursor:pointer}
.pin:hover{color:var(--ink)}
.pin[aria-pressed="true"]{background:var(--fill-2);border-color:transparent;color:var(--ink)}
.pin:disabled{opacity:.4;cursor:default}
.toast .ti-badge{background:none;width:44px;height:44px}
.toast .ti-badge svg{width:44px;height:44px}

/* ---------- header profile popover ---------- */
.hdr-right{position:relative}
.profile-pop{position:absolute;top:calc(100% + 10px);right:0;z-index:120;width:320px;padding:18px;border-radius:var(--r-lg);background:#0E141E;border:1px solid var(--line-2);box-shadow:0 30px 70px -24px rgba(0,0,0,.9)}
.pp-head{display:flex;align-items:center;gap:12px}
.pp-av{width:44px;height:44px;flex:none}
.pp-head b{display:block;font:600 17px/1.25 var(--display)}
.pp-head span{font-size:13px;color:var(--ink-3)}
.pp-bar{margin:14px 0 6px;height:5px}
.pp-next{margin:0;font-size:13px;color:var(--ink-2)}
.pp-show{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.pp-label{display:block;font-size:13px;font-weight:600;color:var(--ink-2);margin-bottom:10px}
.pp-badges{list-style:none;margin:0;padding:0;display:flex;gap:8px}
.pp-badges .bdg-art{width:46px;height:46px}
.pp-show p{margin:0}
.pp-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}

/* ---------- forms ---------- */
.auth{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:64px;margin:32px 0 24px;align-items:start}
.form-card{padding:36px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line)}
.form-card h1{font-size:30px;margin-bottom:6px}
.steps{display:flex;gap:6px;margin:20px 0 24px}
.steps span{flex:1;height:4px;border-radius:999px;background:var(--fill-2)}
.steps span.on{background:var(--accent)}
.field{margin:0 0 18px;padding:0;border:0;min-width:0}
.field label,.field legend{display:block;font-size:14px;font-weight:600;margin-bottom:8px;padding:0}
.input{width:100%;height:46px;padding:0 14px;border-radius:var(--r-sm);border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--ink);font-size:15px;transition:border-color .15s}
.input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(156,203,228,.18)}
select.input{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8B3BF' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:18px;padding-right:38px}
select.input option{background:#0E141E}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.hint{display:block;font-size:13px;color:var(--ink-3);margin-top:7px;line-height:1.5}
.check{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink-2);margin:4px 0 20px}
.check input{margin-top:4px;accent-color:var(--accent)}
.form-card>.muted.small{margin:22px 0 0}
.side{padding-top:12px}
.side h2{font-size:22px}
.side-list{list-style:none;margin:0 0 20px;padding:0}
.side-list li{padding:16px 0;border-bottom:1px solid var(--line)}
.side-list b{display:block;font-size:15px}
.side-list span{color:var(--ink-2);font-size:15px}

/* ---------- shop ---------- */
.promise{list-style:none;margin:0;padding:0}
.promise li{padding:11px 0;border-bottom:1px solid var(--line);color:var(--ink-2);font-size:15px}
.promise li:last-child{border-bottom:0}
.promise b{color:var(--ink);font-weight:600}
.price-table{width:100%;border-collapse:collapse;margin:4px 0 14px;font-size:15px}
.price-table th{text-align:left;font-size:13px;font-weight:500;color:var(--ink-3);padding:10px 0;border-bottom:1px solid var(--line-2)}
.price-table td{padding:12px 0;border-bottom:1px solid var(--line);color:var(--ink-2)}
.price-table td:first-child{color:var(--ink)}

/* ---------- prose / legal ---------- */
.prose{max-width:740px}
.prose h2{font-size:22px;margin:44px 0 12px}
.prose h3{margin:28px 0 8px}
.prose p,.prose li{color:var(--ink-2);line-height:1.7}
.prose ul,.prose ol{padding-left:1.2em;margin:0 0 1em}
.prose li{margin:6px 0}
.prose strong{color:var(--ink);font-weight:600}
.toc{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0!important;margin:20px 0 8px!important}
.toc li{margin:0!important}
.toc a{display:inline-flex;height:32px;align-items:center;padding:0 13px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink-2);font-size:14px;text-decoration:none}
.toc a:hover{color:var(--ink)}
.draft-banner{padding:14px 18px;border-radius:var(--r);background:rgba(217,181,106,.07);border:1px solid rgba(217,181,106,.22);color:var(--ink-2);font-size:14px;margin-bottom:8px}
.email-big{font:600 clamp(22px,3vw,30px)/1.3 var(--display);letter-spacing:-.01em;margin:8px 0 20px}

/* ---------- search ---------- */
.spy{position:fixed;inset:0;z-index:200}
.spy-back{position:absolute;inset:0;background:rgba(3,5,9,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .18s}
.spy-panel{position:relative;width:min(640px,calc(100% - 32px));margin:12vh auto 0;background:#0E141E;border:1px solid var(--line-2);border-radius:18px;box-shadow:0 40px 90px -30px rgba(0,0,0,.9);opacity:0;transform:translateY(-6px) scale(.99);transition:opacity .18s,transform .18s;overflow:hidden}
.spy.in .spy-back,.spy.in .spy-panel{opacity:1;transform:none}
.spy-field{display:flex;align-items:center;gap:12px;height:62px;padding:0 16px 0 20px;border-bottom:1px solid var(--line)}
.spy-field>svg{width:20px;height:20px;color:var(--ink-3);flex:none}
.spy-field input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:var(--ink);font-size:18px;outline:none}
.spy-field input::placeholder{color:var(--ink-3)}
.spy-field input::-webkit-search-cancel-button{-webkit-appearance:none}
.spy-x{flex:none;height:26px;padding:0 9px;border-radius:7px;border:1px solid var(--line-2);background:transparent;color:var(--ink-3);font-size:12px;font-weight:500;cursor:pointer}
.spy-x:hover{color:var(--ink)}
.spy-sub{margin:0;padding:14px 20px 6px;color:var(--ink-3);font-size:13px}
.spy-list{list-style:none;margin:0;padding:4px 8px 8px;max-height:min(52vh,440px);overflow:auto}
.spy-list a{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:12px;color:var(--ink);text-decoration:none}
.spy-list li[aria-selected="true"] a{background:var(--fill-2)}
.spy-list img{width:48px;height:48px;border-radius:10px;object-fit:cover;flex:none;background:#111824}
.sr-t{display:block;min-width:0}
.sr-t b{font-size:15px;font-weight:600}
.sr-t em{font-style:normal;font-size:12px;color:var(--ink-2);margin-left:8px;padding:2px 8px;border-radius:999px;background:var(--fill-2)}
.sr-t span{display:block;font-size:14px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-t small{display:block;font-size:12px;color:var(--ink-3)}
.spy-foot{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;border-top:1px solid var(--line);color:var(--ink-3);font-size:13px}
.spy-foot a{color:var(--ink-2);text-decoration:none}
.spy-foot a:hover{color:var(--ink)}
.spy-foot kbd{font:500 12px var(--text);padding:1px 6px;border-radius:5px;border:1px solid var(--line-2);margin-right:4px;color:var(--ink-2)}
body.spy-open{overflow:hidden}

.demo-flag{position:fixed;left:16px;bottom:16px;z-index:150;padding:8px 14px;border-radius:999px;background:#121A26;border:1px solid var(--line-2);color:var(--ink-2);font-size:13px}
.demo-flag a{color:var(--ink);margin-left:8px}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .gdetail,.auth{grid-template-columns:1fr;gap:32px}
  .ladder{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sc-slots{grid-template-columns:repeat(5,minmax(0,1fr))}
  .foot{flex-direction:column;gap:28px}
  .foot-links{grid-template-columns:repeat(2,auto);justify-content:start}
}
@media (max-width:640px){
  :root{--hdr:60px}
  .wrap,.hdr{padding:0 20px}
  .wrap.narrow-top{padding-top:28px}
  .foot-bottom::before{left:20px;right:20px}
  .nav{display:none}
  .m-games{display:inline}
  .m-home{display:grid;width:36px;height:36px}
  .hdr{gap:12px}
  .m-games{padding:8px 2px}
  .logo .wm{font-size:17px}
  .pass-chip{padding-left:4px}
  .hdr-right{gap:6px}
  .pass-chip{padding-right:12px;height:38px}
  .spy-btn{width:38px;height:38px}
  .cove{min-height:560px}
  .cove-copy{left:20px;right:20px;top:calc(var(--hdr) + 28px)}
  .cove-copy h1{font-size:38px;margin-bottom:12px}
  .cove-copy p{font-size:16px}
  .t-cap b{font-size:16px}
  .sea-nav{display:none}
  .page-head{margin:36px 0 24px}
  .lib-bar{flex-direction:column;align-items:stretch}
  .view-toggle{align-self:flex-start}
  .tiles,.more .tiles{grid-template-columns:1fr;gap:24px}
  .glist a{grid-template-columns:96px 1fr}
  .glist img{width:96px}
  .glist .k{display:none}
  .gbar{gap:12px;padding-top:18px}
  .gt h1{font-size:22px}
  .hide-sm{display:none}
  .stage{border-radius:var(--r)}
  .stage-wrap{padding:0 12px}
  .ladder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sc-slots{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sc-slot .bdg-art{width:52px;height:52px;margin-bottom:6px}
  .sc-slot{padding:12px 6px 10px}
  .showcase .sec-head .link-arrow{display:none}
  .case-grid{grid-template-columns:1fr}
  .gate-list li{grid-template-columns:1fr auto}
  .gate-list .bar{grid-column:1/-1;grid-row:2}
  .profile-pop{position:fixed;top:calc(var(--hdr) + 6px);left:12px;right:12px;width:auto}
  .pass-hero{grid-template-columns:auto 1fr;padding:22px}
  .pts-big{grid-column:1/-1;text-align:left;display:flex;align-items:baseline;gap:8px}
  .bigav{width:64px;height:64px}
  .two{grid-template-columns:1fr}
  .form-card{padding:24px}
  .toasts{left:16px;right:16px;bottom:16px}
  .toast{min-width:0;max-width:none}
  .spy-panel{margin-top:8px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
}

/* ---------- Developers ---------- */
.dev-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:64px;align-items:start;margin-bottom:48px}
.dev-grid .prose h2:first-child{margin-top:0}
.dev-aside{position:sticky;top:calc(var(--hdr) + 24px)}
.glance{margin:0 0 20px}
.glance div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.glance dt{color:var(--ink-2)}.glance dd{margin:0;font-weight:600;text-align:right}
.glance-note{margin:14px 0 0}
.steps-list{list-style:none;counter-reset:st;padding:0!important}
.steps-list li{counter-increment:st;position:relative;padding:0 0 14px 40px;margin:0}
.steps-list li::before{content:counter(st);position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;font-size:13px;font-weight:600;color:var(--ink-2)}
.steps-list b{color:var(--ink)}
.page-head .btns{margin-top:24px}
.page-head .kicker a,.form-card .kicker a{color:inherit;text-decoration:none}
/* guide */
.doc-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:56px;align-items:start;margin-bottom:48px}
.doc-toc{position:sticky;top:calc(var(--hdr) + 24px)}
.doc-toc-h{font-size:13px;font-weight:600;color:var(--ink-3);margin:0 0 10px;text-transform:uppercase;letter-spacing:.06em}
.doc-toc ul{list-style:none;margin:0;padding:0;border-left:1px solid var(--line)}
.doc-toc a{display:block;padding:5px 0 5px 14px;color:var(--ink-2);text-decoration:none;font-size:14px}
.doc-toc a:hover{color:var(--ink)}
.doc{max-width:760px}
.doc h2:first-child{margin-top:0}
.doc h3{font-size:17px;margin:28px 0 10px}
.code{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;overflow-x:auto;font-size:13.5px;line-height:1.6;margin:0 0 1.2em}
.code code{background:none;padding:0;font-size:inherit}
.table-wrap{overflow-x:auto;margin:0 0 1.2em;border:1px solid var(--line);border-radius:var(--r)}
.doc-table{width:100%;border-collapse:collapse;font-size:14px}
.doc-table th,.doc-table td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.doc-table th{font-weight:600;color:var(--ink);background:var(--fill)}
.doc-table tr:last-child td{border-bottom:0}
.doc-table td{color:var(--ink-2)}
.checklist{list-style:none;padding:0!important}
.checklist li{display:flex;gap:12px;align-items:flex-start}
.checklist .box{flex:none;width:16px;height:16px;border:1.5px solid var(--line-2);border-radius:4px;margin-top:5px}
.doc .note{display:block;margin:0 0 1.2em}
/* submit */
.fs{border:0;padding:0;margin:0 0 8px;min-width:0}
.fs+.fs>legend{float:left;width:100%;border-top:1px solid var(--line);padding-top:22px;margin-top:6px}
.fs>legend+*{clear:both}
.fs>legend{font-family:var(--display);font-size:17px;font-weight:650;padding:0;margin:0 0 16px;color:var(--ink)}
.fs .check{margin:4px 0 14px}
.lbl{display:block;font-size:14px;font-weight:600;margin-bottom:8px}
textarea.input{height:auto;padding:12px 14px;resize:vertical;line-height:1.5;font-family:inherit}
.sub-done h2{font-size:24px;margin-top:8px}
.sub-done:focus{outline:none}
/* admin */
.adm-head{margin-bottom:24px}
.adm-tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:24px}
.adm-tabs button{background:none;border:0;border-bottom:2px solid transparent;color:var(--ink-2);font:600 15px var(--text);padding:10px 12px;margin-bottom:-1px;cursor:pointer}
.adm-tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.adm-tabs .n{display:inline-block;min-width:22px;padding:0 6px;border-radius:999px;background:var(--fill-2);font-size:12px;line-height:20px;text-align:center;color:var(--ink-2);margin-left:4px}
.adm-list{margin-bottom:48px}
.adm-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;margin-bottom:16px}
.adm-top{display:flex;gap:16px;align-items:flex-start}
.adm-thumb{flex:none;width:56px;height:56px;border-radius:var(--r);background:var(--fill-2);display:grid;place-items:center;font:650 22px var(--display);color:var(--ink-2)}
.adm-meta{flex:1;min-width:0}
.adm-meta h2{font-size:19px;margin:2px 0 2px}
.adm-meta p{margin:0}
.adm-sub{font-size:13px;color:var(--ink-3);margin-top:4px!important}
.adm-verdict{flex:none;font-size:13px;font-weight:600;padding:5px 11px;border-radius:999px;border:1px solid var(--line-2)}
.v-pass{color:var(--ok);border-color:rgba(127,209,166,.3)}
.v-warn{color:var(--warn);border-color:rgba(217,181,106,.3)}
.v-fail{color:#E89A92;border-color:rgba(232,154,146,.3)}
.adm-note{margin:14px 0 0;font-size:14px;color:var(--ink-2)}
.adm-checks{list-style:none;margin:18px 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:0 32px}
.adm-checks li{display:grid;grid-template-columns:20px 140px 1fr;gap:8px;align-items:baseline;padding:8px 0;border-top:1px solid var(--line);font-size:14px}
.adm-checks b{font-weight:600}
.adm-checks li>span:last-child{color:var(--ink-2)}
.cm{font-weight:700;text-align:center}
.c-pass .cm{color:var(--ok)}.c-warn .cm{color:var(--warn)}.c-fail .cm{color:#E89A92}
.adm-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.adm-actions .btn-soft:first-child{margin-right:auto}
.adm-reject{color:#E89A92}
.btn-danger{background:rgba(232,154,146,.14);color:#F0B3AC}
.btn-danger:hover{background:rgba(232,154,146,.22)}
.adm-hint{font-size:13px;color:var(--ink-3);flex-basis:100%;text-align:right}
@media (max-width:900px){
  .dev-grid,.doc-layout{grid-template-columns:1fr;gap:32px}
  .dev-aside,.doc-toc{position:static}
  .doc-toc ul{display:flex;flex-wrap:wrap;gap:6px;border:0}
  .doc-toc a{padding:4px 12px;border:1px solid var(--line-2);border-radius:999px}
  .adm-checks{grid-template-columns:1fr}
  .adm-checks li{grid-template-columns:20px 120px 1fr}
  .adm-actions .btn-soft:first-child{margin-right:0}
  .adm-hint{text-align:left}
}
@media (max-width:640px){
  .adm-card{padding:18px}
  .adm-top{flex-wrap:wrap;gap:12px}
  .adm-thumb{width:44px;height:44px;font-size:18px}
  .adm-meta{flex:1 1 calc(100% - 56px)}
  .adm-verdict{margin-left:56px}
  .adm-checks li{grid-template-columns:18px 104px 1fr;font-size:13.5px}
}

/* ---------- Logbook cosmetics ---------- */
.fav{position:relative;display:inline-block;flex:none;line-height:0}
.fav>svg:first-child{width:100%;height:100%}
.fav .frm{position:absolute;left:-14%;top:-14%;width:128%;height:128%;pointer-events:none;overflow:visible}
.pass-chip .fav{width:30px;height:30px}.pass-chip .fav .av{width:30px;height:30px}
.fav.bigav-w{width:88px;height:88px}
.fav.pp-av-w{width:44px;height:44px}.fav.pp-av-w .pp-av{width:44px;height:44px}
.frm .spin{transform-origin:40px 40px;animation:frspin 14s linear infinite}
.frm .spin.slow{animation-duration:28s}
.frm .sway{transform-origin:40px 40px;animation:frsway 9s ease-in-out infinite alternate}
.frm .twinkle path{animation:frtw 3.4s ease-in-out infinite}
.frm .pulse{animation:frpulse 4.5s ease-in-out infinite}
@keyframes frspin{to{transform:rotate(360deg)}}
@keyframes frsway{from{transform:rotate(-4deg)}to{transform:rotate(4deg)}}
@keyframes frtw{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes frpulse{0%,100%{opacity:.35}50%{opacity:.8}}
.nm{font-weight:600}
.nm-grad{background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.nm-anim{animation:nmshine 7s linear infinite}
@keyframes nmshine{from{background-position:200% 0}to{background-position:0 0}}
.who{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.who .nm{font:650 17px/1.25 var(--display)}
.who .ttl{font-size:13px;color:var(--ink-2)}
.pp-who{margin-bottom:2px}.pp-who .nm{font-size:15px}
.pass-hero .who{margin-bottom:4px}.pass-hero .who .nm{font-size:19px}
@media (prefers-reduced-motion:reduce){.frm .spin,.frm .sway,.frm .twinkle path,.frm .pulse,.nm-anim{animation:none}}

/* reward chips on the tier cards */
.rung .rh{display:block;margin-top:14px;font-size:12px;font-weight:600;color:var(--ink-3)}
.rchips{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.rchip{display:flex;align-items:center;gap:8px;min-width:0}
.rchip>span:not(.rsw){min-width:0}
.rchip b{display:block;font-size:13px;font-weight:550;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rchip small{display:block;font-size:11.5px;color:var(--ink-3);line-height:1.2}
.rsw,.sw2{position:relative;flex:none;width:24px;height:24px;border-radius:7px;background:var(--fill-2);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.sw2{width:40px;height:40px;border-radius:10px}
.sw-rp i{width:46%;height:46%;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 30%,transparent),0 0 0 6px color-mix(in srgb,var(--c) 12%,transparent)}
.sw-nm .nm{font:650 11px/1 var(--display)}.sw2.sw-nm .nm{font-size:16px}
.sw-fr{background:none;box-shadow:none;overflow:visible}.sw-fr svg{position:absolute;inset:-12%;width:124%;height:124%}
.sw-tt svg,.sw-sd svg{width:60%;height:60%;color:var(--ink-2)}
.rchip:not(.own) .rsw{filter:saturate(.35) brightness(.8)}
.rung.locked{opacity:1}.rung.locked>.ra,.rung.locked>b,.rung.locked>.rp,.rung.locked>.rr{opacity:.62}
.top-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:28px}
.top500{padding-left:28px;border-left:1px solid var(--line)}
.top500 .rchips{grid-template-columns:repeat(2,max-content);gap:8px 20px}

/* look picker */
.look-stage{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);margin-bottom:16px}
.cove.preview{height:340px;min-height:0;max-height:none;touch-action:pan-y}
.look-card{position:absolute;z-index:3;left:20px;top:20px;display:flex;align-items:center;gap:14px;padding:12px 18px 12px 12px;border-radius:16px;background:rgba(7,11,18,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08)}
.fav.lc-av-w{width:52px;height:52px}.fav.lc-av-w .lc-av{width:52px;height:52px}
.lc-tier{display:block;font-size:13px;color:var(--ink-2);margin-top:2px}
.look-cap{position:absolute;z-index:3;right:16px;bottom:14px;font-size:12px;color:rgba(238,242,246,.7);padding:4px 10px;border-radius:999px;background:rgba(7,11,18,.45)}
.look-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.look-tabs button{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);font-size:14px;font-weight:500;cursor:pointer}
.look-tabs button[aria-selected="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.look-tabs .cnt{font-size:12px;opacity:.7;margin-left:2px}
.look-extra{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 0 14px;padding:14px 16px;border-radius:var(--r);background:var(--fill);border:1px solid var(--line)}
.look-extra label{font-size:14px;font-weight:550}
.look-extra input[type=text],.look-extra #nick{height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--line-2);background:var(--bg-2);width:220px}
.look-extra #nick[aria-invalid="true"]{border-color:var(--warn)}
.look-extra input[type=range]{width:160px;accent-color:var(--accent)}
.look-extra .muted{flex-basis:100%}
.look-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.opt button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r);border:1px solid var(--line);background:none;text-align:left;cursor:pointer;transition:background .15s,border-color .15s}
.opt button:hover:not(:disabled){background:var(--fill)}
.opt.on button{border-color:color-mix(in srgb,var(--accent) 65%,transparent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.opt .ot{min-width:0;flex:1}
.opt b{display:block;font-size:14.5px;font-weight:550}
.opt small{display:block;font-size:12.5px;color:var(--ink-3);line-height:1.35}
.opt.on small{color:var(--accent)}
.opt.locked button{cursor:default}.opt.locked .sw2,.opt.locked b{opacity:.55}
.olk{width:16px;color:var(--ink-3)}.olk svg{width:16px;height:16px}

/* collections and the weekly event */
.sets{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.set{padding:18px;border-radius:var(--r);border:1px solid var(--line);background:var(--fill)}
.set.waiting{background:none;border-style:dashed}
.set.complete{border-color:color-mix(in srgb,var(--accent) 45%,transparent)}
.set-h{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.set-h b{font:600 16px/1.3 var(--display)}
.set p{margin:4px 0 10px}
.set .bar,.event .bar{height:4px;border-radius:999px;background:var(--fill-2);overflow:hidden;margin-bottom:10px}
.set .bar i,.event .bar i{display:block;height:100%;background:var(--accent);border-radius:inherit}
.goals{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-wrap:wrap;gap:5px}
.goals li{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--fill-2);color:var(--ink-3)}
.goals li.done{color:var(--ink);background:color-mix(in srgb,var(--accent) 18%,transparent)}
.set-note{color:var(--ink-2);margin:0 0 10px!important}
.set .rchips{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.event{display:grid;grid-template-columns:1.2fr 1fr;gap:32px}
.ev-k{font-size:13px;color:var(--ink-3)}
.event h3{font-size:22px;margin:4px 0 6px}
.ev-have{margin:0 0 12px}
.ev-fair{color:var(--ink-2);margin:14px 0 0}
.ev-next{border-left:1px solid var(--line);padding-left:28px}
.ev-next h4{margin:0 0 10px;font-size:14px;color:var(--ink-2);font-weight:600}
.ev-next ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ev-next li{display:grid;grid-template-columns:110px 1fr;gap:2px 12px;font-size:14px}
.ev-next li .muted{grid-column:2;font-size:13px}
.snd-btn.on{color:var(--ink);border-color:color-mix(in srgb,var(--accent) 55%,transparent)}
.cove[data-mood="bd-sunset"].no-gl{background:linear-gradient(180deg,#12142A,#5A2C3A 40%,#2A1A20 60%,#0E0B10)}
.cove[data-mood="bd-dawn"].no-gl{background:linear-gradient(180deg,#1C1D36,#6E5372 40%,#3A2E3C 60%,#141119)}
@media (max-width:960px){.top-grid,.event{grid-template-columns:1fr}.top500,.ev-next{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:20px}}
@media (max-width:640px){
  .cove.preview{height:250px}
  .look-card{left:12px;top:12px;padding:10px 14px 10px 10px}
  .fav.lc-av-w,.fav.lc-av-w .lc-av{width:42px;height:42px}
  .look-grid{grid-template-columns:1fr 1fr}
  .opt button{flex-direction:column;align-items:flex-start;gap:8px;padding:12px}
  .opt .olk{position:absolute;right:12px;top:12px}.opt button{position:relative}
  .fav.bigav-w{width:64px;height:64px}
  .rchip b{white-space:normal}
}

/* ---------- accounts (assets/js/account.js) ---------- */
.linkish{background:none;border:0;padding:0;font:inherit;color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;cursor:pointer}
.input.mono,.rc-grid code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}
.check.merge{padding:12px 14px;border-radius:var(--r-sm);background:var(--fill);margin:0 0 16px}
.ts-box{min-height:65px;margin:0 0 16px}
.codes-h{font-size:22px;outline:none}
.rc-grid{list-style:none;padding:0;margin:18px 0 14px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.rc-grid li{padding:10px 12px;border-radius:var(--r-sm);background:var(--fill-2);text-align:center}
.rc-grid code{background:none;padding:0;font-size:15px;color:var(--ink)}
.btn-danger{background:rgba(232,120,120,.14);color:#F2B3B3;border:1px solid rgba(232,120,120,.3)}
.btn-danger:hover{background:rgba(232,120,120,.22)}
.pp-acct{margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.pp-acct p{margin:0 0 10px}
.pp-who{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-2)}
.pp-who b{color:var(--ink)}
.pp-who .small{margin-left:auto}
.pp-dot{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none}
.pp-links{display:flex;gap:6px;margin-top:10px}
.pp-links a,.pp-links button{flex:1;display:inline-flex;justify-content:center;align-items:center;height:34px;border-radius:999px;background:var(--fill-2);color:var(--ink);font:500 13px var(--text);text-decoration:none;border:0;cursor:pointer}
.pp-links a:hover,.pp-links button:hover{background:rgba(255,255,255,.13)}
.pp-btns{display:flex;gap:8px}.pp-btns .btn{flex:1}
.acct-wrap{max-width:1040px;padding-top:36px}
.acct-loading{padding:80px 0;text-align:center}
.acct-flash{margin-bottom:16px}
.acct-head{padding:28px}
.ah-id,.prof-head{display:flex;align-items:center;gap:18px}
.ah-av{width:56px;height:56px;flex:none;border-radius:50%;display:grid;place-items:center;font:650 24px var(--display);color:var(--ink);background:radial-gradient(circle at 30% 30%,rgba(156,203,228,.35),rgba(156,203,228,.08));box-shadow:inset 0 0 0 1.5px rgba(156,203,228,.5)}
.ah-id h1,.prof-head h1{font-size:28px;margin:0 0 2px}
.ah-id p,.prof-head p{margin:0;font-size:15px}
.sync-ok{color:var(--ok)}
.ah-stats,.prof-stats,.st-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0 0}
.ah-stats div,.prof-stats div,.st-kpis div{padding:14px 16px;border-radius:var(--r);background:var(--fill)}
.ah-stats dt,.prof-stats dt,.st-kpis dt{font-size:13px;color:var(--ink-3)}
.ah-stats dd,.prof-stats dd,.st-kpis dd{margin:2px 0 0;font:600 22px/1.25 var(--display);letter-spacing:-.01em}
.prof-stats dd small{font:500 14px var(--text);color:var(--ink-3)}
.ah-stats small{font-size:12px;color:var(--ink-3)}
.ah-bar{margin-top:18px;display:grid;gap:8px}
.ah-pend{margin:12px 0 0}
.acct-grid,.prof-grid,.st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.acct-card h2,.prof-grid h2,.st-grid h2{font-size:19px;margin-bottom:8px}
.acct-card>p{margin-top:0;font-size:15px}
.mini-form .field{margin-bottom:12px}
.mini-form .check{margin:4px 0 14px}
.danger-h{font-size:16px;margin:28px 0 6px;padding-top:22px;border-top:1px solid var(--line);color:#F2B3B3}
.switch{display:flex;align-items:center;gap:12px;cursor:pointer;font-size:15px;font-weight:500}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.sw-track{position:relative;width:42px;height:24px;border-radius:999px;background:var(--fill-2);box-shadow:inset 0 0 0 1px var(--line-2);flex:none;transition:background .15s}
.sw-track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--ink-2);transition:transform .15s,background .15s}
.switch input:checked+.sw-track{background:rgba(156,203,228,.35)}
.switch input:checked+.sw-track::after{transform:translateX(18px);background:var(--ink)}
.switch input:focus-visible+.sw-track{outline:2px solid var(--focus);outline-offset:3px}
.acct-out{text-align:center;margin:28px 0 0}
.prof-head{padding:26px 28px;margin-bottom:0}
.prof-priv{margin-bottom:16px}
.prof-stats{margin:16px 0 20px}
.split-bar{height:10px;border-radius:999px;background:rgba(156,203,228,.16);overflow:hidden}
.split-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.split-key{display:flex;gap:18px;margin:10px 0 18px;font-size:14px;color:var(--ink-2)}
.split-key .k{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:0}
.k-a{background:var(--accent)}.k-i{background:rgba(156,203,228,.28)}
.pg-list{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:12px}
.pg-list li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:14px;align-items:center;font-size:15px}
.pg-t small{display:block;font-size:12px;color:var(--ink-3)}
.pg-bar{height:6px;border-radius:999px;background:var(--fill-2);overflow:hidden}
.pg-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.pg-h{color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:64px;text-align:right}
.prof-badges{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:12px}
.prof-badges li{text-align:center;font-size:12px;color:var(--ink-2)}
.prof-badges .bdg-art{width:60px;height:60px;display:block;margin:0 auto 4px}
.board{padding:6px 8px}
.board table{width:100%;border-collapse:collapse;font-size:15px}
.board th{text-align:left;font-size:13px;font-weight:600;color:var(--ink-3);padding:12px 14px;border-bottom:1px solid var(--line)}
.board td{padding:12px 14px;border-bottom:1px solid var(--line)}
.board tr:last-child td{border-bottom:0}
.board .num{text-align:right;font-variant-numeric:tabular-nums}
.board .rk{width:64px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.board .pl{font-weight:550}
.board .pl a{color:var(--ink);text-decoration:none}.board .pl a:hover{text-decoration:underline}
.board tr.me td{background:rgba(156,203,228,.07)}
.medal{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;font:650 13px var(--display);color:#0A0F16}
.medal.m1{background:linear-gradient(135deg,#F3DA92,#B08630)}.medal.m2{background:linear-gradient(135deg,#F1F5F8,#97A3AE)}.medal.m3{background:linear-gradient(135deg,#F5D2B4,#94603F)}
.board-foot{margin-top:14px}
.lease-note{display:flex;gap:10px;align-items:flex-start;margin:12px 0 0;padding:12px 16px;border-radius:var(--r);background:rgba(217,181,106,.08);border:1px solid rgba(217,181,106,.24);color:var(--ink-2);font-size:14px}
.lease-note b{color:var(--ink)}
.ln-dot{width:8px;height:8px;border-radius:50%;background:var(--warn);margin-top:6px;flex:none}
.adm-stats{margin-bottom:40px}
.st-kpis{margin:0 0 20px}
.st-chart{display:flex;align-items:flex-end;gap:3px;height:120px;margin:12px 0 6px}
.st-chart i{flex:1;background:var(--accent);opacity:.75;border-radius:3px 3px 0 0;min-height:2px}
.st-axis{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3);margin-bottom:14px}
.st-t{width:100%;border-collapse:collapse;font-size:15px}
.st-t th{text-align:left;font-weight:500;color:var(--ink-2);padding:9px 0;border-top:1px solid var(--line)}
.st-t td{text-align:right;padding:9px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.st-grid>section:first-child{grid-row:span 2}
@media (max-width:860px){
  .acct-grid,.prof-grid,.st-grid{grid-template-columns:1fr}
  .ah-stats,.prof-stats,.st-kpis{grid-template-columns:repeat(2,1fr)}
  .st-grid>section:first-child{grid-row:auto}
}
@media (max-width:640px){
  .acct-wrap{padding-top:20px}
  .acct-head,.prof-head{padding:20px}
  .ah-av{width:48px;height:48px;font-size:20px}
  .ah-id h1,.prof-head h1{font-size:23px}
  .board .hide-s{display:none}
  .board td,.board th{padding:11px 10px}
  .pg-list li{grid-template-columns:1fr auto;gap:6px 12px}
  .pg-list .pg-bar{grid-column:1 / -1;order:3}
}

/* lighthouse on the island: the way into Home */
.lh-link{position:absolute;left:0;top:0;z-index:4;width:40px;height:72px;display:block;text-decoration:none;color:var(--ink);background:none!important;box-shadow:none!important;border:0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;outline:none}
.lh-ring{position:absolute;left:4px;top:-2px;width:32px;height:76px;border-radius:16px;border:1px solid rgba(255,236,200,0);transition:border-color .2s,box-shadow .2s}
.lh-tip{position:absolute;left:50%;bottom:100%;transform:translate(-50%,-2px);padding:0 0 9px;font-size:13px;font-weight:650;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:#ffe6b8;white-space:nowrap;opacity:.82;text-shadow:0 0 10px rgba(255,190,110,.55),0 1px 2px rgba(0,0,0,.8);transition:opacity .18s,transform .18s;pointer-events:none}
.lh-tip::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:7px;background:linear-gradient(rgba(255,230,184,.7),rgba(255,230,184,0))}
.cove[data-sky="day"] .lh-tip{color:#fff;text-shadow:0 1px 6px rgba(4,8,14,.6)}
.lh-link:hover .lh-tip,.lh-link:focus-visible .lh-tip{opacity:1;transform:translate(-50%,-5px)}
.lh-link:hover .lh-ring{border-color:rgba(255,236,200,.45)}
.lh-link:focus-visible .lh-ring{border:2px solid var(--focus)}
.lh-link{cursor:pointer}
.lh-glow{position:absolute;left:50%;top:6px;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,140,.55),rgba(255,170,80,.18) 55%,rgba(255,170,80,0));pointer-events:none;animation:lhPulse 3.2s ease-in-out infinite}
@keyframes lhPulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
.lh-link:hover .lh-glow,.lh-link:focus-visible .lh-glow{animation-duration:1.6s}
.lh-hover{position:absolute;left:50%;top:calc(100% + 8px);transform:translate(-50%,4px);padding:6px 12px;border-radius:999px;background:rgba(40,24,10,.82);color:#FFE6B8;font-size:13px;font-weight:600;white-space:nowrap;box-shadow:0 0 0 1px rgba(255,200,130,.35),0 6px 18px rgba(0,0,0,.45),0 0 18px rgba(255,170,80,.25);opacity:0;transition:opacity .18s,transform .18s;pointer-events:none}
.lh-link:hover .lh-hover,.lh-link:focus-visible .lh-hover{opacity:1;transform:translate(-50%,0)}
.lh-coach{position:absolute;left:0;top:0;z-index:5;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;border-radius:12px;background:rgba(32,20,10,.86);color:#FFE6B8;font-size:13.5px;font-weight:550;box-shadow:0 0 0 1px rgba(255,200,130,.35),0 10px 28px rgba(0,0,0,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:lhCoachIn .5s ease 1.2s both;transition:opacity .25s}
.lh-coach::before{content:"";position:absolute;left:var(--ax,50%);top:-6px;width:12px;height:12px;margin-left:-6px;background:inherit;transform:rotate(45deg);box-shadow:-1px -1px 0 rgba(255,200,130,.35)}
.lh-coach button{width:26px;height:26px;border-radius:50%;border:0;background:rgba(255,230,184,.12);color:inherit;font-size:16px;line-height:1;cursor:pointer}
.lh-coach button:hover{background:rgba(255,230,184,.22)}
.lh-coach.out{opacity:0}
@keyframes lhCoachIn{from{opacity:0;margin-top:6px}to{opacity:1;margin-top:0}}
@media (prefers-reduced-motion:reduce){.lh-glow{animation:none;opacity:.7}.lh-coach{animation:none}}
.cove.to-home .lh-coach{opacity:0}
.cove canvas.sea{transform-origin:var(--lhx,50%) var(--lhy,30%)}
.cove.to-home canvas.sea{transform:scale(1.7);transition:transform .56s cubic-bezier(.5,0,.75,0)}
.cove::before{content:"";position:absolute;inset:0;z-index:6;background:#070B12;opacity:0;pointer-events:none;transition:opacity .5s ease-in .08s}
.cove.to-home::before{opacity:1}
.cove.to-home .salvage,.cove.to-home .cove-copy,.cove.to-home .lh-link{opacity:0;transition:opacity .25s}
.cove[data-sky="day"] .cove-copy{text-shadow:0 1px 24px rgba(4,8,14,.45)}
@media (prefers-reduced-motion:reduce){.cove.to-home canvas.sea{transform:none}}

/* Themes restyle accents, nav, panel tint, buttons and badge rims. All text pairs ≥ 4.5:1. */
[data-theme] .nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}
[data-theme] .btn-primary{background:var(--btn,#EEF2F6);color:var(--btn-ink,#0A0F16)}
[data-theme] .btn-primary:hover{background:var(--btn-hi,#fff)}
[data-theme] .site-header{background:var(--hdr-bg,rgba(7,11,18,.78))}
[data-theme] body.scene .site-header{background:none}
[data-theme="rose"]{--bg:#0F0A10;--bg-2:#150E16;--panel:#1A111B;--ink:#FBF1F6;--ink-2:#D9BFCD;--ink-3:#A68A99;
  --line:rgba(255,214,234,.10);--line-2:rgba(255,214,234,.18);--fill:rgba(255,200,226,.05);--fill-2:rgba(255,200,226,.10);
  --btn:#F4BFD7;--btn-hi:#F9D3E4;--btn-ink:#3A1228;--hdr-bg:rgba(18,10,17,.8);--r-sm:12px;--r:18px;--r-lg:26px}
[data-theme="rose"] .nav a[aria-current="page"]{box-shadow:none;background:rgba(244,191,215,.12);border-radius:999px}
[data-theme="rose"] .btn-soft{background:rgba(244,191,215,.12)}
[data-theme="rose"] .btn-soft:hover{background:rgba(244,191,215,.2)}
[data-theme="rose"] .logo .wm::after{content:"";display:inline-block;width:6px;height:6px;margin-left:6px;border-radius:50%;background:var(--accent);vertical-align:.35em}
[data-theme="hoard"]{--panel:#14110B;--fill:rgba(255,226,160,.04);--fill-2:rgba(255,226,160,.09);--line:rgba(255,226,160,.09);--line-2:rgba(255,226,160,.16);--btn:#E8CB8A;--btn-hi:#F2DAA6;--btn-ink:#241A06;--r-sm:8px;--r:10px;--r-lg:14px}
[data-theme="lilac"]{--panel:#110F1B;--fill:rgba(214,200,255,.045);--fill-2:rgba(214,200,255,.09);--line:rgba(214,200,255,.09);--line-2:rgba(214,200,255,.16);--btn:#D3C4F5;--btn-hi:#E2D8FA;--btn-ink:#1C1236}
[data-theme="deep"]{--btn:#BFE0F0;--btn-hi:#D6ECF6;--btn-ink:#06202E}
/* badge rarity */
.bdg-art .shine{animation:bdgShine 7s ease-in-out infinite}
@keyframes bdgShine{0%,70%{transform:skewX(-18deg) translateX(0)}100%{transform:skewX(-18deg) translateX(130px)}}
.bdg-art.myth{filter:drop-shadow(0 0 6px rgba(233,215,255,.28))}
@media (prefers-reduced-motion:reduce){.bdg-art .shine{animation:none;opacity:0}}
html.hidden-tab .bdg-art .shine{animation-play-state:paused}
.acct-wide{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:40px}
.acct-wide .danger-h{margin-top:0;padding-top:0;border-top:0}
@media (max-width:860px){.acct-wide{grid-template-columns:1fr;gap:0}.acct-wide .danger-h{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}}
.acct-grid>.panel,.prof-grid>.panel,.st-grid>.panel{margin-bottom:0}.acct-grid,.prof-grid,.st-grid{margin-top:20px}.prof-stats{margin-bottom:0}
/* the site-wide sound button adds a slot to the header: make room on narrow phones */
@media (max-width:420px){.hdr:has(.snd-btn) .logo .wm{display:none}.hdr:has(.snd-btn){gap:8px}}

/* Home shortcut on the account page and your own profile */
.home-btn{display:inline-flex;align-items:center;gap:8px;margin-left:auto;white-space:nowrap}
.home-btn .ic{flex:none}
.ah-id,.prof-head{flex-wrap:wrap}
@media (max-width:560px){.home-btn{margin-left:0;width:100%;justify-content:center}}
.lh-coach.side::before{left:auto;right:-6px;top:50%;margin:-6px 0 0;box-shadow:1px -1px 0 rgba(255,200,130,.35)}
/* Ledger palette (account/profile logbook, nav controls, Home header). Each theme recolors it; shapes stay square. */
:root{--lg-brass:#c9a35f;--lg-brass-rgb:201,163,95;--lg-brass-l:#e9cd8f;--lg-brass-d:#7d6136;--lg-brass-d-rgb:110,82,40;--lg-brass-dd:#9c7638;--lg-lea-1:#2a1f15;--lg-lea-2:#1d150f;--lg-ink:#efe3c8;--lg-ink-m:#bcae92;--lg-paper:#efe2c2;--lg-paper-2:#e3d1a8;--lg-paper-3:#d6c08f;--lg-on-paper:#3a2814;--lg-on-brass:#2b1d0b;--lg-stamp:#8a2d18;--lg-ok:#a7c48a;--lg-ok-rgb:167,196,138}
[data-theme="rose"]{--lg-brass:#e0a594;--lg-brass-rgb:224,165,148;--lg-brass-l:#f6cdbf;--lg-brass-d:#8e5a5e;--lg-brass-d-rgb:142,90,94;--lg-brass-dd:#b0706a;--lg-lea-1:#2c1626;--lg-lea-2:#1e0f1b;--lg-ink:#fbeef3;--lg-ink-m:#d8bccb;--lg-paper:#f7e6ea;--lg-paper-2:#efd3db;--lg-paper-3:#e3bccb;--lg-on-paper:#4a1f33;--lg-on-brass:#3a1420;--lg-stamp:#a3254f;--lg-ok:#e9b6cf;--lg-ok-rgb:233,182,207}
[data-theme="hoard"]{--lg-brass:#e2bd6a;--lg-brass-rgb:226,189,106;--lg-brass-l:#f6dc97;--lg-brass-d:#8a6a2c;--lg-brass-d-rgb:138,106,44;--lg-brass-dd:#b08a3a;--lg-lea-1:#1d1810;--lg-lea-2:#120f09;--lg-ink:#f6ead0;--lg-ink-m:#c9b88f;--lg-paper:#f1e3bd;--lg-paper-2:#e6d19c;--lg-paper-3:#d6bb78;--lg-on-paper:#3a2a0c;--lg-on-brass:#2a1d06;--lg-stamp:#9a2b12;--lg-ok:#d8c27a;--lg-ok-rgb:216,194,122}
[data-theme="lilac"]{--lg-brass:#bfb0e6;--lg-brass-rgb:191,176,230;--lg-brass-l:#e2d9f8;--lg-brass-d:#665a8c;--lg-brass-d-rgb:102,90,140;--lg-brass-dd:#8c7fb8;--lg-lea-1:#211b33;--lg-lea-2:#161224;--lg-ink:#f1ecfb;--lg-ink-m:#c4bada;--lg-paper:#ece6f7;--lg-paper-2:#dcd2ef;--lg-paper-3:#cbbfe6;--lg-on-paper:#2e2448;--lg-on-brass:#221a3a;--lg-stamp:#6a3fb0;--lg-ok:#b9e0c6;--lg-ok-rgb:185,224,198}
/* Lighthouse tip: a hand-lettered line with a leader to the lamp, no bubble */
.lh-coach{border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:2px 0;gap:10px;font:400 17px/1.15 var(--text);letter-spacing:.03em;color:#ffe2ad;text-shadow:0 0 12px rgba(255,180,90,.45),0 1px 2px rgba(0,0,0,.9)}
.lh-coach::before{display:none}
.lh-coach::after{content:"";position:absolute;top:50%;height:1px;background:linear-gradient(90deg,rgba(255,226,173,.15),rgba(255,226,173,.8));width:26px;right:-30px}
.lh-coach:not(.side)::after{right:auto;left:var(--ax,50%);top:-14px;width:1px;height:12px;background:linear-gradient(rgba(255,226,173,.8),rgba(255,226,173,.15))}
.lh-coach span{border-bottom:1px solid rgba(255,226,173,.35);padding-bottom:2px}
.lh-coach button{order:-1;width:auto;height:auto;padding:0 2px;border-radius:0;background:none;font:400 18px/1 Georgia,serif;color:rgba(255,226,173,.7)}
.lh-coach button:hover{background:none;color:#fff}
.lh-tip{font-family:var(--text);font-weight:400;font-size:16px;letter-spacing:.14em}
.has-coach .lh-tip{opacity:0!important}
/* Ledger nav controls: square, brass-edged; points as a plain figure */
.spy-btn,.snd-btn,.m-home{border-radius:1px!important;border:1px solid var(--lg-brass-d)!important;background:linear-gradient(180deg,var(--lg-lea-1),var(--lg-lea-2))!important;color:var(--lg-ink-m)!important;box-shadow:inset 0 1px 0 rgba(255,220,160,.1)}
.spy-btn:hover,.snd-btn:hover,.m-home:hover{border-color:var(--lg-brass)!important;color:var(--lg-ink)!important}
.snd-btn.on{border-color:var(--lg-brass)!important;color:var(--lg-ink)!important}
.pass-chip{border-radius:0!important;border:0!important;background:none!important;padding:0 2px!important;gap:7px}
.pass-chip:hover{background:none!important}
.pass-chip:hover .pc-txt{text-decoration:underline;text-decoration-color:var(--lg-brass)}
.pass-chip .pc-txt{font-family:var(--text);font-weight:600;font-size:18px;color:var(--lg-ink)}
/* toasts: a ledger slip */
.toast{border-radius:1px!important;background:linear-gradient(180deg,var(--lg-lea-1),var(--lg-lea-2))!important;border:1px solid var(--lg-brass-d)!important;box-shadow:inset 0 0 0 3px var(--lg-lea-2),inset 0 0 0 4px rgba(var(--lg-brass-rgb),.28),0 10px 26px rgba(0,0,0,.5)!important}
.toast .ti{border-radius:0!important;background:none!important;box-shadow:inset 0 0 0 1px var(--lg-brass-d);color:var(--lg-brass-l)}
.toast small{font-family:var(--text);font-size:13px!important;color:var(--lg-brass)!important;letter-spacing:.03em}
.toast b{font-family:var(--text);font-size:18px!important;color:var(--lg-ink)}
.toast span{color:var(--lg-ink-m)!important}
/* trading post on the island: the way into the Coin Shop (still, slow lantern glow, tappable) */
.sh-link{position:absolute;left:0;top:0;z-index:4;width:40px;display:block;text-decoration:none;cursor:pointer;outline:none;padding:0}
.sh-link::before{content:"";position:absolute;inset:-10px -8px -6px}
.sh-hut{display:block;width:100%;height:auto;filter:drop-shadow(0 1px 1px rgba(0,0,0,.6));transition:transform .3s ease}
.cove[data-sky="day"] .sh-hut{filter:drop-shadow(0 1px 1px rgba(0,0,0,.35)) brightness(1.15)}
.sh-glow{position:absolute;left:50%;top:65%;width:70px;height:46px;margin:-23px 0 0 -35px;border-radius:50%;background:radial-gradient(closest-side,rgba(255,196,110,.42),rgba(255,160,70,.12) 60%,rgba(255,160,70,0));pointer-events:none;animation:shGlow 7s ease-in-out infinite}
.cove[data-sky="day"] .sh-glow{opacity:.25;animation:none}
@keyframes shGlow{0%,100%{opacity:.55}50%{opacity:.9}}
.sh-link .sh-tip{opacity:0}
.sh-link:hover .sh-tip,.sh-link:focus-visible .sh-tip{opacity:1;transform:translate(-50%,-5px)}
.sh-link:hover .sh-hut{transform:translateY(-1px)}
.sh-link:focus-visible .sh-hut{outline:2px solid var(--focus);outline-offset:3px}
@media (hover:none){.sh-link .sh-tip{opacity:.82}}
@media (prefers-reduced-motion:reduce){.sh-glow{animation:none}}
.cove.to-home .sh-link{opacity:0;transition:opacity .25s}
/* village buildings on the island (SVG over the shader): softly lit by day, warm windows at night */
.village{position:absolute;inset:0;z-index:3;pointer-events:none}
.vh-wrap{position:absolute;left:0;top:0;transform-origin:0 0}
.vh{display:block;overflow:visible}
.vh>:not(.vh-win):not(.vh-smoke):not(.vh-sh):not(.vh-glow):not(defs){filter:brightness(.42) saturate(.7)}
.cove[data-sky="day"] .vh>:not(.vh-win):not(.vh-smoke):not(.vh-sh):not(.vh-glow):not(defs){filter:none}
.cove[data-sky="day"] .vh{filter:saturate(.9) drop-shadow(0 1px 1px rgba(0,0,0,.25))}
.vh-win{fill:#ffc56e;opacity:var(--lv,1);filter:drop-shadow(0 0 2px rgba(255,170,70,.85))}
.vh-win.off{fill:#2a2420;filter:none}
.cove[data-sky="day"] .vh-win{fill:#dfe7ea;opacity:.75;filter:none}.cove[data-sky="day"] .vh-win.off{fill:#c9d2d6}
.cove:not([data-sky="day"]) .vh-win:not(.off){fill:#ffd48a}
.vh-smoke{fill:rgba(220,220,225,.35);animation:vhSmoke 9s ease-out infinite}
.cove[data-sky="day"] .vh-smoke{fill:rgba(255,255,255,.55)}
@keyframes vhSmoke{0%{transform:translate(0,0) scale(.6);opacity:0}20%{opacity:.8}100%{transform:translate(3px,-12px) scale(1.8);opacity:0}}
.vh-smoke{transform-box:fill-box;transform-origin:center}
@media (prefers-reduced-motion:reduce){.vh-smoke{animation:none;opacity:.4}}
.cove.to-home .village{opacity:0;transition:opacity .25s}
.vh-sh{fill:rgba(0,0,0,.35);filter:blur(.6px)}
.cove[data-sky="day"] .vh-win{fill:#cfd8d4;opacity:.7}
/* village v4 */
.vh-wrap{transform-origin:0 0;will-change:auto}
.vh{display:block}
.vh-win{fill:#ffcf7a;opacity:1;filter:none}
.vh-win.off{fill:#3a3530}
.vh-glow{opacity:.85}
.cove[data-sky="day"] .vh-glow{opacity:0}
.cove[data-sky="day"] .vh-win{fill:#a9c0c8;opacity:1}.cove[data-sky="day"] .vh-win.off{fill:#93a9b1}
.vh-sh{fill:rgba(0,0,0,.3);filter:blur(1px)}

/* v6 harbor dock (Coin Shop) */
.sh-dock .sh-glow{left:26%;top:27%;width:64px;height:64px;margin:-32px 0 0 -32px}
.sh-dock .sh-tip{left:27%;bottom:76%}
.sh-dock .sh-hut{filter:drop-shadow(0 .5px .5px rgba(0,0,0,.4))}
.cove[data-sky="day"] .sh-dock .sh-hut{filter:drop-shadow(0 .5px .5px rgba(0,0,0,.25))}
.cove[data-sky="day"] .dk-lamp{fill:#e8dcc0}
.cove:not([data-sky="day"]) .dk-pier,.cove:not([data-sky="day"]) .dk-boat{filter:brightness(.62) saturate(.8)}
.cove:not([data-sky="day"]) .dk-lamp{filter:none}
.sh-link:hover .sh-hut.dk{transform:none}

/* weather: dock lantern sways a little in a storm; copy stays readable in fog/storm */
.dk-lamp{transform-box:view-box;transform-origin:42px 16px}
.cove[data-weather="storm"] .dk-lamp{animation:dkSway 3.6s ease-in-out infinite}
@keyframes dkSway{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@media (prefers-reduced-motion:reduce){.cove[data-weather] .dk-lamp{animation:none}}
.cove[data-weather="fog"] .cove-copy,.cove[data-weather="storm"] .cove-copy,.cove[data-weather="rain"] .cove-copy{text-shadow:0 1px 3px rgba(4,8,14,.55),0 2px 26px rgba(4,8,14,.6)}
.cove[data-weather="storm"] .dk-pier,.cove[data-weather="storm"] .dk-boat{filter:brightness(.6) saturate(.75)}
.cove[data-weather="rain"] .dk-pier,.cove[data-weather="rain"] .dk-boat{filter:brightness(.8) saturate(.85)}
.cove[data-weather="fog"] .sh-dock .sh-hut{opacity:.8}
/* Island hotspots (lighthouse = Home, dock = Coin Shop): no browser tap highlight or default focus box on touch; gold ring for keyboard only */
.lh-link,.sh-link,.lh-link *,.sh-link *{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
.lh-link:focus,.sh-link:focus{outline:none}
.lh-link:focus-visible,.sh-link:focus-visible{outline:3px solid var(--lg-gold,#f2c14e);outline-offset:4px;border-radius:14px}
.lh-link:focus-visible .lh-ring{border-color:var(--lg-gold,#f2c14e)}
.sh-link:focus-visible .sh-hut{outline:none}
/* Phones: the play area fills most of the screen below the site header. Small-viewport units keep it clear of browser bars;
   the vh line is the fallback for older browsers. Fixed-ratio games (landscape/portrait) keep their shape. Tablets/desktop unchanged. */
@media (max-width:600px){
  .stage[data-orientation="any"]{aspect-ratio:auto;max-height:none;height:calc(100vh - var(--hdr,60px) - 24px - var(--ad-notice-h,0px));height:calc(100svh - var(--hdr,60px) - 24px - var(--ad-notice-h,0px));min-height:420px}
  .stage[data-orientation="landscape"]{max-height:calc(100svh - var(--hdr,60px) - 24px)}
  .stage[data-orientation="portrait"]{max-width:min(100%,calc((100svh - var(--hdr,60px) - 24px) * .5625))}
  .gdetail{grid-template-columns:minmax(0,1fr)}
  .gabout{min-width:0;overflow-wrap:anywhere}
}
/* Phones: 44px tap targets for the header Home icon and the island Home spot */
@media (max-width:600px){.m-home{width:44px;height:44px}.lh-link{width:44px;margin-left:-2px}}
/* How to play list: long control labels wrap instead of running over their description; phones stack label above text */
.controls li{min-width:0}
.controls li>span:not(.kbd){min-width:0;flex:1}
.kbd{white-space:normal;max-width:100%;flex:none}
@media (max-width:600px){.controls li{flex-direction:column;align-items:flex-start;gap:4px}.kbd{text-align:left}}