@import "https://fonts.bunny.net/css?family=newsreader:600,700|lexend:400,500,600&display=swap";:root{--su-void:#f7f4ed;--su-ink:#fffdf8;--su-graphite:#f2eee5;--su-raised:#f8f5ed;--su-rule:#d8d5c9;--su-rule-strong:#8b9b8d;--su-paper:#fffdf8;--su-paper-given:#f3f1e9;--su-ivory:#343e37;--su-mist:#626f68;--su-ice:#34443b;--su-teal:#466e61;--su-teal-deep:#315e52;--su-teal-soft:#7a9d872b;--su-conflict:#9b4b52;--su-conflict-soft:#f8dfe1;--su-display:"Newsreader", "Palatino Linotype", Palatino, serif;--su-ui:"Lexend", ui-sans-serif, system-ui, sans-serif;--su-radius:1.15rem}*,:before,:after{box-sizing:border-box}html,body{min-height:100dvh;margin:0}html{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}body.su{background:radial-gradient(circle at 84% 10%, #edbebb6b, transparent 29%), radial-gradient(ellipse 55% 35% at 4% 90%, #b9cfb74d, transparent 65%), var(--su-void);color:var(--su-ice);font-family:var(--su-ui);-webkit-font-smoothing:antialiased;overflow:hidden}body.su:before{content:"";pointer-events:none;opacity:.12;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.su-skip{position:absolute;left:-9999px}.su-skip:focus{z-index:80;background:var(--su-raised);color:var(--su-ice);padding:.5rem .75rem;top:1rem;left:1rem}.su-shell{z-index:1;width:min(100%,28rem);height:100svh;padding:calc(.65rem + env(safe-area-inset-top)) .9rem calc(.75rem + env(safe-area-inset-bottom));background:#fffdf847;flex-direction:column;margin:0 auto;display:flex;position:relative;box-shadow:0 0 0 1px #7286740f,0 24px 70px #57615014}.su-top{justify-content:space-between;align-items:baseline;margin-bottom:.35rem;display:flex}.su-hub{color:var(--su-mist);letter-spacing:.18em;font-size:.68rem;font-weight:500;text-decoration:none}.su-hub:hover{color:var(--su-teal)}.su-mark{font-family:var(--su-display);letter-spacing:.28em;color:var(--su-teal);font-size:.78rem}.su-root{flex-direction:column;flex:1;min-height:0;display:flex;position:relative}.su-screen{flex-direction:column;flex:1;min-height:0;display:flex}.su-screen[hidden]{display:none!important}.su-hero{isolation:isolate;padding:1.6rem .2rem 1.1rem;position:relative}.su-hero:before{content:"";aspect-ratio:1;opacity:.72;filter:blur(.2px);z-index:-1;background:radial-gradient(circle at 35% 32%,#f9e4df,#ebc9c4 75%);border-radius:50%;width:5.8rem;position:absolute;top:.7rem;right:.45rem}.su-kicker{letter-spacing:.28em;color:var(--su-teal);margin:0 0 .35rem;font-size:.68rem;font-weight:500}.su-title{font-family:var(--su-display);letter-spacing:-.03em;margin:0;font-size:clamp(3.1rem,14vw,4.4rem);font-weight:700;line-height:.88}.su-lead{color:var(--su-mist);margin:.85rem 0 0;font-size:.95rem;line-height:1.45}.su-diffs{gap:.7rem;margin-top:auto;display:grid}.su-rank-open{width:100%;margin:.7rem 0 .4rem}.su-offline-status{color:var(--su-mist);text-align:center;margin:.35rem 0 0;font-size:.75rem;line-height:1.4}.su-diff{border-radius:var(--su-radius);color:inherit;text-align:left;cursor:pointer;background:linear-gradient(135deg,#fffdf9,#f4f5ed);border:1px solid #dbe2d6;grid-template-columns:1fr auto;grid-template-areas:"name best""desc best";align-items:center;gap:.15rem .8rem;padding:.95rem 1rem;font-family:inherit;transition:border-color .18s,background-color .18s,transform .18s;display:grid;box-shadow:0 7px 20px #5b6c5b12}.su-diff:hover,.su-diff:focus-visible{outline:2px solid var(--su-teal-deep);outline-offset:2px;border-color:#89a893;transform:translateY(-2px)}.su-diff-name{letter-spacing:.18em;grid-area:name;font-size:.82rem;font-weight:600}.su-diff-desc{color:var(--su-mist);grid-area:desc;font-size:.82rem}.su-best{text-align:right;grid-area:best}.su-best-label{letter-spacing:.16em;color:var(--su-mist);font-size:.58rem;display:block}.su-best-time{font-variant-numeric:tabular-nums;color:var(--su-teal);font-size:.95rem}.su-play-bar{justify-content:space-between;align-items:end;gap:.75rem;margin-bottom:.55rem;display:flex}.su-stat{flex-direction:column;gap:.1rem;display:flex}.su-stat-label{letter-spacing:.16em;color:var(--su-mist);font-size:.58rem}.su-stat-value{font-variant-numeric:tabular-nums;font-size:1.05rem;font-weight:500}.su-board-wrap{flex:auto;justify-content:center;align-items:center;min-height:0;display:flex;position:relative}.su-board{aspect-ratio:1;background:var(--su-rule-strong);border-radius:.55rem;grid-template-columns:repeat(9,1fr);width:min(100%,26rem,100dvh - 19.5rem);padding:4px;display:grid;box-shadow:0 18px 38px #57615029,0 0 0 5px #f6f3eb}.su-cell{appearance:none;background:var(--su-paper);color:var(--su-ivory);font-family:var(--su-display);cursor:pointer;touch-action:manipulation;box-shadow:inset 0 0 0 .5px var(--su-rule);border:0;margin:0;padding:0;font-size:clamp(1.05rem,4.4vw,1.55rem);font-weight:600;line-height:1;position:relative}.su-cell[data-col="2"],.su-cell[data-col="5"]{box-shadow:inset 0 0 0 .5px var(--su-rule), inset -2.5px 0 0 var(--su-rule-strong)}.su-cell[data-row="2"],.su-cell[data-row="5"]{box-shadow:inset 0 0 0 .5px var(--su-rule), inset 0 -2.5px 0 var(--su-rule-strong)}.su-cell[data-row="2"][data-col="2"],.su-cell[data-row="2"][data-col="5"],.su-cell[data-row="5"][data-col="2"],.su-cell[data-row="5"][data-col="5"]{box-shadow:inset 0 0 0 .5px var(--su-rule), inset -2.5px 0 0 var(--su-rule-strong), inset 0 -2.5px 0 var(--su-rule-strong)}.su-cell.is-given{background:var(--su-paper-given);color:var(--su-ivory)}.su-cell.is-user{color:var(--su-teal-deep)}.su-cell.is-same-row,.su-cell.is-same-col,.su-cell.is-same-box{background:#eaf0e7}.su-cell.is-same-number{background:#dcebdd}.su-cell.is-selected{box-shadow:inset 0 0 0 2px var(--su-teal-deep);z-index:1;background:#cee3d1}.su-cell.is-conflict,.su-cell.is-conflict.is-user{color:var(--su-conflict);background:var(--su-conflict-soft)}.su-cell:disabled{cursor:default}.su-cell-value{pointer-events:none;display:block}.su-notes{pointer-events:none;font-family:var(--su-ui);color:#6c786e;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);font-size:.52rem;font-weight:500;display:grid;position:absolute;inset:3px}.su-notes span{opacity:0;justify-content:center;align-items:center;display:flex}.su-notes span.is-on{opacity:1}.su-keypad{grid-template-columns:repeat(3,1fr);gap:.4rem;margin-top:.7rem;display:grid}.su-key,.su-action{appearance:none;background:var(--su-graphite);color:var(--su-ice);cursor:pointer;touch-action:manipulation;border:1px solid #dce2d8;border-radius:.7rem;min-height:2.55rem;font-family:inherit;font-weight:500;transition:background-color .18s,border-color .18s}.su-key{font-variant-numeric:tabular-nums;font-size:1.1rem}.su-key:focus-visible,.su-action:focus-visible,.su-primary:focus-visible,.su-ghost:focus-visible,.su-rank-tab:focus-visible,.su-cell:focus-visible{outline:2px solid var(--su-teal-deep);outline-offset:2px;z-index:3}.su-tools{grid-template-columns:1fr 1fr;gap:.4rem;margin-top:.4rem;display:grid}.su-tools:has([data-su-hint]:not([hidden])){grid-template-columns:repeat(3,1fr)}.su-hint-status{text-align:center;letter-spacing:.12em;min-height:1rem;color:var(--su-mist);margin:.35rem 0 0;font-size:.65rem}.su-cell.is-hinted{box-shadow:inset 0 0 0 2px var(--su-teal);z-index:2;background:#c8dfd1;animation:.5s ease-out su-hint-flash}.su-cell.is-hinted .su-cell-value{color:var(--su-teal-deep)}@keyframes su-hint-flash{0%{box-shadow:inset 0 0 0 3px var(--su-teal)}to{box-shadow:inset 0 0 0 2px var(--su-teal)}}.su-tool{letter-spacing:.08em;font-size:.68rem}.su-tool:disabled{opacity:.42;cursor:default}.su-tool.is-on,.su-key:hover,.su-action:hover,.su-tool:hover{color:var(--su-teal);background:#e8efe6;border-color:#8aa993}.su-actions{grid-template-columns:repeat(3,1fr);gap:.4rem;margin-top:.45rem;display:grid}.su-action{letter-spacing:.12em;font-size:.68rem}.su-overlay{z-index:20;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#f2f0e7d1;justify-content:center;align-items:center;padding:1.2rem;display:flex;position:absolute;inset:0}.su-overlay[hidden]{display:none!important}.su-card{background:var(--su-ink);text-align:center;border:1px solid #dce2d8;border-radius:1.2rem;width:min(100%,22rem);padding:1.4rem 1.2rem 1.15rem;box-shadow:0 20px 55px #53605024}.su-card h2{font-family:var(--su-display);margin:0;font-size:2rem;line-height:1}.su-card p{color:var(--su-mist);margin:.7rem 0 0}.su-pause-cover{aspect-ratio:1;background:repeating-linear-gradient(-32deg, #97b3991f 0 12px, transparent 12px 24px), var(--su-graphite);border:1px solid #dce2d8;border-radius:.55rem;flex-direction:column;justify-content:center;align-items:center;width:min(100%,22rem);display:flex}.su-pause-cover h2{letter-spacing:.28em;margin:0;font-size:.9rem}.su-pause-cover p{color:var(--su-mist);margin:.6rem 0 1rem;font-size:.85rem}.su-result-meta{text-align:left;gap:.35rem;margin:1.1rem 0 1.2rem;display:grid}.su-result-row{justify-content:space-between;font-size:.88rem;display:flex}.su-result-row span:last-child{font-variant-numeric:tabular-nums;color:var(--su-teal)}.su-card-actions{gap:.45rem;margin-top:1.1rem;display:grid}.su-primary,.su-ghost{appearance:none;letter-spacing:.14em;cursor:pointer;border-radius:.75rem;min-height:2.7rem;font-family:inherit;font-size:.72rem;font-weight:600}.su-primary{background:var(--su-teal);color:#fffdf8;border:0}.su-ghost{color:var(--su-ice);background:0 0;border:1px solid #aebfac}.su-overlay.is-lose .su-card h2{color:var(--su-conflict)}.su-rank-hero{padding-bottom:.6rem}.su-rank-title{font-family:var(--su-display);letter-spacing:.12em;margin:0;font-size:2.4rem}.su-rank-tabs{grid-template-columns:repeat(3,1fr);gap:.4rem;margin-bottom:.85rem;display:grid}.su-rank-tab{appearance:none;background:var(--su-graphite);min-height:2.4rem;color:var(--su-mist);letter-spacing:.12em;cursor:pointer;border:1px solid #dce2d8;border-radius:.7rem;font-family:inherit;font-size:.68rem;font-weight:600}.su-rank-tab[aria-pressed=true]{color:var(--su-teal);background:var(--su-teal-soft);border-color:#8aa993}.su-rank-status{text-align:center;letter-spacing:.14em;color:var(--su-mist);margin:1.4rem 0 0;font-size:.78rem}.su-rank-list{flex:1;gap:.4rem;min-height:0;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.su-rank-row{background:var(--su-graphite);border:1px solid #e0e5da;border-radius:.8rem;grid-template-columns:2rem 1fr auto;align-items:center;gap:.6rem;padding:.7rem .8rem;display:grid}.su-rank-row.is-me{background:var(--su-teal-soft);border-color:#8aa993}.su-rank-pos{font-variant-numeric:tabular-nums;color:var(--su-teal);font-size:.85rem}.su-rank-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.su-rank-time{font-variant-numeric:tabular-nums;color:var(--su-mist)}.su-rank-back{width:100%;margin-top:.75rem}@media (width>=720px){.su-shell{padding-top:1.2rem}.su-board{width:min(100%,24.5rem)}}@media (height<=700px){.su-hero{padding-top:.6rem}.su-title{font-size:2.6rem}.su-key,.su-action{min-height:2.25rem}}@media (prefers-reduced-motion:reduce){.su-diff,.su-key,.su-action{transition:none}.su-cell.is-hinted{animation:none}}