:root{--bg:#0f1218;--panel:#171b24;--cell:#1d222d;--cell-sel:#3358a8;--line:#2c3342;--line-strong:#6b7590;--ink:#eef1f7;--ink-user:#8fc6ff;--ink-note:#9aa3b5;--wrong:#ff6b7a;--good:#5ad19a;--accent:#ffd166;--btn:#232937;--btn-hi:#2f3748;--sg-exit-bg:transparent;--sg-exit-color:var(--ink);--sg-exit-size:44px;--sg-exit-radius:10px;--sg-exit-border:1px solid var(--line)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-user-select:none;user-select:none;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#app{height:100dvh;padding:max(8px, env(safe-area-inset-top)) 12px max(10px, env(safe-area-inset-bottom));flex-direction:column;align-items:center;gap:10px;display:flex}.hud{justify-content:space-between;align-items:center;gap:8px;width:min(100%,560px);display:flex}.hud-left,.hud-right{align-items:center;gap:8px;display:flex}h1{letter-spacing:.02em;margin:0;font-size:20px}.pill{background:var(--btn);color:var(--ink-note);white-space:nowrap;border-radius:999px;padding:3px 9px;font-size:12px}.stat{font-variant-numeric:tabular-nums;color:var(--ink-note);text-align:right;min-width:44px;font-size:15px}.hud-btn{border:1px solid var(--line);width:44px;height:44px;color:var(--ink);cursor:pointer;background:0 0;border-radius:10px;font-size:18px}.hud-btn.off{color:var(--ink-note);text-decoration:line-through}.wrap{--size:min(100vw - 24px, 100dvh - 250px, 560px);width:var(--size);height:var(--size);overscroll-behavior:contain;border:1px solid var(--line);background:var(--panel);scrollbar-width:thin;border-radius:8px;overflow:auto}.board{--n:7;--cell:calc(var(--size) / var(--n));--gap:4px;width:calc(var(--cell) * var(--n));height:calc(var(--cell) * var(--n));background-image:radial-gradient(circle, var(--line) 1.5px, transparent 1.6px);background-size:var(--cell) var(--cell);position:relative}.board.zoomed{--cell:max(calc(var(--size) / var(--n)), 46px);--gap:5px}.isle{--d:clamp(26px, calc(var(--cell) * .82), 50px);z-index:2;width:var(--d);height:var(--d);left:calc((var(--c) + .5) * var(--cell));top:calc((var(--r) + .5) * var(--cell));border:2px solid var(--line-strong);background:var(--cell);color:var(--ink);font:700 calc(var(--d) * .5) system-ui, sans-serif;cursor:pointer;border-radius:50%;place-items:center;margin:0;padding:0;line-height:1;transition:box-shadow .1s,border-color .1s;display:grid;position:absolute;transform:translate(-50%,-50%)}.isle.done{border-color:var(--good);color:var(--good);background:#16241f}.isle.over{border-color:var(--wrong);color:var(--wrong);background:#2a1a1f}.isle.sel{background:var(--cell-sel);border-color:var(--accent);color:var(--ink);box-shadow:0 0 0 4px #ffd1664d}.isle.cur{box-shadow:0 0 0 3px #8fc6ff8c}.isle.sel.cur{box-shadow:0 0 0 4px #ffd1664d,0 0 0 6px #8fc6ff73}.isle.hint:after{content:"";background:var(--accent);opacity:.7;border-radius:50%;width:6px;height:6px;position:absolute;bottom:2px}.isle.hint{border-color:#ffd16699}.link{z-index:1;pointer-events:none;cursor:pointer;position:absolute}.link.on{pointer-events:auto}.link.h{left:calc((var(--c) + .5) * var(--cell));top:calc((var(--r) + .5) * var(--cell));width:calc(var(--len) * var(--cell));height:calc(var(--cell) * .6);transform:translateY(-50%)}.link.v{left:calc((var(--c) + .5) * var(--cell));top:calc((var(--r) + .5) * var(--cell));height:calc(var(--len) * var(--cell));width:calc(var(--cell) * .6);transform:translate(-50%)}.link i{background:var(--ink-user);border-radius:2px;display:none;position:absolute}.link.h i{height:3px;top:50%;left:0;right:0;transform:translateY(-50%)}.link.v i{width:3px;top:0;bottom:0;left:50%;transform:translate(-50%)}.link.v1 i:first-child,.link.v2 i{display:block}.link.h.v2 i:first-child{transform:translateY(calc(-50% - var(--gap)))}.link.h.v2 i:last-child{transform:translateY(calc(-50% + var(--gap)))}.link.v.v2 i:first-child{transform:translateX(calc(-50% - var(--gap)))}.link.v.v2 i:last-child{transform:translateX(calc(-50% + var(--gap)))}.link.wrong i{background:var(--wrong)}.link.pop i{animation:.16s ease-out pop}@keyframes pop{0%{opacity:.2}to{opacity:1}}.controls{flex-direction:column;gap:6px;width:min(100%,560px);display:flex}.status{color:var(--ink-note);text-align:center;min-height:18px;margin:0;font-size:13px}.status.bad{color:var(--wrong)}.status.good{color:var(--good)}.actions{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.act{border:1px solid var(--line);background:var(--btn);height:48px;color:var(--ink);cursor:pointer;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:1px;font-size:12px;display:flex}.act .ico{font-size:18px;line-height:1}.act .ico svg{fill:none;stroke:currentColor;stroke-width:2.6px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:18px;display:block}.act[aria-pressed=true]{background:var(--accent);color:#1a1500;border-color:var(--accent)}.act:disabled{opacity:.4;cursor:default}.act:active{background:var(--btn-hi)}.overlay{z-index:5;background:#080a0ed1;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.overlay.hidden,.hidden{display:none!important}.card{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:16px;flex-direction:column;gap:10px;width:min(100%,360px);padding:22px 20px;display:flex}.card h2{margin:0;font-size:28px}.sub{color:var(--ink-note);margin:0;font-size:14px}.sub.small{font-size:12px}.rules{color:var(--ink-note);margin:2px 0 0;font-size:12px;line-height:1.4}.btn{border:1px solid var(--line);background:var(--btn);height:48px;color:var(--ink);cursor:pointer;border-radius:12px;font-size:16px;font-weight:600}.btn:hover{background:var(--btn-hi)}.btn.primary{background:var(--accent);color:#1a1500;border-color:var(--accent)}.btn.daily{border-color:var(--accent);color:var(--accent)}.btn small{color:var(--ink-note);font-size:11px;font-weight:500;display:block}.levels{grid-template-columns:1fr 1fr;gap:8px;display:grid}.levels .btn{height:52px;line-height:1.15}.stats{color:var(--ink-note);margin:4px 0 0;font-size:12px}.top{text-align:left;color:var(--ink-note);margin:0;padding:0 0 0 20px;font-size:13px}.top li span{float:right;color:var(--ink);font-variant-numeric:tabular-nums}@media (min-width:700px) and (min-height:700px){.wrap{--size:min(100vw - 24px, 100dvh - 270px, 560px)}}#menu>.card,#win>.card,#end>.card{max-height:100%;overflow-y:auto}#menu>.card>*,#win>.card>*,#end>.card>*{flex-shrink:0}.hud sg-exit{z-index:6;position:relative}@media (orientation:landscape) and (max-height:560px){body:not(.cover) #app{padding:max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));grid-template-rows:auto auto auto 1fr;grid-template-columns:minmax(0,1fr) minmax(250px,340px);place-content:stretch center;gap:8px 16px;display:grid}body:not(.cover) #app>*{grid-column:2;width:100%;min-width:0}body:not(.cover) #app>.wrap{width:var(--size);--size:min(100dvh - 20px, 100vw - 380px);grid-area:1/1/-1;place-self:center}#menu>.card{gap:10px;width:min(100%,640px,100vw - 136px);padding:16px 22px}#menu .levels{grid-template-columns:repeat(auto-fit,minmax(84px,1fr))}body:has(.overlay:not(.hidden)) .hud-left{visibility:hidden}body:has(.overlay:not(.hidden)) .hud .stat{visibility:hidden}.overlay{padding-top:8px;padding-bottom:8px}}body.cover #app{gap:0;padding:0;overflow:hidden}body.cover .hud,body.cover .controls,body.cover .overlay{display:none!important}body.cover .wrap{border:0;border-radius:0;flex:none;width:100vw;height:100vh;position:relative;overflow:hidden}body.cover .board{--cell:128px;--gap:11px;left:calc(50% - 5.5 * var(--cell));top:calc(50% - 4.9 * var(--cell));background-image:none;position:absolute}body.cover .isle{--d:calc(var(--cell) * .7);border-width:4px}body.cover .isle:not(.done):not(.sel):not(.over){background:#1d222d}body.cover .link.h i{height:7px}body.cover .link.v i{width:7px}