:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--felt:#17603f;--felt-deep:#0b3322;--bar:#061c128c;--text:#f1f6f2;--muted:#b4cabd;--accent:#f4c64f;--panel:#13241c;--line:#ffffff24;font-family:system-ui,-apple-system,Segoe UI,Apple SD Gothic Neo,Noto Sans KR,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{color:var(--text);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"), radial-gradient(ellipse at 50% 35%, var(--felt), var(--felt-deep) 85%);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;flex-direction:column;display:flex}.bar{padding:8px max(10px, env(safe-area-inset-right)) 8px max(10px, env(safe-area-inset-left));background:var(--bar);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);flex:none;align-items:center;gap:6px;display:flex}.btn{border:1px solid var(--line);height:36px;color:var(--text);font:inherit;cursor:pointer;background:#ffffff0f;border-radius:10px;align-items:center;gap:6px;padding:0 12px;font-size:14px;font-weight:600;text-decoration:none;transition:background .15s,opacity .15s,transform .1s;display:inline-flex}.btn:hover{background:#ffffff21}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.4;cursor:default;transform:none}.btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.btn kbd{border:1px solid var(--line);color:var(--muted);font:inherit;background:#ffffff12;border-radius:5px;margin-left:6px;padding:1px 5px;font-size:11px;font-weight:700}.btn.accent{background:var(--accent);border-color:var(--accent);color:#1b1a12}.btn.accent:hover{background:#f7d474}.btn[hidden]{display:none}.btn.icon-only{justify-content:center;width:36px;padding:0}.hud{font-variant-numeric:tabular-nums;gap:16px;margin-left:auto;padding:0 8px;display:flex}.hud span{flex-direction:column;align-items:flex-end;line-height:1.1;display:flex}.hud small{color:var(--muted);font-size:11px}.hud b{font-size:15px}@media (width<=640px){.btn span{display:none}.btn{justify-content:center;width:36px;padding:0}.hud{gap:10px;padding:0 4px}.hud b{font-size:13px}}#toast{left:50%;bottom:max(24px, env(safe-area-inset-bottom));opacity:0;pointer-events:none;z-index:9500;background:#0a140fe0;border-radius:999px;padding:10px 16px;font-size:14px;transition:opacity .2s,translate .2s;position:fixed;translate:-50% 16px}#toast.show{opacity:1;translate:-50%}dialog{border:1px solid var(--line);background:var(--panel);width:min(360px,100vw - 32px);max-height:calc(100dvh - 24px);color:var(--text);border-radius:18px;padding:18px;overflow:auto;box-shadow:0 30px 60px #00000080}dialog[open]{animation:.28s cubic-bezier(.2,.9,.3,1.2) pop}dialog::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000073}@keyframes pop{0%{opacity:0;scale:.92}}dialog h2{margin:0 0 12px;font-size:17px}dialog h2:not(:first-child){margin-top:18px}.note{color:var(--muted);margin:8px 0 0;font-size:12.5px}.seg{border:0;gap:6px;margin:0;padding:0;display:flex}.seg legend{color:var(--muted);margin-bottom:8px;font-size:13px}.seg label{flex:1}.seg input{opacity:0;position:absolute}.seg span{text-align:center;border:1px solid var(--line);cursor:pointer;border-radius:10px;padding:9px;font-weight:600;display:block}.seg input:checked+span{background:var(--accent);border-color:var(--accent);color:#1b1a12}.seg input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}.stats{grid-template-columns:1fr auto;gap:7px 12px;margin:0;font-size:14px;display:grid}.stats dt{color:var(--muted)}.stats dd{text-align:right;font-variant-numeric:tabular-nums;margin:0;font-weight:700}dialog.wide{width:min(420px,100vw - 32px)}.rank{font-variant-numeric:tabular-nums;margin:0;padding:0;font-size:13px;list-style:none}.rank li{border-radius:6px;grid-template-columns:2.2em 1fr auto auto;align-items:center;gap:10px;padding:2px 8px;display:grid}.rank li+li{box-shadow:inset 0 1px 0 var(--line)}.rank .no{color:var(--muted);text-align:center;font-weight:700}.rank li:nth-child(-n+3) .no{color:var(--accent)}.rank .who{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.rank .sc{font-weight:700}.rank .tm{color:var(--muted);text-align:right;min-width:3.4em}.rank li.me{box-shadow:inset 0 0 0 1px var(--accent);background:#f4c64f29}.rank li.vacant{opacity:.4}.rank li.vacant .who{font-weight:400}.save{margin-top:18px}.save label{color:var(--muted);margin-bottom:7px;font-size:12.5px;display:block}.save .row{gap:8px;display:flex}.save input{border:1px solid var(--line);min-width:0;color:var(--text);font:inherit;background:#ffffff0f;border-radius:10px;flex:1;padding:9px 12px;font-weight:600}.save input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.save button{border:1px solid var(--accent);font:inherit;cursor:pointer;border-radius:10px;padding:9px 14px;font-weight:700}.save[hidden],#save-msg:empty{display:none}#save-msg.bad{color:#ff9a8b}.actions{justify-content:flex-end;gap:8px;margin-top:18px;display:flex}.actions.wrap{flex-wrap:wrap}.actions button{font:inherit;cursor:pointer;border-radius:10px;padding:9px 16px;font-weight:700}.primary{background:var(--accent);border:1px solid var(--accent);color:#1b1a12}.ghost{border:1px solid var(--line);color:var(--text);background:0 0}:root{--cw:80px;--ch:112px;--r:6px}.card{width:var(--cw);height:var(--ch);perspective:calc(var(--cw) * 8);will-change:transform;position:absolute;top:0;left:0}.card .inner{transform-style:preserve-3d;transition:transform .34s cubic-bezier(.3,.75,.25,1);position:absolute;inset:0}.card.down .inner{transform:rotateY(180deg)}.card .face{border-radius:var(--r);backface-visibility:hidden;background-size:100% 100%;transition:box-shadow .2s,transform .2s;position:absolute;inset:0;box-shadow:0 1px 1.5px #00000059,0 0 #0000}.card .back{transform:rotateY(180deg)}