:root{color-scheme:dark;--bg:#101218;--panel:#1b1e27;--line:#30343f;--text:#f4f5f7;--muted:#a3a8b6;--lime:#c7f36b;--blue:#4474fa;--orange:#ffb47a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Pretendard","Noto Sans KR",system-ui,sans-serif;line-height:1.6}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:5px}button:disabled{cursor:default}a{color:inherit;text-decoration:none}.top{max-width:1280px;margin:auto;padding:28px 40px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;font-size:22px;font-weight:850;letter-spacing:-1px}.mark{display:grid;place-items:center;width:36px;height:36px;background:var(--lime);color:var(--bg);border-radius:9px;line-height:1}.wordmark{font-size:11px;letter-spacing:2px;color:var(--muted);margin-left:5px}.navlink{font-size:14px;color:#cbd0dc}main{max-width:1280px;margin:auto;padding:0 40px}.intro{display:flex;justify-content:space-between;align-items:flex-end;padding:44px 0 32px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:1.6px;color:var(--muted)}h1{font-size:clamp(30px,3.3vw,44px);letter-spacing:-1.8px;line-height:1.25;margin:10px 0 12px}p{margin:0}.intro p{color:var(--muted);font-size:16px}.date{font-size:13px;font-family:monospace;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:8px 16px}.mobile{display:none}.layout{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:24px}.tabs{display:flex;border-bottom:1px solid var(--line);gap:7px;margin-bottom:20px}.tab{flex:1;text-align:left;border:0;background:none;padding:14px 16px 18px;color:var(--muted);border-bottom:3px solid transparent;font-weight:700;font-size:16px}.tab span{font-size:12px;margin-right:10px;font-weight:400;color:var(--muted)}.tab.active{color:var(--lime);border-color:var(--lime)}.game-shell{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:26px}.game-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.game-heading h2{font-size:25px;letter-spacing:-.8px;margin:5px 0}.pill{background:#292d37;border:1px solid #424855;border-radius:30px;padding:6px 12px;font-size:12px;white-space:nowrap}.instruction{color:#b4b9c6;font-size:15px;margin:6px 0 22px}.stage{height:320px;border-radius:14px;overflow:hidden;background:#11151d;position:relative;display:flex;align-items:center;justify-content:center}.pad{width:100%;height:100%;border:0;background:#244ccf;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:22px;transition:background .1s;touch-action:manipulation}.pad strong{font-size:32px;letter-spacing:-1px}.pad small{font-size:15px;margin-top:10px;opacity:.8}.pad .symbol{font-size:52px;font-weight:300;line-height:1;margin-bottom:24px}.pad.waiting{background:#303440}.pad.go{background:var(--lime);color:#17200b}.pad.early{background:#754328}.pad.result{background:#243057}.game-bottom{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:20px;min-height:32px;font-size:14px;color:#bcc1ce}.text-button{background:none;border:0;color:var(--text);text-decoration:underline;text-underline-offset:5px;white-space:nowrap}.under{display:flex;justify-content:center;gap:25px;color:var(--muted);font-size:12px;padding:15px 0}.under span:before{content:'✓';margin-right:7px;color:var(--lime)}aside{padding-top:2px}.record{background:var(--lime);color:#17200d;border-radius:20px;padding:28px 24px}.record .eyebrow{color:#4d642c;font-size:10px}.record h2{font-size:20px;letter-spacing:-.6px;margin:8px 0 24px}.best{font-size:43px;line-height:1.1;font-weight:850;letter-spacing:-1.5px;padding-bottom:28px;overflow-wrap:anywhere}.best small{display:block;font-size:13px;letter-spacing:0;font-weight:500;margin-top:12px;color:#4a5c32}.record-row{display:flex;justify-content:space-between;border-top:1px solid #a9d353;padding:12px 0;font-size:14px}.note{font-size:13px;color:#506139;margin:15px 0 22px}.share{background:#17200d;color:var(--lime);border:0;border-radius:9px;padding:11px;width:100%;font-size:14px;font-weight:650}#share-status{display:block;font-size:12px;margin-top:8px}.tip{border:1px solid var(--line);border-radius:20px;padding:24px;margin-top:20px}.tip h3{font-size:18px;margin:8px 0}.tip p{font-size:14px;color:var(--muted)}.tiny-bars{height:35px;display:flex;align-items:flex-end;gap:6px;margin-top:20px}.tiny-bars i{background:#6c85c0;flex:1;height:30%;border-radius:3px}.tiny-bars i:nth-child(3n){height:65%}.tiny-bars i:nth-child(2n){height:90%;background:#94abdc}.guide{padding:60px 0 45px}.section-heading h2{font-size:26px;letter-spacing:-1px;margin:7px 0 24px}.guides{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.guides article{border-top:1px solid var(--line);padding-top:22px}.guides article>span{font-family:monospace;font-size:12px;letter-spacing:1px;color:var(--lime)}.guides h3{font-size:18px;margin:10px 0}.guides p{font-size:14px;color:#d1d4dc}.guides .muted{color:var(--muted);margin-top:12px}footer{border-top:1px solid var(--line);padding:28px 0 36px}.footer-brand{font-size:19px;font-weight:800}.footer-brand span{color:var(--muted);font-size:13px;font-weight:400;margin-left:15px}.footer-links{display:flex;gap:20px;flex-wrap:wrap;margin:18px 0}.footer-links button{background:none;border:0;padding:0;font-size:13px;color:#c0c5d1}footer>p{font-size:12px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:264px;height:264px}.cell{border:1px solid #393e4c;background:#252b39;border-radius:9px;font-size:24px;font-weight:750;touch-action:manipulation}.cell:hover:not(:disabled){background:#394865}.cell.done{background:#22362d;color:#8ce4ad;border-color:#3e5d4a}.cell.flash{background:var(--lime);color:#17200d;border-color:var(--lime)}.cell.wrong{background:#773d37}.overlay{position:absolute;inset:0;background:#11151def;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:20px;text-align:center}.overlay h3{font-size:30px;margin:0}.overlay p{color:var(--muted);font-size:15px}.primary{background:var(--blue);border:0;border-radius:10px;padding:12px 27px;font-weight:700}.timer{font-variant-numeric:tabular-nums}dialog{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:32px;max-width:560px;width:calc(100% - 32px)}dialog::backdrop{background:#000b}dialog h2{font-size:24px;margin:0 28px 20px 0}dialog p{color:#c8cdd6;margin-bottom:16px;font-size:15px}#close-dialog{position:absolute;right:17px;top:10px;border:0;background:none;font-size:30px}.reveal{animation:reveal .35s ease both}@keyframes reveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important;transition:none!important}}@media(max-width:950px){.layout{grid-template-columns:minmax(0,1fr) 250px;gap:18px}main,.top{padding-left:24px;padding-right:24px}.game-shell{padding:20px}.tab{padding-left:8px;padding-right:8px}.tab span{margin-right:5px}}@media(max-width:730px){.top{padding:18px 20px}.wordmark{display:none}main{padding:0 18px}.intro{padding:28px 0 24px}.intro h1{font-size:32px}.intro p{font-size:14px}.date{display:none}.layout{grid-template-columns:1fr}.tabs{gap:0}.tab{font-size:15px;padding:12px 6px}.game-shell{padding:18px;border-radius:16px}.game-heading h2{font-size:23px}.stage{height:310px}.instruction{font-size:14px}.game-bottom{font-size:13px}.under{gap:12px;font-size:11px}aside{display:grid;grid-template-columns:1fr}.record{padding:22px}.record h2{margin-bottom:16px}.best{font-size:38px;padding-bottom:20px}.tip{display:none}.guides{grid-template-columns:1fr;gap:24px}.guide{padding-top:40px}.section-heading h2{font-size:23px}.footer-brand span{display:block;margin:6px 0}.pad strong{font-size:29px}.brand{font-size:21px}}@media(max-width:360px){.tab span{display:none}.game-heading h2{font-size:20px}.grid{width:240px;height:240px}.under{flex-wrap:wrap}.pill{font-size:11px;padding:4px 8px}}

.keyboard-help{color:var(--muted);font-size:14px;margin-top:24px}#storage-status{font-size:13px;color:#6d2b12}.pad strong{font-size:clamp(22px,3vw,30px);word-break:keep-all;line-height:1.4}.under{flex-wrap:wrap}.game-bottom #status{overflow-wrap:anywhere}.eyebrow{letter-spacing:.5px}@media(max-width:430px){.game-bottom{align-items:flex-start}.game-bottom #status{max-width:67%}.game-heading h2{font-size:21px}.stage{min-height:300px}.pad small{font-size:14px}}

.grid{width:min(264px,calc(100% - 20px));height:auto;aspect-ratio:1}.stage button:focus-visible{outline-offset:-4px}

.header-nav{display:flex;gap:20px}.tabs a{display:block}.related-links{margin-top:24px;color:var(--muted);font-size:14px}.related-links a{color:var(--lime);text-decoration:underline;text-underline-offset:4px}.intro h1{word-break:keep-all}.intro p{max-width:650px}.guide h3{word-break:keep-all}@media(max-width:730px){.header-nav{gap:14px}.navlink{font-size:13px}.intro h1{font-size:29px}}
