@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{font-family:'Noto Sans KR',system-ui,sans-serif;color:#252b3b;background:#f6f7fb;font-synthesis:none;--accent:#6558dc;--muted:#8790a3}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0}button:focus-visible,summary:focus-visible{outline:3px solid #9c8cff;outline-offset:4px}button{touch-action:manipulation}button:disabled{cursor:default}button:hover:not(:disabled){filter:brightness(.98)}.shell{max-width:1160px;padding:0 52px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;height:106px;border-bottom:1px solid #e6e9f1}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;font-size:18px;font-weight:800}.brand small{display:block;font-size:9px;letter-spacing:2.1px;color:#9a9eaf;margin-top:2px}.brand-icon{width:40px;height:40px;background:#6558dc;color:white;border-radius:12px;display:grid;place-items:center;font-size:28px}.version{font-size:10px;letter-spacing:1.4px;color:#8e95a5;border:1px solid #e1e4ed;padding:8px 12px;border-radius:50px}.layout{display:grid;grid-template-columns:1fr 430px;gap:85px;margin:46px 0 40px}.intro{padding-top:17px}.eyebrow{font-size:11px;font-weight:700;color:#8174cf;letter-spacing:1px}h1{font-size:39px;line-height:1.45;letter-spacing:-2px;font-weight:800;margin:17px 0 18px}h1 em{font-style:normal;color:#7867da}.intro>p{font-size:13px;color:#8990a2;line-height:1.9;margin-bottom:30px}.section-label{display:flex;gap:10px;align-items:center;font-size:10px;color:#aaa2d0;font-weight:700;letter-spacing:.5px;margin-bottom:14px}.section-label span{font-size:12px;color:#5a6071;letter-spacing:0}.themes{display:grid;gap:9px}.themes button{display:flex;align-items:center;text-align:left;gap:14px;background:white;border:1px solid #e8eaf1;border-radius:14px;padding:14px 17px;min-height:75px;transition:background .2s,border .2s}.themes button[aria-pressed=true]{border-color:#aa9ce9;background:#f0edff;box-shadow:0 3px 10px #7460bd08}.themes strong{display:block;font-size:13px;margin-bottom:4px}.themes small{color:#9095a5;font-size:10px}.sample{display:block;width:36px;height:36px;flex:none}.pop-sample{border-radius:13px;background:linear-gradient(145deg,#c2b8ff,#9d8bf3);box-shadow:inset 0 -3px 0 #8170ca33}.glass-sample{border-radius:8px;background:linear-gradient(130deg,#e7ffff 0%,#b9e5fa 45%,#e4f5ff 48%,#9fcded 100%);border:1px solid #a3cee9;transform:rotate(10deg);box-shadow:inset 2px 2px 2px white}.weight-sample{border-radius:5px;background:linear-gradient(140deg,#65708e,#424b66);box-shadow:0 4px 0 #30394e}.check{margin-left:auto;color:#7867da;visibility:hidden}.themes button[aria-pressed=true] .check{visibility:visible}.theme-note{font-size:10px;color:#a0a5b3;margin-top:12px}.how{margin-top:28px}.how p{font-size:11px;line-height:2;color:#969bab}.how b{font-weight:600;color:#666c7e}details{margin-top:24px;border-top:1px solid #e4e7ef;padding-top:17px;font-size:11px;color:#686f80}summary{cursor:pointer;font-weight:600}summary span{font-weight:400;font-size:10px;color:#9da3b1;margin-left:8px}.setting-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}label{display:flex;flex-direction:column;gap:5px}input{width:100%;padding:7px;background:white;border:1px solid #dfe2eb;border-radius:6px;color:#474e60;font-size:12px}form p{font-size:10px;line-height:1.7}.small-button{background:#e9e4fb;color:#6454b1;border-radius:7px;padding:8px 12px}.game-panel{background:white;border:1px solid #e9ebf2;border-radius:24px;padding:23px 25px 16px;box-shadow:0 18px 60px #26355a09;align-self:start}.game-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:19px}.board-label{font-size:9px;color:#9096a5;letter-spacing:1px;font-weight:700}.board-label span{margin-left:8px;color:#b0b5c0;letter-spacing:0;font-weight:400}.icon-button{background:#f6f7fa;border-radius:30px;padding:6px 9px;color:#8990a1;font-size:12px}.icon-button span{font-size:9px;margin-left:3px}.stats{display:flex;justify-content:space-between;padding:0 1px;margin-bottom:13px}.stats span{display:block;color:#9b9faf;font-size:10px;margin-bottom:4px}.stats strong{font-size:29px;letter-spacing:-1px;line-height:1.2;font-weight:800;font-variant-numeric:tabular-nums}.time-stat{text-align:right}.time-stat strong{color:#7867da;font-weight:700;font-size:25px}.time-track{height:4px;border-radius:9px;background:#f1eff9;overflow:hidden;margin-bottom:18px}#time-fill{height:100%;background:#a295ec;transition:width .2s;width:100%}.board-wrap{position:relative;border-radius:14px;background:#f3f4f8;padding:7px;overflow:hidden}#board{position:relative;aspect-ratio:8/10;width:100%;touch-action:manipulation}.block{position:absolute;border:0;padding:0;display:grid;place-items:center;width:var(--cell-w);height:var(--cell-h);background:none;transition:transform 150ms cubic-bezier(.2,.85,.35,1);will-change:transform}.block-inner{position:absolute;inset:2px;background:var(--color);border-radius:29%;box-shadow:inset 0 -3px 1px #0000000a,inset 0 2px 1px #ffffff45;transition:border-radius .15s,background .2s;display:grid;place-items:center}.block-inner:after{content:'';position:absolute;top:19%;left:23%;width:15%;height:8%;border-radius:50%;background:#ffffff75;transform:rotate(-30deg)}.block .symbol{font-size:10px;color:#ffffff70;font-weight:800}.block:hover .block-inner{filter:brightness(1.04)}.block:active .block-inner{transform:scale(.93)}.block.selected .block-inner{filter:brightness(1.12);box-shadow:inset 0 0 0 2px #ffffffaa}.block[data-top=true] .block-inner{border-top-left-radius:12%;border-top-right-radius:12%;top:-1px}.block[data-bottom=true] .block-inner{border-bottom-left-radius:12%;border-bottom-right-radius:12%;bottom:-1px}.block[data-left=true] .block-inner{border-top-left-radius:12%;border-bottom-left-radius:12%;left:-1px}.block[data-right=true] .block-inner{border-top-right-radius:12%;border-bottom-right-radius:12%;right:-1px}body[data-theme=glass] .board-wrap{background:#eaf3fa}body[data-theme=glass] .block-inner{inset:3px!important;border-radius:7px!important;background:linear-gradient(135deg,#ffffffaa,transparent 45%,#ffffff99 47%,transparent 52%),var(--color);border:1px solid #ffffffaa;box-shadow:inset 0 0 6px #ffffffcc,0 2px 3px #4d66882a}body[data-theme=glass] .block-inner:after{width:60%;height:1px;top:20%;left:15%;transform:rotate(-35deg)}body[data-theme=weight] .board-wrap{background:#262e43}body[data-theme=weight] .block-inner{inset:3px!important;border-radius:5px!important;box-shadow:inset 0 3px 0 #ffffff22,0 3px 0 #00000050;filter:saturate(.5) brightness(.8)}body[data-theme=weight] .block-inner:after{display:none}.curtain{position:absolute;inset:0;background:#f5f5fbf5;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:23px}.curtain[hidden]{display:none}.curtain h2{font-size:22px;letter-spacing:-.9px;margin:14px 0 8px;font-weight:800}.curtain p{font-size:11px;line-height:1.9;color:#969aad;margin:0 0 22px}.curtain small{font-size:9px;color:#adb0bd;margin-top:16px}.primary{background:#7765d9;color:white;border-radius:12px;padding:15px 20px;font-size:12px;font-weight:700;min-width:220px;box-shadow:0 6px 15px #7765d92a;display:flex;justify-content:center;gap:42px}.start-art{display:flex;align-items:center;gap:6px;height:70px;margin-bottom:4px}.start-art i{width:42px;height:42px;border-radius:15px;background:#b4a3f5;transform:rotate(-15deg);box-shadow:inset 0 -4px 0 #00000008}.start-art i:nth-child(2){background:#ffb5c3;transform:translateY(-12px) rotate(8deg)}.start-art i:nth-child(3){background:#a3dcd2;transform:rotate(18deg)}.board-foot{display:flex;align-items:center;justify-content:space-between;margin-top:13px;font-size:9px;color:#9b9faf;gap:8px;min-height:14px}#remaining{font-size:8px;white-space:nowrap;letter-spacing:.5px;color:#b2b7c3}.game-actions{display:flex;gap:9px;margin-top:17px}.game-actions button{flex:1;padding:11px;border-radius:10px;background:#f5f6fa;color:#81879a;font-size:14px}.game-actions span{font-size:11px;margin-left:6px}.fair-note{text-align:center;color:#b2b6c1;font-size:8px;margin:14px 0 0}.result-icon{color:#a18ce8;font-size:37px;line-height:1}#final-score{font-size:45px;line-height:1.2;color:#7562cf;margin:-9px 0 17px;font-variant-numeric:tabular-nums}.breakdown{width:100%;max-width:230px;border-top:1px solid #e0ddec;padding:12px 0;margin-bottom:14px}.breakdown div{display:flex;justify-content:space-between;font-size:10px;color:#8a90a2;line-height:2.3}.breakdown b{color:#62697d}.text-button{background:transparent;color:#9298a8;font-size:10px;margin-top:13px;text-decoration:underline}.particle{position:absolute;width:10px;height:10px;border-radius:50%;background:var(--color);pointer-events:none;z-index:3;animation:burst .4s ease-out forwards}.score-float{position:absolute;color:#6d54ba;font-size:19px;font-weight:900;pointer-events:none;z-index:4;animation:float .65s ease-out forwards;text-shadow:0 1px 5px white}#effects{position:absolute;inset:7px;pointer-events:none}.block-inner.shake{animation:shake .17s ease-in-out}footer{display:flex;justify-content:space-between;border-top:1px solid #e6e9f1;padding:24px 0;color:#b4b8c5;font-size:8px;letter-spacing:1.2px}@keyframes burst{to{transform:translate(var(--dx),var(--dy)) scale(.1);opacity:0}}@keyframes float{to{transform:translateY(-45px);opacity:0}}@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@media(min-width:1000px){.shell{max-width:1120px}.layout{gap:92px}.intro{max-width:330px}}@media(max-width:850px){.shell{padding:0 24px}.layout{gap:35px;grid-template-columns:1fr 390px}h1{font-size:30px;letter-spacing:-1.5px}.game-panel{padding:20px}.intro{min-width:0}.themes button{padding:11px}.sample{width:30px;height:30px}.theme-note{line-height:1.6}}@media(max-width:690px){.shell{padding:0 16px;max-width:480px}header{height:72px}.brand{font-size:15px}.brand-icon{height:32px;width:32px;font-size:23px}.version{font-size:8px;padding:6px 8px}.layout{display:flex;flex-direction:column;gap:18px;margin:20px 0 26px}.intro{display:contents}.intro>.eyebrow,.intro>h1,.intro>p,.how,.theme-note{display:none}.theme-section{order:0}.theme-section .section-label{display:none}.themes{display:flex;gap:7px}.themes button{flex:1;justify-content:center;gap:7px;padding:10px 4px;min-height:48px;border-radius:12px}.themes strong{font-size:11px;margin:0}.themes small,.themes .check{display:none}.sample{width:22px;height:22px;border-radius:8px}.game-panel{order:1;width:100%;padding:17px;border-radius:20px}.game-top{margin-bottom:15px}.stats strong{font-size:26px}.time-stat strong{font-size:23px}.time-track{margin-bottom:13px}details{order:2;margin-top:0;padding-top:16px}footer{font-size:7px;padding:20px 0}.board-foot{font-size:8px}.curtain h2{font-size:21px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
body[data-theme=glass] .block{transition-duration:180ms;transition-timing-function:cubic-bezier(.16,.8,.3,1)}body[data-theme=weight] .block{transition-duration:210ms;transition-timing-function:cubic-bezier(.3,.05,.7,1.3)}body[data-theme=glass] .particle{animation-name:shatter}body[data-theme=weight] .particle{animation-name:debris;animation-duration:.28s}body[data-theme=weight] .board-wrap.impact{animation:impact .14s ease-out}@keyframes shatter{to{transform:translate(var(--dx),var(--dy)) rotate(180deg) scale(.3);opacity:0}}@keyframes debris{to{transform:translate(var(--dx),35px) rotate(75deg);opacity:0}}@keyframes impact{35%{transform:translateY(2px)}75%{transform:translateY(-1px)}}
.mode-tabs{display:flex;gap:5px;padding:4px;background:#f3f2f9;border-radius:11px;margin:0 0 17px}.mode-tabs button{flex:1;padding:9px 4px;background:transparent;color:#9590a8;font-size:11px;font-weight:600;border-radius:8px}.mode-tabs button[aria-pressed=true]{background:white;color:#7663cc;box-shadow:0 2px 7px #72658b12}.mode-tabs span{font-size:7px;letter-spacing:.5px;margin-left:3px}.test-meta{padding:0 2px 15px;color:#8b83a4;font-size:10px}.test-meta[hidden]{display:none}.test-meta strong{display:block;color:#7460b7;margin-bottom:4px;font-size:12px}.test-meta span{display:block;font-size:8px;word-break:break-all;font-family:monospace}.test-meta small{display:block;font-size:8px;margin-top:6px;color:#a3a0ae}#config-mode-note{color:#8b7fb0}#solution-panel{font-size:11px}.solution-warning{color:#a27f53;font-size:10px;line-height:1.8;background:#faf3e8;padding:10px;border-radius:8px}.board-pick-label{margin-bottom:9px}#solution-board-select{font-family:inherit}#solution-error{color:#b57272;font-size:10px}.solution-caption{font-size:10px;line-height:1.8;color:#9490a1}.solution-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}.solution-controls button{font-size:10px;color:#82719f;background:#ebe7f7;border-radius:6px;padding:7px 10px;white-space:nowrap}.solution-controls button:disabled{opacity:.35}#solution-step{accent-color:#8870d3;padding:0;min-width:0}#solution-progress{font-size:11px;color:#7e6ca6;font-weight:600}#solution-board{display:grid;grid-template-columns:repeat(8,1fr);gap:3px;padding:6px;border-radius:10px;background:#eeedf5;aspect-ratio:8/10}.solution-cell{border-radius:6px;background:var(--color);opacity:.8;position:relative;display:grid;place-items:center;color:#ffffff9e;font-size:8px}.solution-cell.next{outline:2px solid #5b428f;outline-offset:-1px;opacity:1;z-index:1}.solution-cell.empty{background:transparent}.solution-cell.anchor:after{content:'●';font-size:10px;color:#5b428f}#solution-info{font-size:10px;line-height:1.8;color:#857d96}#solution-id{font-family:monospace;font-size:8px;color:#a7a2b1;overflow-wrap:anywhere}#solution-content[hidden]{display:none}input:disabled{background:#edeef4;color:#a5a7b3}@media(max-width:690px){#solution-panel{order:3;margin-top:0}#solution-board{max-width:320px;margin:auto}.mode-tabs{margin-bottom:15px}}

.board-pick-label{display:flex;flex-direction:column;gap:6px;font-size:10px;color:#92869e;margin-bottom:10px}.board-pick-label select{font:inherit;font-size:12px;color:#75608f;border:1px solid #ddd5ec;border-radius:8px;background:#fbfaff;padding:9px;width:100%}.test-meta strong{font-size:11px}.test-meta select{cursor:pointer}
#validation-panel{margin-top:20px}#validation-current,#validation-detail{font-size:10px;line-height:1.9;color:#8b8298}#validation-result{font-size:12px;color:#ba746c}#validation-result[data-valid=true]{color:#5d9e87}#validation-session{font-size:8px;color:#a7a0b0;overflow-wrap:anywhere}.validation-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.validation-actions button{background:#ebe7f7;border-radius:7px;color:#87739f;font-size:9px;padding:8px}#validation-content[hidden]{display:none}@media(max-width:690px){#validation-panel{order:4;margin-top:0}}