/* A compact arcade cabinet: paper, ink, cherry red. */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+KR:wght@400;500;600;700&display=swap');
body{background:#faf8f3;color:#282b32;font-family:'IBM Plex Sans KR','Malgun Gothic',sans-serif}body::selection{background:#ffd5dd}.app{max-width:760px;padding:24px 28px 18px}header{border-bottom:2px solid #292d35;padding:0 0 16px}.brand{font-size:26px;letter-spacing:-1px;font-weight:700}.brand span{color:#e94366}.pill{border:0;background:transparent;padding:0;color:#777977;font-size:14px;border-radius:0}.intro{text-align:left;margin:24px 0 22px;display:flex;justify-content:space-between;gap:16px;align-items:center}.eyebrow{display:none}h1{font-size:20px;margin:0;letter-spacing:-.7px;font-weight:600}h1 span{color:#e94366}.intro p{font-size:14px;line-height:1.5;max-width:240px}.stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0;margin:0;background:#292d35;border-radius:12px 12px 0 0;color:#fff}.stat{background:transparent;border:0;border-right:1px solid #52545b;padding:15px 22px;border-radius:0}.stat:last-child{border:0}.label{color:#c2c2c5;font-size:13px}.value{font-size:34px;line-height:1.15;margin-top:7px;letter-spacing:-1px}.clock{color:#ffadbb}.value small{color:#c2c2c5;font-size:14px;font-weight:400;letter-spacing:0}.bar{border-radius:0;height:5px;margin:0;background:#52545b}.bar div{background:#ef5675}.playarea{padding:22px;border:1px solid #dddcd6;border-top:0;background:#ebeae4;border-radius:0 0 12px 12px;box-shadow:0 5px 0 #dddbd3}.board{gap:12px}.tile{height:119px;background:#fff!important;border:1px solid #dbd9d0;border-bottom:4px solid #d7d4cb;border-radius:9px;font-size:49px;transition:transform .07s,border-color .07s;box-shadow:none}.tile:hover{transform:translateY(-2px);border-color:#a4a49c}.tile:active{transform:translateY(2px)}.tile.selected{background:#fff0f3!important;border:2px solid #ed4b70;border-bottom:4px solid #cf365c;transform:translateY(2px)}.tile.correct{background:#e0f2da!important;border-color:#8cba77;transform:scale(.94)}.tile.wrong{background:#ffe0e4!important}.overlay{background:#faf8f3f5;border-radius:0 0 12px 12px}.overlay h2{font-size:28px;letter-spacing:-1px;margin:10px 0}.overlay p{color:#696c70;font-size:15px}.big-icon{width:72px;height:72px;display:grid;place-items:center;margin:0 auto 18px;background:#fff;border:1px solid #dfddd5;border-radius:14px;font-size:40px;transform:rotate(-7deg);box-shadow:3px 4px 0 #e7e2d7}.primary{background:#e94366;border:1px solid #bc2e4c;border-radius:8px;padding:15px 28px;box-shadow:0 4px 0 #b52c49;font-size:16px;min-width:220px}.secondary{border:1px solid #d0cec6;background:#fff;border-radius:8px;padding:14px 22px;color:#42454a}.resultscore{color:#e94366;font-variant-numeric:tabular-nums}.toast{font-size:14px;margin:12px 0 0;color:#bd3655}.below{margin-top:10px;color:#65686b;border-bottom:1px solid #dddcd6;padding-bottom:16px}.below strong{color:#292d35;font-variant-numeric:tabular-nums}.sound{color:#65686b}.hint{font-size:13px;text-align:left;margin:15px 0 0;color:#777977}footer{text-align:left;font-size:12px;color:#8b8d8a;margin-top:8px}.challenge{background:#fff0f3;border:1px solid #ecc1cd;color:#a33753;border-radius:8px;font-size:14px;margin:0 0 18px}.sharebox{border-radius:6px}.primary:focus-visible,.tile:focus-visible{outline-color:#e94366}.actions{gap:10px}.resultdetails{font-size:13px!important}@media(min-width:1000px){.app{padding-top:38px}}@media(max-width:600px){.app{padding:18px 14px}.intro{display:block;margin:18px 0}.intro p{max-width:none;margin-top:8px}h1{font-size:19px}.stat{padding:13px 14px}.value{font-size:28px}.playarea{padding:12px}.tile{height:90px;font-size:36px}.board{gap:8px}.below{gap:5px;flex-wrap:wrap}.overlay h2{font-size:23px}.overlay p{font-size:14px}.brand{font-size:23px}.pill{font-size:12px}}
.time-bonus{display:inline-block;animation:time-reward .45s ease-out}@keyframes time-reward{0%{color:#abffc1;transform:scale(1.3)}100%{color:inherit;transform:scale(1)}}
.time-reward-popup{position:absolute;z-index:4;left:50%;top:-10px;pointer-events:none;white-space:nowrap;font-size:clamp(36px,6vw,60px);font-weight:900;letter-spacing:-2px;color:#fff45c;-webkit-text-stroke:2px #272d35;text-shadow:3px 4px 0 #272d35;opacity:0;transform:translate(-50%,12px) scale(.65) rotate(-8deg)}.time-reward-popup.show{animation:reward-pop .1s cubic-bezier(.2,.8,.25,1) forwards}@keyframes reward-pop{0%{opacity:0;transform:translate(-50%,15px) scale(.5) rotate(-8deg)}12%{opacity:1;transform:translate(-50%,-12px) scale(1.25) rotate(-8deg)}25%,65%{opacity:1;transform:translate(-50%,-8px) scale(1) rotate(-5deg)}100%{opacity:0;transform:translate(-50%,-32px) scale(.95) rotate(-5deg)}}@media(prefers-reduced-motion:reduce){.time-reward-popup.show{animation:reward-static .1s linear!important}}@keyframes reward-static{0%,85%{opacity:1;transform:translate(-50%,-8px)}100%{opacity:0;transform:translate(-50%,-8px)}}
.time-reward-popup{top:50%;font-size:clamp(52px,9vw,86px);letter-spacing:-3px;padding:8px 22px;background:#272d35ed;border:3px solid #fff45c;border-radius:12px;color:#fff45c;-webkit-text-stroke:0;text-shadow:2px 3px 0 #000;transform:translate(-50%,-50%) scale(.7)}@keyframes reward-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.5) rotate(-8deg)}12%{opacity:1;transform:translate(-50%,-50%) scale(1.18) rotate(-4deg)}25%,70%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-3deg)}100%{opacity:0;transform:translate(-50%,-65%) scale(.95) rotate(-3deg)}}@keyframes reward-static{0%,85%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0;transform:translate(-50%,-50%)}}


.tile[hidden]{display:none!important}.stage-label{font-size:13px;font-weight:600;letter-spacing:1px;color:#6b6e6c;margin:0 0 12px}.board.level-2 .tile{height:88px;font-size:43px}.board.level-3 .tile{height:68px;font-size:36px}@media(max-width:600px){.board.level-2 .tile{height:66px;font-size:32px}.board.level-3 .tile{height:52px;font-size:29px}}

.overlay h2.victory-title{font-size:42px;color:#e94366;letter-spacing:-2px}
.overlay h2{font-size:clamp(32px,7vw,50px);font-weight:900;line-height:1.15;margin:14px 0}.overlay h2.victory-title{font-size:clamp(48px,9vw,72px);color:#fff45c;background:#292d35;border-radius:12px;padding:12px 24px;box-shadow:0 5px 0 #e94366}.match-result{font-size:clamp(26px,5vw,38px)!important;font-weight:900;line-height:1.25!important;color:#292d35!important;margin:14px 0 18px!important;letter-spacing:-1px}.resultdetails{margin:8px 0}.overlay .big-icon{display:none}.resultscore{font-size:34px}.overlay{overflow:auto}.overlay #panel{width:100%;max-width:580px}
.restart-row{background:#292d35;text-align:right;padding:0 16px 10px}.restart-button{font-size:14px;color:#fff;background:#464b55;border:1px solid #717782;border-radius:6px;padding:8px 12px}.restart-button:hover{background:#5b626f}.restart-button[hidden]{display:none}

.leaderboard{margin-top:28px;border-top:2px solid #292d35;padding-top:16px}.rank-header{display:flex;justify-content:space-between;align-items:center}.rank-header h2{font-size:22px;margin:0}.rank-header button{font-size:14px;border:1px solid #d2cfc5;background:#fff;padding:8px 12px;border-radius:6px}.leaderboard ol{list-style:none;padding:0;margin:12px 0}.leaderboard li{display:grid;grid-template-columns:40px 1fr auto;gap:12px;padding:13px 10px;border-bottom:1px solid #dedbd3;align-items:center}.rank-number{font-weight:700;color:#e94366}.leaderboard li:first-child{background:#fff1cc}.leaderboard p{font-size:14px;color:#747678}.score-form{display:flex;justify-content:center;gap:8px;margin-top:14px}.score-form input{min-width:0;width:180px;padding:10px;border:1px solid #ccc7bd;border-radius:6px;font:inherit;font-size:14px}.rank-submit{background:#292d35;color:white;border:0;padding:10px 14px;border-radius:6px;font-size:14px}.rank-submit:disabled{opacity:.55}.save-status{font-size:12px!important;margin:8px 0!important}.overlay #panel{padding:12px 0}.overlay{align-items:flex-start}.overlay #panel{margin:auto}@media(max-width:600px){.score-form{flex-wrap:wrap}.rank-submit{min-height:42px}}

.top5-callout{background:#292d35;border:3px solid #ffe766;border-radius:12px;padding:14px 16px;margin:14px auto 10px;max-width:460px;text-align:center;color:#ffe766;box-shadow:0 4px 0 #e94366}.top5-callout strong{display:block;font-size:clamp(27px,5vw,36px);font-weight:900;letter-spacing:-1px}.top5-callout span{display:block;color:#fff;font-size:15px;margin-top:6px}.top5-form .rank-submit{background:#e94366;font-weight:700;box-shadow:0 3px 0 #b52c49}.top5-form input{border:2px solid #e94366}.top5-callout.saved{font-size:22px;padding:12px;color:#fff;border-color:#e94366}

.leaderboard li{grid-template-columns:76px minmax(0,1fr) auto}.rank-number{white-space:nowrap;font-size:14px}.rank-names{overflow-wrap:anywhere;line-height:1.6}@media(max-width:400px){.leaderboard li{grid-template-columns:62px minmax(0,1fr) auto;gap:8px;font-size:14px}.rank-number{font-size:13px}}
