:root{--bg:#1f2024;--panel:#26262aeb;--panel-solid:#2a2a2e;--panel-2:#36363c;--text:#f4f4f2;--muted:#b3b3ba;--accent:#00e0a8;--accent-grad:linear-gradient(135deg, #2ae6c2 0%, #16d690 100%);--accent-text:#0b1f18;--danger:#ff5a5f;--border:#ffffff1f;--board-bg:#2a2a2e;--band-bg:#f3f3f0;--band-alt:#e4e4df;--cell-blank:#fff;--grid-line:#cfcfca;--grid-bold:#38c838;--grid-frame:#4a4a50;--cell-stripe:#28281e09;--clue-text:#26262a;--clue-done:#b4b4ae;--mega:#d8434f;--mega-band:#f6dcd9;--cross:#ff7a1c;--cross-bg:#ecebe6;--highlight:#3cc8ff47;--cursor:#2fd2ec;--radius:18px;--gutter:16px;--gutter-l:max(var(--gutter), env(safe-area-inset-left));--gutter-r:max(var(--gutter), env(safe-area-inset-right));--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Rodin,system-ui,-apple-system,Segoe UI,Hiragino Sans,Noto Sans JP,sans-serif;font-weight:600}*{box-sizing:border-box}[hidden]{display:none!important}html,body{background:var(--bg);height:100%;color:var(--text);margin:0}html{touch-action:manipulation}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.calm *,.calm :before,.calm :after{scroll-behavior:auto!important;transition:none!important;animation:none!important}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;background:var(--bg)}.backdrop{z-index:0;pointer-events:none;opacity:0;transition:opacity var(--fade,.7s) ease;background:50%/cover no-repeat;position:fixed;inset:0}.backdrop.on{opacity:1;z-index:0}.backdrop:not(.on){z-index:-1;transition-delay:var(--fade,.7s)}@media (prefers-reduced-motion:reduce){.backdrop{transition:none}}body:before{content:"";pointer-events:none;z-index:1;background:var(--img-pattern) repeat;opacity:.08;background-size:240px;position:fixed;inset:0}#app{z-index:2;height:100dvh;position:relative}a{color:inherit;text-decoration:none}h1,h2,strong{font-weight:800}.screen{flex-direction:column;height:100%;display:flex}.scroll{scrollbar-width:thin;scrollbar-color:#ffffff47 transparent;padding:var(--gutter) var(--gutter-r) calc(var(--gutter) + env(safe-area-inset-bottom)) var(--gutter-l);flex:1;overflow:auto}.narrow{flex-direction:column;gap:14px;width:100%;max-width:680px;margin:0 auto;display:flex}.bar{margin:calc(10px + env(safe-area-inset-top)) var(--gutter-r) 0 var(--gutter-l);background:var(--panel);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);align-items:center;gap:10px;padding:8px 10px;display:flex;box-shadow:0 4px 18px #0000004d}.icon{width:22px;height:22px;display:block}.btn.icon{background:#ffffff14;border-color:#0000;border-radius:12px}.btn.icon:hover{background:#ffffff29}.bar h1{white-space:nowrap;text-overflow:ellipsis;flex:1;margin:0;font-size:1.15rem;overflow:hidden}.bar h1:focus{outline:none}.home-title{align-items:flex-start}.brand{object-fit:contain;width:auto;max-width:70vw;height:34px}.brand.invert{filter:invert()}.logo{letter-spacing:-.01em;font-weight:800}.btn{border:1px solid var(--border);background:var(--panel-2);min-height:42px;color:var(--text);font:inherit;cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:12px;justify-content:center;align-items:center;gap:6px;padding:0 16px;font-weight:700;display:inline-flex}.btn:hover{background:#44444b}.btn:disabled{opacity:.4;cursor:default}.btn.icon{width:42px;padding:0;font-size:1.25rem}.btn.primary{background:var(--accent-grad);color:var(--accent-text);border-color:#0000}.btn.primary:hover{filter:brightness(1.08)}.btn.eshop{color:#fff;background:#e60012;border-color:#0000;text-decoration:none}.btn.eshop:hover{background:#c8000f}.btn.eshop .icon{flex:none;width:1.1em;height:1.1em}.eshop-note{opacity:.85;font-size:.75rem;font-weight:600}.banner.with-shop{flex-direction:column;gap:10px}.dialog.notice p{text-wrap:balance}@property --menu-cursor{syntax:"<color>";inherits:true;initial-value:#00e0a8}@keyframes cursor-pulse{0%,to{--menu-cursor:var(--accent)}50%{--menu-cursor:color-mix(in srgb, var(--accent) 45%, #fff)}}html{--menu-cursor:var(--accent);animation:1.5s linear infinite cursor-pulse}html.calm{animation:none}:root{--cursor-ring:0 0 0 8px #0a0a0e8c, 0 0 18px 6px color-mix(in srgb, var(--accent) 55%, transparent)}:focus-visible{outline:3px solid var(--menu-cursor);outline-offset:2px}html[data-prompts] :focus-visible{box-shadow:var(--cursor-ring)}html[data-prompts] canvas:focus-visible{box-shadow:none}.lede{background:var(--panel);color:var(--muted);border-radius:14px;margin:0 0 14px;padding:6px 12px;font-size:.85rem;display:inline-block}.grid{gap:14px;display:grid}.home-bar{box-shadow:none;-webkit-backdrop-filter:none;background:0 0}.home-bar .btn.icon{background:var(--panel)}.spacer{flex:1}.home-main{flex-direction:column;display:flex}.home-inner{text-align:center;flex-direction:column;align-items:center;gap:20px;margin:auto;padding:8px 0 16px;display:flex}.home-logo .brand{filter:drop-shadow(0 0 1px #0009)drop-shadow(0 2px 8px #00000073);width:min(560px,82vw);max-width:none;height:auto;transition:opacity .45s}.home-logo .brand-dark{opacity:0;filter:drop-shadow(0 0 1px #ffffffe6)drop-shadow(0 0 8px #fff9);position:absolute;top:0;left:0}.home-logo [data-tone=light] .brand-dark{opacity:1}.home-logo [data-tone=light] .brand:not(.brand-dark){opacity:0}.home-logo .brand-plus{transition:filter .45s}.brand-shine{pointer-events:none;-webkit-mask-image:var(--mask);-webkit-mask-image:var(--mask);mask-image:var(--mask);mix-blend-mode:screen;background:linear-gradient(105deg,#0000 44%,#ffffffbf 50%,#0000 56%) 120% 0/300% 100% no-repeat;animation:14s linear 2s infinite brand-shine;position:absolute;inset:0;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}@keyframes brand-shine{0%,70%{background-position:120% 0}88%,to{background-position:-20% 0}}.calm .brand-shine{display:none}@media (prefers-reduced-motion:reduce){.brand-shine{display:none}.home-logo .brand,.home-logo .brand-plus{transition:none}}.home-logo .brand-plus{filter:drop-shadow(0 0 1.5px #000000d9)drop-shadow(0 2px 10px #0009)}.home-logo [data-tone=light] .brand-plus{filter:drop-shadow(0 0 1.5px #fff)drop-shadow(0 0 3px #fffffff2)drop-shadow(0 0 14px #ffffffd9)}.mode-row{flex-wrap:wrap;justify-content:center;gap:6px 10px;margin:0 auto;display:flex}.mode-btn{aspect-ratio:1;text-align:center;color:#fff;place-items:center;width:150px;display:grid;position:relative}@media (hover:hover){.mode-btn:hover{filter:brightness(1.12);transform:scale(1.06)}}.mode-btn:focus-visible{filter:brightness(1.12);outline:none}.mode-btn:focus-visible:after{content:"";pointer-events:none;border:3px solid #fff;border-radius:18%;position:absolute;inset:15%;transform:rotate(45deg);box-shadow:0 0 0 2px #1d1d21,inset 0 0 0 2px #1d1d21}.mode-frame{filter:drop-shadow(0 4px 10px #00000073);width:100%;height:100%;position:absolute;inset:0}.mode-fill{opacity:.8;clip-path:polygon(50% 17%,54% 18.5%,81.5% 46%,83% 50%,81.5% 54%,54% 81.5%,50% 83%,46% 81.5%,18.5% 54%,17% 50%,18.5% 46%,46% 18.5%);position:absolute;inset:0;overflow:hidden}.fill-band{position:absolute;left:0;right:0}.mode-fill:before{content:"";height:calc(var(--level,17%) - 17%);z-index:1;background:linear-gradient(#ffffff38,#0000 55%,#00000047);position:absolute;bottom:17%;left:0;right:0}.mode-fill.empty:before{display:none}.mode-fill:after{content:"";z-index:2;left:0;right:0;bottom:calc(var(--level,0%) - 1px);background:#ffffffb3;height:2px;position:absolute;box-shadow:0 0 10px 3px #ffffff40}.mode-fill.empty:after{display:none}.mode-text{text-shadow:0 1px 3px #000000d9;flex-direction:column;align-items:center;gap:1px;max-width:62%;display:flex;position:relative}.mode-text strong{font-size:.86rem;line-height:1.1}.mode-text small{font-variant-numeric:tabular-nums;opacity:.95;font-size:.72rem;font-weight:700}.progress{background:#ffffff1f;border-radius:3px;width:100%;height:6px;display:block;overflow:hidden}.segs{height:100%;display:flex}.seg{height:100%}.home-foot{grid-template-columns:repeat(2, min(300px, calc(50vw - var(--gutter) - 5px)));justify-content:center;align-items:stretch;gap:10px;display:grid}.home-foot>.foot-card{width:auto;min-width:0}.daily-marks{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.daily-mark{color:var(--muted);background:#ffffff14;border-radius:8px;align-items:center;gap:3px;padding:2px 8px;font-weight:800;display:inline-flex}.daily-mark.done{background:var(--accent-grad);color:var(--accent-text)}.daily-mark .icon{width:12px;height:12px}.friends-line{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.friends-card{position:relative}.friends-card.news:after{content:"";background:var(--danger);width:9px;height:9px;box-shadow:0 0 0 2px var(--panel-solid);border-radius:50%;position:absolute;top:8px;right:10px}.daily-tiles{grid-template-columns:repeat(3,minmax(0,132px));justify-content:center;gap:14px;margin:6px 0 4px;display:grid}.daily-col{text-align:center;flex-direction:column;gap:6px;display:flex}.daily-col h3{margin:0;font-size:.9rem}.daily-friend{min-height:1.2em;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:700}.daily-streak{color:var(--muted);font-size:.85rem;font-weight:800}.daily-note{color:var(--muted);text-align:center;margin:4px 0 0;font-size:.85rem}.foot-card{width:min(300px, calc(100vw - 2 * var(--gutter)));background:var(--panel);border-radius:16px;min-height:52px}.made-by{background:var(--panel);color:var(--muted);border-radius:9px;flex:none;align-self:flex-end;align-items:center;gap:3px;margin-top:8px;padding:5px 10px;font-size:.68rem;font-weight:700;text-decoration:none;transition:background .15s;display:inline-flex}.made-by strong{color:var(--text)}.made-by:hover{background:#282830d9}.made-by:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.narrow>.made-by{margin-bottom:10px}.theme-switch{align-items:center;gap:6px;padding:4px;display:flex}.theme-name{flex:1;justify-content:center;align-items:center;gap:8px;min-width:0;font-size:.8rem;font-weight:800;display:flex}.theme-switch{touch-action:pan-y;-webkit-user-select:none;user-select:none}.theme-note{color:var(--muted);display:flex}.theme-note .icon{width:16px;height:16px}.theme-name .marquee-box{white-space:nowrap;min-width:0;overflow:hidden}.marquee-box>span{display:inline-block}.theme-switch .tab-icon{border-radius:8px;flex:none;width:30px;height:30px}.home-count{color:var(--muted);flex-direction:column;justify-content:center;gap:6px;padding:8px 14px;font-size:.78rem;display:flex}.home-count strong{color:var(--text)}a.home-count{cursor:pointer;text-decoration:none;transition:background .15s}a.home-count:hover{background:#282830d9}a.home-count:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.home-count .progress{margin:0}.guide-bar{z-index:3;padding:10px var(--gutter-r) max(10px, env(safe-area-inset-bottom)) var(--gutter-l);background:#18181ce6;flex:none;justify-content:center;display:flex;position:relative;box-shadow:0 -6px 20px #00000040}.guide{text-align:center;white-space:nowrap;max-width:100%;margin:0;font-size:.9rem;font-weight:700;overflow:hidden}.guide span{padding:0 12px;display:inline-block}@media (width<=560px){.guide{white-space:normal;text-wrap:balance;justify-content:center;align-items:center;min-height:2.5em;font-size:.85rem;line-height:1.25;display:flex}}.guide.marquee,.marquee-box.marquee{text-align:left;-webkit-mask-image:linear-gradient(90deg,#0000,#000 16px calc(100% - 16px),#0000);mask-image:linear-gradient(90deg,#0000,#000 16px calc(100% - 16px),#0000)}.guide.marquee span,.marquee-box.marquee>span{animation:guide-scroll var(--dur,6s) ease-in-out infinite}@keyframes guide-scroll{0%,20%{transform:translate(0)}60%,80%{transform:translateX(var(--shift))}to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){.guide.marquee{white-space:normal;text-align:center;-webkit-mask-image:none;mask-image:none}.guide.marquee span,.marquee-box.marquee>span{animation:none}.marquee-box.marquee{text-overflow:ellipsis}}.mode-btn.lit{filter:brightness(1.15);transform:scale(1.06)}.tabs-wrap{margin:8px var(--gutter-r) 0 var(--gutter-l);background:var(--panel);border-radius:var(--radius);align-items:center;gap:6px;padding:8px 0 8px 8px;display:flex}.tabs-wrap .strip-scroll,.tabs-wrap .tabs{flex:1;min-width:0}.strip-scroll{display:flex;position:relative}.strip-scroll>.tabs.dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}.strip-scroll>.tabs.dragging .tab{pointer-events:none}.strip-arrow{z-index:2;border:1px solid var(--border);width:36px;height:36px;color:var(--text);cursor:pointer;opacity:0;pointer-events:none;background:#2c2c34f5;border-radius:10px;place-items:center;transition:opacity .15s,background .15s;display:grid;position:absolute;top:50%;translate:0 -50%;box-shadow:0 2px 10px #00000073}.strip-arrow.left{left:4px}.strip-arrow.right{right:4px}.strip-arrow.shown{opacity:1;pointer-events:auto}.strip-arrow:hover{background:#40404afa}.strip-arrow .icon{width:18px;height:18px}.tabs{scrollbar-width:none;gap:6px;padding:0 14px;scroll-padding:0 28px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 16px calc(100% - 28px),#0000 100%);mask-image:linear-gradient(90deg,#0000 0,#000 16px calc(100% - 28px),#0000 100%)}.tabs::-webkit-scrollbar{display:none}.tabs:after{content:"";flex:none;width:8px}.tab{white-space:nowrap;color:var(--muted);background:#ffffff0f;border:2px solid #0000;border-radius:14px;flex:none;align-items:center;gap:8px;padding:5px 12px 5px 5px;font-weight:800;display:flex;position:relative;overflow:hidden}.tab:hover{color:var(--text);background:#ffffff1f}.tab.active{border-color:var(--accent);color:var(--text);background:color-mix(in srgb, var(--accent) 14%, transparent)}.tab>:not(.tab-progress){position:relative}.tab-progress{opacity:.28;pointer-events:none;position:absolute;inset:0}.tab-icon{border-radius:10px;flex:none;width:40px;height:40px}.tab-text{flex-direction:column;line-height:1.15;display:flex}.tab-text small{font-size:.75rem;font-weight:600}.banner{justify-content:center;align-items:center;gap:12px;margin:26px 0 22px;display:flex}.sections>.section:first-of-type .banner{margin-top:8px}.section{content-visibility:auto;contain-intrinsic-size:auto 900px}.sections{max-width:1400px;margin:0 auto}.size-banner{font-size:2rem;font-weight:800}.size-banner>span:last-child{background:var(--panel);border-radius:14px;padding:2px 18px}.size-banner .size-icon{width:56px;height:56px}.vol-logo{object-fit:contain;filter:drop-shadow(0 0 1px #ffffffb3)drop-shadow(0 2px 8px #0000008c);max-width:min(520px,90%);max-height:72px}.view-toggle{flex:none;display:flex}.view-toggle button{min-height:40px;font:inherit;cursor:pointer;background:0 0;border:0;padding:8px 12px;font-size:.8rem;font-weight:800}.size-head{background:var(--panel);border-radius:12px;margin:0 0 10px;padding:6px 14px;font-size:1rem;display:inline-block}.tiles{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px 10px}.sentinel{text-align:center;color:var(--muted);padding:18px 0 40px;font-size:.85rem}.sentinel:not(:empty):not(.top){background:var(--panel);border-radius:12px;margin:18px auto 40px;padding:6px 14px;display:table}.sentinel:empty{padding:0}.sentinel.top{height:1px;padding:0}.section+.section{margin-top:8px}.size-icon{background:radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--c) 55%, #fff) 0%, var(--c) 55%, color-mix(in srgb, var(--c) 70%, #000) 100%);border-radius:10px;flex:none;width:40px;height:40px;display:inline-flex;box-shadow:inset 0 0 0 1px #ffffff40}.size-icon svg{filter:drop-shadow(0 1px 1px #00000040);width:100%;height:100%}.tile{flex-direction:column;align-items:stretch;gap:5px;display:flex}@media (hover:hover){.tile:hover{transform:translateY(-2px)}}.tile .frame{aspect-ratio:1;background:var(--img-tile,var(--panel-solid)) center / 100% 100% no-repeat;border-radius:16px;place-items:center;padding:19%;display:grid}.tile.color .frame{background-image:var(--img-tile-color,none);padding:21%}.screen.mode-picross,.screen.mode-large{--mode-ring:#2a9be0}.screen.mode-mega{--mode-ring:#e0303c}.screen.mode-clip{--mode-ring:#f5c400}.screen.mode-timeattack{--mode-ring:#ff8a1c}.screen.mode-tutorial{--mode-ring:#b7b7bf}.tile:not(.color):not(.cleared):not(.tagged) .frame:before{content:"";border:max(2px, 2.6cqw) solid var(--mode-ring,transparent);pointer-events:none;border-radius:14%;position:absolute;inset:17.5%}.tile .frame{container-type:inline-size}.tile .frame img,.tile .frame canvas{object-fit:contain;width:100%;height:100%}.tile .frame .sprite{background-color:#f4f1e6;border-radius:3px}.tile .num{color:#b8b8c0;font-size:1.15rem;font-weight:800}.tile.cleared .frame{box-shadow:inset 0 0 0 3px var(--accent)}.tile.tagged .frame{box-shadow:inset 0 0 0 3px var(--game)}.tile.tagged.cleared .frame{box-shadow:inset 0 0 0 3px var(--game), 0 0 0 2px var(--accent)}.tile .cap{background:var(--panel);border-radius:8px;flex-wrap:wrap;justify-content:center;align-items:baseline;column-gap:6px;padding:3px 6px;font-size:.75rem;line-height:1.3;display:flex}.tile .cap .label{white-space:nowrap;text-overflow:ellipsis;font-weight:800;overflow:hidden}.tile.tagged .cap .label{color:var(--game)}.tile .cap .stat{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.pixel{image-rendering:pixelated}.sprite{background-repeat:no-repeat;display:block}.panel-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:16px}.panel-card h2{margin:0 0 8px;font-size:1.05rem}.panel-card p{color:var(--muted);margin:0 0 10px}.setting{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:12px 0;display:flex}.setting:last-child{border-bottom:0}.setting>span{flex-direction:column;flex:1;display:flex}.setting small{color:var(--muted);font-weight:600}.setting input[type=checkbox]{order:2}.setting input[type=range]{accent-color:var(--accent);width:45%}.setting select{text-overflow:ellipsis;min-width:0;font:inherit;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:10px;max-width:55%;padding:8px}.row{flex-wrap:wrap;gap:8px;margin:10px 0 0;display:flex}.row.center{justify-content:center}.help dt{margin-top:8px;font-weight:800}.help dd{color:var(--muted);margin:2px 0 0}.send{grid-template-columns:auto 1fr;align-items:start;gap:16px;display:grid}.stack{flex-direction:column;gap:6px;display:flex}.stack small{color:var(--muted)}.qr{background:#fff;border-radius:12px;width:220px;height:220px;padding:4px}.qr svg{width:100%;height:100%;display:block}.qr-label{text-align:center;color:var(--muted);max-width:220px;margin:6px 0 0;font-size:.8rem}textarea.code{resize:vertical;width:100%;color:var(--text);border:1px solid var(--border);word-break:break-all;background:#1c1c20;border-radius:10px;padding:10px;font:.75rem ui-monospace,Menlo,monospace}.status{background:var(--panel-solid);color:var(--text);border-left:4px solid;border-radius:12px;margin:0;padding:10px 14px;font-weight:700;box-shadow:0 2px 10px #00000059}.status.ok{border-color:var(--accent)}.status.err{border-color:var(--danger)}video.scan{border-radius:12px;width:100%;max-width:360px;margin-top:10px}.play-main{min-height:0;padding:12px var(--gutter-r) max(12px, env(safe-area-inset-bottom)) var(--gutter-l);flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:clamp(190px,14vw,250px) minmax(0,1600px) clamp(128px,8vw,160px);justify-content:center;gap:12px;display:grid}.info,.controls{background:var(--panel);border-radius:var(--radius);flex-direction:column;align-self:start;gap:12px;padding:14px;display:flex}.info{text-align:center;padding-top:calc(14px + env(safe-area-inset-top));align-items:center}.info-actions{justify-content:space-between;width:100%;display:flex}.preview-box{aspect-ratio:1;background:#fff;border-radius:16px;place-items:center;width:100%;padding:12%;display:grid;box-shadow:inset 0 0 0 3px #d9d9d4}.preview{width:100%;max-width:100%;height:auto;max-height:100%}.info-text{flex-direction:column;display:flex}.info-text strong,.info-title{margin:0;font-size:1.05rem;font-weight:800;line-height:1.25}.info-text small{color:var(--muted)}.timer{font-variant-numeric:tabular-nums;--dh:28px;align-items:center;gap:1px;height:30px;font-size:1.6rem;font-weight:800;display:inline-flex}.timer .dslot{height:var(--dh);aspect-ratio:28/37;flex:none;justify-content:center;align-items:center;display:inline-flex}.timer .dslot.colon{aspect-ratio:12/37;margin:0 1px}.timer .dslot img{max-width:100%;max-height:100%}.timer .dslot.colon img{max-height:72%}.timer.low .dslot img{filter:brightness(.75)sepia()hue-rotate(-50deg)saturate(6)}.timer.low{color:var(--danger)}.mistakes{color:var(--danger);font-variant-numeric:tabular-nums;align-items:center;gap:6px;font-weight:800;display:inline-flex}.mistakes img{width:26px;height:26px}.board-wrap{background:var(--board-bg);border-radius:var(--radius);min-width:0;min-height:0;padding:8px;display:flex;position:relative;box-shadow:0 6px 24px #00000059}.board{touch-action:none;border-radius:10px;outline:none;width:100%;height:100%;display:block}.board:focus-visible{outline:none}.board-fx{pointer-events:none;position:absolute}.side-btns{flex-direction:column;align-items:center;gap:8px;display:flex}.hint-card{left:50%;top:calc(env(safe-area-inset-top) + 84px);background:var(--panel-solid);border:1px solid var(--border);text-align:center;z-index:9;border-radius:16px;width:min(320px,100% - 32px);max-height:calc(100% - 100px);padding:14px;position:fixed;overflow:auto;transform:translate(-50%);box-shadow:0 8px 30px #00000080}.hint-card p{margin:0 0 6px;font-size:.9rem}.controls{align-items:stretch}.tools{flex-direction:column;align-items:center;gap:10px;display:flex}.tools.small{flex-flow:wrap;justify-content:center;gap:8px}.tool-btn{color:var(--text);font:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:5px;padding:0;display:flex}.tool-btn small{color:var(--muted);font-size:.72rem;font-weight:800}html[data-pointer] .tool-btn.active small,.editor .tool-btn.active small{color:var(--text)}.round{color:#fff;width:64px;height:64px;font:inherit;cursor:pointer;background:#3a3a40;border:3px solid #ffffffd9;border-radius:30%;justify-content:center;align-items:center;display:inline-flex}button.round.small{border-width:2px;width:44px;height:44px}@media (hover:hover){.round:hover:not(:disabled),.tool-btn:hover .round{background:#46464d}}.round:disabled{opacity:.35;cursor:default}html[data-pointer] .tool-btn.active .round,.editor .tool-btn.active .round{box-shadow:0 0 0 4px var(--cursor,var(--accent)), 0 0 14px color-mix(in srgb, var(--cursor,var(--accent)) 55%, transparent);background:#2c2c31;border-color:#0000}.tool-btn.using .round{background:color-mix(in srgb, var(--cursor,var(--accent)) 35%, #2c2c31);box-shadow:0 0 0 3px color-mix(in srgb, var(--cursor,var(--accent)) 70%, transparent);transform:scale(.92)}.tool-btn.using small{color:var(--text)}.tool-icon{object-fit:contain;justify-content:center;align-items:center;width:28px;height:28px;display:inline-flex}.round.small .tool-icon{width:22px;height:22px}.tool-icon svg{width:100%;height:100%}.tool-icon.glyph{font-size:1.3rem;font-weight:800;line-height:1}.tool-btn.tool-fill .tool-icon{background:var(--fill,#2b2f3a);border-radius:5px;width:24px;height:24px;box-shadow:0 0 0 2px #fff}.palette{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.palette .color{background:var(--c);cursor:pointer;border:0;border-radius:10px;height:44px;position:relative;box-shadow:inset 0 0 0 1px #00000040}.palette .color[aria-checked=true]{box-shadow:0 0 0 2px #111,0 0 0 4px #fff}.palette .color .key{color:#fff;text-shadow:0 0 2px #000;font-size:.62rem;font-weight:800;position:absolute;top:2px;left:5px}@media (hover:none){.palette .color .key{display:none}}details.help summary{cursor:pointer;padding:6px 0}.setting output{text-align:right;min-width:3.2em;color:var(--muted);font-variant-numeric:tabular-nums}.overlay{-webkit-backdrop-filter:blur(10px);padding:var(--gutter);z-index:10;background:#141418d1;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dialog{background:var(--panel-solid);border:1px solid var(--border);border-radius:var(--radius);text-align:center;flex-direction:column;gap:10px;min-width:min(320px,100%);max-width:420px;padding:24px;display:flex;box-shadow:0 10px 40px #00000080}.dialog h2{margin:0}.dialog p{color:var(--muted);margin:0}.dialog .title{color:var(--text);font-size:1.15rem;font-weight:800}.dialog .clear-art{background-color:#fff;border-radius:10px;align-self:center;width:min(240px,60vw)!important}.clear h2{background:var(--accent-grad);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:2.2rem}.shake .board-wrap{animation:.25s shake}@keyframes shake{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.clip-layout{grid-template-columns:220px minmax(0,720px);justify-content:center;align-items:start;gap:14px;display:grid}.clip-info{flex-direction:column;gap:8px;padding:12px;display:flex}.clip-thumb{aspect-ratio:1;background:#2c2c33;border-radius:12px;place-items:center;padding:14%;display:grid}.clip-thumb>span{color:#e9e9ee;font-size:2.4rem;font-weight:900}.clip-thumb canvas{object-fit:contain;width:100%;height:100%;image-rendering:pixelated;background:#f4f1e6;border-radius:4px}.clip-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;padding:2px 0 4px;display:flex}.clip-label{letter-spacing:.06em;text-transform:uppercase;color:var(--text);background:#3d3d45;border-radius:6px 0;padding:2px 8px;font-size:.68rem;font-weight:900}.clip-row strong{font-variant-numeric:tabular-nums}.clip-dots{flex-wrap:wrap;align-items:center;gap:8px;padding:4px}.clip-dots span{background:#6a6a72;border-radius:50%;flex:none;width:8px;height:8px}.clip-dots span.done{background:var(--accent)}.clip-dots span.at{outline:2px solid var(--cursor);outline-offset:2px}.clip-frame{background:#26262c;border-radius:16px;padding:8px;box-shadow:0 6px 24px #00000059}@media (orientation:landscape) and (width>=761px){.clip-frame{justify-self:center;width:100%;max-width:calc(100dvh - 116px)}}.clip-wrap{background:#f4f1e6c7;border-radius:8px;position:relative;overflow:hidden}.clip-picture{height:auto;display:block;width:100%!important}.clip-wrap.complete .clip-picture{background-color:#f4f1e6}.clip-pieces{position:absolute;inset:0}.piece{padding:2px;display:flex;position:absolute;container-type:size}.piece>span{color:#f2f2f5;width:100%;height:100%;transition:transform .15s var(--ease), box-shadow .15s ease;background:linear-gradient(160deg,#3c3c44,#2a2a30);border-radius:max(4px,8cqmin);place-items:center;font-size:clamp(.6rem,38cqmin,1.5rem);font-weight:900;display:grid;box-shadow:0 1px 3px #00000059}.piece:hover>span,.piece:focus-visible>span{box-shadow:0 0 0 2.5px var(--cursor), 0 1px 3px #00000059;outline:none}.piece:focus-visible{outline:none}.piece.done{border-radius:4px;box-shadow:inset 0 0 0 1px #26262cd9}.piece:after{pointer-events:none;opacity:0;border-radius:6px}.piece:focus-visible:after,.piece:hover:after{opacity:1;box-shadow:0 0 0 3px var(--cursor), 0 0 12px #50e6c899;animation:piece-arrive .4s var(--ease) both, piece-pulse 1s ease-in-out .4s infinite}@keyframes piece-arrive{0%{inset:-2px}42%{inset:-8px}to{inset:-2px}}@keyframes piece-pulse{50%{box-shadow:0 0 0 3px #3fd4c0,0 0 16px #50e6c8d9}}.calm .piece:after{animation:none!important}.clip-wrap.whole .clip-pieces{opacity:0;pointer-events:none}.clip-pieces{transition:opacity .25s}.clip-bar-btns{gap:6px;margin-left:auto;display:flex}.clip-dots{grid-template-columns:repeat(10,8px);justify-content:start;display:grid}.piece.done:hover,.piece.done:focus-visible{box-shadow:inset 0 0 0 2.5px var(--cursor)}.clip-wrap.complete{animation:dialog-in .5s var(--ease-back) backwards}.clip-shade{pointer-events:none;background:#000000a1;position:absolute;inset:0}.clip-fly{z-index:2;pointer-events:none;position:absolute;overflow:hidden;box-shadow:0 6px 18px #00000073}.clip-flash{pointer-events:none;background:#5ae1ff73;border-radius:4px;position:absolute;inset:0;box-shadow:0 0 0 2px #96f0ffe6}.clip-frame{position:relative}.clip-ring{aspect-ratio:1;pointer-events:none;z-index:3;border:6px solid #bef5ffe6;border-radius:50%;width:60%;position:absolute;transform:translate(-50%,-50%)scale(0);box-shadow:0 0 24px #96ebffcc}.clip-charge{aspect-ratio:1;pointer-events:none;z-index:3;opacity:0;background:radial-gradient(closest-side,#fffffff2,#aaf0ff99 45%,#0000);border-radius:50%;width:45%;position:absolute;transform:translate(-50%,-50%)}.clip-out{pointer-events:none;z-index:3;background:#fff;position:absolute;inset:0}.piece.done{transition:box-shadow .25s}.piece.done.unframed,.clip-wrap.seamless .piece.done{box-shadow:none}.piece.done.unframed:hover,.piece.done.unframed:focus-visible{box-shadow:inset 0 0 0 2.5px var(--cursor)}@media (width<=760px),(orientation:portrait){.clip-layout{grid-template-columns:minmax(0,1fr)}.clip-info{grid-template-columns:64px minmax(0,1fr) minmax(0,1fr);grid-auto-rows:auto;align-items:center;column-gap:10px;display:grid}.clip-thumb{grid-row:span 3;padding:10%}.clip-thumb>span{font-size:1.4rem}.clip-dots{grid-column:1/-1}}.error,.not-found{padding:var(--gutter);gap:8px}@media (width<=760px),(orientation:portrait){.play-main{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);gap:8px;padding:8px}.info{text-align:left;flex-direction:row;align-self:stretch;gap:10px;padding:8px 10px}.info-actions{display:contents}.info-actions .btn:first-child{order:-1}.info-actions .btn:last-child{order:10}.info-actions .btn:only-child{order:-1}.info .timer{--dh:22px;height:24px}.preview-box{border-radius:10px;width:52px;padding:6px;box-shadow:inset 0 0 0 2px #d9d9d4}.info-text{flex:1;align-items:flex-start;min-width:0}.info-text strong,.info-title,.info-text small{white-space:nowrap;text-overflow:ellipsis;max-width:100%;overflow:hidden}.controls{flex-flow:wrap;justify-content:center;align-self:stretch;align-items:center;gap:10px;padding:8px 10px}.tools{flex-direction:row;gap:12px}.tools.small{flex-wrap:nowrap}.side-btns{flex-direction:row;gap:10px}.round{width:54px;height:54px}.palette{flex:100%;grid-template-columns:repeat(auto-fit,minmax(36px,1fr))}.tiles{grid-template-columns:repeat(auto-fill,minmax(84px,1fr))}.tab-icon{width:34px;height:34px}.view-toggle button{padding:7px 9px}.send{grid-template-columns:1fr;justify-items:center}.play-main{padding-top:calc(8px + env(safe-area-inset-top))}.info{padding-top:8px}}@media (width<=480px){.side-btns{flex-direction:column;gap:6px}.tools.small{gap:6px}.controls button.round.small{width:40px;height:40px}}@media (width<=360px){.preview-box,.tool-btn small{display:none}.round{width:50px;height:50px}}@media (orientation:landscape) and (height<=500px){.play-main{padding-top:6px;padding-bottom:max(6px, env(safe-area-inset-bottom));grid-template-columns:150px minmax(0,1fr) 124px;gap:8px}.info,.controls{gap:8px;max-height:100%;padding:8px;overflow-y:auto}.preview-box{width:88px;padding:8px}.tools{grid-template-columns:repeat(2,48px);justify-content:center;gap:8px;display:grid}.round{width:48px;height:48px}.tool-btn small{display:none}.palette{grid-template-columns:repeat(3,1fr)}.play-main{grid-template-rows:minmax(0,1fr)}.info{flex-direction:column;align-self:start;align-items:stretch}.info-actions{display:flex}.info-text small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.controls{flex-flow:column;justify-content:flex-start;align-self:start}.side-btns{flex-flow:wrap;justify-content:center}}@media (width<=560px){.mode-btn{width:min(124px,28vw)}.mode-text strong{font-size:.78rem}}.scroll::-webkit-scrollbar{width:8px;height:8px}.scroll::-webkit-scrollbar-track{background:0 0}.scroll::-webkit-scrollbar-thumb{background:#ffffff47 padding-box padding-box;border:2px solid #0000;border-radius:8px}:root{--ease:cubic-bezier(.2, .8, .2, 1);--ease-back:cubic-bezier(.3, 1.4, .5, 1)}.bar:not(.home-bar){view-transition-name:bar}::view-transition-group(root){animation-duration:.28s;animation-timing-function:var(--ease)}::view-transition-old(root){animation:.18s var(--ease) both vt-out}::view-transition-new(root){animation:.28s var(--ease) both vt-in}[data-nav=back]::view-transition-old(root){animation-name:vt-out-back}[data-nav=back]::view-transition-new(root){animation-name:vt-in-back}[data-nav=same]::view-transition-old(root){animation-name:vt-fade-out}[data-nav=same]::view-transition-new(root){animation-name:vt-fade-in}[data-nav=card]::view-transition-old(root){animation:.22s both vt-fade-out}[data-nav=card]::view-transition-new(root){animation:.22s both vt-fade-in}[data-nav=card]::view-transition-group(puzzle){animation-duration:.32s}[data-nav=fade]::view-transition{background:#000}[data-nav=fade]::view-transition-group(*){animation-duration:1s}[data-nav=fade]::view-transition-old(*){animation:.5s linear both vt-fade-out}[data-nav=fade]::view-transition-new(*){animation:.5s linear .5s both vt-fade-in}::view-transition-group(bar){animation-duration:.28s;animation-timing-function:var(--ease)}::view-transition-group(puzzle){animation-duration:.34s;animation-timing-function:var(--ease);z-index:4}::view-transition-old(puzzle){object-fit:cover;height:100%;animation-duration:.34s}::view-transition-new(puzzle){object-fit:cover;height:100%;animation-duration:.34s}@keyframes vt-in{0%{opacity:0;transform:translate(28px)}}@keyframes vt-out{to{opacity:0;transform:translate(-18px)}}@keyframes vt-in-back{0%{opacity:0;transform:translate(-28px)}}@keyframes vt-out-back{to{opacity:0;transform:translate(18px)}}@keyframes vt-fade-in{0%{opacity:0}}@keyframes vt-fade-out{to{opacity:0}}@media (prefers-reduced-motion:reduce){::view-transition-group(*){animation:none!important}::view-transition-old(*){animation:none!important}::view-transition-new(*){animation:none!important}}.btn,.tool-btn,.round,.palette .color,.tab,.view-toggle button,.mode-btn,.tile{transition:transform .14s var(--ease), background-color .18s ease, box-shadow .18s ease, filter .14s ease, opacity .18s ease}.btn:active,.tool-btn:active,.round:active,.palette .color:active,.tab:active,.view-toggle button:active{transform:scale(.95)}.mode-btn:active,.tile:active{transform:scale(.97)}.mode-btn{animation:mode-in .42s var(--ease-back) backwards;animation-delay:calc(var(--i,0) * 40ms)}.mode-fill{animation:fill-rise .7s var(--ease) backwards;animation-delay:calc(var(--i,0) * 40ms + .15s);transform-origin:50% 100%}.home-foot,.home-logo{animation:rise-in .4s var(--ease) backwards}.home-foot{animation-delay:.2s}@keyframes mode-in{0%{opacity:0;transform:scale(.82)rotate(-6deg)}}@keyframes fill-rise{0%{transform:scaleY(0)}}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}}.tile{animation:rise-in .3s var(--ease) backwards}.progress .seg,.tab-progress .seg{transition:flex-basis .5s var(--ease), width .5s var(--ease)}.overlay:not([hidden]){animation:.18s backwards vt-fade-in}.overlay:not([hidden]) .dialog{animation:dialog-in .3s var(--ease-back) backwards}.overlay.closing{animation:.16s forwards vt-fade-out}.overlay.closing .dialog{animation:.16s forwards dialog-out}@keyframes dialog-in{0%{opacity:0;transform:translateY(12px)scale(.94)}}@keyframes dialog-out{to{opacity:0;transform:scale(.97)}}.board-wrap>*{transition:opacity .2s}.hint-card{animation:rise-in .35s var(--ease) backwards}.star{color:#ffd24a;text-shadow:0 1px #00000059}.tile .frame{position:relative}.star-badge{color:#5a3a00;pointer-events:none;background:radial-gradient(circle at 35% 30%,#fff2a8,#ffc928 60%,#e09a00);border-radius:50%;place-items:center;width:22px;height:22px;font-size:13px;line-height:1;display:grid;position:absolute;top:-6px;right:-6px;box-shadow:0 1px 3px #0006}.assists{text-align:left;background:#ffffff0d;border-radius:14px;flex-direction:column;gap:2px;padding:6px 12px;display:flex}.bar-toggle{align-self:stretch;margin-left:auto}.bar-toggle button{min-height:40px;padding:6px 12px;font-size:.8rem}.bar .bar-toggle+.btn{margin-left:4px}@media (width<=520px){.bar-toggle{--compact:1}.bar-toggle button:not(.active){display:none}.bar-toggle button.active:after{content:" ⇄";opacity:.7}}.bar h1{min-width:3.5em}@media (width<=380px){.bar{gap:6px;padding-left:6px;padding-right:6px}.bar h1{font-size:1rem}.bar .btn.icon{width:38px;height:38px}.bar-toggle{padding:2px}.bar-toggle button{min-height:0;padding:5px 8px;font-size:.7rem}.bar-toggle button.active:after{content:none}}.dialog{max-height:calc(100dvh - 2 * var(--gutter) - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain;overflow-y:auto}@media (height<=520px){.dialog{gap:7px;padding:14px 18px}.dialog h2{font-size:1.15rem}.dialog .btn{min-height:38px;padding-top:6px;padding-bottom:6px}.dialog .clear-art{width:min(150px,30vh)!important}}@media (height<=520px) and (width>=560px){.dialog[aria-label=Pause]{grid-template-columns:1fr 1fr;align-items:start;column-gap:12px;max-width:560px;display:grid}.dialog[aria-label=Pause]>h2,.dialog[aria-label=Pause]>.pause-player,.dialog[aria-label=Pause]>.pause-song{grid-column:1/-1}}@media (width<=330px){.info-text small{display:none}.info .timer{--dh:18px;height:20px}.info-actions .btn.icon{width:36px;height:36px}}.toast .toast-later{background:0 0;width:36px;min-height:36px}.toast-text{flex-direction:column;gap:2px;min-width:0;display:flex}.toast-text small{color:var(--muted);font-size:.8rem;font-weight:600}.toast{z-index:20;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));background:var(--panel-solid);border:1px solid var(--border);width:max-content;max-width:calc(100vw - 2 * var(--gutter));animation:rise-in .35s var(--ease) backwards;border-radius:16px;align-items:center;gap:12px;padding:10px 10px 10px 16px;font-size:.9rem;font-weight:700;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 30px #00000080}.board-wrap.with-lesson{flex-direction:column;gap:8px}.with-lesson .board{flex:1 1 0;height:auto;min-height:0}.lesson-card{background:var(--panel-solid);border:1px solid var(--border);animation:rise-in .3s var(--ease) backwards;border-radius:14px;flex-direction:column;flex:none;gap:8px;padding:12px 14px;display:flex;box-shadow:0 4px 16px #00000059}.lesson-top{align-items:center;gap:10px;font-size:.8rem;display:flex}.lesson-top strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--accent);flex:1;overflow:hidden}.lesson-count{color:var(--muted);font-variant-numeric:tabular-nums}.lesson-skip{min-height:30px;padding:4px 12px;font-size:.78rem}.lesson-text{min-height:3em;margin:0;font-size:1.05rem;line-height:1.5}.lesson-bar{background:#ffffff1a;border-radius:3px;height:4px;display:block;overflow:hidden}.lesson-bar>span{border-radius:inherit;background:var(--accent-grad);height:100%;transition:width .3s var(--ease);display:block}.lesson-card{box-sizing:border-box;align-self:flex-start;max-width:100%}.play.lesson .controls.attached{overflow-y:auto}.play.lesson .controls .preview-box{display:none}.cc-step{font-weight:800;font-size:calc(13px * var(--s));color:var(--accent);letter-spacing:.04em}.lesson-actions{justify-content:flex-end;align-items:center;gap:10px;display:flex}.lesson-hint{color:#ffd54a;flex:1;font-size:.85rem;font-weight:800}.lesson-next{min-width:110px}.lesson-card.waiting{border-color:#ffd54a99}.play.lesson .timer,.play.lesson .mistakes{visibility:hidden}@media (width<=760px),(height<=520px){.lesson-card{gap:6px;padding:9px 11px}.lesson-text{min-height:2.6em;font-size:.9rem}}.filter-btn{min-height:36px;font-size:.8rem}.filter-btn.active{background:var(--accent-grad);color:var(--accent-text)}.pad :focus{outline-color:var(--menu-cursor);outline-offset:3px;box-shadow:var(--cursor-ring);outline-width:3px!important;outline-style:solid!important}.pad canvas:focus{box-shadow:none}.pad .mode-btn:focus{filter:drop-shadow(0 0 8px var(--accent)) brightness(1.15);outline:none!important}.record-totals{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px;display:grid}.stat-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);text-align:center;padding:14px 10px}.stat-card strong{font-variant-numeric:tabular-nums;font-size:clamp(1.1rem,4.5vw,1.5rem);display:block}.stat-card small{color:var(--muted);font-size:.75rem;font-weight:700}.record-legend{color:var(--muted);align-items:center;gap:6px;margin:0 0 4px;font-size:.75rem;font-weight:700;display:flex}.record-legend .swatch{background:var(--accent);border-radius:4px;width:18px;height:8px;display:inline-block}.record-legend .swatch.light{opacity:.45;margin-left:8px}.record-list{flex-direction:column;display:flex}.record-row{border-bottom:1px solid var(--border);align-items:flex-start;gap:12px;padding:10px 0;display:flex}.record-row:last-child{border-bottom:0}.record-row .tab-icon{border-radius:10px;width:40px;height:40px}.record-main{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.record-name{justify-content:space-between;align-items:baseline;gap:10px;font-size:.9rem;display:flex}.record-name strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.record-name>span{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;font-size:.8rem}.record-stars{color:#ffd24a}.record-modes{flex-wrap:wrap;gap:5px;display:flex}.chip{color:var(--muted);background:#ffffff0f;border-radius:7px;padding:3px 8px;font-size:.74rem;font-weight:700}.chip b{color:var(--text);font-variant-numeric:tabular-nums}.chip.complete{color:var(--text);background:color-mix(in srgb, var(--accent) 14%, transparent)}.brand-wrap{max-width:100%;display:inline-block;position:relative}.brand-wrap>img.brand{display:block}.brand-plus{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.brand-plus .sq{transform-box:fill-box;transform-origin:50%;animation:plus-pop .45s var(--ease-back) backwards;animation-delay:calc(var(--i) * 35ms + .15s)}@keyframes plus-pop{0%{opacity:0;transform:scale(.2)rotate(-20deg)}}.seg.helped,.fill-band.all{opacity:.45}.fill-band.stars{z-index:0}.done-badge{pointer-events:none;border-radius:50%;place-items:center;width:18px;height:18px;font-size:11px;font-weight:900;line-height:1;display:grid;position:absolute;box-shadow:0 1px 3px #00000073}.done-badge.check{background:var(--accent-grad);color:var(--accent-text)}.done-badge.star{color:#5a3a00;background:radial-gradient(circle at 35% 30%,#fff2a8,#ffc928 60%,#e09a00)}.tab-icon-wrap{flex:none;display:inline-flex;position:relative}.tab-icon-wrap .done-badge{top:-6px;right:-6px}.mode-btn .done-badge{z-index:3;width:24px;height:24px;font-size:14px;top:14%;right:14%}.credit-intro p{margin:0}.credit-list{flex-direction:column;gap:10px;margin-top:12px;display:flex}.credit-game{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}.credit-head{align-items:center;gap:12px;display:flex}.credit-head h2{margin:0;font-size:1rem}.credit-head p{color:var(--muted);margin:2px 0 0;font-size:.8rem;font-weight:700}.credit-roles{margin-top:8px}.credit-roles summary{cursor:pointer;color:var(--accent);font-size:.85rem;font-weight:800}.credit-roles dl{columns:2 240px;column-gap:24px;margin:6px 0 0;font-size:.82rem}.credit-roles dt{color:var(--muted);text-transform:uppercase;letter-spacing:.03em;break-after:avoid;font-size:.72rem;font-weight:700}.credit-roles dd{margin:0}.credit-role{break-inside:avoid;padding-bottom:8px}.backdrop.pixel{image-rendering:pixelated}.credit-notice{color:var(--muted);white-space:pre-line;margin:8px 0 0;font-size:.72rem}.credit-source{color:var(--muted);margin:6px 0 0;font-size:.72rem}.credit-source a{color:inherit}.setting-link{color:inherit;text-decoration:none}.setting-link .chev{color:var(--muted);flex:none;font-size:1.6rem;line-height:1}@media (width<=480px){.setting:has(>select){flex-wrap:wrap}.setting>select{flex:100%;width:100%;min-width:0;max-width:none}}.setting-link:hover .chev,.setting-link:focus-visible .chev{color:var(--accent)}.card-head{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.card-head h2{margin:0}.btn.small{min-height:36px;padding:0 12px;font-size:.85rem}.controls-note{color:var(--muted);margin:4px 0 8px;font-size:.78rem}.controls-note:empty{display:none}.bind-list{gap:14px;display:grid}.bind-group h3{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 4px;font-size:.72rem}.bind-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:12px;padding:6px 0;display:flex}.bind-row:last-child{border-bottom:0}.bind-label{font-weight:700}.bind-keys{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.bind-chip{background:var(--panel-2);border:1px solid var(--border);border-radius:8px;align-items:stretch;display:inline-flex;overflow:hidden}.bind-key,.bind-x,.bind-add{font:inherit;color:var(--text);cursor:pointer;background:0 0;border:0}.bind-key{min-width:2.4em;padding:5px 9px;font-size:.85rem;font-weight:800}.bind-key.empty{color:var(--muted)}.bind-key.listening{color:var(--accent-text);background:var(--accent);animation:1s ease-in-out infinite alternate pulse}.bind-x{color:var(--muted);border-left:1px solid var(--border);padding:0 8px}.bind-x:hover,.bind-x:focus-visible{color:var(--danger)}.bind-add{border:1px dashed var(--border);width:2.1em;color:var(--muted);border-radius:8px;font-weight:800}.bind-add:hover,.bind-add:focus-visible,.bind-key:hover{color:var(--accent)}.bind-add.listening{border-style:solid;width:auto;padding:5px 9px}@keyframes pulse{to{opacity:.65}}.edit-title{font:inherit;color:var(--text);flex:1;font-size:1.05rem;font-weight:800}.edit-title:focus{outline:2px solid var(--accent);outline-offset:-2px}.edit-info{text-align:left;align-items:stretch}.edit-field{flex-direction:column;gap:4px;display:flex}.edit-label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;font-weight:800}.edit-field select,.edit-size select{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:10px;min-width:0;padding:7px 8px}.edit-size{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;flex-direction:column;font-size:.72rem;font-weight:800}.edit-layers{align-self:stretch}.edit-layers button{flex:1}.edit-status{font:inherit;text-align:left;color:#fff;background:#3a3a42;border:0;border-radius:999px;align-self:stretch;align-items:center;gap:8px;padding:5px 10px 5px 5px;font-size:.85rem;font-weight:800;display:flex;box-shadow:inset 0 0 0 1.5px #ffffff2e}.edit-status[hidden]{display:none}.edit-status:disabled{cursor:default}.edit-status-icon{color:#3a3a42;background:#ffffffeb;border-radius:50%;flex:none;place-items:center;width:22px;height:22px;font-size:.8rem;font-weight:900;display:grid}.edit-status.unique{color:#06281e;box-shadow:none;background:linear-gradient(#2ccf9a,#19b383)}.edit-status.unique .edit-status-icon{color:#19b383}.edit-status.multiple,.edit-status.multiple-piece,.edit-status.rules{color:#3a2400;box-shadow:none;background:#ffb22e}.edit-status.multiple .edit-status-icon,.edit-status.multiple-piece .edit-status-icon,.edit-status.rules .edit-status-icon{color:#c47b00}.edit-status.multiple{cursor:pointer}.edit-status.multiple:hover{filter:brightness(1.06)}.edit-status.none,.edit-status.slow{color:#fff;box-shadow:none;background:#e8484d}.edit-status.none .edit-status-icon,.edit-status.slow .edit-status-icon{color:#e8484d}.edit-status.checking .edit-status-icon{animation:.8s ease-in-out infinite alternate pulse}.edit-msg{min-height:1.2em;color:var(--muted);margin:0;font-size:.85rem}.edit-tools .tools{grid-template-columns:repeat(2,auto);justify-content:center;display:grid}.edit-tools .tools.small{flex-wrap:wrap;justify-content:center;display:flex}.edit-tools .tools.small.edit-move{grid-template-columns:repeat(3,auto);justify-content:center;display:grid}.edit-move>:first-child{grid-area:2/1}.edit-move>:nth-child(2){grid-area:1/2}.edit-move>:nth-child(3){grid-area:2/2}.edit-move>:nth-child(4){grid-area:2/3}.edit-actions,.edit-picture{flex-direction:column;gap:8px;display:flex}.edit-picture .row{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.edit-palette{grid-template-columns:repeat(4,1fr);gap:5px;display:grid}.swatch{aspect-ratio:1;background:var(--c);cursor:pointer;border:2px solid #ffffff26;border-radius:8px;min-width:26px;padding:0}.swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.swatch.custom{background:var(--panel-2);color:var(--muted);place-items:center;font-weight:900;display:grid;position:relative}.swatch.custom input{opacity:0;cursor:pointer;position:absolute;inset:0}.editor-board{cursor:crosshair}@media (width<=760px),(orientation:portrait){.edit-bar{margin:8px 8px 0}.edit-info{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px;display:grid}.edit-info .edit-mode{display:none}.edit-info .edit-sizes,.edit-info .edit-layers{grid-column:span 1}.edit-info .edit-status,.edit-info>label.edit-field,.edit-info .edit-msg{grid-column:1/-1}.edit-info>label.edit-field{flex-direction:row;align-items:center;gap:8px}.edit-info .edit-msg:empty{display:none}.edit-tools{flex-direction:column;gap:8px;padding:8px}.edit-tools .tools{grid-template-columns:repeat(5,auto)}.edit-actions{flex-flow:wrap;justify-content:center;gap:6px}.edit-tools .round.small{width:34px;height:34px}.edit-tools .tool-btn small,.edit-tools .tool-btn.off{display:none}.edit-palette{grid-template-columns:repeat(9,1fr);gap:4px}.edit-palette .swatch{min-width:0}.edit-info .edit-layers:has(>button:nth-child(3)){grid-column:1/-1}.edit-layers button{min-width:0;padding-inline:8px}}.edit-swap{align-items:start}.edit-actions,.edit-picture{align-content:start}.new-tile .frame{aspect-ratio:1;background:#ffffff0a;border:2px dashed #ffffff40;border-radius:14px;place-items:center;display:grid}.new-plus{color:var(--muted);font-size:2.4rem;font-weight:300;line-height:1}.new-tile:hover .new-plus,.new-tile:focus-visible .new-plus{color:var(--accent)}.edit-tools .round{width:46px;height:46px}.edit-tools .round.small{width:38px;height:38px}.edit-tools .tools{gap:6px}.games-list,.pack-puzzles{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.game-row,.pack-puzzle{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:8px 0;display:flex}.game-row:last-child,.pack-puzzle:last-child{border-bottom:0}.game-row.off>:not(.game-actions){opacity:.4}.game-row .tab-icon{border-radius:10px;flex:none;width:40px;height:40px}.game-name{flex-direction:column;flex:1;min-width:0;display:flex}.game-name strong{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.game-name small{color:var(--muted);font-size:.75rem}.game-actions{flex:none;align-items:center;gap:6px;display:flex}.btn.icon.small{width:34px;height:34px;min-height:0;padding:0;font-size:1rem}.btn.danger{color:#ffb3b5;border-color:#ff5a5f80}.card-head .row,.pack-save .row,.panel-card>.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.text-input{font:inherit;color:var(--text);background:var(--panel-2);border:1px solid var(--border);border-radius:10px;width:min(240px,50%);min-width:0;padding:8px 10px}.text-input:disabled{opacity:.6}.color-presets{grid-template-columns:repeat(7,28px);gap:6px;display:grid}.color-presets .swatch{width:28px;min-width:0}.media-row{align-items:flex-start}.media-pick{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:6px;width:min(100%,340px);display:grid}.media-pick>.media-box{grid-column:1/-1}.media-box{justify-content:flex-end;display:flex}.media-preview{object-fit:contain;border-radius:8px;max-width:160px;max-height:72px;display:block}.media-preview.media-icon{width:48px;height:48px}.media-preview.media-bg{max-height:60px}.media-none{color:var(--muted);font-size:.8rem}.media-box audio{width:200px;max-width:100%;height:34px}.pack-thumb{background:#f4f1e6;border-radius:8px;flex:none;place-items:center;width:44px;height:44px;padding:4px;display:grid}.pack-thumb canvas{max-width:100%;max-height:100%;image-rendering:pixelated}.pack-empty{color:var(--muted);padding:8px 0}.pack-save{flex-direction:column;gap:8px;display:flex}@media (width<=520px){.media-row{flex-wrap:wrap}.media-pick{align-items:stretch;width:100%;max-width:none}.color-presets{grid-template-columns:repeat(7,1fr)}.text-input{width:100%}:is(.setting:has(>.text-input),.setting:has(>.color-presets)){flex-wrap:wrap}}.panel-card>.row select{font:inherit;background:var(--panel-2);color:var(--text);border:1px solid var(--border);border-radius:10px;max-width:100%;padding:7px 8px}.guide-lines{height:2px;position:absolute;top:0;left:0;right:0}.guide-line{opacity:0;transition:opacity .3s;position:absolute;inset:0}.guide-line.in{opacity:1}.share-dialog{width:100%;max-width:380px}.share-dialog .qr-wrap{background:#fff;border-radius:12px;align-self:center;width:min(220px,70vw);padding:6px}.share-dialog .qr-wrap svg{width:100%;height:auto;display:block}.share-dialog .qr-label{font-size:.8rem}.share-dialog .row,.share-preview .row{justify-content:center;margin:0}.share-dialog textarea.code{resize:none;width:100%;font-family:ui-monospace,monospace;font-size:.72rem}.share-note{font-size:.8rem}.share-preview{flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px;display:flex}.share-preview>div{flex-direction:column;flex:1;min-width:140px;display:flex}.share-preview small{color:var(--muted)}.pack-thumb.big{width:72px;height:72px}.tab-icon.letter{color:#fff;border-radius:12px;place-items:center;width:48px;height:48px;font-size:1.4rem;font-weight:900;display:grid}.share-preview .tab-icon{border-radius:12px;width:48px;height:48px}.import textarea.code{width:100%}.import .msg{margin-top:12px}@media (width<=480px){.edit-bar .btn{padding:0 10px}}.edit-swap{display:grid}.edit-swap>*{grid-area:1/1}.edit-swap>.off,.edit-tools .tool-btn.off{visibility:hidden}.btn.pill{background:var(--panel);-webkit-backdrop-filter:blur(6px);border-radius:12px;gap:8px;padding:0 16px 0 12px;font-weight:800}.btn.pill .icon{width:22px;height:22px}.home-bar{gap:8px}@media (width<=360px){.btn.pill span{display:none}.btn.pill{padding:0 10px}}.wip-badge{aspect-ratio:1;background:var(--accent);width:18%;box-shadow:0 0 0 2px var(--panel-solid);border-radius:50%;position:absolute;top:7%;right:7%}.preview-box{position:relative}.preview-view{border:2px solid var(--cursor);pointer-events:none;border-radius:3px;transition:left 80ms linear,top 80ms linear;position:absolute;box-shadow:0 0 0 1px #ffffffb3}.lesson-heading{color:var(--accent)}.bar{z-index:20;position:relative}.search{flex:1 1 0;min-width:0}.mode .bar h1{flex:none;min-width:0;max-width:45%}@media (width<=420px){.bar .search-field:not(:focus-within) .search-input:placeholder-shown::placeholder{color:#0000}}.search-field{cursor:text;background:#ffffff14;border:1.5px solid #0000;border-radius:12px;align-items:center;gap:6px;height:42px;padding:0 4px 0 10px;transition:border-color .15s,background .15s;display:flex}.search-field:focus-within{border-color:var(--mode-line-solid,#2a9be0);background:#ffffff1f}.search-field>.icon{opacity:.6;flex:none;width:18px;height:18px}.search-input{min-width:0;color:var(--text);font:inherit;background:0 0;border:0;outline:none;flex:1;font-size:.95rem;font-weight:700}.search-input::-webkit-search-cancel-button{display:none}.search-input::placeholder{color:var(--text);opacity:.4;font-weight:600}.search-close{width:32px;height:32px;color:var(--text);cursor:pointer;background:#ffffff1a;border:0;border-radius:9px;flex:none;place-items:center;padding:0;display:grid}.search-close[hidden]{display:none}.search-close .icon{width:16px;height:16px}.search-view[hidden]{display:none}.search-count{background:var(--panel-solid);color:#fff;text-align:center;border-radius:999px;width:fit-content;max-width:100%;margin:4px auto 10px;padding:6px 14px;font-size:.9rem;font-weight:800}@media (orientation:landscape) and (height<=500px) and (width<=619px){.play-main{grid-template:"board info"minmax(0,max-content)"board controls"minmax(45%,1fr)/minmax(0,1fr) 136px;gap:6px;padding:6px}.play-main>.info{flex-direction:column;grid-area:info;align-items:stretch;gap:6px;padding:6px;overflow-y:auto}.play-main>.board-wrap{grid-area:board}.play-main>.controls{flex-flow:column;grid-area:controls;align-self:stretch;gap:6px;padding:6px;overflow-y:auto}.info .preview-box{display:none}.tools{grid-template-columns:repeat(2,44px)}.round{width:44px;height:44px}.controls button.round.small,.edit-tools .round.small{width:34px;height:34px}.side-btns{flex-flow:wrap;justify-content:center}.edit-info{display:flex}.edit-info>label.edit-field{flex-direction:column;align-items:stretch;gap:2px}.edit-sizes{gap:4px}.edit-tools .tools{grid-template-columns:repeat(2,auto)}.edit-palette{grid-template-columns:repeat(4,1fr)}.edit-bar .btn{padding:0 10px}}.ask-buttons{flex-wrap:wrap;justify-content:center;margin-top:8px}.ask-buttons .btn{white-space:nowrap;flex:1 0 auto}label.swatch.active{place-items:center;display:grid;position:relative}label.swatch.active input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.swatch-edit{color:#fff;text-shadow:0 0 2px #000,0 0 4px #000;pointer-events:none;font-size:.8rem;font-weight:900}.edit-picture .row .btn.small{padding:0 10px}.edit-ref{gap:6px}.edit-ref>.btn{align-self:stretch}.edit-ref-tools{flex-direction:column;gap:6px;display:flex}.edit-ref-tools[hidden]{display:none}.edit-ref-row{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px;font-size:.8rem;font-weight:700;display:flex}.edit-ref-row .btn{flex:1;padding:0 8px}.edit-ref-op{min-width:60px;accent-color:var(--accent);flex:1}.edit-ref-tools .btn.active{background:var(--accent);color:var(--accent-text);border-color:#0000}.editor-board.moving-ref,canvas.moving-ref{cursor:grab;touch-action:none}.play-main.cornered{grid-template-columns:minmax(0,1600px) clamp(132px,9vw,168px)}.play-main.cornered>.info{display:none}.cornered .controls .info-actions{justify-content:space-between;width:100%;display:flex}.cornered .controls .preview-box{width:100%}.corner-card{--s:1;--r:16px;z-index:2;align-items:center;gap:calc(5px * var(--s));padding:calc(8px * var(--s)) calc(10px * var(--s)) calc(10px * var(--s));color:#fff;border-radius:var(--r) 0 0 0;font-size:calc(14px * var(--s));pointer-events:none;background:#1c1c20;flex-direction:column;display:flex;position:absolute}.corner-card[hidden]{display:none}.cc-mode{text-align:center;padding:calc(3px * var(--s)) 0;border-radius:calc(10px * var(--s));box-shadow:inset 0 0 0 calc(2px * var(--s)) #fff;letter-spacing:.08em;text-transform:uppercase;font-weight:800;font-size:calc(13px * var(--s));white-space:nowrap;text-overflow:ellipsis;background:#000;align-self:stretch;overflow:hidden}.cc-id{letter-spacing:.14em;font-weight:800;font-size:calc(15px * var(--s));line-height:1}.cc-plates{gap:calc(6px * var(--s));grid-template-columns:1fr 1fr;align-self:stretch;display:grid}.cc-plate{text-align:center;border-radius:calc(5px * var(--s));font-size:calc(11px * var(--s));box-shadow:inset 0 0 0 calc(1.5px * var(--s)) #ffffff59;white-space:nowrap;text-overflow:ellipsis;padding:0 4px;font-weight:800;line-height:1.5;overflow:hidden}.cc-plate.count{background:var(--pc,#00bfe6);color:var(--pc-text,#08202a);box-shadow:none;font-variant-numeric:tabular-nums;padding:0 calc(7px * var(--s));justify-content:space-between;gap:4px;display:flex}.cc-plate.count b{font-weight:900}.cc-time{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;display:flex}.corner-card .timer{--dh:calc(30px * var(--s));height:calc(32px * var(--s));font-size:calc(1.7rem * var(--s))}.corner-card .mistakes{font-size:calc(12px * var(--s))}.corner-card .mistakes img{width:calc(18px * var(--s));height:calc(18px * var(--s))}.cc-icons{align-items:center;gap:calc(4px * var(--s));display:flex}.cc-icons>span,.cc-icons>button{width:calc(28px * var(--s));height:calc(28px * var(--s));display:block;position:relative}.cc-icons>button.cc-toggle{pointer-events:auto;color:inherit;cursor:pointer;transition:transform .12s var(--ease);background:0 0;border:0;border-radius:6px;padding:0}.cc-icons>button.cc-toggle:hover{transform:translateY(-1px)scale(1.08)}.cc-icons>button.cc-toggle:focus-visible{outline:2px solid var(--cursor);outline-offset:2px}.cc-icons>button.cc-toggle:after{content:"";position:absolute;inset:-6px}.cc-icons svg{width:100%;height:100%;display:block}.cc-icons .cc-star{width:calc(18px * var(--s));height:calc(18px * var(--s));color:#5a5a60;margin-right:calc(2px * var(--s))}.cc-icons .cc-star.on{color:#ffd21e}.screen.play:not(.editor) .board-wrap{box-shadow:none;background:0 0;padding:0}@media (width>=761px) and (orientation:landscape) and (height>=501px){.edit-main{grid-template-columns:clamp(190px,14vw,250px) minmax(0,1600px) clamp(156px,11vw,184px)}}.edit-tools{align-items:center}.edit-swap{grid-template-columns:minmax(0,1fr);justify-items:center;width:100%}.edit-actions,.edit-picture{align-items:center;width:100%}.edit-field>.text-input,.edit-field>select{box-sizing:border-box;width:100%;min-width:0}.edit-overlay{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;cursor:pointer;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;font-size:.72rem;font-weight:800;display:flex}.edit-overlay .onoff{flex:none;width:92px;height:28px;font-size:.72rem}.screen.editor .board-wrap{background:#fff}.controls.attached{background:var(--panel-solid);box-sizing:border-box;z-index:1;position:relative;box-shadow:0 6px 16px -6px #00000059}.controls.attached[data-side=right]{border-radius:0 16px 16px 0;align-self:start}.controls.attached[data-side=bottom]{border-radius:0 0 16px 16px;justify-self:start}.onoff{width:140px;height:32px;font:inherit;cursor:pointer;background:#4a4a50;border:0;border-radius:10px;flex:none;grid-template-columns:1fr 1fr;padding:0;font-size:.85rem;font-weight:800;display:inline-grid}.onoff>span{color:#c4c4ca;border-radius:10px;place-items:center;transition:background .15s,color .15s;display:grid}.onoff[aria-checked=false]>span:first-child,.onoff[aria-checked=true]>span:last-child{background:var(--accent-grad);color:var(--accent-text)}.onoff:disabled{opacity:.45;cursor:default}.onoff:focus-visible,.cycler:focus-visible,.levels:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cycler{color:#fff;background:#4a4a50;border-radius:10px;outline:none;flex:0 240px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:4px;min-width:150px;height:32px;padding:0 4px;display:grid}.cycler-value{text-align:center;text-wrap:balance;overflow-wrap:anywhere;font-size:.85rem;font-weight:800;line-height:1.15}.cycler-arrow{background:var(--accent-grad);width:24px;height:24px;color:var(--accent-text);font:inherit;cursor:pointer;border:0;border-radius:7px;place-items:center;padding:0;font-size:1.1rem;font-weight:900;line-height:1;display:grid}.levels{cursor:pointer;outline:none;flex:none;align-items:flex-end;gap:4px;height:28px;padding:0 6px;display:inline-flex}.level-bar{width:9px;height:var(--h);background:#55555c;border-radius:2px;transition:background .12s}.level-bar.on{background:#fff}.levels[aria-disabled=true]{opacity:.4;pointer-events:none}.options .panel-card{color:#2a2a2e;background:#f6f6f3f0;border:4px solid #2a2a2e;padding:14px}.options .panel-card h2{color:#2a2a2e;letter-spacing:.04em;text-transform:uppercase;margin:0 0 6px 4px;font-size:1rem}.options .setting{box-sizing:border-box;color:#fff;background:#1d1d21;border:2px solid #0000;border-radius:14px;flex-wrap:wrap;row-gap:6px;min-height:44px;margin:6px 0;padding:6px 6px 6px 14px;text-decoration:none}.options .setting:last-child{border-bottom:2px solid #0000}.options .setting>span>strong{align-items:center;gap:10px;font-size:.95rem;display:inline-flex}.options .setting>span>strong:before{content:"";background:#fff;border-radius:50%;flex:none;width:10px;height:10px}.options .setting.current{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 25%, transparent)}.options .setting.current>span>strong:before{background:var(--accent)}.options.with-help .setting small{display:none}.options .setting{align-items:center}.options .setting>span{gap:2px}.options .setting small{color:#a4a4ac;padding-left:20px;font-size:.78rem}.options .panel-card>p,.options .panel-card>small,.options .panel-card .muted,.options .controls-note{color:#5a5a62}.options .panel-card a:not(.btn):not(.setting){color:#0a8f6e}.options .chip{color:#4a4a52;background:#e4e4df}.options .panel-card .btn:not(.primary):not(.danger){color:#fff;background:#2a2a2e;border-color:#0000}.options .setting-link .chev{color:var(--accent);place-items:center;margin-right:6px;display:grid}.options .setting-link .chev .icon{stroke-width:2.6px;width:20px;height:20px}.options .setting-link:hover{border-color:color-mix(in srgb, var(--accent) 50%, transparent)}.options .setting .text-input{color:#fff;background:#4a4a50;border:0;border-radius:10px;width:min(220px,50%);padding:6px 14px}.settings-help{padding:10px 16px calc(10px + env(safe-area-inset-bottom));text-align:center;color:#fff;-webkit-backdrop-filter:blur(8px);background:#141418d1;min-height:1.4em;margin:0;font-size:.9rem;font-weight:700}.setting>.cycler{flex-direction:row;flex:240px;display:grid}.options .setting>span:first-child:not(.cycler):not(.levels){flex:999 auto}.setting>.levels{flex-direction:row;flex:none;display:inline-flex}.options .setting:has(>.onoff){flex-wrap:nowrap}.options .setting:has(>.onoff)>span:first-child{flex:auto;min-width:0}@media (width<=420px){.onoff{width:112px}.cycler{min-width:130px}}.cycler-arrow svg{width:14px;height:14px}.view-toggle{background:#4a4a50;border-radius:12px;padding:0}.view-toggle button{color:#c4c4ca;border-radius:12px}.view-toggle button:hover:not(.active){color:#c4c4ca}.view-toggle button.active{background:var(--accent-grad);color:var(--accent-text);box-shadow:none}.screen.mode>main.scroll{-webkit-mask-image:linear-gradient(#0000 0,#000 22px calc(100% - 14px),#0000 100%);mask-image:linear-gradient(#0000 0,#000 22px calc(100% - 14px),#0000 100%)}.info-actions .pause-btn{flex:none;width:auto;min-width:88px}.cornered .controls .info-actions .pause-btn,.controls.attached .info-actions .pause-btn{width:100%}.options .record-row{color:#fff;background:#1d1d21;border:0;border-radius:14px;margin:6px 0;padding:10px 12px}.options .record-row .chip{color:var(--muted);background:#ffffff14}.options .record-row .chip b{color:#fff}.options .stat-card{color:#2a2a2e;background:#f6f6f3f0;border:4px solid #2a2a2e}.options .stat-card small{color:#5a5a62}.options .credit-list{border-radius:var(--radius);background:#f6f6f3f0;border:4px solid #2a2a2e;padding:8px 14px}.options .credit-game{background:#1d1d21;border:0;border-radius:14px;margin:6px 0}input[type=text]:focus-visible,input[type=search]:focus-visible,input:not([type]):focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.options button.setting{width:100%;font:inherit;text-align:left;cursor:pointer}.options .reset-row strong,.options .reset-row .chev{color:#ff8a8e}.options .reset-row:hover{border-color:#ff5a5f80}a[data-href]{cursor:pointer}.play .controls{transition:opacity .4s .12s,translate .55s cubic-bezier(.2,.8,.2,1) 80ms}.play .controls.tools-enter{opacity:0;transition:none;translate:-48px}.play .controls.tools-enter[data-side=bottom]{translate:0 -40px}.play .controls.tools-enter[data-side=none],.calm .play .controls.tools-enter{translate:none}.clear-dim{z-index:2;opacity:0;pointer-events:none;background:#00000080;position:fixed;inset:0}.clear-picture{translate:-50% -50%;transform:translate(var(--dx), var(--dy));z-index:3;pointer-events:none;background:#fff;position:absolute;top:50%;left:50%}.clear-picture>canvas,.clear-picture>.sprite{display:block;position:absolute;inset:0;width:100%!important;height:100%!important}.clear-picture>.sprite{opacity:0}.clear-glow{opacity:0;border:3px solid #fff;border-radius:4px;position:absolute;inset:-3px;box-shadow:0 0 18px 4px #ffffe6d9,inset 0 0 12px #ffffe699}.clear-banner{left:0;right:0;top:var(--cy,50%);z-index:4;pointer-events:none;justify-content:center;align-items:center;height:clamp(64px,17.8vh,128px);display:flex;position:fixed;translate:0 -50%}.clear-banner .plate{opacity:0;background:repeating-linear-gradient(135deg,#121218e6 0 12px,#2a2a34e6 12px 24px);position:absolute;inset:0;box-shadow:inset 0 2px #ffffff40,inset 0 -2px #ffffff40}.clear-banner .word{opacity:0;color:#fff;letter-spacing:.08em;text-shadow:0 3px #00000059;padding-left:.08em;font-size:clamp(2rem,6.7vh,3.2rem);font-weight:900;line-height:1;position:relative}.clear-banner.time-up{top:50%}.clear-banner.time-up .plate,.clear-banner.time-up .word{opacity:1;animation:dialog-in .4s var(--ease-back) both}.clear-band{z-index:4;pointer-events:none;transform-origin:top;padding:0 max(16px, env(safe-area-inset-left));color:#fff;background:#000000a1;flex-direction:column;align-items:stretch;gap:10px;font-size:clamp(1rem,3.6vh,1.6rem);font-weight:800;display:flex;position:fixed;bottom:12%;left:0;right:0}.clear-band .band-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 28px;width:100%;max-width:900px;min-height:clamp(40px,7.8vh,56px);margin:0 auto;padding-top:4px;display:flex}.clear-band .time{font-variant-numeric:tabular-nums}.clear-band .name{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:40ch;overflow:hidden}.clear-band .band-side{align-items:center;gap:10px;font-size:.7em;display:flex}.clear-band .rec{opacity:.85;font-variant-numeric:tabular-nums}.clear-band .rec.new{opacity:1;color:#ffd21e}.clear-band .rec small{color:#fff;opacity:.75;font-size:.85em;font-weight:700}.clear-band .grade{color:#ffd21e;letter-spacing:.06em}.clear-band.open{pointer-events:auto;padding-bottom:12px;transition:top .3s ease-out}.clear-band .clear-actions{flex-wrap:wrap;justify-content:center;gap:8px;font-size:1rem;display:flex}.clear-band .clear-actions .btn{white-space:nowrap;flex:0 180px}@media (width<=560px){.clear-band{padding-bottom:max(12px, env(safe-area-inset-bottom))}.clear-band .band-row{gap:2px 16px;padding-top:8px}.clear-band .clear-actions .btn{flex:30%;padding-inline:8px;font-size:.9rem}}.play .controls.given-up{opacity:0;pointer-events:none;transition:opacity .25s}@media (orientation:landscape) and (height<=500px){.home-logo .brand{width:min(260px,38vw)}.mode-row{flex-wrap:nowrap;gap:6px}.mode-btn{width:min(92px,12.5vw)}.mode-text strong{font-size:.62rem}.mode-text small{font-size:.56rem}.home-inner{gap:10px}.vol-logo{max-height:40px}}@media (width>=561px) and (height>=501px) and (height<=760px){.home-logo .brand{width:min(380px,60vw)}.home .mode-btn{width:120px}.home .mode-text strong{font-size:.78rem}.home-inner{gap:12px}}@media (width<=560px) and (height<=740px){.home .mode-btn{width:min(108px,25vw)}.home .mode-text strong{font-size:.72rem}.home-inner{gap:10px}}.guide:hover span,.marquee-box:hover>span,.guide:focus-within span{animation-play-state:paused}.piece:after{content:"";position:absolute;inset:-6px}.home-logo{font-size:inherit;font-weight:inherit;margin:0}body{line-height:1.35}@media (width<=480px){.home-bar .btn.pill span{display:none}.home-bar .btn.pill{padding:0 11px}}.btn.pill:hover{background:#3a3a40f5}.share-dialog .qr{aspect-ratio:1;background:0 0;width:100%;height:auto;padding:0}.share-dialog .qr-label{text-align:center;align-self:center}.share-dialog .row .btn{flex:1}.options .game-row,.options .bind-row,.options .pack-puzzle{color:#fff;background:#1d1d21;border:0;border-radius:14px;margin:6px 0;padding:8px 12px}.options .game-row:last-child,.options .bind-row:last-child,.options .pack-puzzle:last-child{border-bottom:0}.options .credit-list{gap:0}.options .qr-label,.options .stack small,.options .pack-empty,.options .bind-group h3{color:#5a5a62}.options .panel-card .btn:not(.primary):not(.danger):hover{background:#3a3a40}.options .setting select,.options .media-pick select{color:#fff;min-height:36px;font:inherit;background:#4a4a50;border:0;border-radius:10px;padding:0 10px}@media (width<=520px){.options .setting .text-input{width:100%}.card-head h2{white-space:nowrap}.card-head .row{flex-wrap:nowrap}.options .game-row{flex-wrap:wrap}.options .game-row .game-actions{flex-basis:100%;justify-content:flex-end}}.clip-row strong{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.narrow>.lede{margin:0}.msg:empty,.pack-save .edit-msg:empty{display:none}.edit-title{background:#ffffff14;border:0;border-radius:12px;height:42px;padding:0 12px}.edit-size select{text-transform:none;letter-spacing:0;min-height:36px;font-size:.95rem}.edit-label,.edit-overlay>span{white-space:nowrap}.screen.editor .info,.screen.editor .controls{background:var(--panel-solid)}.clip-info{background:var(--panel-solid);border-radius:var(--radius);border:0}.options .reset-row strong:before{background:#ff8a8e}@media (orientation:landscape) and (width>=761px){.play-main{grid-template-rows:minmax(0,1fr)}.play-main>.info,.play-main>.controls{scrollbar-width:none;max-height:100%;overflow-y:auto}}.lesson-card.tap-on .lesson-hint:after{content:"Tap anywhere to continue.";color:var(--muted);font-weight:700}.controls.attached[data-side=right]{overflow-y:auto}@media (orientation:landscape) and (width>=761px) and (height<=800px){.cornered .controls .preview-box{display:none}}@media (orientation:landscape) and (height<=500px) and (width<=619px){.play-main>.controls{justify-content:flex-start}.palette{flex:none;grid-template-columns:repeat(2,1fr)}.lesson-card{min-width:min(100%,300px)}}.edit-title{min-width:72px}@media (width<=400px){.edit-bar .btn:not(.icon){padding:0 9px;font-size:.82rem}}@media (width<=520px){.bar:has(.search-field:focus-within) h1{display:none}.bar:has(.search-field:focus-within) .bar-toggle{display:none}}@media (width<=360px){.clip-info{grid-template-columns:minmax(0,1fr)}}.piece-veil{z-index:3;pointer-events:none;color:#f2f2f5;background:linear-gradient(160deg,#3c3c44,#2a2a30);border-radius:8px;place-items:center;font-size:clamp(1.5rem,8vmin,4rem);font-weight:900;display:grid;position:absolute}.dialog.prestart{text-align:center;width:min(360px,100%)}.prestart-pic{border-radius:6px;width:min(140px,40vw);max-height:140px;margin:0 auto 6px;position:relative;overflow:hidden;box-shadow:0 0 0 3px #fff,0 4px 14px #00000059}.prestart-board{width:100%;height:100%;display:block}.prestart-pic.hinted{border-radius:4px;width:min(230px,62vw);max-height:none}.prestart-pic.hinted svg{width:100%;height:auto;display:block}.prestart-art{background:#fff;animation:.45s .3s both prestart-art;display:grid;position:absolute;inset:0}.prestart-art>*{object-fit:contain;image-rendering:pixelated;width:100%!important;height:100%!important}@keyframes prestart-art{0%{opacity:0;transform:scale(.96)}}.calm .prestart-art{animation:none}.prestart-facts{opacity:.85;flex-wrap:wrap;justify-content:center;gap:4px 12px;font-weight:700;display:flex}.prestart .ask-buttons{flex-wrap:wrap}.create .mode-text{justify-content:center}.setting-link.off{opacity:.45;pointer-events:none}.pick-modes{margin:8px var(--gutter-r) 0 var(--gutter-l);background:var(--panel);border-radius:var(--radius);padding:8px 0;display:flex}.pick-modes .tabs{flex:1;min-width:0}.pick-tabs .pick-line{background:var(--mode-line);opacity:.16}.pick-tabs .tab.active{border-color:var(--mode-solid,var(--accent));background:0 0}.pick-tabs .tab.active .pick-line{opacity:.32}.pick-tabs .mode-icon{object-fit:contain;border-radius:0}.tab.add-tab .add-icon{color:#fff;background:#ffffff24;border-radius:10px;place-items:center;font-size:1.4rem;font-weight:900;display:grid}.danger-text{color:#ff6b6b}.edit-grid-colors .edit-palette{flex-wrap:wrap;align-items:center}.grid-colors .swatch{color:#fff;text-shadow:0 1px 2px #0009;place-items:center;font-weight:900;display:grid}.edit-pieces{flex-direction:column;gap:4px;max-height:220px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.edit-pieces li{border-radius:8px;align-items:center;gap:4px;padding:2px 4px;display:flex}.edit-pieces li.active{background:color-mix(in srgb, var(--accent) 18%, transparent)}.piece-pick{text-align:left;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;flex:1;padding:4px;font-weight:700}.piece-state{background:#6a6a72;border-radius:50%;flex:none;width:10px;height:10px}.piece-state.unique{background:#3fd4a0}.piece-state.multiple,.piece-state.none{background:#ff6b5c}.edit-timer{gap:6px;display:grid}.edit-time{justify-content:space-between;align-items:center;gap:8px;display:flex}.edit-time .text-input{text-align:center;width:84px}.edit-original summary{cursor:pointer;padding:4px 0;font-weight:800}.edit-original .text-input{box-sizing:border-box;width:100%;margin-top:6px}.edit-based{opacity:.85;margin:4px 0;font-size:.85rem}.pack-mode-head{justify-content:space-between;align-items:center;padding:8px 4px 2px;list-style:none;display:flex}.pack-num{font-variant-numeric:tabular-nums;opacity:.75;min-width:3.4em;font-weight:800}.orig-inputs{flex-direction:column;flex:200px;gap:6px;display:flex}.card-head .btn{white-space:nowrap}.card-head{flex-wrap:wrap;gap:6px}.clip-wrap{container-type:inline-size}.clip-pieces.q-l{font-size:10.5cqw}.clip-pieces.q-m{font-size:7.8cqw}.clip-pieces.q-s{font-size:5.2cqw}.clip-pieces .piece>span{font-size:min(.66em,60cqmin)}.piece-badge{color:#fff;background:#26262c;border-radius:999px;place-items:center;min-width:20px;height:20px;padding:0 5px;font-size:.7rem;font-weight:900;display:grid;position:absolute;top:4px;right:4px;box-shadow:0 1px 3px #0006}.clip-medal{border-radius:50%;width:20px;height:20px;position:absolute;bottom:4px;left:4px;box-shadow:0 1px 3px #00000073,inset 0 0 0 2px #fff9}.clip-medal.gold{background:radial-gradient(circle at 35% 30%,#fff3b0,#f5c400 45%,#b08400)}.clip-medal.platinum{background:radial-gradient(circle at 35% 30%,#fff,#d9e4ee 45%,#8ea2b4)}.tile.locked,.piece.locked{opacity:.4;pointer-events:none;filter:grayscale(.6)}.share-btn{justify-content:center;align-items:center;gap:6px;display:inline-flex}.edit-bar .btn:has(>.icon){justify-content:center;align-items:center;gap:6px;display:inline-flex}.share-btn .icon,.edit-bar .btn>.icon{flex:none;width:17px;height:17px}.share-btn.done{color:#3fd4a0}.share-actions{flex-wrap:wrap;justify-content:center}.edit-toast{z-index:6;pointer-events:none;color:#06281e;animation:dialog-in .3s var(--ease-back) both;background:linear-gradient(#2ccf9a,#19b383);border-radius:999px;padding:8px 16px;font-weight:900;transition:opacity .3s;position:absolute;top:14px;left:50%;translate:-50%;box-shadow:0 6px 18px #0000004d}.edit-toast.out{opacity:0}.edit-toast[hidden]{display:none}.edit-bar .btn.saved{background:linear-gradient(#2ccf9a,#19b383)}.edit-based{background:var(--panel-2);border-radius:10px;padding:8px 10px}.edit-more{flex-direction:column;grid-column:1/-1;gap:8px;display:flex}.edit-more>summary{cursor:pointer;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;padding:4px 0;font-size:.72rem;font-weight:800}.edit-more[open]>summary{margin-bottom:4px}.edit-more>:not(summary)+:not(summary){margin-top:8px}@media (width<=760px),(orientation:portrait){.edit-info .edit-overlay,.edit-info .edit-grid-colors,.edit-info .edit-timer,.edit-info .edit-pieces-field{grid-column:1/-1}.edit-grid-colors{flex-flow:wrap;align-items:center}.edit-grid-colors .edit-palette{gap:5px;display:flex}.edit-grid-colors .swatch{width:30px}}.edit-bar .short{display:none}@media (width<=440px){.edit-bar .long{display:none}.edit-bar .short{display:inline}.edit-bar .btn{padding-inline:10px}}.prestart .ask-buttons .btn{white-space:nowrap}.prestart .ask-buttons .btn.primary{flex:100%}.clear-band .rec .star,.prestart-rec .star{color:#ffd21e}.edit-time .stars{color:#ffd21e;letter-spacing:.04em;white-space:nowrap}.home .mode-btn .mode-text{transition:opacity .3s}.home .mode-text.create-text{opacity:0;height:fit-content;margin:auto;position:absolute;inset:0}.home .mode-fill,.home .done-badge,.home .home-foot,.home .home-only,.home .create-only{transition:opacity .3s ease, translate .35s var(--ease)}.home .create-only{opacity:0;pointer-events:none;align-items:center;gap:10px;display:flex;position:absolute;translate:-10px}.home.creating .create-only{opacity:1;pointer-events:auto;position:static;translate:none}.home.creating .home-only{opacity:0;pointer-events:none;position:absolute;translate:10px}.home.creating .create-pill{opacity:0;transition:none}.home.creating .home-bar .create-pill{transition:none;position:absolute}.home.creating .home-only{transition:opacity .3s ease, translate .35s var(--ease), position 0s .3s;transition-behavior:allow-discrete}.home.creating .mode-text:not(.create-text){opacity:0}.home.creating .mode-text.create-text{opacity:1}.home.creating .mode-fill,.home.creating .done-badge{opacity:0}.home.creating .home-foot,.home.creating .made-by{opacity:0;pointer-events:none}.create-title{margin:0;font-size:1.15rem;font-weight:800}.calm .home *{transition:none!important}.home .home-bar{transition:background-color .3s,box-shadow .3s}.home.creating .home-bar{background:var(--panel);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 18px #0000004d}.edit-zoom{justify-content:center;align-items:center;gap:6px;display:flex}.edit-focus{background:var(--panel-2);border-radius:999px;justify-content:space-between;align-items:center;gap:8px;padding:6px 6px 6px 12px;font-weight:800;display:flex}.edit-focus[hidden]{display:none}.focused .edit-sizes,.focused .edit-layers,.focused .edit-pieces-field{opacity:.4;pointer-events:none}.tile .frame.revealed>:first-child{opacity:.55;filter:saturate(.6)}.prompt{pointer-events:none;justify-content:center;align-items:center;display:none}:is(html[data-prompts=keys] .prompt:has(>.prompt-key),html[data-prompts=pad] .prompt:has(>.prompt-pad)){display:inline-flex}.prompt kbd{color:#fff;text-align:center;white-space:nowrap;background:#2a2a31;border-radius:6px;min-width:1.6em;padding:.05em .4em;font:800 .68rem/1.4 Rodin,system-ui,sans-serif;display:none;box-shadow:inset 0 0 0 1.5px #ffffff8c}html[data-prompts=keys] .prompt-key,html[data-prompts=pad] .prompt-pad{display:inline-block}.tool-btn .prompt{margin-top:2px}.round.small{position:relative}.round.small>.prompt.under{position:absolute;top:100%;left:50%;transform:translate(-50%,2px)}html[data-prompts] .controls .tools.small{margin-bottom:14px}.pause-btn .prompt.inline{margin-left:6px}.btn>.prompt{margin-left:8px}.tabs-wrap>.prompt.tab-cap{flex:none;align-self:center}.prompt-bar{color:#fff;white-space:nowrap;pointer-events:none;flex:none;align-items:center;gap:14px;font-size:.78rem;font-weight:800;display:none}html[data-prompts] .prompt-bar{display:flex}.prompt-item{align-items:center;gap:6px;display:inline-flex}.prompt-strip{justify-content:flex-end;display:none}html[data-prompts] .prompt-strip{display:flex}html[data-prompts] .with-prompts{position:relative}html[data-prompts] .with-prompts>.prompt-bar{right:max(12px, var(--gutter-r,12px));position:absolute;top:50%;transform:translateY(-50%)}html[data-prompts] .with-prompts>.guide,html[data-prompts] .with-prompts>.help-text{margin-inline:var(--caps,0px)}.settings-help>.help-text{display:block}html[data-prompts] .with-prompts.stacked>.prompt-bar{justify-content:center;margin-top:6px;position:static;transform:none}html[data-prompts] .guide-bar.with-prompts.stacked{flex-direction:column;align-items:stretch}@media (width<=520px){.prompt-bar{gap:10px;font-size:.72rem}}@media (hover:none) and (pointer:coarse){.prompt,.prompt-bar,.prompt-strip{display:none!important}}.tabs-wrap>.prompt.tab-cap:first-of-type{margin-left:4px}.tabs-wrap>.prompt.tab-cap:last-child{margin-right:6px}.player-plate{background:var(--pc);min-width:0;color:var(--pc-text);box-shadow:inset 0 -2px 0 var(--pc-dark);border-radius:10px;align-items:center;gap:6px;padding:3px 10px 3px 4px;font-weight:900;display:inline-flex}.player-plate.unnamed{padding-right:4px}.player-tag{color:#fff;letter-spacing:.04em;background:#00000080;border-radius:6px;flex:none;padding:1px 6px;font-size:.72em}.player-name{text-overflow:ellipsis;white-space:nowrap;min-width:0;max-width:12ch;overflow:hidden}.player-chip{flex:none;align-items:center;gap:4px;display:inline-flex}.player-open,.player-swap{font:inherit;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:0}.player-open{display:inline-flex}.player-open:hover .player-plate{filter:brightness(1.08)}.player-swap{width:34px;height:30px;box-shadow:inset 0 0 0 2px var(--pc);background:#3a3a40;place-items:center;display:inline-grid}.bar .player-chip{flex-shrink:1;min-width:0}.bar .player-open{min-width:0}.bar .player-open .player-plate{box-sizing:border-box;border-radius:12px;min-height:42px;padding:0 12px 0 8px;font-size:.95rem}.bar .player-open .player-plate.unnamed{padding-right:8px}.bar .player-swap{border-radius:12px;width:42px;height:42px}.bar .player-name{max-width:min(12ch,26vw)}@media (width<=380px){.bar .player-open .player-plate{min-height:38px}.bar .player-swap{width:38px;height:38px}}@media (width<=480px){.bar .player-chip:has(.player-swap) .player-name{display:none}.bar .player-chip:has(.player-swap) .player-plate{padding-right:8px}.bar .player-chip:has(.player-swap+.player-swap) .player-swap{width:34px}}.bar>.btn,.bar>a.btn{flex:none}.player-swap .player-tag{color:#fff;background:0 0;padding:0;font-size:.72rem;font-weight:900}.player-swap:hover{background:#46464e}.player-open:focus-visible,.player-swap:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.player-wipe{z-index:30;pointer-events:none;border-radius:10px;position:fixed}@media (width<=520px){.bar:not(.home-bar) .player-chip .player-name,.bar:not(.home-bar) .player-swap{display:none}.bar:not(.home-bar) .player-chip .player-plate{padding-right:4px}}.pause-player{justify-content:center;margin:-4px 0 4px;display:flex}.prestart-players{gap:4px;display:grid}.prestart-players .player-plate{font-size:.8rem}.player-panel{text-align:left;width:min(440px,100vw - 32px);max-height:calc(100dvh - 40px);overflow:auto}::view-transition-group(player){animation-duration:.32s;animation-timing-function:var(--ease);z-index:4}.player-panel-head{align-items:center;margin-bottom:8px;display:flex}.player-panel-head h2{margin:0}.player-body{gap:10px;display:grid}.player-card{background:#2a2a31;border-radius:14px;gap:8px;padding:10px 12px;display:grid;box-shadow:inset 0 0 0 2px #0000}.player-card.playing{box-shadow:inset 0 0 0 2px var(--pc)}.player-card-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.player-now{color:var(--pc);letter-spacing:.06em;text-transform:uppercase;font-size:.75rem;font-weight:900}.player-row{grid-template-columns:64px minmax(0,1fr);align-items:center;gap:8px;font-size:.85rem;font-weight:800;display:grid}.player-row.player-foot{justify-content:space-between;display:flex}.player-name-input{color:#fff;width:100%;font:inherit;background:#4a4a50;border:0;border-radius:10px;padding:6px 12px}.player-note{opacity:.7;margin:0;font-size:.75rem}.color-grid{grid-template-columns:repeat(4,34px);gap:8px;display:grid}.color-cell{background:var(--pc);cursor:pointer;width:34px;height:34px;box-shadow:inset 0 -3px 0 var(--pc-dark);border:0;border-radius:9px}.color-cell[aria-checked=true]{outline-offset:3px;outline:3px dashed #fff}.color-cell:focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media (width<=420px){.mode .bar .player-chip{display:none}}.player-panel-head{gap:8px}.panel-tabs{background:#1f1f25;border-radius:14px;gap:4px;padding:4px;display:flex}.panel-tab{color:#c9c9d0;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:6px 14px;font-weight:800}.panel-tab.active{background:var(--accent);color:#102a22}.panel-tab:focus-visible{outline-offset:1px;outline:3px solid #fff}.player-tab{gap:10px;display:grid}.player-card.plain h3{margin:0;font-size:.95rem}.backup-row .row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.backup-status{justify-content:space-between;align-items:center;gap:8px;display:flex}.transfer-input{color:#fff;width:9.5em;font:inherit;letter-spacing:.08em;text-transform:uppercase;background:#4a4a50;border:0;border-radius:10px;padding:6px 10px;font-weight:800}.transfer-code{background:#1f1f25;border-radius:12px;justify-items:center;gap:2px;padding:8px;display:grid}.transfer-code strong{letter-spacing:.12em;font-variant-numeric:tabular-nums;font-size:1.6rem}.transfer-code small{opacity:.75}.player-msg{color:#8be0b8;min-height:1.2em;margin:0;font-size:.85rem;font-weight:700}.player-msg.err{color:#ff8a80}.friend-qr{cursor:zoom-in;background:#fff;border:0;border-radius:10px;flex:none;width:104px;padding:4px}.friend-qr .qr{width:100%;height:auto;padding:0}.friend-qr svg{width:100%;height:auto;display:block}.panel-end{justify-content:flex-end}.friend-add{gap:6px;display:flex}.friend-input{width:11em}.friend-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.friend-row{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.friend-row small{opacity:.6;font-variant-numeric:tabular-nums}.friend-row.pending .player-plate{opacity:.7}.news-list{gap:4px;max-height:40vh;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.news-open{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.news-row:not(:has(.news-open)){grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:6px 8px;display:grid}.news-open{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;padding:6px 8px}.news-open:hover{background:#ffffff12}.news-text{flex-direction:column;min-width:0;font-size:.9rem;font-weight:700;display:flex}.news-line{color:var(--muted);font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.news-day{color:var(--muted);white-space:nowrap;font-size:.8rem}.news-empty{color:var(--muted);margin:0}.panel-tab.news,.player-chip.news .player-open{position:relative}.panel-tab.news:after,.player-chip.news .player-open:after{content:"";background:var(--danger);width:9px;height:9px;box-shadow:0 0 0 2px var(--panel-solid);border-radius:50%;position:absolute;top:2px;right:2px}.prestart-friends{text-align:left;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:4px 0;display:grid}.friend-board{background:#ffffff0f;border-radius:10px;gap:2px;margin:0;padding:6px 8px;font-size:.8rem;font-weight:700;list-style:none;display:grid}.friend-board-head{letter-spacing:.06em;text-transform:uppercase;opacity:.75;font-size:.7rem}.friend-board-head .star{color:#ffd21e}.friend-board li:not(.friend-board-head){grid-template-columns:1.4em minmax(0,1fr) auto;align-items:center;gap:6px;display:grid}.friend-board li.me{color:#fff}.friend-board .rank{opacity:.6;font-variant-numeric:tabular-nums}.friend-name{text-overflow:ellipsis;white-space:nowrap;border-left:4px solid var(--pc);min-width:0;padding-left:6px;overflow:hidden}.friend-board .time{font-variant-numeric:tabular-nums}.clear-band .friend-rank{opacity:.9;font-size:.85em}.tour-layer{z-index:25;pointer-events:none;animation:dialog-in .2s var(--ease) both;position:fixed;inset:0}.tour-layer.closing{animation:.18s both dialog-out}.tour-hole{pointer-events:none;transition:left .28s var(--ease), top .28s var(--ease), width .28s var(--ease), height .28s var(--ease), opacity .2s;border-radius:12px;position:fixed;box-shadow:0 0 0 9999px #0a0a1094,0 0 0 3px #ffb228,0 0 18px 4px #ffe28cb3}.tour-card{pointer-events:auto;width:min(380px,100vw - 24px);animation:none;position:fixed}.calm .tour-hole{transition:none}.tour-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;padding:0 16px 16px;display:grid}.tour-tile{color:#fff;width:100%;font:inherit;cursor:pointer;background:#1c1c22e0;border:0;border-radius:14px;padding:12px 16px}.tour-tile:hover,.tour-tile:focus-visible{box-shadow:0 0 0 2px var(--accent);background:#2c2c34f2;outline:none}@media (pointer:coarse){.cycler-value{cursor:pointer}.player-open .player-plate{min-height:36px;padding-top:6px;padding-bottom:6px}.player-swap{width:44px;height:40px}.bar .player-swap{width:42px;height:42px}.bind-key,.bind-add,.bind-x{min-width:44px;min-height:44px}}.player-overlay{padding-top:max(20px, env(safe-area-inset-top));align-items:flex-start}.player-panel-head{z-index:1;background:var(--panel-solid);margin:-24px -24px 8px;padding:16px 24px 8px;position:sticky;top:-24px}.player-panel-head>.btn.icon{flex:none}.panel-tabs{min-width:0}@media (width<=380px){.panel-tab{padding:6px 10px;font-size:.85rem}}.search-view .banner{justify-content:flex-start;padding:4px 16px}.search-view .vol-logo{width:auto;max-height:32px}.search-view .size-head{padding:4px 10px;font-size:.85rem}.search-input:focus,.search-input:focus-visible{box-shadow:none;outline:none}@media (orientation:landscape) and (height<=500px){.mode .bar{min-height:0;padding-block:4px}.mode .tabs-wrap{padding-block:3px}.mode .tabs .tab{min-height:0;padding-block:3px}.mode .tabs .tab-icon-wrap,.mode .tabs .tab-icon{width:30px;height:30px}.mode .banner{padding-block:2px}.mode .banner .vol-logo{max-height:30px}}.tour-card .lesson-text{white-space:pre-line}.edit-sizes{grid-template-columns:minmax(0,1fr);gap:6px;display:grid}.edit-size{gap:4px;display:grid}.edit-info .chooser,.edit-info .cycler{width:100%;min-width:0}.chooser{min-width:0;display:flex}.chooser>.cycler{flex:auto}.add-from .chooser{flex:220px;min-width:0}.media-none:empty{display:none}.setting-value{color:var(--muted);text-align:right;text-overflow:ellipsis;white-space:nowrap;min-width:0;margin-left:auto;font-size:.8rem;font-weight:800;overflow:hidden}.bgm-list{gap:6px;display:grid}.bgm-game{color:#fff;background:#1d1d21;border-radius:14px;grid-template-columns:minmax(0,13em) minmax(0,1fr);align-items:center;gap:8px 12px;padding:8px 10px;display:grid}.bgm-name{align-items:center;gap:8px;min-width:0;font-size:.9rem;display:flex}.bgm-name strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.bgm-name .tab-icon{flex:none;width:28px;height:28px}.bgm-tracks{flex-wrap:wrap;gap:6px;display:flex}.bgm-track{color:#fff;min-height:34px;font:inherit;cursor:pointer;background:#34343a;border:2px solid #0000;border-radius:10px;padding:4px 12px;font-size:.8rem;font-weight:800}.bgm-track:hover{background:#44444b}.bgm-track[aria-checked=true]{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 18%, transparent)}@media (width<=560px){.bgm-game{grid-template-columns:1fr}}@media (pointer:coarse){.bgm-track{min-height:44px}}.bgm-list.off{opacity:.4}.faq{color:#fff;background:#1d1d21;border-radius:14px;margin:6px 0}.faq summary{cursor:pointer;border-radius:14px;align-items:center;gap:10px;min-height:44px;padding:6px 14px;font-size:.95rem;font-weight:800;list-style:none;display:flex}.faq summary::-webkit-details-marker{display:none}.faq summary:before{content:"";background:#fff;border-radius:50%;flex:none;width:10px;height:10px}.faq[open] summary:before{background:var(--accent)}.faq p{color:#e6e6ea;margin:0;padding:0 16px 12px 34px;font-size:.9rem;line-height:1.5}.tile:focus-visible,.pad .tile:focus,html[data-prompts] .tile:focus-visible{box-shadow:none;outline:none!important}.tile:focus-visible .frame,.pad .tile:focus .frame{outline:3px solid var(--menu-cursor);outline-offset:3px}html[data-prompts] .tile:focus-visible .frame,.pad .tile:focus .frame{box-shadow:0 0 18px 6px color-mix(in srgb, var(--accent) 60%, transparent)}.tile:focus-visible,.pad .tile:focus{transform:translateY(-2px)}.calm .tile:focus-visible,.calm .pad .tile:focus{transform:none}.tabs .tab:focus-visible,.pad .tabs .tab:focus{outline-offset:-3px}.prompt.bar-cap{align-self:center;margin:0 2px}.pause-player .prompt.bar-cap{display:none!important}.tiles-head{color:#fff;text-shadow:0 1px 3px #00000080;grid-column:1/-1;margin:14px 2px 2px;font-size:1rem;font-weight:800}.song-title{left:0;top:calc(64px + env(safe-area-inset-top));z-index:40;pointer-events:none;color:#fff;border-left:4px solid var(--accent);background:#14141ae0;border-radius:0 12px 12px 0;align-items:center;gap:10px;max-width:min(80vw,420px);padding:8px 18px 8px 14px;display:flex;position:fixed;box-shadow:0 4px 16px #00000059}.song-title .icon{width:18px;height:18px;color:var(--accent);flex:none}.song-title>span{flex-direction:column;min-width:0;line-height:1.25;display:flex}.song-title strong{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;font-weight:800;overflow:hidden}.song-title strong+span{text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:800;overflow:hidden}.pause-song{width:100%;color:var(--muted);font:inherit;text-align:left;cursor:pointer;background:#ffffff0f;border:0;border-radius:12px;align-items:center;gap:10px;margin-top:4px;padding:8px 12px;font-size:.8rem;display:flex}.pause-song:hover:not(:disabled){color:var(--text);background:#ffffff1c}.pause-song:disabled{cursor:default}.pause-song .icon{width:16px;height:16px;color:var(--accent);flex:none}.pause-song-text{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.pause-song-text strong{color:var(--text);font-weight:800}.pause-song-next{color:var(--accent);flex:none;font-size:1.2rem;line-height:1}.pause-song:disabled .pause-song-next{visibility:hidden}.friends .friend-list,.friends .news-list{gap:0;max-height:none}.friends .friend-row.setting,.friends .news-row.setting:not(.with-open){grid-template-columns:auto minmax(0,1fr) auto;gap:10px;display:grid}.friends .news-row.with-open{padding:0}.friends .news-row.with-open .news-open{color:#fff;border-radius:12px;width:100%;padding:6px 10px 6px 14px}.friends .friend-row small,.friends .news-day,.friends .news-line{color:#a4a4ac}.friends .news-text{color:#fff}.friends .friend-open{border-radius:10px;display:inline-flex}.friends .friend-add>.row,.friends .friend-actions{flex-wrap:nowrap;gap:6px}.options .friend-add .text-input{width:150px}.friends .friend-row small{white-space:nowrap;text-overflow:ellipsis;padding-left:0;overflow:hidden}.friends .friend-code-row .friend-qr{border-radius:8px;width:64px;padding:3px}.friends-note{margin:6px 4px 0;font-size:.85rem}.record-who{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.record-who-wrap{justify-content:center;align-items:center;gap:8px;margin:0 0 12px;display:flex}.record-who-wrap>.prompt.tab-cap{flex:none}.record-tab{background:var(--panel);opacity:.75;border-radius:12px;padding:4px;text-decoration:none;display:inline-flex}.record-tab.active{opacity:1;box-shadow:0 0 0 3px var(--accent)}.record-tab:hover{opacity:1}.h2h-score{margin:2px 4px 8px;font-weight:800}.h2h-list>small{color:#5a5a62;margin:4px 4px 0;font-weight:700;display:block}.friend-pick-dialog{width:min(440px,100%)}.friend-pick-lead{color:var(--muted);margin:0 0 4px;font-weight:600}.friend-pick-search{margin:4px 0}.friend-picks{overscroll-behavior:contain;flex-direction:column;max-height:min(52vh,420px);margin:0 -8px;padding:0 8px;display:flex;overflow-y:auto}.friend-pick{width:100%;font:inherit;color:inherit;text-align:left;border:0;border-bottom:1px solid var(--border);cursor:pointer;background:0 0;border-radius:0;min-height:52px;padding:10px 8px}.friend-pick:last-child{border-bottom:0}.friend-pick:hover,.friend-pick:focus-visible{background:#ffffff12;border-radius:10px}.friend-pick>.player-plate{flex:0 auto;min-width:0;max-width:60%;font-size:1rem}.friend-pick>small{font-variant-numeric:tabular-nums;margin-left:auto}.friend-pick>.chev{opacity:.5;flex:none;display:flex}.friend-pick-none{color:var(--muted);text-align:center;margin:8px 0}.media-more{flex-basis:100%;justify-content:flex-end;align-items:center;gap:8px;display:flex}.media-more:empty{display:none}.media-more small{color:#a4a4ac;font-weight:700}.media-missing{color:#ffcf6b!important}.share-missing{color:var(--muted)}.player-panel-head>.prompt.tab-cap{flex:none;align-self:center}.player-panel-head{justify-content:flex-start}.close-with-cap{flex:none;align-items:center;gap:6px;margin-left:auto;display:inline-flex}.toast:not(:focus-within)>.toast-cap{display:none!important}:is(html[data-prompts=keys] .prompt-item:not(:has(.prompt-key)),html[data-prompts=pad] .prompt-item:not(:has(.prompt-pad))){display:none}.prompt-pair{gap:3px;display:inline-flex}.edit-guide .prompt-bar{white-space:normal;flex-wrap:wrap;gap:6px 14px;margin-top:4px}.two-labels{display:inline-grid}.two-labels>*{grid-area:1/1;justify-content:center;align-items:center;gap:6px;display:inline-flex}.btn:not(.done)>.two-labels>.label-done,.btn.done>.two-labels>.label-idle{visibility:hidden}.player-msg.float-msg{z-index:15;left:50%;bottom:calc(64px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 2 * var(--gutter));background:var(--panel-solid);border:1px solid var(--border);text-align:center;pointer-events:none;min-height:0;animation:rise-in .3s var(--ease) backwards;border-radius:14px;padding:10px 16px;font-size:.9rem;position:fixed;transform:translate(-50%);box-shadow:0 8px 30px #00000073}.player-msg.float-msg:empty{display:none}.big-code .big-qr{aspect-ratio:1;background:#fff;border-radius:14px;align-self:center;width:min(320px,70vw,50dvh);padding:10px}.big-code .big-qr .qr{border-radius:0;width:100%;height:100%;padding:0}.big-code .big-code-text{color:var(--text);letter-spacing:.04em;font-variant-numeric:tabular-nums;font-size:1.6rem;font-weight:800}.edit-presets{grid-template-columns:repeat(8,1fr);gap:4px;margin-top:6px;display:grid}.edit-presets .edit-sublabel{color:var(--muted);grid-column:1/-1;font-size:.72rem;font-weight:700}.swatch.mini{border-radius:6px;min-width:0}.swatch.mini[aria-pressed=true]{box-shadow:0 0 0 2px var(--accent);border-color:#fff}.edit-presets .edit-custom{grid-column:1/-1;position:relative}.edit-presets .edit-custom input{opacity:0;cursor:pointer;position:absolute;inset:0}.setting.edit-shared{text-align:center;flex-direction:column;align-items:center;gap:6px;margin-top:10px;padding:8px 6px;display:flex}.setting.edit-shared strong{font-size:.78rem;line-height:1.2}.setting.edit-shared>.onoff{margin:0}.edit-tool-label{text-align:center;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:6px;font-size:.66rem;font-weight:800;display:block}.edit-toast.warn{color:#ffd6d2;background:#5a1f24}.edit-info{overflow-x:hidden}.edit-hint{color:var(--muted);margin:4px 0 0;font-size:.78rem;line-height:1.3}.edit-add-piece{margin-top:6px}.share-more{text-align:left;margin-top:6px}.share-more>summary{cursor:pointer;color:var(--muted);padding:6px 0;font-size:.85rem;font-weight:800}.share-more[open]>summary{margin-bottom:6px}.share-more .share-actions{margin-top:8px}