:root{--paper:#f2eee6;--field:#faf7f0;--ink:#232623;--muted:#77776d;--border:#d6d0c5;--danger:#e36b50;--sage:#8ba795;--mustard:#dbae61;--card:#f8f5ee;--radius:10px}*{box-sizing:border-box}html,body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Noto Sans KR,NanumSquare,Apple SD Gothic Neo,Malgun Gothic,sans-serif}button{font:inherit;color:inherit}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.app{max-width:1008px;margin:0 auto;padding:24px}.top{justify-content:flex-end;padding:0 0 12px;display:flex}.tools{gap:8px;display:flex}.tools button,.debug button{border:1px solid var(--border);color:var(--muted);cursor:pointer;background:0 0;border-radius:6px;padding:5px 10px;font-size:12px;font-weight:700}.tools button:hover,.debug button:hover{border-color:var(--ink);color:var(--ink)}.card{background:var(--card);border:1px solid var(--border);border-radius:12px;position:relative;overflow:hidden}.hud{border-bottom:1px solid var(--border);grid-template-columns:1fr auto 1fr;align-items:center;padding:10px 20px;display:grid}.hud-l,.hud-c,.hud-r{flex-direction:column;gap:3px;display:flex}.hud-c{align-items:center}.hud-r{align-items:flex-end}.hud .logo{font-size:14px;font-weight:800}.hud .hud-sub,.hud .hud-cap{letter-spacing:1.2px;color:var(--muted);font-size:10px;font-weight:700}.hud .timer{font-variant-numeric:tabular-nums;text-align:center;font-size:36px;font-weight:800;line-height:1}.hud .lv{letter-spacing:.5px;font-size:14px;font-weight:800}.hud .pb{color:var(--muted);text-align:right;font-size:12px;font-weight:700}.pips{gap:3px;display:inline-flex}.pips i{background:var(--border);border-radius:1.5px;width:11px;height:7px;display:inline-block}.pips i.on{background:var(--sage)}.pips i.on.cur{background:var(--danger)}.result{flex-direction:column;align-items:center;gap:6px;width:min(640px,92%);display:flex}.result .eyebrow.coral{color:var(--danger);letter-spacing:2px}.result .lvrow{align-items:center;gap:12px;margin-top:2px;font-size:14px;display:flex}.result .lvrow strong{font-size:16px;font-weight:800}.result .best{letter-spacing:2px;color:var(--muted);margin:10px 0 0;font-size:13px;font-weight:800}.result .best strong{letter-spacing:1px;color:var(--ink);font-variant-numeric:tabular-nums;margin-left:8px;font-size:22px;font-weight:800}.result .initials{flex-direction:column;align-items:center;gap:10px;margin-top:10px;display:flex}.result .initials input{width:5ch;font:inherit;letter-spacing:10px;text-align:center;text-transform:uppercase;color:var(--ink);border:0;border-bottom:2px solid var(--ink);caret-color:var(--danger);background:0 0;border-radius:0;outline:none;padding:4px 0;font-size:34px;font-weight:800}.result .initials input::placeholder{color:var(--border)}.result .initials .btn{margin-top:0;padding:8px 18px}.result .btns{gap:10px;margin-top:12px;display:flex}.result .link{margin-top:2px}.btn.primary{background:var(--danger);color:#fff}.btn.primary:hover{background:#d25a40}.btn.ghost{color:var(--ink);border:1px solid var(--ink);background:0 0}.btn.ghost:hover{background:#2326230f}.new{color:var(--danger)}.stage{aspect-ratio:960/540;background:var(--field);-webkit-user-select:none;user-select:none;touch-action:none;position:relative}.stage canvas{width:100%;height:100%;display:block}.overlay{text-align:center;cursor:default;background:#faf7f0db;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:24px;display:flex;position:absolute;inset:0}.overlay[hidden]{display:none}.eyebrow{letter-spacing:1px;color:var(--muted);margin:0;font-size:11px;font-weight:800}.overlay h2{margin:0;font-size:26px;font-weight:800}.overlay .desc{color:var(--muted);margin:0;font-size:14px}.big-time{font-variant-numeric:tabular-nums;font-size:60px;font-weight:800;line-height:1.1}.big-time.clear{color:var(--sage)}.overlay .best{color:var(--muted);margin:0;font-size:13px;font-weight:700}.overlay .best .new{color:var(--sage)}.btn{background:var(--ink);color:var(--field);border-radius:var(--radius);cursor:pointer;border:0;margin-top:10px;padding:10px 18px;font-size:15px;font-weight:700}.btn:hover{background:#000}.btn:active{transform:translateY(1px)}kbd{font:inherit;opacity:.8;border:1px solid;border-radius:4px;padding:0 5px;font-size:12px}.tiny{color:var(--muted);margin:6px 0 0;font-size:11px}body.home .stage{position:static}body.home .stage canvas{visibility:hidden}.overlay.home{background:var(--field);gap:0;padding:32px 24px;overflow:hidden}.deco{--a:0deg;--c:227, 107, 80;pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50%;transform:rotate(var(--a));display:block;position:absolute}.deco.large{--c:139, 167, 149}.deco img{width:100%;display:block;position:relative}.deco i{background:linear-gradient(to left, rgba(var(--c), .42), rgba(var(--c), .12) 60%, transparent 92%);border-radius:999px;width:300%;height:20%;position:absolute;top:50%;right:58%;transform:translateY(-50%)}.deco i:before,.deco i:after{content:"";background:linear-gradient(to left, rgba(var(--c), .38), transparent 90%);border-radius:999px;height:34%;position:absolute;right:8%}.deco i:before{width:68%;top:-70%}.deco i:after{width:84%;bottom:-75%;right:16%}.deco.large i{width:240%;height:16%}.deco b{background:radial-gradient(circle, rgba(var(--c), .55) 0 2px, transparent 2.5px) 14% 18% / 6px 6px no-repeat, radial-gradient(circle, rgba(var(--c), .4) 0 1.5px, transparent 2px) 42% 78% / 5px 5px no-repeat, radial-gradient(circle, rgba(var(--c), .5) 0 2.5px, transparent 3px) 68% 10% / 7px 7px no-repeat, radial-gradient(circle, rgba(var(--c), .35) 0 1.5px, transparent 2px) 86% 64% / 5px 5px no-repeat;position:absolute;inset:-60% 40% -60% -210%}.deco.d1{--a:28deg;width:74px;top:8%;left:6%}.deco.d2{--a:18deg;width:48px;top:22%;left:19%}.deco.d3{--a:-26deg;width:240px;top:66%;left:-7%}.deco.d4{--a:-10deg;width:58px;top:47%;left:13%}.deco.d5{--a:-34deg;width:118px;top:7%;left:76%}.deco.d6{--a:198deg;width:166px;top:42%;left:80%}.deco.d7{--a:206deg;width:52px;top:25%;left:85%}.deco.d8{--a:216deg;width:64px;top:64%;left:73%}.deco.d9{--a:160deg;width:46px;top:83%;left:84%}.deco.d10{--a:238deg;width:72px;top:76%;left:88%}.title{word-break:keep-all;flex-direction:column;align-items:center;gap:14px;width:min(440px,100%);display:flex;position:relative}.title .wordmark{letter-spacing:-6px;white-space:nowrap;text-shadow:-7px 0 #23262326,-15px 0 #2326231a,-25px 0 #2326230f,-38px 0 #23262308;margin:0 0 -2px;font-size:clamp(72px,12vw,140px);font-weight:900;line-height:.9;position:relative;transform:skew(-9deg)}.title .wordmark:before{content:"";z-index:-1;pointer-events:none;background:linear-gradient(270deg,#2326232e,#0000 82%) 100% 8%/100% 3px no-repeat,linear-gradient(270deg,#e36b5052,#0000 86%) 100%/78% 4px no-repeat,linear-gradient(270deg,#23262321,#0000 80%) 100% 92%/62% 3px no-repeat;width:96%;height:68%;position:absolute;top:16%;right:72%}.title.enter .wordmark{animation:.46s cubic-bezier(.16,1,.3,1) both shift-in}@keyframes shift-in{0%{opacity:0;transform:translate(-90px)skew(-14deg)}60%{opacity:1}to{opacity:1;transform:translate(0)skew(-9deg)}}@media (prefers-reduced-motion:reduce){.title.enter .wordmark{animation:none}}.tagline{letter-spacing:5px;color:var(--muted);margin:2px 0 14px;font-size:12px;font-weight:700}.start{letter-spacing:3px;justify-content:center;align-items:center;gap:12px;width:100%;margin:0;padding:15px 20px;font-size:20px;font-weight:800;display:flex}.start .arrow{letter-spacing:0;font-weight:400}.pick{flex-direction:column;gap:8px;width:100%;display:flex}.mode{border:1px solid var(--border);border-radius:var(--radius);text-align:left;cursor:pointer;background:0 0;grid-template-columns:36px 1fr auto;align-items:center;gap:12px;padding:10px 14px;display:grid}.mode .k{border:1px solid var(--border);border-radius:8px;place-items:center;width:36px;height:36px;display:grid;position:relative}.mode .k.dart img{width:26px;transform:rotate(-30deg)}.mode .k.core:before{content:"";border:2px solid var(--ink);border-radius:50%;width:16px;height:16px}.mode .k.core:after{content:"";background:var(--ink);border-radius:50%;width:5px;height:5px;position:absolute}.mode .k.dual{overflow:hidden}.mode .k.dual img{width:17px;position:absolute;top:3px;left:3px;transform:rotate(-30deg)}.mode .k.dual:before{content:"";background:var(--border);width:46px;height:1px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-45deg)}.mode .k.dual:after{content:"";border:1.5px solid var(--ink);width:11px;height:11px;box-shadow:inset 0 0 0 2px var(--field), inset 0 0 0 5px var(--ink);border-radius:50%;position:absolute;bottom:5px;right:5px}.mode[aria-pressed=true] .k.dual:before{background:var(--ink)}.mode .n{letter-spacing:.5px;flex-direction:column;gap:1px;font-size:16px;font-weight:800;line-height:1.1;display:flex}.mode .n small{letter-spacing:0;color:var(--muted);font-size:12px;font-weight:700}.mode .h{letter-spacing:1px;color:var(--muted);font-size:11px;font-weight:700}.mode:hover{border-color:var(--ink)}.mode:active{transform:translateY(1px)}.mode[aria-pressed=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.mode[aria-pressed=true] .k{border-color:var(--ink)}.mode:focus-visible,.start:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.title .best{color:var(--ink);font-variant-numeric:tabular-nums;align-items:center;gap:12px;margin:12px 0 0;display:flex}.title .best span{letter-spacing:2px;color:var(--muted);align-items:center;gap:12px;font-size:11px;font-weight:800;display:flex}.title .best span:before,.title .best span:after{content:"";background:var(--border);width:36px;height:1px}.title .best strong{font-size:22px;font-weight:800}.title .rule{color:var(--muted);margin:0;font-size:12px}.link{letter-spacing:2px;color:var(--muted);cursor:pointer;text-underline-offset:4px;background:0 0;border:0;padding:2px 8px;font-size:12px;font-weight:800;text-decoration:underline}.link:hover,.link:focus-visible{color:var(--ink);outline:none}.board{word-break:keep-all;flex-direction:column;align-items:center;gap:12px;width:min(560px,100%);display:flex;position:relative}.board h2{margin:-6px 0 0;font-size:26px;font-weight:800}.board .tabs{gap:6px;display:flex}.board .tab{border:1px solid var(--border);letter-spacing:1px;color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:7px 14px;font-size:12px;font-weight:800}.board .tab:hover,.board .tab[aria-pressed=true]{border-color:var(--ink);color:var(--ink)}.board .rows{width:100%;margin:4px 0 0;padding:0;list-style:none}.board .row{border-top:1px solid var(--border);font-variant-numeric:tabular-nums;text-align:left;grid-template-columns:32px 1fr auto 52px;align-items:baseline;gap:14px;padding:9px 12px;display:grid}.board .row:first-child{border-top:0}.board .row.me{background:#e36b5017;border-radius:8px}.board .rank{color:var(--muted);font-weight:800}.board .row:first-child .rank{color:var(--danger)}.board .who{letter-spacing:4px;font-size:18px;font-weight:800}.board .time{font-size:18px;font-weight:800}.board .lv{color:var(--muted);text-align:right;font-size:12px;font-weight:700}.board .empty{color:var(--muted);padding:24px 12px;font-size:14px}.board .rule{color:var(--muted);margin:0;font-size:12px}.title .links{gap:14px;display:flex}.sounds .rows{max-height:340px;overflow-y:auto}.sounds .row{grid-template-columns:34px 150px 1fr;gap:12px;padding:7px 10px}.sounds .row.off{opacity:.45}.sounds .who{letter-spacing:0;font-size:14px}.sounds .when{color:var(--muted);font-size:12px;font-weight:700}.sounds .play{background:var(--ink);width:30px;height:30px;color:var(--field);cursor:pointer;border:0;border-radius:8px;padding:0;font-size:11px}.sounds .play:hover{background:#000}.sounds .play:active{transform:translateY(1px)}.sounds .tabs{flex-wrap:wrap;justify-content:center}.caption{border-top:1px solid var(--border);letter-spacing:1px;color:var(--muted);justify-content:space-between;padding:10px 20px;font-size:11px;font-weight:700;display:flex}.about{color:var(--muted);word-break:keep-all;margin:14px 4px 0;font-size:13px;line-height:1.6}.about summary{cursor:pointer;letter-spacing:.3px;color:var(--muted);font-weight:800;display:inline-block}.about summary:hover{color:var(--ink)}.about-body{max-width:72ch;padding-top:6px}.about-body p{margin:0 0 8px}.about-body ul{margin:0 0 8px;padding-left:18px}.about-body li{margin:2px 0}.about-body strong{color:var(--ink);margin-right:4px}.debug{border:1px dashed var(--border);color:var(--muted);border-radius:8px;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;padding:12px;font-size:12px;display:flex}.debug[hidden]{display:none}.debug input{font:inherit;border:1px solid var(--border);background:var(--field);border-radius:4px;padding:3px 6px}.debug .sep{background:var(--border);width:1px;height:16px}@media (width<=720px){.app{padding:16px}.hud .timer{font-size:28px}body.home .hud,body.home .caption{display:none}body.home .stage{aspect-ratio:auto}body.home .stage canvas{display:none}.overlay.home{justify-content:flex-start;min-height:620px;padding:40px 16px 0;position:relative;inset:auto}.overlay.home .title{margin-top:24px}.deco.d2,.deco.d4,.deco.d5,.deco.d7,.deco.d8,.deco.d10{display:none}.deco.d1{width:46px;top:1%;left:4%}.deco.d3{width:124px;top:84%;left:-12%}.deco.d6{width:92px;top:80%;left:72%}.deco.d9{--a:206deg;width:40px;top:2%;left:82%}.title .wordmark{letter-spacing:-4px;text-shadow:-5px 0 #23262324,-10px 0 #23262314,-16px 0 #2326230a}.title .wordmark:before{width:70%;right:76%}.board .row{grid-template-columns:28px 1fr auto;gap:10px}.board .lv{display:none}.sounds .row{grid-template-columns:34px 1fr}.sounds .when{grid-column:2}}