:root{color-scheme:dark;--ink:#f4f0ff;--muted:#c7bdd8;--accent:#c8a8ff;--ivory:#d8d1bf;--surface:#191c30;--line:#ffffff26}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{padding:6px;background:radial-gradient(ellipse at 0 0,#312246,transparent 60%),#0d1120;color:var(--ink);font:14px system-ui,sans-serif}.shell{position:relative;width:min(100%,1000px);height:100%;margin:auto;padding:16px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#1c1930,#141b2b);box-shadow:0 20px 80px #0005}header{display:flex;align-items:center;gap:12px}.brand{margin-right:auto}.brand>span,.eyebrow{font-size:8px;font-weight:750;letter-spacing:.13em;color:var(--muted)}h1{font-size:27px;letter-spacing:-1px;margin:4px 0 0}h1 span{font-size:19px;color:var(--accent)}.meta{display:flex;gap:19px;font-variant-numeric:tabular-nums}.meta>div{display:grid;gap:4px}.meta span{font-size:7px;letter-spacing:.08em;font-weight:700;color:var(--muted)}.meta strong{font-size:15px}.icon{display:grid;place-items:center;min-width:36px;min-height:36px;padding:0;font-size:20px}button{font:inherit;border:1px solid var(--line);border-radius:10px;min-height:38px;padding:7px 10px;color:var(--ink);background:#ffffff08;cursor:pointer;touch-action:manipulation}button:hover{background:#ffffff14}button:active{transform:translateY(1px)}button:focus-visible,summary:focus-visible{outline:3px solid #b5f2eb;outline-offset:2px}button:disabled{opacity:.42;cursor:default}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px;min-height:0}.board-area{display:grid;place-items:center;min-width:0;min-height:0}.board-frame{position:relative;aspect-ratio:1;border:2px solid var(--ivory);border-radius:10px;overflow:hidden;box-shadow:0 12px 35px #0004}#board{display:grid;grid-template-rows:repeat(9,1fr);gap:1px;background:#b9b0bb;height:100%;width:100%}.row{display:grid;grid-template-columns:repeat(9,1fr);gap:1px;min-height:0}.row:nth-child(3),.row:nth-child(6){border-bottom:2px solid var(--ivory)}.cell{border:0;border-radius:0;padding:0;min-height:0;min-width:0;display:grid;place-items:center;background:#161c30;color:#f1eee7;font-size:clamp(18px,3.2vw,29px);font-weight:600;font-variant-numeric:tabular-nums;position:relative;touch-action:manipulation;aspect-ratio:1}.cell:nth-child(3),.cell:nth-child(6){border-right:2px solid var(--ivory)}.cell[data-fixed=false]{color:#d9bdff}.cell[data-peer=true]{background:#24273e}.cell[data-same=true]{background:#393253}.cell[data-selected=true]{background:#624780;box-shadow:inset 0 0 0 2px #e8cfff}.cell[data-error=true]{background:#612e44;color:#ffced6}.cell:disabled{opacity:1}.cell:focus-visible{outline:0;box-shadow:inset 0 0 0 3px #b5f2eb;z-index:1}.pencil{display:grid;grid-template-columns:repeat(3,1fr);width:100%;height:100%;padding:1px;font-size:clamp(7px,1.2vw,11px);font-weight:450;color:#d9cee8}.pencil span{display:grid;place-items:center}.controls{display:flex;flex-direction:column;min-height:0;gap:12px;overflow-y:auto}.keypad{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.keypad button{min-height:48px;background:#27253d;font-size:22px;font-weight:600;padding:4px}.keypad small{display:block;color:var(--muted);font-size:8px;font-weight:400;margin-top:1px}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.tools button{font-size:11px;min-height:39px;padding:6px 3px}.tools button[aria-pressed=true]{background:#67498b;border-color:#dcbcff}.tools span{display:block;font-size:16px;margin-bottom:2px}.help-card{padding:12px;border:1px solid var(--line);border-radius:13px;background:#101527}.help-card strong{font-size:12px}.help-card p{font-size:11px;color:var(--muted);line-height:1.65;margin:9px 0 0}.help-card .fine{font-size:9px}details{font-size:11px;margin-top:10px;color:var(--muted);line-height:1.5}summary{cursor:pointer}footer{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:15px;font-size:10px;color:var(--muted)}#save-state{font-size:8px;text-align:right;flex-shrink:0}#cover{position:absolute;inset:0;z-index:4;display:grid;place-items:center;padding:15px;background:#101527f2;backdrop-filter:blur(5px);text-align:center}.cover-card{width:100%;max-width:310px;max-height:100%;overflow:auto}.cover-card h2{font-size:clamp(23px,4vw,34px);line-height:1.1;letter-spacing:-1px;margin:8px 0 13px}.cover-card p:not(.eyebrow){font-size:12px;line-height:1.65;color:var(--muted);margin:0 0 17px}.primary{width:100%;background:#c3a3ff;color:#1c1030;border-color:#dfcaff;font-weight:750;min-height:42px}.primary:hover{background:#d6c0ff}.secondary{width:100%;margin-top:7px;min-height:36px;font-size:12px}.cover-card small{display:block;font-size:9px;line-height:1.5;color:var(--muted);margin-top:12px}#hint-panel{position:absolute;z-index:5;right:16px;bottom:40px;width:min(330px,calc(100% - 32px));padding:15px;border:1px solid #b595e3;border-radius:16px;background:#252038;box-shadow:0 15px 60px #0009}#hint-panel>div{display:flex;justify-content:space-between;align-items:center;gap:12px}#hint-panel strong{font-size:13px}#close-hint{min-width:32px;min-height:32px;font-size:22px;padding:0}#hint-copy{font-size:12px;line-height:1.6;color:#e2d9ee;margin:10px 0}#apply-hint{font-size:12px;min-height:36px}[hidden]{display:none!important}
@media(max-width:700px){.shell{padding:10px;gap:8px;border-radius:17px}header{gap:8px;flex-wrap:wrap}.brand{flex:1 1 100%;display:flex;align-items:center;justify-content:space-between}.brand>span{font-size:7px}.brand h1{font-size:22px;margin:0}.meta{flex:1;gap:19px}.meta strong{font-size:13px}.icon{min-width:33px;min-height:33px}.workspace{display:flex;flex-direction:column;gap:8px}.board-area{flex:1;min-height:0}.controls{flex-shrink:0;gap:6px;overflow:visible}.keypad{grid-template-columns:repeat(9,1fr);gap:4px}.keypad button{font-size:19px;min-height:39px;border-radius:7px}.keypad small{font-size:7px}.tools{grid-template-columns:repeat(5,1fr);gap:4px}.tools button{min-height:33px;font-size:10px;padding:3px 1px}.tools span{display:inline;font-size:12px;margin:0 2px 0 0}.help-card{display:none}.cell{font-size:clamp(17px,6vw,27px)}.pencil{font-size:clamp(7px,2.2vw,10px)}footer{font-size:9px;line-height:1.3}#save-state{font-size:7px;max-width:90px}.cover-card h2{font-size:27px}.cover-card p:not(.eyebrow){font-size:11px;margin-bottom:12px}.cover-card small{font-size:8px;margin-top:8px}#hint-panel{bottom:100px;right:10px;width:calc(100% - 20px)}html[data-embedded=true] .brand{display:none}}
@media(max-height:500px) and (orientation:landscape){.shell{padding:8px;gap:6px}.brand{display:none}.meta{margin-right:auto}.workspace{grid-template-columns:minmax(0,1fr) 245px;gap:14px}.keypad button{min-height:36px;font-size:19px}.controls{gap:7px}.tools{grid-template-columns:repeat(5,1fr)}.tools button{min-height:35px;font-size:8px}.tools span{font-size:13px}.help-card{padding:8px}.help-card p,.help-card details{font-size:9px;margin-top:5px}.help-card .fine{display:none}.cover-card h2{font-size:25px}.cover-card p:not(.eyebrow){font-size:11px}#hint-panel{bottom:30px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}