.tool-head{text-align:center;padding:6px 0 4px}.tool-head h1{margin:4px 0 8px;font-size:clamp(30px,6vw,48px);font-weight:900;line-height:1.1}.tool-head h1 span{background:linear-gradient(90deg, var(--pink), var(--cyan));color:#0000;-webkit-background-clip:text;background-clip:text}.tool-head p{color:var(--muted);max-width:40em;margin:0 auto;font-size:17px}.sv-card{background:#0b06178c;border:1px solid #ffffff1a;border-radius:26px;max-width:900px;margin:20px auto 0;padding:18px;scroll-margin-top:12px}.sv-card h2{margin:0 0 10px;font-size:22px}.sv-setup{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 18px;display:flex}.sv-num{align-items:center;gap:6px;font-weight:800;display:inline-flex}.sv-num output{text-align:center;font-variant-numeric:tabular-nums;min-width:2ch;font-size:20px}.sv-btn{font:inherit;color:var(--text);cursor:pointer;background:#ffffff14;border:1px solid #ffffff2e;border-radius:12px;min-height:40px;padding:8px 14px;font-weight:800}.sv-btn:hover:not(:disabled){border-color:var(--cyan)}.sv-btn:disabled{opacity:.4;cursor:default}.sv-btn.sq{width:40px;padding:0;font-size:20px}.sv-hint{text-align:center;color:var(--muted);margin:14px 0 10px;font-size:15px}.sv-hint b{color:var(--text)}.sv-palette{flex-wrap:wrap;justify-content:center;gap:8px;margin:6px 0 4px;display:flex}.swatch{cursor:pointer;width:44px;height:44px;font:inherit;color:#0000008c;background:radial-gradient(circle at 35% 30%, var(--l), var(--c) 70%);border:3px solid #0000;border-radius:50%;padding:0;font-size:16px;position:relative;box-shadow:inset 0 0 0 1px #ffffff40}.swatch.on{box-shadow:0 0 0 3px var(--purple);border-color:#fff}.swatch .cnt{color:#fff;background:#3b2a63;border-radius:10px;place-items:center;min-width:20px;height:20px;padding:0 4px;font-size:12px;font-weight:900;display:grid;position:absolute;top:-6px;right:-6px}.swatch.full .cnt{background:#059669}.swatch.over .cnt{background:#dc2626}.swatch.toolchip{width:auto;color:var(--text);box-shadow:none;background:#ffffff14;border:2px solid #ffffff2e;border-radius:14px;padding:0 12px;font-size:14px;font-weight:800}.swatch.toolchip.on{box-shadow:0 0 0 3px var(--purple);border-color:#fff}.sv-tool-now{text-align:center;color:var(--muted);margin:4px 0 0;font-size:14px}.sv-tool-now b{color:var(--text)}.sv-board{flex-wrap:wrap;justify-content:center;gap:14px 10px;padding:18px 4px 6px;display:flex}.tube{font:inherit;color:var(--muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:0;transition:transform .2s;display:flex}.tube .glass{--h:26px;width:44px;height:calc(var(--cap) * var(--h) + 8px);background:#ffffff0f;border:2px solid #dcd2ff8c;border-top-color:#dcd2ff40;border-radius:6px 6px 22px 22px;flex-direction:column-reverse;padding:0 3px 4px;display:flex;overflow:hidden}.tube .layer{flex:0 0 var(--h);color:#00000073;border-top:1px solid #0000002e;place-items:center;font-size:12px;display:grid}.tube .layer:first-child{border-radius:0 0 18px 18px}.tube .num{text-align:center;border-radius:8px;min-width:24px;font-size:14px;font-weight:900}button.tube:hover .glass{border-color:var(--cyan)}.tube.nope{animation:.3s nope}@keyframes nope{25%{transform:translate(-4px)}75%{transform:translate(4px)}}.tube.src{transform:translateY(-12px)}.tube.src .glass{border-color:var(--pink);box-shadow:0 0 18px #f0abfc99}.tube.src .num{background:var(--pink);color:#2b0f3d}.tube.dst .glass{border-color:var(--cyan);box-shadow:0 0 18px #67e8f999}.tube.dst .num{background:var(--cyan);color:#06303a}.tube .layer.moving{animation:1.1s ease-in-out infinite pulse}@keyframes pulse{50%{filter:brightness(1.35)}}.sv-tools{flex-wrap:wrap;justify-content:center;gap:10px;margin:10px 0 4px;display:flex}.sv-status{text-align:center;border-radius:16px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;max-width:640px;margin:14px auto 0;padding:12px 16px;font-size:15px;display:flex}.sv-status ul{width:100%;margin:6px 0 0;padding:0;list-style:none}.sv-status.good{background:#10b98124;border:1px solid #10b98173}.sv-status.warn{background:#facc151a;border:1px solid #facc1559}.sv-status.bad{background:#ef444424;border:1px solid #ef444480}.sv-status.busy{background:#a855f729;border:1px solid #a855f780}.spin{border:3px solid #ffffff40;border-top-color:var(--cyan);border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.sv-solve-row{text-align:center;margin:16px 0 4px}.sv-solve-row .btn{cursor:pointer;border:0;font-family:inherit}.sv-solve-row .btn:disabled{filter:grayscale(.8);opacity:.5;cursor:default;box-shadow:none}.sv-card.busy .sv-board,.sv-card.busy .sv-setup,.sv-card.busy .sv-tools{opacity:.5;pointer-events:none}.sv-player{outline:none}.sv-step-label{text-align:center;min-height:1.6em;margin:8px 0;font-size:18px}.sv-controls{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.sv-controls .sv-btn{padding:8px 11px}.sv-steps{gap:6px;max-height:320px;margin:18px 0 0;padding:0;list-style:none;display:grid;position:relative;overflow-y:auto}.sv-steps button{text-align:left;width:100%;font:inherit;color:var(--text);cursor:pointer;background:#ffffff0d;border:1px solid #0000;border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;display:flex}.sv-steps button .n{color:var(--muted);font-weight:900}.sv-steps button.past{opacity:.55}.sv-steps button.cur{border-color:var(--pink);background:#f0abfc1f}.sv-steps .dot{background:var(--c);color:#00000080;border-radius:50%;place-items:center;width:22px;height:22px;margin-left:auto;font-size:11px;display:inline-grid;box-shadow:inset 0 0 0 1px #ffffff4d}.sv-steps .amt{color:var(--muted);font-size:14px}.sv-after{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:14px;display:flex}@media (min-width:700px){.sv-card{padding:26px}.tube .glass{--h:30px;width:50px}}@media (prefers-reduced-motion:reduce){.tube,.tube .layer.moving,.spin{transition:none!important;animation:none!important}}
