.game-header{width:100%;padding:6px 18px 0;display:flex;align-items:center;justify-content:space-between}.moves-row{position:relative;width:min(90vw,450px);display:flex;align-items:center;justify-content:center}.moves-row .undo-icon{position:absolute;right:0}.game-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:20px;width:100%;padding-top:12px;padding-bottom:20px}.score{display:flex;flex-direction:column;gap:6px;width:min(90vw,450px)}.moves-total{font-size:2.5rem;font-weight:700;color:var(--accent);line-height:1}.bar{position:relative;display:flex;height:14px;border-radius:7px;background:var(--bar-track)}.bar-zone{height:100%}.bar-zone:first-child{border-top-left-radius:7px;border-bottom-left-radius:7px}.bar-zone:last-child{border-top-right-radius:7px;border-bottom-right-radius:7px}.bar-3{background:var(--bar-3)}.bar-2{background:var(--bar-2)}.bar-1{background:var(--bar-1)}.bar-marker{position:absolute;top:-4px;width:3px;height:22px;background:var(--marker);border-radius:2px;transform:translate(-50%);transition:left .15s}.bar-marker.over{background:var(--accent)}.bar-ticks{position:relative;height:1.2em;font-size:.95rem;color:var(--tick-text)}.tick{position:absolute;transform:translate(-50%)}.tick-end{right:0;transform:none}#board{display:grid;grid-template-columns:repeat(9,1fr);gap:2px;padding:4px;background:var(--board-gutter);border-radius:8px;width:min(90vw,450px);aspect-ratio:1}.cell{display:flex;align-items:center;justify-content:center;background:var(--cell-bg);font-size:clamp(1rem,4vw,1.6rem);font-weight:700;cursor:pointer;user-select:none;transition:background .15s,transform .15s;border-radius:3px;position:relative}.cell.swappable:hover{background:var(--cell-hover)}.cell.selected{box-shadow:inset 0 0 0 3px var(--accent),0 2px 8px color-mix(in srgb,var(--accent) 35%,transparent);transform:scale(1.06);z-index:2}.cell.fixed{color:var(--fixed-text);cursor:not-allowed;background:var(--fixed-bg);font-weight:600}.cell.swappable{color:var(--cell-text);font-weight:700}.cell.conflict{color:var(--conflict-text)}.cell.border-left{border-left:3px solid var(--grid-line)}.cell.border-top{border-top:3px solid var(--grid-line)}.solved{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:4.4rem}.solved-stars{font-size:2.4rem;letter-spacing:8px}.solved-stars .filled{color:var(--accent)}.solved-stars .empty{color:var(--star-empty)}.solved-text{font-size:1.2rem;font-weight:700;color:var(--accent)}#board.solved-board{box-shadow:0 0 0 4px var(--accent)}[hidden]{display:none!important}.level-label{font-size:1.1rem;font-weight:700;color:var(--muted-text);letter-spacing:.04em}.controls{display:flex;gap:12px;align-items:center}.btn-secondary{background:var(--cell-bg);border-color:var(--border);color:var(--muted-text)}.btn-secondary:hover{background:var(--cell-bg);border-color:var(--accent);color:var(--accent)}.btn:disabled{opacity:.45;cursor:default}.difficulty{display:flex;gap:8px}.difficulty button{padding:6px 14px;background:var(--cell-bg);color:var(--muted-text);border:2px solid var(--border);border-radius:0;cursor:pointer;font-family:inherit;font-weight:700;transition:color .15s ease,border-color .15s ease,transform .15s ease}.difficulty button:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}.difficulty button.active{border-color:var(--accent);color:var(--accent)}.intro{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:#14141e8c;backdrop-filter:blur(2px)}.intro.hidden{display:none}.intro-card{background:var(--cell-bg);color:var(--page-text);width:min(92vw,380px);border-radius:14px;padding:40px 36px;box-shadow:0 14px 44px #00000073;display:flex;flex-direction:column;align-items:center;text-align:center;gap:28px}.intro-title{color:var(--accent);font-size:1.7rem}.intro-rules{list-style:none;display:flex;flex-direction:column;gap:16px;font-size:1rem;line-height:1.5}.intro .btn{padding:12px 44px;font-size:1.05rem}.demo-board{display:grid;grid-template-columns:repeat(3,48px);gap:3px;padding:4px;background:var(--board-gutter);border:3px solid var(--border);animation:demo-box var(--demo-period, 4.6s) ease-in-out infinite}.demo-cell{height:48px;display:flex;align-items:center;justify-content:center;background:var(--cell-bg);font-size:1.4rem;font-weight:700;color:var(--cell-text)}.demo-a,.demo-b{display:inline-block;position:relative;z-index:1}.demo-a{animation:demo-a var(--demo-period, 4.6s) ease-in-out infinite}.demo-b{animation:demo-b var(--demo-period, 4.6s) ease-in-out infinite}.demo-c{animation:demo-c var(--demo-period, 4.6s) ease-in-out infinite}@keyframes demo-a{0%,26%{transform:none;color:var(--conflict-text)}32%{transform:translate(25px,-10px);color:var(--conflict-text)}38%,90%{transform:translate(51px);color:var(--cell-text)}94%,to{transform:none;color:var(--conflict-text)}}@keyframes demo-b{0%,26%{transform:none;color:var(--conflict-text)}32%{transform:translate(-25px,10px);color:var(--conflict-text)}38%,90%{transform:translate(-51px);color:var(--cell-text)}94%,to{transform:none;color:var(--conflict-text)}}@keyframes demo-c{0%,30%{color:var(--conflict-text)}38%,90%{color:var(--cell-text)}94%,to{color:var(--conflict-text)}}@keyframes demo-box{0%,36%{border-color:var(--border);opacity:1}42%,80%{border-color:var(--accent);opacity:1}88%{border-color:var(--border);opacity:1}91%,96%{opacity:0}99%,to{border-color:var(--border);opacity:1}}.tutor-hint{font-size:.95rem;font-weight:700;color:var(--accent)}.cell.hint-pulse{animation:hint-pulse var(--pulse-period, 1.1s) ease-in-out infinite;z-index:1}@keyframes hint-pulse{0%,to{transform:scale(1);box-shadow:none}50%{transform:scale(1.12);box-shadow:0 2px 12px color-mix(in srgb,var(--accent) 45%,transparent)}}@media(prefers-reduced-motion:reduce){.demo-a,.demo-b,.demo-c,.demo-board,.cell.hint-pulse{animation:none}}@media(max-width:640px){.game-wrap{gap:12px;justify-content:flex-start}.moves-total{font-size:2rem}.solved{height:3.8rem}.difficulty{gap:6px;flex-wrap:wrap;justify-content:center;max-width:96vw}.difficulty button{padding:6px 10px;font-size:.85rem}}
