/* Maillon — styles */
/* Layout: barre d'outils en haut, panneau d'entrée à gauche (onglets Configs / Liens), schéma à droite */
:root{--bg:#f6f7f9;--panel:#fff;--fg:#1c2330;--mut:#6b7587;--bd:#dde1e8;--acc:#2563eb;--ok:#15803d;--warn:#b45309;--n0:#1e3a8a;--n1:#2563eb;--n2:#0e7490;--n3:#475569;--link:#64748b;--mono:ui-monospace,Menlo,Consolas,monospace}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0f141c;--panel:#171e29;--fg:#e6eaf2;--mut:#8b96a9;--bd:#2a3342;--acc:#60a5fa;--ok:#4ade80;--warn:#fbbf24;--n0:#3b5bdb;--n1:#2f6fe0;--n2:#0e8aa8;--n3:#5b6b82;--link:#8795ab;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0f141c;--panel:#171e29;--fg:#e6eaf2;--mut:#8b96a9;--bd:#2a3342;--acc:#60a5fa;--ok:#4ade80;--warn:#fbbf24;--n0:#3b5bdb;--n1:#2f6fe0;--n2:#0e8aa8;--n3:#5b6b82;--link:#8795ab;color-scheme:dark}
html,body{height:100%}
[hidden]{display:none!important}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:flex;flex-direction:column}
header{display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--panel);border-bottom:1px solid var(--bd);flex-wrap:wrap}
h1{font-size:17px;margin:0;flex:1;min-width:140px;display:flex;align-items:center;gap:9px;letter-spacing:.01em}
h1 svg{flex:none;display:block}
h1 small{font-size:12px;font-weight:500;color:var(--mut);letter-spacing:0}
:root{color-scheme:light}
:root[data-theme="light"]{color-scheme:light}
select option{background:var(--panel);color:var(--fg)}
select option:checked{background:var(--acc);color:#fff}
input[type=text]{font:inherit;padding:4px 8px;border:1px solid var(--bd);background:var(--panel);color:var(--fg);border-radius:8px;min-width:0;flex:1}
select{font:inherit;padding:5px 8px;border:1px solid var(--bd);background:var(--panel);color:var(--fg);border-radius:8px}
button,.btn{font:inherit;padding:6px 12px;border:1px solid var(--bd);background:var(--panel);color:var(--fg);border-radius:8px;cursor:pointer;display:inline-block}
button:hover,.btn:hover{border-color:var(--acc)}
button:focus-visible,.btn:focus-within,textarea:focus-visible,input:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
button.ghost{border-color:transparent;background:none;color:var(--mut)}
button.ghost:hover{color:var(--fg)}
button.warn{border-color:var(--warn);color:var(--warn);background:none}
button.p{background:var(--acc);border-color:var(--acc);color:#fff}
main{flex:1;display:flex;min-height:0}
aside{width:400px;max-width:45%;padding:12px 14px;border-right:1px solid var(--bd);background:var(--panel);display:flex;flex-direction:column;gap:8px;overflow:auto;min-width:0}
.tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--bd)}
#col{min-height:140px}
.tg{display:flex;align-items:center;gap:8px;font-size:12.5px}
.sw8{width:26px;height:0;border-top:4px solid;flex:none;border-radius:2px;box-shadow:0 0 0 1.5px color-mix(in srgb,var(--fg) 40%,transparent)}
.tg code{font-family:var(--mono)}
.tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:none;padding:6px 5px;color:var(--mut);font-size:12.5px}
#typ{min-height:120px}
.tabs button[aria-selected="true"]{color:var(--fg);border-bottom-color:var(--acc);font-weight:600}
.pane{display:flex;flex-direction:column;gap:8px;flex:1;min-height:0}
textarea{width:100%;resize:vertical;font:12.5px/1.5 var(--mono);padding:10px;border:1px solid var(--bd);border-radius:8px;background:var(--bg);color:var(--fg)}
#sws{display:flex;flex-direction:column;gap:6px}
.sw{border:1px solid var(--bd);border-radius:8px;background:var(--bg)}
.sw>summary{display:flex;align-items:center;gap:8px;padding:6px 8px;list-style:none;font-weight:600}
.sw>summary::-webkit-details-marker{display:none}
.sw>summary::before{content:'▸';color:var(--mut);width:10px}
.sw[open]>summary::before{content:'▾'}
.sw .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:13px}
.sw .nm.none{color:var(--warn);font-family:inherit;font-weight:500}
.sw .rm{border:0;background:none;color:var(--mut);padding:2px 6px;font-size:13px}
.sw .rm:hover{color:#dc2626}
.sw textarea{display:block;border:0;border-top:1px solid var(--bd);border-radius:0 0 8px 8px;min-height:200px;background:var(--panel)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.proj{padding-bottom:8px;border-bottom:1px solid var(--bd)}
body:not(.adv) .advonly{display:none}
.devc{display:flex;flex-direction:column;gap:6px;border-top:1px solid var(--bd);padding-top:8px}
.devgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px 10px;font-size:12.5px}
.devgrid label{display:flex;align-items:center;gap:6px}
.devgrid input[type=color]{width:30px;height:22px;padding:0;border:1px solid var(--bd);border-radius:5px;background:none;cursor:pointer;flex:none}
.help{border:1px solid var(--bd);border-radius:8px;padding:6px 10px;font-size:12.5px}
.help>summary{cursor:pointer;color:var(--fg);font-weight:600}
.help[open]>summary{margin-bottom:6px}
.help>.h{margin-top:6px}
.warnbox{border-color:var(--warn)!important}
.warnbox>summary{color:var(--warn)}
.warnbox ul{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;max-height:260px}
.warnbox li{margin:5px 0;font-size:12.5px}
button.lnk{border:0;background:none;padding:0;color:var(--acc);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline}
.nbrs{display:flex;flex-direction:column;gap:6px}
.nbrs textarea{white-space:pre;overflow-x:auto;overflow-wrap:normal;font-size:11.5px}
.advbox{display:flex;flex-direction:column;gap:8px;border:1px dashed var(--bd);border-radius:8px;padding:8px 10px}
#pmsg{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
#in{min-height:220px;flex:1}
#alias{min-height:56px;height:56px}
.drop{border:1.5px dashed var(--bd);border-radius:8px;padding:10px;text-align:center;color:var(--mut);font-size:12.5px}
.drop.on{border-color:var(--acc);color:var(--fg)}
.drop label{color:var(--acc);cursor:pointer;text-decoration:underline}
.h{color:var(--mut);font-size:12px}
.h code,.sum code{font-family:var(--mono);background:var(--bg);padding:1px 5px;border-radius:4px;border:1px solid var(--bd)}
.opt{display:flex;align-items:center;gap:6px;font-size:12.5px}
.sum{font-size:12.5px;display:flex;flex-direction:column;gap:6px}
.sum .k{font-variant-numeric:tabular-nums}
.chip{display:inline-block;padding:0 7px;border-radius:999px;font-size:11.5px;border:1px solid currentColor}
.chip.ok{color:var(--ok)}.chip.w{color:var(--warn)}
details{border:1px solid var(--bd);border-radius:8px;padding:6px 8px}
summary{cursor:pointer;font-weight:600}
details ul{margin:6px 0 0;padding-left:16px;max-height:200px;overflow:auto;font-family:var(--mono);font-size:11.5px}
details li{margin:2px 0;word-break:break-word}
#view{flex:1;overflow:auto;padding:16px;min-width:0}
#q{flex:0 1 210px;min-width:120px}
#q.miss{border-color:var(--warn)}
#zon{min-height:70px}
.cmpb{border-color:color-mix(in srgb,var(--warn) 45%,var(--bd));background:color-mix(in srgb,var(--warn) 8%,var(--panel))}
.cmpb details{flex-basis:100%;font-size:12.5px}
.cmpb ul{margin:6px 0 0;padding-left:18px;max-height:180px;overflow:auto;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:12.5px}
.cmpb .add{color:#15803d}.cmpb .rem{color:#dc2626}.cmpb .chg{color:var(--warn)}
.viewwrap{flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.exb{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:space-between;margin:12px 16px 0;padding:10px 14px;border:1px solid color-mix(in srgb,var(--acc) 40%,var(--bd));background:color-mix(in srgb,var(--acc) 9%,var(--panel));border-radius:10px;font-size:13px}
.exb span{min-width:0;flex:1 1 260px}
#view svg{display:block;margin:auto;max-width:none;user-select:none}
#view g[data-n]{cursor:grab;touch-action:none}
#view.drag,#view.drag g[data-n]{cursor:grabbing}
#pos{min-height:180px;flex:1}
.modal{position:fixed;inset:0;background:color-mix(in srgb,#000 55%,transparent);display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));z-index:20}
.mbox{background:var(--panel);border:1px solid var(--bd);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:10px;max-width:100%;max-height:100%;min-width:0}
.mbox .row{justify-content:space-between}
.mimg{overflow:auto;min-height:0}
.mimg img{display:block;max-width:none;width:auto;background:#fff}
#err{color:#dc2626;font-size:12px;min-height:0}
#code{height:110px;flex:none}
@media (max-width:760px){main{flex-direction:column}aside{width:100%;max-width:none;border-right:0;border-bottom:1px solid var(--bd)}#view{min-height:420px}}