:root{--ink: #12304a;--ink2: #0b2236;--bone: #f6f1e6;--paper: #fbf7ee;--dim: rgba(18, 48, 74, .62);--p1: #ff6f59;--p2: #ffb238;--p3: #c3d43f;--p4: #3fc79f;--p5: #3aa3e0;--p6: #6f7bf0;--p7: #b26ee8;--p8: #ee66b5;--washi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9 .35' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .47 0 0 0 0 .36 0 0 0 .16 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");--seal: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M2 12c2-5 5-5 7-1s4 3 6-2c1-2 2-2 3-1' fill='none' stroke='%23f6ead2' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M3 16h14' stroke='%23f6ead2' stroke-width='1.4' stroke-linecap='round'/%3E%3C/svg%3E");--waves: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='30' viewBox='0 0 80 30'%3E%3Cpath d='M0 18C10 18 16 6 28 6c8 0 10 6 6 8 6-1 8-4 6-7 9 2 13 11 22 11h18v12H0z' fill='%2322578a'/%3E%3Cpath d='M0 18C10 18 16 6 28 6c8 0 10 6 6 8 6-1 8-4 6-7 9 2 13 11 22 11h18' fill='none' stroke='%23f4ecd8' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M28 6c-3-1-6 0-8 3M34 14c-2 0-4 1-5 3M40 7c-1 2-3 3-5 3' fill='none' stroke='%23f4ecd8' stroke-width='1.2' stroke-linecap='round'/%3E%3Cpath d='M0 25c14 0 20-5 34-5s24 5 46 5v5H0z' fill='%23172a4e'/%3E%3Cpath d='M0 25c14 0 20-5 34-5s24 5 46 5' fill='none' stroke='%237fa3c8' stroke-width='1' opacity='.7'/%3E%3C/svg%3E");--type: Seravek, "Gill Sans Nova", "Segoe UI Variable Text", Ubuntu, "Noto Sans", sans-serif}html,body{background:var(--ink2);color:var(--ink);font-family:var(--type)}.stage{background:#e4dccb}.hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:flex-start;justify-content:space-between;padding:calc(8px + var(--safe-t)) calc(10px + var(--safe-r)) 0 calc(10px + var(--safe-l));pointer-events:none}.sq{border-radius:12px;background:var(--ink);box-shadow:inset 0 -3px #00000040,0 3px 10px #0b223640}.btn{pointer-events:auto;width:44px;height:44px;display:grid;place-items:center;border:0;color:var(--bone);text-decoration:none;transition:transform .12s ease}.btn:active{transform:translateY(2px) scale(.95)}.btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.mute .spk{fill:currentColor;stroke:none}.mute .off,.mute[aria-pressed=true] .wav{display:none}.mute[aria-pressed=true] .off{display:inline}.mute[aria-pressed=true]{color:#f6f1e680}.board{display:flex;flex-direction:column;align-items:center}.score{min-width:4ch;padding:0 12px;text-align:center;font:300 34px/1.05 var(--type);letter-spacing:.02em;font-variant-numeric:tabular-nums;color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.6);transition:transform .25s cubic-bezier(.2,1.6,.4,1)}.score.pop{transform:scale(1.08)}.meta{display:flex;gap:6px;margin-top:3px;align-items:center}.mult{padding:3px 9px;font:600 13px/1.2 var(--type);letter-spacing:.06em;color:var(--ink);background:#fbf7eed9;border-radius:6px;box-shadow:inset 0 0 0 1.2px var(--ink);transition:transform .3s cubic-bezier(.2,1.6,.4,1)}.mult.hot{background:var(--ink);color:var(--bone);box-shadow:inset 0 -2px 0 var(--p2)}.mult.pop{transform:scale(1.25)}.hull{display:inline-flex;gap:3px;padding:4px 7px;background:#fbf7eed9;border-radius:6px;box-shadow:inset 0 0 0 1.2px var(--ink)}.hull svg{width:18px;height:10px;transition:opacity .3s ease,transform .4s ease}.hull path{fill:var(--ink)}.hull svg.gone{opacity:.25;transform:translateY(2px) rotate(-14deg)}.hull svg.gone path{fill:none;stroke:var(--ink);stroke-width:1.4;stroke-dasharray:3 2}.hull.shake{animation:shake .5s ease}@keyframes shake{20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.title,.card,.paused,.sheet{position:absolute;z-index:2;text-align:center}.title,.card,.paused{pointer-events:none}.sheet{inset:0;z-index:4;display:grid;place-items:center;padding:calc(20px + var(--safe-t)) 16px calc(20px + var(--safe-b));background:#0b22368c}.card-paper{position:relative;width:min(300px,calc(100vw - 40px));margin:0 auto;padding:20px 18px 16px;color:var(--ink);background:var(--washi),linear-gradient(180deg,#faf4e6,#f2e9d5);background-blend-mode:multiply;border-radius:4px;box-shadow:inset 0 0 0 2px #172a4e,inset 0 0 0 5px #f6efdf,inset 0 0 0 6px #172a4e80,0 2px #172a4e40,0 18px 40px #0b162c61}.card-paper{padding-bottom:44px}.card-paper:before{content:"";position:absolute;left:2px;right:2px;bottom:2px;height:30px;border-radius:0 0 3px 3px;pointer-events:none;background:var(--waves) left bottom / 80px 30px repeat-x,linear-gradient(180deg,transparent 0 40%,#172a4e 40%);opacity:.95}.card-paper:after{content:"";position:absolute;right:14px;top:16px;width:26px;height:26px;border-radius:3px;transform:rotate(-4deg);background:#d2462a var(--seal) center / 20px 20px no-repeat;box-shadow:inset 0 0 0 1.5px #fae6d28c;opacity:.92;pointer-events:none}.card-paper.wide{width:min(360px,calc(100vw - 28px));max-height:calc(100vh - 60px);overflow:auto}.spectrum{position:absolute;left:1.5px;right:1.5px;top:1.5px;height:5px;display:flex;border-radius:5px 5px 0 0;overflow:hidden}.spectrum i{flex:1}.spectrum i:nth-child(1){background:var(--p1)}.spectrum i:nth-child(2){background:var(--p2)}.spectrum i:nth-child(3){background:var(--p3)}.spectrum i:nth-child(4){background:var(--p4)}.spectrum i:nth-child(5){background:var(--p5)}.spectrum i:nth-child(6){background:var(--p6)}.spectrum i:nth-child(7){background:var(--p7)}.spectrum i:nth-child(8){background:var(--p8)}.kicker{font:500 12px/1.3 var(--type);letter-spacing:.26em;text-transform:lowercase;color:var(--dim)}.title{inset:0;display:flex;align-items:flex-start;justify-content:center;padding:calc(70px + var(--safe-t)) 20px calc(40px + var(--safe-b))}.title.fade{animation:fadeOut .45s ease forwards}@keyframes fadeOut{to{opacity:0;transform:translateY(-12px)}}.title h1{margin:2px 0 0;font:200 clamp(44px,13vw,56px)/1.05 var(--type);letter-spacing:.08em;color:var(--ink)}.legend{margin:8px auto 0;width:190px;height:88px;display:grid;place-items:center;border-radius:6px;background:linear-gradient(180deg,#8ea9c0 0,#ece3cf 30%,#f1e8d4 44%,#22578a 44%,#172a4e);box-shadow:inset 0 0 0 1.6px #141620;overflow:hidden}.legend svg{width:180px;height:84px;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round}.legend .flat,.legend .w1,.legend .w2{stroke:var(--paper);stroke-width:2.2}.legend .w1{opacity:0;animation:w1 4.2s ease-in-out infinite}.legend .w2{opacity:0;animation:w2 4.2s ease-in-out infinite}.legend .flat{animation:w0 4.2s ease-in-out infinite}.legend .rock{fill:#a49e8f;stroke:#141620;stroke-width:1.2}.legend .stop{fill:#13324a;stroke:#f6f1e666;stroke-width:1}.legend .mid{stroke:#f6f1e699;stroke-width:1.2}.legend .stop{fill:#102a47}.legend .bar{fill:var(--p1);transform-origin:154px 41px;transform:scaleY(0);animation:bar 4.2s ease-in-out infinite}.legend .hand{fill:var(--paper);stroke:var(--ink);stroke-width:1.4;animation:hand 4.2s ease-in-out infinite}@keyframes w0{0%,18%{opacity:1}24%,92%{opacity:0}to{opacity:1}}@keyframes w1{0%,18%{opacity:0}24%,52%{opacity:1}58%,to{opacity:0}}@keyframes w2{0%,52%{opacity:0}58%,92%{opacity:1}to{opacity:0}}@keyframes bar{0%,18%{transform:scaleY(0)}24%,92%{transform:scaleY(1)}to{transform:scaleY(0)}}@keyframes hand{0%,6%{transform:translate(10px,22px)}15%,20%{transform:translate(0)}30%,46%{transform:translate(10px,22px)}52%,56%{transform:translate(0)}66%,to{transform:translate(10px,22px)}}.cta{margin-top:12px;font:500 16px/1.3 var(--type);letter-spacing:.04em;color:var(--ink);animation:breathe 2.6s ease-in-out infinite}.paused .cta{font-size:22px;color:var(--bone)}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}.best{margin-top:4px;font:500 13px/1 var(--type);letter-spacing:.18em;color:var(--dim);font-variant-numeric:tabular-nums}.row2{display:flex;gap:10px;justify-content:center;margin-top:12px}.pill{pointer-events:auto;min-height:44px;padding:0 16px;display:inline-flex;align-items:center;gap:8px;border:0;color:var(--ink);background:transparent;border-radius:10px;box-shadow:inset 0 0 0 1.4px var(--ink);font:600 14px/1 var(--type);letter-spacing:.16em;text-transform:lowercase}.pill.solid{background:var(--ink);color:var(--bone)}.pill svg{width:20px;height:20px;fill:none;stroke:var(--p5);stroke-width:2;stroke-linecap:round}.pill:active{transform:translateY(1px) scale(.97)}.card{left:50%;top:46%;transform:translate(-50%,-46%) scale(.96);opacity:0;transition:opacity .35s ease,transform .5s cubic-bezier(.2,1.4,.4,1)}.card.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.big{font:200 56px/1 var(--type);margin-top:4px;font-variant-numeric:tabular-nums;color:var(--ink);letter-spacing:.02em}.newbest{display:inline-block;margin-top:6px;padding:5px 12px;font:700 12px/1 var(--type);letter-spacing:.22em;color:var(--bone);background:#d2462a;border-radius:5px;box-shadow:inset 0 -2px 0 var(--p2);animation:shine 1.4s ease-in-out infinite}@keyframes shine{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.keep{display:block;width:116px;height:auto;aspect-ratio:2 / 3;object-fit:cover;margin:10px auto 0;border-radius:3px;box-shadow:0 0 0 1.5px var(--ink),0 0 0 5px var(--paper),0 0 0 6px #12304a59,0 10px 18px #0b22364d;transform:rotate(-1.5deg)}.rows{margin:12px 4px 0}.row{display:flex;justify-content:space-between;align-items:baseline;padding:4px 2px 3px;border-bottom:1px solid rgba(18,48,74,.18);font:500 13px/1.2 var(--type);letter-spacing:.14em;color:var(--dim)}.row b{font:500 17px/1 var(--type);color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.02em}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px;margin:14px 0}.grid figure{margin:0}.grid figure:nth-child(odd) img{transform:rotate(-1.2deg)}.grid figure:nth-child(2n) img{transform:rotate(1deg)}.grid img{width:100%;aspect-ratio:2 / 3;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1.2px var(--ink),0 0 0 4px var(--paper),0 6px 10px #0b223640}.grid figcaption{margin-top:8px;font:600 12px/1 var(--type);color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:.06em}.grid figure{cursor:pointer}.grid figure.pinned img{box-shadow:0 0 0 1.2px var(--ink),0 0 0 4px var(--paper),0 0 0 6px #d2462a,0 6px 10px #0b223640}.grid figure.pinned figcaption:before{content:"★";color:#d2462a}.big-keep{width:min(200px,56vw);margin-top:16px}.dcap{margin:12px 0 0;font:600 13px/1.2 var(--type);color:var(--ink);letter-spacing:.06em;font-variant-numeric:tabular-nums}.row2.btns{flex-wrap:wrap;gap:8px}.pill.ad:after{content:"AD";margin-left:2px;padding:1px 4px;border-radius:4px;font:700 9px/1.2 var(--type);letter-spacing:.08em;background:var(--ink);color:var(--bone)}.empty{margin:18px 0;font:500 14px/1.3 var(--type);color:var(--dim);letter-spacing:.06em}.paused{inset:0;display:grid;place-items:center;background:#0b22368c}@media(max-height:700px){.title{padding-top:calc(58px + var(--safe-t))}.card-paper{padding-top:15px;padding-bottom:34px}.card-paper:before{height:24px;background-size:64px 24px,auto}.title h1{font-size:42px}.legend{height:76px}.legend svg{height:72px}.big{font-size:44px}.keep{width:80px}.row{padding:3px 2px 2px}.card{top:44%}}@media(prefers-reduced-motion:reduce){.cta,.newbest,.legend .w1,.legend .w2,.legend .flat,.legend .bar,.legend .hand{animation:none}.legend .w1{opacity:1}.legend .flat{opacity:0}.legend .bar{transform:none}.score,.mult,.hull svg{transition:none}.hull.shake{animation:none}}.title{padding-top:calc(60px + var(--safe-t))}.title .card-paper{padding-bottom:26px}.title .card-paper:before{height:18px;background-size:48px 18px,auto}.title .legend{margin-top:5px}@media(max-height:700px){.title{padding-top:calc(54px + var(--safe-t))}}