:root{color-scheme:dark;--fond: #1e1f22;--panneau: #26282c;--bordure: #34373d;--texte: #e4e6ea;--texte-doux: #9aa0aa;--accent: #6ea8fe;--erreur: #f08a8a;font-family:system-ui,-apple-system,Segoe UI,sans-serif;font-size:14px}*{box-sizing:border-box}body{margin:0;background:var(--fond);color:var(--texte)}.app{display:grid;grid-template-columns:280px 1fr;height:100vh}.panneau{background:var(--panneau);border-right:1px solid var(--bordure);overflow-y:auto;padding:16px}.panneau h1{font-size:15px;margin:0 0 4px;letter-spacing:.02em}.panneau h2{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--texte-doux);margin:24px 0 8px}.sous-titre{color:var(--texte-doux);margin:0 0 8px;font-size:12px}.parametre{display:grid;grid-template-columns:1fr 84px;gap:8px;align-items:center;margin-bottom:6px}.parametre label{font-size:12px;color:var(--texte-doux);overflow:hidden;text-overflow:ellipsis}.parametre input{background:#1a1b1e;border:1px solid var(--bordure);border-radius:4px;color:var(--texte);padding:4px 6px;font:inherit;font-size:12px;width:100%}.parametre input:focus{outline:1px solid var(--accent);border-color:var(--accent)}.feature{padding:6px 8px;border-radius:4px;font-size:12px;border:1px solid transparent}.feature:nth-child(odd){background:#2b2d31}.feature span{color:var(--texte-doux);font-size:11px;margin-left:6px}button{width:100%;padding:8px;border-radius:4px;border:1px solid var(--bordure);background:#32353b;color:var(--texte);font:inherit;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.5;cursor:default}.viewport{position:relative}.viewport canvas{display:block;width:100%;height:100%}.etat{position:absolute;left:12px;bottom:12px;font-size:11px;color:var(--texte-doux);background:#1e1f22d9;border:1px solid var(--bordure);border-radius:4px;padding:6px 10px;line-height:1.6;font-variant-numeric:tabular-nums}.erreur{color:var(--erreur);font-size:12px;line-height:1.5;margin-top:12px}