:root{--panel-w: 360px;--gap: 10px;--muted:#646b73}*{box-sizing:border-box}.app{display:grid;grid-template-columns:var(--panel-w) 1fr;height:100vh}.panel{padding:16px;border-right:1px solid #eee;overflow:auto}.panel h2{margin:0 0 12px}.form{display:grid;gap:var(--gap)}.group{display:grid;gap:6px}.group label{font-size:14px;color:#333}.inline{display:grid;grid-template-columns:1fr 100px;gap:8px;align-items:center}input[type=number],input[type=text],select{width:100%}.models{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.model{position:relative;border:1px solid #e5e7eb;border-radius:10px;padding:8px;background:#fff;cursor:pointer;transition:box-shadow .15s ease,transform .05s ease;display:grid;gap:6px;justify-items:center}.model:hover{box-shadow:0 2px 10px #0000000f}.model.selected{outline:2px solid #2563eb}.model.disabled{opacity:.45;cursor:not-allowed;position:relative}.model.disabled:after{content:"bientôt";position:absolute;top:6px;right:6px;font-size:10px;color:#fff;background:#9ca3af;padding:2px 6px;border-radius:999px}.model svg{width:60px;height:40px}.section-title{margin-top:4px;font-weight:600;color:#111827}.actions{display:flex;gap:8px;margin-top:6px}small.helper{color:var(--muted)}.footer{margin-top:18px;border-top:1px solid #ddd;text-align:center;font-weight:600;color:#374151;font-size:13px;letter-spacing:.2px;text-transform:uppercase;background:linear-gradient(to right,#f3f4f6,#fff);border-radius:8px;padding:10px;box-shadow:inset 0 1px 2px #0000000d}.ctx-menu{position:fixed;z-index:50;background:#fff;border:1px solid #e5e7eb;box-shadow:0 10px 30px #0000001f;border-radius:10px;padding:8px;min-width:220px}.ctx-menu .ctx-title{font-size:12px;color:#6b7280;margin:4px 6px 8px}.ctx-menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:8px 10px;border-radius:6px;cursor:pointer;font-size:14px}.ctx-menu button:hover{background:#f3f4f6}.ctx-menu button:disabled{opacity:.5;cursor:not-allowed}@media (max-width: 1024px){:root{--panel-w: 320px}}@media (max-width: 768px){.app{grid-template-columns:1fr!important;grid-template-rows:1fr}.panel{width:100%;max-width:100%;border-right:none;padding:12px}.app>canvas{display:none}.models{grid-template-columns:1fr}.inline{grid-template-columns:1fr 80px;gap:6px}}@media (max-width: 480px){:root{--gap: 8px}.panel{padding:10px}.panel h2{font-size:1.1rem}.actions{flex-direction:column}.actions button{width:100%}}@media (max-width: 768px){body{font-size:14px}h1{font-size:1.75rem!important}h2{font-size:1.25rem!important}}@media (max-width: 480px){h1{font-size:1.5rem!important}}
