/* ───────── Nouveau design du panel (sobre, arrondi) — activé par html[data-design="v2"], bouton « Design » en bas du menu ───────── */
html[data-design="v2"]{--page:#060607;--frame:#0c0c0e;--card:#111114;--card2:#16161a;--line:#26262b;--line2:#34343b;--txt:#ececef;--mut:#8d8d96;--hover:#17171b;--on:#1b1b20;--field:#0e0e11;--btn:#ffffff;--btnink:#0c0c0e;--r:14px;--ff:'Geist','Inter','Inter Display','Segoe UI',system-ui,-apple-system,sans-serif}
html[data-design="v2"][data-theme="clair"]{--page:#e9eaee;--frame:#ffffff;--card:#ffffff;--card2:#f4f5f8;--line:#e2e4ea;--line2:#cfd2db;--txt:#16171b;--mut:#6b7080;--hover:#f1f2f6;--on:#eef0f5;--field:#f7f8fb;--btn:#15161a;--btnink:#ffffff}
html[data-design="v2"] body{background:var(--page);color:var(--txt);font:14px/1.5 var(--ff);-webkit-font-smoothing:antialiased}
html[data-design="v2"] h1,html[data-design="v2"] h2,html[data-design="v2"] h3{font-style:normal;text-transform:none;letter-spacing:-.01em;color:var(--txt)}
html[data-design="v2"] h1{font-size:28px;font-weight:400;line-height:1.15}
html[data-design="v2"] h2{font-size:16px;font-weight:600;margin-bottom:12px}
html[data-design="v2"] h3{font-weight:600}
html[data-design="v2"] a{color:var(--txt);text-decoration:none}
html[data-design="v2"] .muted,html[data-design="v2"] .stat small,html[data-design="v2"] label{color:var(--mut)}
/* coque : menu à gauche, cadre arrondi à droite */
html[data-design="v2"] .layout{grid-template-columns:292px 1fr;gap:0;padding:12px 12px 12px 0;height:100vh;min-height:0}
html[data-design="v2"] .side{background:transparent;border:0;padding:22px 18px 14px 22px;gap:2px;height:calc(100vh - 24px);position:sticky;top:12px;scrollbar-width:thin}
html[data-design="v2"] .side .logo{height:44px;margin:4px 6px 22px}
html[data-design="v2"] .side .sec{font-size:14px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--mut);margin:22px 8px 8px}
html[data-design="v2"] .side>select{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 14px;font-weight:500;margin:0 0 4px !important;cursor:pointer;appearance:none}
html[data-design="v2"] .nav{border:1px solid transparent;border-radius:12px;padding:9px 14px;font-weight:500;font-size:14.5px;color:var(--txt);gap:14px;transform:none}
html[data-design="v2"] .nav:hover{background:var(--hover)}
html[data-design="v2"] .nav.on{background:var(--on);border-color:var(--line2);transform:none;color:var(--txt)}
html[data-design="v2"] .nav.on>*{transform:none}
html[data-design="v2"] .nav svg{width:19px;height:19px;stroke-width:1.5;color:var(--mut)}
html[data-design="v2"] .nav.on svg{color:rgb(var(--a))}
html[data-design="v2"] .side .bottom{padding-top:18px}
html[data-design="v2"] .main{background:var(--frame);border:1px solid var(--line);border-radius:26px;padding:0;max-width:none;width:auto;height:calc(100vh - 24px);overflow:auto;scrollbar-width:thin;position:relative}
html[data-design="v2"] .crumb{display:flex;align-items:center;gap:8px;padding:0 28px;height:78px;border-bottom:1px solid var(--line);position:sticky;top:0;background:color-mix(in srgb,var(--frame) 92%,transparent);backdrop-filter:blur(10px);z-index:5;font-size:18px}
html[data-design="v2"] .crumb .c1{color:var(--mut)}html[data-design="v2"] .crumb .sl{color:var(--mut)}html[data-design="v2"] .crumb b{font-weight:500}
html[data-design="v2"] .crumb .grow{flex:1}
html[data-design="v2"] .crumb .who{display:flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--line);border-radius:12px;font-size:14px;font-weight:500;background:var(--card)}
html[data-design="v2"] .crumb .who i{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block}
html[data-design="v2"] .page{padding:30px 32px 60px;max-width:1360px}
html[data-design="v2"] .top{margin-bottom:24px}
/* cartes, champs, boutons */
html[data-design="v2"] .card{background:var(--card);border:1px solid var(--line);border-left:1px solid var(--line);border-radius:18px;padding:20px 22px;box-shadow:none}
html[data-design="v2"] .stat{padding:18px 20px}
html[data-design="v2"] .stat small{font-size:13px;font-weight:500;letter-spacing:0;text-transform:none}
html[data-design="v2"] .stat b{font-size:30px;font-style:normal;font-weight:600;letter-spacing:-.02em}
html[data-design="v2"] .btn{background:var(--card2);color:var(--txt);border:1px solid var(--line2);border-radius:12px;padding:10px 18px;font-weight:500;font-size:14px;letter-spacing:0;text-transform:none;font-style:normal;transform:none;box-shadow:none}
html[data-design="v2"] .btn>*{transform:none}
html[data-design="v2"] .btn:hover{border-color:var(--mut)}
html[data-design="v2"] .btn.p{background:var(--btn);color:var(--btnink);border-color:var(--btn);box-shadow:none}
html[data-design="v2"] .btn.p:hover{opacity:.9}
html[data-design="v2"] .btn.d{background:transparent;border-color:rgba(248,113,113,.5);color:var(--bad)}
html[data-design="v2"] .btn.s{padding:6px 12px;font-size:13px;border-radius:10px}
html[data-design="v2"] input,html[data-design="v2"] select,html[data-design="v2"] textarea{background:var(--field);border:1px solid var(--line);border-radius:12px;padding:11px 14px}
html[data-design="v2"] input:focus,html[data-design="v2"] select:focus,html[data-design="v2"] textarea:focus{border-color:rgb(var(--a));box-shadow:0 0 0 3px rgba(var(--a),.14)}
html[data-design="v2"] input[type=color]{padding:3px;border-radius:10px}
html[data-design="v2"] label{font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;margin:14px 0 6px}
html[data-design="v2"] .pill{padding:3px 11px;font-size:12px;font-weight:500;letter-spacing:0;text-transform:none;font-style:normal;transform:none;border-radius:999px;background:var(--on);color:var(--txt)}
html[data-design="v2"] .pill.ok{background:rgba(74,222,128,.14);color:var(--ok)}html[data-design="v2"] .pill.bad{background:rgba(248,113,113,.14);color:var(--bad)}html[data-design="v2"] .pill.warn{background:rgba(251,191,36,.14);color:var(--warn)}html[data-design="v2"] .pill.acc{background:rgb(var(--a));color:#15110a}
html[data-design="v2"] th{font-size:12.5px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--mut);border-bottom:1px solid var(--line);padding:10px 12px}
html[data-design="v2"] td{border-bottom:1px solid var(--line);padding:12px}
html[data-design="v2"] .key{background:var(--field);border:1px solid var(--line2);border-radius:12px;color:var(--txt)}
html[data-design="v2"] .tabs .btn.on{background:var(--btn);color:var(--btnink);border-color:var(--btn)}
html[data-design="v2"] .qa{border-bottom-color:var(--line);color:var(--txt);border-radius:10px}html[data-design="v2"] .qa:hover{background:var(--hover)}
html[data-design="v2"] .bar-row .bt{transform:none;border-radius:99px;background:var(--on)}html[data-design="v2"] .bar-row .bt>*{border-radius:99px}
html[data-design="v2"] .steps li::before{border-radius:50%;background:var(--on);color:var(--txt);border:1px solid var(--line2)}
html[data-design="v2"] pre.code,html[data-design="v2"] .console,html[data-design="v2"] .diff{background:var(--field);border:1px solid var(--line);border-radius:12px}
html[data-design="v2"] .files .fwrap{background:var(--field);border:1px solid var(--line);border-radius:16px;overflow:hidden}
html[data-design="v2"] .toast{background:var(--card2);border:1px solid var(--line2);border-left:1px solid var(--line2);border-radius:14px}
html[data-design="v2"] .modal .box{background:var(--card);border:1px solid var(--line2);border-radius:20px}
html[data-design="v2"] .auth .box{background:var(--card);border:1px solid var(--line2);box-shadow:0 30px 80px rgba(0,0,0,.5);border-radius:22px}
html[data-design="v2"] .layout .dot.on{box-shadow:none}
@media(max-width:1000px){html[data-design="v2"] .layout{grid-template-columns:1fr;height:auto;padding:0}html[data-design="v2"] .side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;padding:14px}html[data-design="v2"] .main{height:auto;border-radius:0;border-width:1px 0 0}html[data-design="v2"] .crumb{position:static;height:60px}}
html:not([data-design="v2"]) .crumb{display:none}
html[data-design="v2"] .setbar{left:316px;right:32px;bottom:24px;border:1px solid var(--line2);border-radius:16px;background:color-mix(in srgb,var(--card2) 94%,transparent);backdrop-filter:blur(10px);box-shadow:0 20px 60px rgba(0,0,0,.5);padding:12px 16px}
html[data-design="v2"] .setcat{border-left:0;border-radius:10px}html[data-design="v2"] .setcat.on{background:var(--on)}
html[data-design="v2"] .plan{border-left:1px solid var(--line);border-radius:18px;background:var(--card)}
html[data-design="v2"] .side>select{background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238d8d96' stroke-width='2'%3E%3Cpath d='m7 15 5 5 5-5M7 9l5-5 5 5'/%3E%3C/svg%3E") no-repeat right 14px center}
@media(max-width:1000px){html[data-design="v2"] .setbar{left:12px;right:12px}}
html[data-design="v2"][data-theme="clair"] .side .logo{filter:invert(1) hue-rotate(180deg)}