*{box-sizing:border-box}html,body{margin:0;background:#1b1f24;color:#e8eaed;font:15px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{max-width:1100px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;gap:8px}.logo{font-weight:800;letter-spacing:.25em;font-size:20px;background:linear-gradient(90deg,#f2f4f6,#8d96a0,#dfe3e7);-webkit-background-clip:text;color:transparent}nav{display:flex;gap:4px;background:#2a3038;border-radius:10px;padding:3px}nav button{border:0;background:none;color:#c7ccd2;padding:8px 14px;border-radius:8px;font-weight:600;font-size:15px}nav button.on{background:#f0a030;color:#1b1f24}nav button:disabled{opacity:.35}main{flex:1;padding:0 10px}.panel{display:flex;flex-direction:column;gap:8px}.board{width:100%;aspect-ratio:10/7;border-radius:10px;touch-action:none;display:block;background:#f4f1ea}.view3d{width:100%;height:min(62vh,600px);min-height:300px;border-radius:10px;overflow:hidden;touch-action:none}.view3d canvas{display:block}.row{display:flex;flex-wrap:wrap;gap:8px}.btn{border:1px solid #3a424c;background:#2a3038;color:#e8eaed;padding:11px 14px;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.btn:disabled{opacity:.4}.btn.primary{background:#f0a030;color:#1b1f24;border-color:#f0a030}.btn.done{background:#2f7d4f;border-color:#2f7d4f;color:#fff}.btn.big{width:100%;justify-content:center;padding:14px;font-size:17px}.hint{color:#9aa3ad;font-size:13px;margin:0}.sliders{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px 16px}.slider{display:flex;flex-wrap:wrap;justify-content:space-between;font-size:14px;color:#c7ccd2}.slider b{color:#f0a030}.slider input{width:100%;accent-color:#f0a030;height:28px}footer{margin-top:14px;padding:12px;text-align:center;font-size:12px;color:#aab2bb;border-top:1px solid #2f363f;background:#16191d}