:root{--night:#14213a;--snow:#f3f7fb;--ice:#bcd7ea;--pine:#1f4d45;--wood:#7a3b24;--signal:#ff7a1a;--ink:#0d1626;--muted:#8fa5bd;--display:"Bowlby One","Arial Black",Impact,sans-serif;--body:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark}html,body{height:100%;margin:0}html{overscroll-behavior:none}[hidden]{display:none!important}html,body,#wrap,canvas,button{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}body{background:var(--ink);color:var(--snow);font-family:var(--body);overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}#wrap{position:fixed;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px);background:var(--ink);touch-action:none;user-select:none;-webkit-user-select:none}canvas{display:block;width:100%;height:100%}#card{position:fixed;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#0d162655,#0d1626cc);padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));box-sizing:border-box;overflow:auto}#card .in{max-width:620px;width:100%;display:flex;flex-direction:column;gap:12px;margin:auto;box-sizing:border-box;padding:clamp(18px,3vw,30px);background:linear-gradient(160deg,#1b2d4ef2,#111c33f2);border:1px solid #ffffff1a;border-radius:18px;box-shadow:0 24px 60px #0009,inset 0 1px #ffffff14;animation:rise .35s cubic-bezier(.2,.8,.3,1.2)}@keyframes rise{0%{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){#card .in{animation:none}}#card .ribbon{align-self:flex-start;font-family:var(--display);font-size:12px;letter-spacing:.12em;color:#1a1200;background:linear-gradient(90deg,#ffd23a,#ff9f1a);padding:5px 12px;border-radius:4px;box-shadow:0 3px #b36b00}#card h1.epic{font-size:clamp(30px,6vw,60px);color:#ff4d4d;text-shadow:0 3px 0 #7a0d0d,0 8px 20px #ff2a2a55;letter-spacing:.02em}#card h1.epic span{display:block;font-size:.4em;color:var(--snow);text-shadow:none;letter-spacing:.08em;margin-top:6px}#card .legs.exp i.on{background:#ffd23a}#card .legs.exp i.done{background:#ffd23a77}#card .expbox{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:12px;background:linear-gradient(135deg,#3a0d12,#1b1020);border:1px solid #ff4d4d55}#card .expbox h2{font-family:var(--display);font-weight:400;margin:0;font-size:clamp(20px,3.4vw,30px);color:#ff5a5a}#card .expbox h2 span{color:var(--snow);font-size:.55em;margin-left:8px}#card button.red{background:linear-gradient(180deg,#ff5a5a,#d8202a);color:#fff;box-shadow:0 4px #7a0d0d,0 8px 18px #ff2a2a40}#card .lb{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font-variant-numeric:tabular-nums}#card .lb li{display:grid;grid-template-columns:2em 1fr auto;gap:10px;padding:6px 10px;border-radius:8px;background:#ffffff0d}#card .lb li.me{background:#ff7a1a33;outline:1px solid #ff7a1a}#card .lb li span{color:var(--muted)}#card .lb li b{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#card .lb li em{font-style:normal;font-family:var(--display)}#card .lbform{display:flex;flex-direction:column;gap:6px}#card .lbform label{font-size:13px;color:var(--muted)}#card input{font:inherit;font-size:16px;padding:10px 12px;border-radius:10px;border:1px solid #ffffff33;background:#0d1626;color:var(--snow);min-width:0;flex:1}#card input:focus-visible{outline:3px solid var(--signal)}#card .lvls{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}#card .lvls button{align-self:stretch;font-size:15px;min-height:46px;padding:8px 12px;text-align:left;display:flex;gap:8px;align-items:center}#card .lvls small{font-size:12px;color:var(--muted)}#card .lvls button.red-lvl{border-color:#ff4d4d88}#card .tabs{display:flex;gap:8px;flex-wrap:wrap}#card .tabs button{min-height:40px;font-size:14px;padding:6px 14px}#card .tabs button.on{border-color:var(--signal);color:var(--signal)}#card .legs{display:flex;gap:6px}#card .legs i{display:block;width:26px;height:5px;border-radius:3px;background:#ffffff26}#card .legs i.on{background:var(--signal)}#card .legs i.done{background:#ff7a1a77}#card .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}#card button.ghost{background:transparent;color:var(--snow);border:2px solid var(--muted)}#mute{position:fixed;top:calc(env(safe-area-inset-top,0px) + 9vh + 14px);right:max(12px,env(safe-area-inset-right));z-index:6;width:46px;height:46px;font-size:20px;border-radius:50%;border:1px solid #ffffff22;background:#14213acc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font-size:18px;cursor:pointer;touch-action:manipulation}#mute:focus-visible,#pause:focus-visible{outline:3px solid var(--signal)}#pause{position:fixed;top:calc(env(safe-area-inset-top,0px) + 9vh + 70px);right:max(12px,env(safe-area-inset-right));z-index:6;width:46px;height:46px;border-radius:50%;border:1px solid #ffffff33;background:#14213acc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font-size:15px;box-shadow:0 4px 12px #0006;font-weight:700;cursor:pointer;touch-action:manipulation}#card .menu{display:flex;flex-direction:column;gap:10px;align-items:stretch}#card .menu button{align-self:stretch}#card .eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--signal);font-weight:700}#card h1{font-family:var(--display);font-weight:400;font-size:clamp(22px,4.4vw,46px);line-height:1.02;margin:0;text-wrap:balance}#card p{margin:0;line-height:1.45;font-size:clamp(13px,1.7vw,16px);color:var(--ice)}#card .ticket{display:grid;grid-template-columns:auto 1fr auto;gap:4px 14px;align-items:baseline;border:1px dashed var(--muted);border-radius:8px;padding:10px 12px;font-variant-numeric:tabular-nums;font-size:clamp(12px,1.6vw,15px)}#card .ticket b{font-family:var(--display);font-weight:400;font-size:1.25em}#card .ticket span{color:var(--muted)}#card img{width:100%;max-height:28vh;object-fit:cover;border-radius:8px}#card .keys{font-size:13px;color:var(--muted)}#card button{align-self:flex-start;font-family:var(--display);font-size:18px;min-height:48px;touch-action:manipulation;background:linear-gradient(180deg,#ff9440,#ff7a1a);color:var(--ink);border:0;border-radius:10px;padding:10px 24px;cursor:pointer;box-shadow:0 4px #b4500c,0 8px 18px #ff7a1a40;transition:transform .08s,box-shadow .08s}#card button:active{transform:translateY(3px);box-shadow:0 1px #b4500c}#card button:focus-visible{outline:3px solid var(--snow);outline-offset:3px}#card button:hover{filter:brightness(1.08)}#card button.ghost{box-shadow:none}@media(max-height:520px){#card .in{gap:8px}#card img{max-height:22vh}}#card .cardbody{display:flex;flex-direction:column;gap:12px}@media(max-height:520px){#card .cardbody{gap:8px}}#card .chars{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}#card .charcard{align-self:stretch;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto;gap:2px 12px;text-align:left;padding:12px 14px;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 35%,#14213a),#14213a);border:2px solid var(--c);color:var(--snow);box-shadow:none;font-family:var(--body);font-size:14px}#card .charcard .avatar{grid-row:1/4;width:52px;height:52px;border-radius:50%;background:var(--c);display:grid;place-items:center;font-size:26px}#card .charcard .cname{font-family:var(--display);font-size:22px;line-height:1.1}#card .charcard .ctrait{color:var(--ice);font-size:13px;line-height:1.35}#card .charcard .clevels{color:var(--muted);font-size:12px}#card button.back{min-height:36px;font-size:13px;padding:4px 12px;border-width:1px}