:root{--bg: #f3f4f6;--surface: #ffffff;--text: #1f2933;--muted: #6b7280;--line: #d6dae0;--cell-closed: #c9d0d9;--cell-closed-hover: #b7c0cc;--cell-open: #f8f9fb;--entrance: #3fb37f;--exit: #4c8dff;--start: #2f6fe0;--goal: #111827;--path: #f2cd55;--path-text: #3d3200;--danger: #e5484d;--primary: #1f2933;--primary-text: #ffffff;--n1: #2563eb;--n2: #15803d;--n3: #dc2626;--n4: #6d28d9;--n5: #b45309;--n6: #0e7490;--n7: #111827;--n8: #6b7280;color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #14181d;--surface: #1d232a;--text: #e6e9ee;--muted: #8b95a3;--line: #2d3540;--cell-closed: #3a4654;--cell-closed-hover: #465465;--cell-open: #222a33;--primary: #e6e9ee;--primary-text: #14181d;--start: #6ea8ff;--goal: #e6e9ee;--n1: #6ea8ff;--n2: #5fd08f;--n3: #ff7a7a;--n4: #c49bff;--n5: #f2b25c;--n6: #5ad2e6;--n7: #e6e9ee;--n8: #a3acb9;color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Malgun Gothic,Noto Sans KR,system-ui,sans-serif;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;touch-action:manipulation;user-select:none;-webkit-user-select:none}button:disabled{cursor:default;opacity:.4}.app{max-width:820px;height:100dvh;margin:0 auto;padding:max(10px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:8px;overflow-y:auto}.side{display:flex;flex-direction:column;gap:8px;flex-shrink:0}.main{position:relative;flex:1;min-height:240px;display:flex}.mode-toast{position:absolute;top:12px;left:50%;z-index:6;transform:translate(-50%);padding:8px 16px;border-radius:999px;background:var(--primary);color:var(--primary-text);font-weight:700;font-size:.95rem;white-space:nowrap;pointer-events:none;box-shadow:0 4px 14px #0003;animation:toastInOut .9s ease both}.mode-toast.flag{background:var(--danger);color:#fff}@keyframes toastInOut{0%{opacity:0;transform:translate(-50%,-6px)}15%,70%{opacity:1;transform:translate(-50%)}to{opacity:0}}@media (prefers-reduced-motion: reduce){.mode-toast{animation:none}}.pause-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:var(--bg);border-radius:10px}.pause-overlay strong{font-size:1.3rem}.pause-overlay span{color:var(--muted);font-variant-numeric:tabular-nums}.pause-overlay .primary{min-width:160px;min-height:44px}.dock{flex-shrink:0}.touch-only{display:none}@media (hover: none) and (pointer: coarse){.touch-only{display:inline}.mouse-only{display:none}}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px}.topbar .app-title{font-weight:800;font-size:1.15rem;margin:0;letter-spacing:-.02em;white-space:nowrap}.app-links{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:.75rem;margin-top:-2px}.app-links a{color:var(--muted);text-decoration:underline;text-underline-offset:2px}.app-links a:hover{color:var(--text)}.topbar-actions{display:flex;gap:4px;flex-shrink:0}.mode-switch{margin-right:auto;padding:2px}.segmented.mode-switch button{padding:5px 12px;font-size:.85rem;white-space:nowrap}.mode-timeAttack .mode-switch button.on{background:var(--danger);color:#fff}.ghost{padding:6px 12px;border-radius:8px;border:1px solid var(--line);background:var(--surface)}.ghost:hover{border-color:var(--muted)}.ghost.icon{padding:4px 10px}.primary{padding:9px 16px;border-radius:8px;background:var(--primary);color:var(--primary-text);font-weight:600}.primary.block{width:100%;margin-top:12px}.link{margin-top:14px;font-size:.85rem;text-decoration:underline}.danger{color:var(--danger)}.hud{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.stat{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px 8px;display:flex;flex-direction:column;min-width:0}.stat-label{font-size:.7rem;color:var(--muted)}.stat-value{font-size:1.05rem;font-weight:700;font-variant-numeric:tabular-nums}.stat-sub{font-size:.7rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stat.timer{text-align:left;align-items:stretch}.stat.timer:disabled{opacity:1}.stat.timer.toggle:hover{border-color:var(--muted)}.stat.timer .stat-label{display:flex;justify-content:space-between;gap:4px}.timer-icon{font-size:.6rem;letter-spacing:-.15em}.stat.timer.caution .stat-value{color:var(--n5)}.stat.timer.warn{border-color:var(--danger)}.stat.timer.warn .stat-value{color:var(--danger);animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{opacity:.55}}@media (prefers-reduced-motion: reduce){.stat.timer.warn .stat-value,.cell.path{animation:none}}.segmented{display:grid;grid-template-columns:1fr 1fr;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:3px}.segmented button{padding:9px 8px;border-radius:7px;font-weight:600;color:var(--muted)}.segmented button.on{background:var(--primary);color:var(--primary-text)}.tip{margin:0;font-size:.78rem;color:var(--muted);line-height:1.45}.result{background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--path);border-radius:10px;padding:10px 12px}.result.lost{border-left-color:var(--danger)}.result p{margin:4px 0;font-size:.9rem}.result .muted{color:var(--muted);font-size:.78rem}.result-head{display:flex;align-items:center;gap:8px;font-size:1.05rem}.badge{font-size:.72rem;font-weight:700;background:var(--path);color:var(--path-text);padding:2px 8px;border-radius:999px}.result-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-top:8px}.wrong-legend{color:var(--danger);font-weight:700}.board-area{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.board-fit{flex:1;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center}.viewport{position:relative;overflow:auto;scrollbar-width:none;touch-action:none;overscroll-behavior:contain;border-radius:8px;flex-shrink:0;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.viewport::-webkit-scrollbar{display:none}.viewport.zoomed{cursor:grab;box-shadow:0 0 0 2px var(--exit)}.zoom-layer{container-type:inline-size}.zoom-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0}.zoom-hint{font-size:.75rem;color:var(--muted)}.zoom-controls{display:flex;border:1px solid var(--line);border-radius:8px;background:var(--surface);overflow:hidden}.zoom-controls button{min-width:40px;height:34px;font-size:1.1rem;font-weight:700}.zoom-controls .zoom-value{min-width:58px;font-size:.8rem;font-variant-numeric:tabular-nums;border-inline:1px solid var(--line)}.board{width:100%;display:grid;grid-template-columns:repeat(var(--n),1fr);gap:clamp(1px,calc(100cqw / var(--n) * .07),3px);padding:clamp(2px,calc(100cqw / var(--n) * .12),6px);background:var(--line);border-radius:8px}.cell{aspect-ratio:1;display:grid;place-items:center;border-radius:clamp(1px,calc(100cqw / var(--n) * .12),5px);font-size:calc(100cqw / var(--n) * .55);font-weight:800;line-height:1;font-variant-numeric:tabular-nums;cursor:pointer}.cell.closed,.cell.flagged{background:var(--cell-closed)}@media (hover: hover){.status-playing .cell.closed:hover{background:var(--cell-closed-hover)}}.status-playing .cell.closed:active{background:var(--cell-closed-hover)}.cell.open{background:var(--cell-open);cursor:default}.cell.flagged{font-size:calc(100cqw / var(--n) * .5)}.cell.n1{color:var(--n1)}.cell.n2{color:var(--n2)}.cell.n3{color:var(--n3)}.cell.n4{color:var(--n4)}.cell.n5{color:var(--n5)}.cell.n6{color:var(--n6)}.cell.n7{color:var(--n7)}.cell.n8{color:var(--n8)}.cell.entrance,.cell.exit{position:relative;box-shadow:inset 0 0 0 clamp(2px,calc(100cqw / var(--n) * .09),3px) var(--mark)}.cell.entrance{--mark: var(--start)}.cell.exit{--mark: var(--goal)}.cell .cell-icon{width:72%;height:72%;color:var(--mark, var(--start))}.cell.exit .corner-icon{position:absolute;right:6%;top:6%;width:34%;height:34%;color:var(--goal);opacity:.85}.cell.walker .cell-icon{color:var(--start)}.cell.path.walker .cell-icon{color:#1b3f8a}.cell.walker.arrived .cell-icon{animation:arrive .5s ease}@keyframes arrive{40%{transform:scale(1.35)}}.cell.mine{background:color-mix(in srgb,var(--danger) 22%,var(--cell-closed));font-size:calc(100cqw / var(--n) * .5)}.cell.exploded{background:var(--danger)}.cell.wrong{color:var(--danger)}.status-lost .cell,.status-won .cell{cursor:default}.cell.path{background:var(--path);color:var(--path-text);animation:pathIn .5s ease both}@keyframes pathIn{0%{transform:scale(.7);opacity:.4}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:grid;place-items:center;padding:16px;z-index:10}.modal{width:min(460px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--surface);border-radius:14px;padding:14px 16px 16px}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.modal-head h2{margin:0;font-size:1.05rem}.rules{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:.92rem;line-height:1.5}.chip{display:inline-grid;place-items:center;width:1.5em;height:1.5em;border-radius:4px;font-size:.8em;font-weight:800;vertical-align:middle}.chip.entrance{box-shadow:inset 0 0 0 2px var(--start);color:var(--start)}.chip.exit{box-shadow:inset 0 0 0 2px var(--goal);color:var(--goal)}.chip svg{width:78%;height:78%}.rules-head{margin:14px 0 6px;font-size:.95rem}.modal-tabs{margin-bottom:6px}.modal-note{margin:0 0 8px;font-size:.78rem;color:var(--muted)}.stage-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.stage-btn{width:100%;display:grid;grid-template-columns:2.2em 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--bg)}.stage-btn:disabled{opacity:.5;cursor:not-allowed}.stage-btn.current{border-color:var(--primary)}.stage-btn.cleared .stage-rec{color:var(--n2)}.stage-no{grid-row:span 2;font-size:1.2rem;font-weight:800;text-align:center}.stage-meta{font-size:.85rem;font-weight:600}.stage-rec{font-size:.75rem;color:var(--muted)}@media (max-width: 560px),(orientation: landscape) and (max-height: 560px){.topbar .app-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}@media (max-width: 480px){.app{gap:6px;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}.side{gap:6px}.topbar .app-title{font-size:1.05rem}.segmented.mode-switch button{padding:5px 9px}.ghost{min-height:36px;padding:6px 10px}.hud{gap:4px}.stat{padding:4px 6px;border-radius:8px}.stat-label,.stat-sub{font-size:.66rem}.stat-value{font-size:.95rem}.segmented button{min-height:42px}.tip{font-size:.74rem}.result{padding:8px 10px}.result p{font-size:.84rem}.result-actions button{flex:1;min-height:42px}.zoom-controls button{min-width:44px;height:38px}.modal-backdrop{align-items:end;padding:0}.modal{width:100%;border-radius:16px 16px 0 0;padding-bottom:max(16px,env(safe-area-inset-bottom))}}@media (orientation: landscape) and (max-height: 560px){.app{max-width:none;display:grid;grid-template-columns:min(300px,42vw) 1fr;grid-template-rows:1fr auto;grid-template-areas:"side main" "dock main";gap:8px 12px;overflow:hidden}.side{grid-area:side;overflow-y:auto;min-height:0}.dock{grid-area:dock}.hud{grid-template-columns:repeat(2,1fr)}.main{grid-area:main;min-height:0;min-width:0}.modal-backdrop{align-items:center;padding:12px}.modal{border-radius:14px}}.segmented.mode-switch{grid-template-columns:repeat(3,auto)}.mode-daily .mode-switch button.on{background:var(--exit);color:#fff}.topbar-actions .icon-only{display:none}.link{color:var(--exit);cursor:pointer}.rank-line .link,.rank-me .link,.daily-gate .link{margin:0 0 0 4px;padding:0;font-size:inherit}.rank-line{font-size:.86rem}.result .rank-line.muted,.rank-line.muted{color:var(--muted);font-size:.8rem}.pause-note{max-width:300px;text-align:center;font-size:.8rem;line-height:1.45;padding:0 12px}.daily-gate{background:color-mix(in srgb,var(--bg) 94%,transparent);padding:16px}.daily-gate .primary{min-width:180px;min-height:46px;font-size:1.05rem}.daily-gate .primary:disabled{opacity:.6}.form-error{color:var(--danger);font-size:.85rem;margin:6px 0 0}.text-input{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-height:40px;min-width:0}.text-input:focus{outline:2px solid var(--exit);outline-offset:1px}.nickname-form{display:flex;gap:6px;margin:6px 0}.nickname-form .text-input{flex:1}.rank-filters{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:space-between;margin:6px 0}.rank-filters select{flex:1}.date-nav{display:flex;align-items:center;gap:6px;font-weight:700}.date-nav .ghost:disabled{opacity:.3}.metric-switch{padding:2px}.metric-switch button{padding:6px 12px;font-size:.85rem}.rank-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;max-height:min(52vh,460px);overflow-y:auto}.rank-row{display:grid;grid-template-columns:2.6em 1fr auto;align-items:center;gap:8px;padding:7px 10px;border-top:1px solid var(--line)}.rank-row:first-child{border-top:0}.rank-row.me{background:color-mix(in srgb,var(--path) 30%,transparent)}.rank-no{font-weight:800;text-align:center;font-variant-numeric:tabular-nums}.rank-row.top1 .rank-no:before{content:"🥇"}.rank-row.top2 .rank-no:before{content:"🥈"}.rank-row.top3 .rank-no:before{content:"🥉"}.rank-row.top1 .rank-no,.rank-row.top2 .rank-no,.rank-row.top3 .rank-no{font-size:0}.rank-row.top1 .rank-no:before,.rank-row.top2 .rank-no:before,.rank-row.top3 .rank-no:before{font-size:1.2rem}.rank-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.me-tag{margin-left:6px;font-size:.7rem;padding:1px 6px;border-radius:999px;background:var(--primary);color:var(--primary-text);vertical-align:middle}.rank-score{display:flex;flex-direction:column;align-items:flex-end;font-variant-numeric:tabular-nums}.rank-score small{color:var(--muted);font-size:.72rem}.rank-gap{text-align:center;color:var(--muted);border-top:1px solid var(--line)}.rank-empty{text-align:center;color:var(--muted);padding:24px 0}.rank-me{margin-top:10px;font-size:.85rem;color:var(--muted)}@media (max-width: 480px){.topbar-actions .label{display:none}.topbar-actions .icon-only{display:inline}.topbar-actions .ghost{min-width:36px;padding:6px 8px}.segmented.mode-switch button{padding:5px 7px;font-size:.8rem}}.help-btn.attention{border-color:var(--start);color:var(--start);font-weight:700;animation:helpPulse 1.6s ease-in-out infinite}@keyframes helpPulse{0%,to{box-shadow:0 0 color-mix(in srgb,var(--start) 55%,transparent)}60%{box-shadow:0 0 0 7px color-mix(in srgb,var(--start) 0%,transparent)}}@media (prefers-reduced-motion: reduce){.help-btn.attention{animation:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--start) 45%,transparent)}}.help-lead{margin:0 0 4px;font-size:.95rem;line-height:1.6}.help-links a{color:var(--start);font-weight:600}.home-info[hidden]{display:none}.board-loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;align-items:center;justify-content:center;pointer-events:auto}.board-loading span{padding:8px 16px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--muted);font-size:.9rem;opacity:0;animation:loadingShow .2s ease .3s forwards}@keyframes loadingShow{to{opacity:1}}