@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap";:root{--moki-ink: #30283f;--moki-muted: #62586b;--moki-paper: #f5f1e9;--moki-surface: #fffdf8;--moki-line: #d7cfda;--moki-plum: #514065;--moki-plum-light: #e7dff0;--moki-lime: #cbe18d;--moki-lime-light: #e9f1d3;--moki-coral: #d76c57;--moki-coral-light: #f7ddd5;--moki-blue: #467586;--moki-blue-light: #d7e7e9}:root{font-family:DM Sans,Noto Sans KR,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--ink);background:var(--page);font-synthesis:none;--green: var(--moki-plum);--green-deep: var(--moki-ink);--green-soft: var(--moki-plum-light);--muted: var(--moki-muted);--line: var(--moki-line);--page: var(--moki-paper);--ink: var(--moki-ink);--border: var(--moki-line);--switch: var(--moki-plum-light);--frame: #ebe4e9;--grid: #e4deea;--grid-strong: #a396af;--grid-outer: var(--moki-plum);--cell-ink: var(--moki-ink);--peer: #f2eef6;--matching: var(--moki-blue-light);--selected: var(--moki-lime-light);--selected-ring: var(--moki-plum);--key: var(--moki-plum-light);--key-hover: #d8cbe5;--badge: var(--moki-lime);--badge-ink: #514761;--panel: var(--moki-surface);--panel-soft: #eee9ef}*{box-sizing:border-box}body{margin:0;background:var(--page)}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible{outline:3px solid var(--moki-coral);outline-offset:2px}.app-shell{display:flex;flex-direction:column;width:min(100%,680px);min-height:100svh;margin:0 auto;padding:22px 20px calc(22px + env(safe-area-inset-bottom))}.game-content{display:flex;flex:1;flex-direction:column;justify-content:space-around}.ad-section{width:min(100% - 40px,640px);min-height:110px;margin:170px auto 0;text-align:center}.ad-section[hidden]{display:none}.ad-label{display:block;margin-bottom:12px;color:var(--muted);font-size:11px}.site-about{width:min(100% - 40px,640px);margin:48px auto 0;padding:28px 30px;border:1px solid var(--border);border-radius:18px;background:var(--panel);color:var(--ink)}.site-about h1{margin:0 0 14px;font-size:clamp(19px,4.5vw,24px);line-height:1.35}.site-about h2{margin:24px 0 8px;font-size:clamp(16px,3.7vw,19px)}.site-about p{margin:0;color:var(--badge-ink);font-size:14px;line-height:1.8}.site-footer{padding:30px 20px max(24px,env(safe-area-inset-bottom));text-align:center}.site-footer a{color:var(--muted);font-size:12px;text-underline-offset:3px}.topbar,.brand,.top-actions,.new-game,.records-button,.level-row,.game-meta,.tools,.keypad{display:flex;align-items:center}.topbar{justify-content:space-between}.brand{gap:10px}.top-actions{gap:6px}.brand-mark{width:32px;height:32px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;padding:4px;border-radius:9px;background:var(--green);transform:rotate(-7deg)}.brand-mark i{display:block;background:var(--green-soft);border-radius:2px}.brand-mark i:nth-child(3){background:var(--moki-lime)}.brand-copy{display:flex;flex-direction:column;line-height:1;gap:3px}.brand-copy strong{font-size:19px;font-weight:700;letter-spacing:-.05em}.brand-copy small{font-size:9px;font-weight:600;letter-spacing:.22em;color:var(--muted)}.new-game,.records-button{gap:5px;padding:9px 12px;border:1px solid var(--border);border-radius:100px;color:var(--green);background:var(--moki-surface);font-size:13px;font-weight:600;transition:background .2s,transform .2s}.new-game svg,.records-button svg{width:16px;height:16px}.new-game:hover,.records-button:hover{background:var(--moki-lime-light);transform:translateY(-1px)}.records-button{color:var(--moki-ink);background:var(--moki-lime-light);border-color:var(--moki-lime)}@media(max-width:350px){.records-button{width:35px;min-width:35px;justify-content:center;padding:9px 0}.records-button span{display:none}.new-game{white-space:nowrap;padding-inline:9px}}.level-row{justify-content:space-between;margin:23px 0 14px}.section-label{color:var(--badge-ink);font-size:13px;font-weight:600}.level-switch{display:grid;grid-template-columns:repeat(4,1fr);width:208px;padding:3px;border:1px solid var(--border);border-radius:100px;background:var(--switch)}.level-switch button{min-height:31px;padding:0;border:0;border-radius:100px;background:transparent;color:var(--badge-ink);font-size:13px;font-weight:600;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}.level-switch button.active{color:var(--green-deep);background:#fff;box-shadow:0 1px 4px #1f3e2d17}.game-meta{justify-content:space-between;margin:0 2px 10px}.meta-block{display:flex;align-items:baseline;gap:7px;white-space:nowrap}.meta-block span{color:var(--badge-ink);font-size:12px;font-weight:500}.meta-block strong{color:var(--ink);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}.meta-divider{width:1px;height:12px;background:var(--line)}.resource-group{display:flex;align-items:center;gap:9px}.lives-block{align-items:center;gap:5px}.meta-block .lives{display:inline-flex;align-items:center;gap:2px;color:var(--moki-coral)}.lives span{display:inline-flex}.lives svg{width:16px;height:16px}.meta-block .heart-full{color:var(--moki-coral)}.heart-full svg{fill:currentColor}.meta-block .heart-lost{color:#c9bdc6}.heart-lost svg{fill:none}.lives.hit{animation:heart-hit .45s ease-out}@keyframes heart-hit{0%,45%{transform:scale(1.18)}to{transform:scale(1)}}.board-frame{width:100%;padding:4px;border-radius:10px;background:var(--frame);box-shadow:0 9px 28px #30283f12,0 1px 3px #30283f12}.board{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));width:100%;aspect-ratio:1;overflow:hidden;border:2px solid var(--grid-outer);border-radius:5px;background:var(--moki-surface)}.cell{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border:0;border-right:1px solid var(--grid);border-bottom:1px solid var(--grid);border-radius:0;background:var(--moki-surface);color:var(--cell-ink);font-size:clamp(20px,5vw,36px);font-weight:500;line-height:1;font-variant-numeric:tabular-nums;transition:background .12s}.cell:nth-child(9n){border-right:0}.cell:nth-last-child(-n+9){border-bottom:0}.cell.box-right{border-right:2px solid var(--grid-strong)}.cell.box-bottom{border-bottom:2px solid var(--grid-strong)}.cell.peer{background:var(--peer)}.cell.matching{background:var(--matching)}.cell.selected{z-index:1;background:var(--selected);box-shadow:inset 0 0 0 2px var(--selected-ring)}.cell.wrong-feedback,.cell.selected.wrong-feedback{z-index:3;animation:wrong-cell 1.4s ease-out both;animation-delay:var(--feedback-offset, 0ms)}.cell.wrong-feedback .cell-value{animation:wrong-value 1.4s ease-out both;animation-delay:var(--feedback-offset, 0ms)}@keyframes wrong-cell{0%,22%{background:var(--moki-coral-light);box-shadow:inset 0 0 0 2px var(--moki-coral),0 0 0 3px #d76c5729}to{background:var(--selected);box-shadow:inset 0 0 0 2px var(--selected-ring)}}@keyframes wrong-value{0%{opacity:0;transform:scale(.7);color:#913b32}16%,38%{opacity:1;transform:scale(1.16);color:#913b32}to{opacity:0;transform:scale(.85);color:var(--moki-coral)}}.cell:hover:not(.selected){background:var(--peer)}.cell.hinted,.cell.hinted:hover{z-index:2;background:var(--moki-lime-light);box-shadow:inset 0 0 0 3px #879a48}.cell.hinted.selected{background:var(--moki-lime)}.cell.hinted:after{content:"";position:absolute;top:4px;right:4px;width:5px;height:5px;border-radius:50%;background:var(--moki-plum)}.cell-notes{display:grid;grid-template-columns:repeat(3,1fr);width:86%;height:86%;place-items:center}.cell-notes i{color:var(--badge-ink);font-size:clamp(8px,1.8vw,12px);font-style:normal;font-weight:600}.tools{justify-content:space-around;margin:14px 2px 10px}.tools button{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;width:33.333%;min-height:52px;border:0;background:transparent;color:var(--badge-ink);font-size:12px;font-weight:500;transition:color .2s,transform .2s}.tools button:hover:not(:disabled),.tools button.active{color:var(--green);transform:translateY(-1px)}.tools button:disabled{opacity:.35}.tools svg{width:23px;height:23px}.tools b{position:absolute;top:-4px;left:calc(50% + 9px);padding:1px 3px;border-radius:4px;color:#fff;background:var(--moki-muted);font-size:7px;line-height:1.3}.tools .active b{background:var(--green)}.tools #hint-badge{display:grid;place-items:center;top:-3px;left:calc(50% + 10px);min-width:20px;height:20px;padding:0 4px;border-radius:10px;color:var(--moki-ink);background:var(--moki-lime);font-size:12px;font-weight:700}.tools #hint-badge.empty{background:var(--moki-line)}.keypad{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:4px}.digit{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:0;min-height:65px;padding:4px 0;border:0;border-radius:11px;background:var(--key);color:var(--green);transition:background .15s,transform .15s}.digit:hover:not(:disabled){background:var(--key-hover);transform:translateY(-2px)}.digit:active:not(:disabled){transform:scale(.95)}.digit strong{font-size:clamp(22px,5.3vw,30px);line-height:1.05;font-weight:500}.digit small{display:grid;place-items:center;min-width:22px;height:19px;padding:0 4px;border-radius:10px;color:var(--badge-ink);background:var(--badge);font-size:12px;line-height:1;font-weight:700}.digit.complete{color:var(--muted);background:var(--panel-soft);opacity:.6}.digit.complete small{color:var(--muted);background:var(--line)}.digit.wrong-feedback,.digit.wrong-feedback:hover{animation:wrong-digit 1.4s ease-out both;animation-delay:var(--feedback-offset, 0ms)}.digit.wrong-feedback small{animation:wrong-badge 1.4s ease-out both;animation-delay:var(--feedback-offset, 0ms)}@keyframes wrong-digit{0%{background:var(--moki-coral-light);color:var(--moki-coral);box-shadow:0 0 0 1px #d76c571f;transform:none}18%,38%{background:var(--moki-coral-light);color:#913b32;box-shadow:0 0 0 3px #d76c5738,0 5px 16px #d76c5733;transform:translateY(-3px) scale(1.04)}to{background:var(--key);color:var(--green);box-shadow:none;transform:none}}@keyframes wrong-badge{0%{background:var(--moki-coral-light);color:#913b32}18%,38%{background:#913b32;color:#fff}to{background:var(--badge);color:var(--badge-ink)}}.toast{position:fixed;z-index:10;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 40px);padding:11px 16px;border-radius:100px;color:#fff;background:var(--green);box-shadow:0 6px 22px #30283f2e;font-size:12px;font-weight:600;text-align:center;opacity:0;transform:translate(-50%,8px);pointer-events:none;transition:opacity .2s,transform .2s}.toast.visible{opacity:1;transform:translate(-50%)}.game-dialog{width:min(calc(100% - 28px),430px);max-width:none;max-height:calc(100svh - 24px);overflow-y:auto;padding:30px 26px 26px;border:1px solid var(--border);border-radius:22px;color:var(--ink);background:var(--panel);box-shadow:0 22px 70px #30283f33;text-align:center}.game-dialog::backdrop{background:#30283f66;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.dialog-icon{display:grid;place-items:center;width:54px;height:54px;margin:0 auto 15px;border-radius:16px;color:var(--moki-ink);background:var(--moki-lime)}.dialog-icon svg{width:29px;height:29px}.win-icon{color:#fff;background:var(--green)}.loss-icon{color:var(--moki-coral);background:var(--moki-coral-light)}.dialog-kicker{margin:0 0 7px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.12em}.game-dialog h2{margin:0;font-size:clamp(25px,6vw,29px);font-weight:700;line-height:1.3;letter-spacing:-.04em}.dialog-description{margin:16px 0 25px;color:var(--badge-ink);font-size:16px;line-height:1.55}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.dialog-actions button{min-height:52px;padding:9px 8px;border:0;border-radius:11px;font-size:16px;font-weight:700;line-height:1.35}.dialog-secondary{color:var(--green);background:var(--green-soft)}.dialog-primary{color:#fff;background:var(--green)}.dialog-primary:hover{background:var(--green-deep)}.result-score{display:flex;flex-direction:column;align-items:center;gap:1px;margin:20px 0 0;padding:17px 12px 16px;border-radius:15px;color:var(--green-deep);background:var(--green-soft)}.result-score>span{font-size:14px;font-weight:600}.result-score strong{font-size:clamp(34px,9vw,42px);font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums}.result-score small{margin-left:3px;font-size:19px;font-weight:600}.loss-score{color:#923c37;background:var(--moki-coral-light)}.result-description{margin:13px 0 24px}.record-icon{color:var(--moki-ink);background:var(--moki-lime)}.record-list{display:grid;gap:9px;margin:20px 0 15px;text-align:left}.record-row{display:grid;grid-template-columns:1fr auto;grid-template-areas:"period score" "detail detail";align-items:baseline;gap:3px 8px;padding:12px 15px;border-radius:12px;background:var(--panel-soft)}.record-row span{grid-area:period;color:var(--badge-ink);font-size:15px;font-weight:700}.record-row strong{grid-area:score;color:var(--ink);font-size:23px;font-weight:700;font-variant-numeric:tabular-nums}.record-row small{grid-area:detail;color:var(--badge-ink);font-size:14px}.score-rules{margin:0 0 20px;color:var(--badge-ink);font-size:15px;line-height:1.55;text-align:left}.score-rules summary{padding:5px 0;cursor:pointer;font-weight:600}.score-rules p{margin:8px 0 0}.record-actions{grid-template-columns:1fr}@media(max-width:350px){.game-dialog{padding-inline:20px}}@media(max-height:610px){.game-dialog{padding-top:20px;padding-bottom:20px}.dialog-icon{width:42px;height:42px;margin-bottom:9px}.dialog-icon svg{width:24px;height:24px}.record-list{margin-top:16px;margin-bottom:12px}.record-row{padding-block:10px}}@media(max-height:480px){.game-dialog{padding-top:18px;padding-bottom:18px}.dialog-icon{width:40px;height:40px;margin-bottom:8px;border-radius:12px}.dialog-icon svg{width:23px;height:23px}.dialog-description{margin:10px 0 18px}.result-score{margin-top:12px;padding-block:11px}.record-list{margin-top:12px}}@media(orientation:landscape)and (max-height:480px){.game-dialog{padding-top:14px;padding-bottom:14px}.dialog-icon{display:none}.game-dialog h2{font-size:26px}.dialog-description{margin:10px 0 14px}.dialog-actions button{min-height:48px}.record-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0}.record-row{grid-template-columns:1fr;grid-template-areas:"period" "score" "detail";align-content:center;gap:2px;min-width:0;padding:9px 8px}.record-row strong{font-size:21px}.record-row small{overflow-wrap:anywhere}.score-rules{margin-bottom:12px}}@media(min-width:700px){.app-shell{padding:28px 24px 22px}.level-row{margin-top:26px}}@media(max-width:390px){.app-shell{padding:18px 20px calc(18px + env(safe-area-inset-bottom))}.level-row{margin-top:21px;margin-bottom:13px}.game-meta,.resource-group{gap:5px}.lives svg{width:13px;height:13px}.meta-block .lives{gap:1px}.tools{margin:16px 0 10px}.digit{min-height:55px}}@media(orientation:portrait)and (max-width:420px){.game-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px 8px}.game-meta .meta-divider{display:none}.resource-group{justify-self:end}}@media(max-height:730px){.level-row{margin-top:17px;margin-bottom:10px}.tools{margin-top:10px;margin-bottom:8px}}@media(max-height:610px)and (max-width:390px){.app-shell{padding-top:10px;padding-bottom:8px}.level-row{margin-top:15px;margin-bottom:8px}.game-meta{margin-bottom:7px}.tools{margin:7px 0 5px}.tools button{min-height:40px;gap:3px}.tools svg{width:20px;height:20px}.digit{min-height:42px}}@media(orientation:landscape)and (min-width:480px){.app-shell{display:grid;--pad-left: max(10px, env(safe-area-inset-left));--pad-right: max(10px, env(safe-area-inset-right));--pad-top: max(10px, env(safe-area-inset-top));--pad-bottom: max(10px, env(safe-area-inset-bottom));--layout-extra: calc(var(--pad-left) + var(--pad-right) + 28px);--rail-size: clamp(58px, 8vw, 82px);--info-size: clamp(100px, 13vw, 138px);--digit-size: clamp(38px, 6vw, 62px);--board-size: min(calc(100svh - var(--pad-top) - var(--pad-bottom)), calc(100vw - var(--rail-size) - var(--info-size) - var(--digit-size) - var(--layout-extra)), 660px);grid-template-columns:var(--rail-size) minmax(0,1fr);grid-template-rows:var(--board-size);column-gap:8px;align-content:center;width:min(100%,calc(var(--rail-size) + var(--board-size) + var(--info-size) + var(--digit-size) + var(--layout-extra)));min-height:100svh;padding:var(--pad-top) var(--pad-right) var(--pad-bottom) var(--pad-left)}.topbar{grid-column:1;grid-row:1;flex-direction:column;justify-content:space-between;align-items:stretch;min-width:0;height:var(--board-size);margin:0}.brand{flex-direction:column;align-items:center;gap:4px;text-align:center}.brand-mark{width:30px;height:30px}.brand-copy strong{font-size:14px}.brand-copy small{font-size:7px}.top-actions{flex-direction:column;gap:6px;width:100%}.top-actions button{flex-direction:column;justify-content:center;gap:1px;width:100%;min-height:44px;padding:4px 1px;border-radius:11px;font-size:10px;white-space:nowrap}.top-actions svg{width:16px;height:16px}.game-content{grid-column:2;grid-row:1;display:grid;grid-template-columns:minmax(0,var(--board-size)) minmax(0,var(--info-size)) minmax(0,var(--digit-size));grid-template-rows:var(--board-size);column-gap:8px}.board-frame{grid-column:1;grid-row:1;width:100%;padding:3px}.game-settings{grid-column:2;grid-row:1;min-width:0}.level-row{flex-direction:column;align-items:stretch;gap:4px;margin:0 0 8px}.section-label{font-size:11px}.level-switch{width:100%;padding:2px}.level-switch button{min-height:26px;font-size:10px}.game-meta{display:flex;flex-direction:column;align-items:stretch;gap:3px;margin:0}.meta-block{justify-content:space-between;gap:2px}.meta-block span{font-size:11px}.meta-block strong{font-size:12px}.meta-divider{display:none}.resource-group{flex-direction:column;align-items:stretch;gap:3px}.lives svg{width:12px;height:12px}.meta-block .lives{gap:1px}.game-controls{display:contents}.tools{grid-column:2;grid-row:1;align-self:end;display:grid;grid-template-columns:1fr;gap:2px;margin:0}.tools button{flex-direction:row;justify-content:flex-start;width:100%;min-height:27px;gap:4px;padding:0 3px;font-size:10px}.tools svg{width:19px;height:19px}.tools b{top:4px;right:3px;left:auto}.tools #hint-badge{top:4px;right:3px;left:auto;min-width:17px;height:17px;font-size:10px}.keypad{grid-column:3;grid-row:1;grid-template-columns:1fr;grid-template-rows:repeat(9,minmax(0,1fr));align-items:stretch;height:100%;gap:3px}.digit{flex-direction:row;min-height:0;padding:0;border-radius:8px}.digit strong{font-size:clamp(17px,5svh,29px)}.digit small{min-width:17px;height:17px;padding:0 2px;font-size:11px}.cell{font-size:clamp(17px,5svh,36px)}.cell-notes i{font-size:clamp(7px,1.8svh,12px)}}@media(orientation:landscape)and (min-width:900px){.brand-mark{width:32px;height:32px}.brand-copy strong{font-size:16px}.brand-copy small{font-size:8px}.top-actions button{min-height:56px;font-size:12px}.top-actions svg{width:20px;height:20px}.section-label{font-size:13px}.level-switch button{min-height:30px;font-size:12px}.meta-block span{font-size:12px}.meta-block strong{font-size:13px}.lives svg{width:14px;height:14px}.tools button{min-height:36px;font-size:12px}.tools svg{width:22px;height:22px}.digit strong{font-size:32px}.digit small{min-width:20px;height:20px;font-size:12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.cell.wrong-feedback{background:var(--moki-coral-light);box-shadow:inset 0 0 0 2px var(--moki-coral)}.cell.wrong-feedback .cell-value{opacity:1;color:#913b32;transform:none}.digit.wrong-feedback{background:var(--moki-coral-light);color:#913b32;box-shadow:0 0 0 3px #d76c5738}.digit.wrong-feedback small{background:#913b32;color:#fff}}