:root{--bg:#01030a;--panel:rgba(3,9,22,.9);--panel2:rgba(0,23,34,.82);--cyan:#00ffe1;--blue:#2b7cff;--violet:#ad5cff;--green:#76ff8a;--amber:#ffd66b;--text:#eaffff;--muted:#8fc6d1;--border:rgba(0,255,225,.42);--danger:#ff4d8f}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;background:#01030a;color:var(--text);font-family:Orbitron,Consolas,monospace}body:before{content:"";position:fixed;inset:0;background:linear-gradient(180deg,rgba(0,3,10,.42),rgba(0,0,0,.58)),url("../backcel.png") center center/cover no-repeat fixed;z-index:-3;filter:brightness(.94) contrast(1.12) saturate(1.12)}body:after{content:"";position:fixed;inset:0;background:radial-gradient(circle at 55% 18%,rgba(0,255,225,.16),transparent 36%),linear-gradient(90deg,rgba(0,255,225,.035) 1px,transparent 1px),linear-gradient(0deg,rgba(0,255,225,.025) 1px,transparent 1px);background-size:auto,44px 44px,44px 44px;pointer-events:none;z-index:-1}.app-shell{height:100vh;padding:9px;display:grid;grid-template-rows:auto 1fr;gap:9px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 13px;border:1px solid rgba(0,255,225,.26);background:linear-gradient(145deg,rgba(0,10,18,.26),rgba(0,36,52,.16));backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border-radius:18px;box-shadow:0 0 18px rgba(0,255,225,.12),inset 0 0 18px rgba(0,255,225,.035)}h1{margin:0;color:var(--cyan);font-size:clamp(1.25rem,2.2vw,2.25rem);letter-spacing:.08em;text-shadow:0 0 16px var(--cyan)}p{margin:3px 0 0;color:var(--muted);font-size:.78rem}.status-panel{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.status-panel span,.visual-head span{padding:5px 8px;border:1px solid rgba(0,255,225,.35);border-radius:999px;background:rgba(0,0,0,.56);color:var(--green);font-size:.7rem;box-shadow:inset 0 0 12px rgba(0,255,225,.08)}.cockpit{min-height:0;display:grid;grid-template-columns:330px minmax(360px,1.1fr) minmax(360px,1fr);grid-template-rows:minmax(0,1fr) 250px;gap:9px}.panel{min-height:0;border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,rgba(3,9,22,.68),rgba(0,23,34,.52));backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);box-shadow:0 0 24px rgba(0,255,225,.14),inset 0 0 24px rgba(0,255,225,.045);overflow:hidden}.left-panel{display:grid;grid-template-rows:auto 170px 1fr}.center-panel,.right-panel{display:grid;grid-template-rows:auto 1fr}.bottom-panel{grid-column:1/4;display:grid;grid-template-rows:auto 1fr}.visual-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border-bottom:1px solid rgba(0,255,225,.24)}.visual-head.compact{padding:8px 10px}h2{font-size:.9rem;margin:0 0 8px;color:var(--cyan);text-shadow:0 0 9px rgba(0,255,225,.65)}.visual-head h2,.table-head h2{margin:0}canvas{width:100%;height:100%;display:block;background:radial-gradient(circle at center,rgba(0,255,225,.08),rgba(0,0,0,.62) 66%)}#leftOscilloscope{border-bottom:1px solid rgba(0,255,225,.2)}.controls-block{padding:10px;overflow:auto}button,select,input{width:100%;margin:4px 0;padding:7px 8px;border-radius:10px;border:1px solid rgba(0,255,225,.55);background:#04101e;color:var(--text);font-family:inherit;font-size:.76rem;box-shadow:inset 0 0 12px rgba(0,255,225,.08)}select{appearance:none;background:linear-gradient(145deg,#030b16,#061b2a);color:#f2ffff;font-weight:700}select option{background:#030914;color:#f2ffff}button{cursor:pointer;background:linear-gradient(145deg,#011925,#00394a);color:var(--cyan);font-weight:900;text-transform:uppercase;letter-spacing:.04em}button:hover{box-shadow:0 0 16px rgba(0,255,225,.35),inset 0 0 16px rgba(0,255,225,.12);transform:translateY(-1px)}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.inline-label{display:block;color:var(--muted);font-size:.7rem;margin:6px 0}.inline-label input{margin-top:4px}.metrics-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:9px 0 3px}.metrics-grid div{padding:8px;border:1px solid rgba(0,255,225,.24);border-radius:12px;background:rgba(0,0,0,.38);min-width:0}.metrics-grid b,.metrics-grid span{display:block}.metrics-grid b{color:var(--muted);font-size:.64rem}.metrics-grid span{color:var(--green);font-size:.74rem;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.camera-buttons{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:8px;border-top:1px solid rgba(0,255,225,.24)}.table-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 11px;border-bottom:1px solid rgba(0,255,225,.24)}.formula{font-size:.72rem;color:var(--amber);text-shadow:0 0 8px rgba(255,214,107,.35)}.tables{min-height:0;display:grid;grid-template-columns:1.1fr .85fr 1.1fr;gap:8px;padding:8px}.table-card{min-height:0;border:1px solid rgba(0,255,225,.18);border-radius:14px;background:rgba(0,0,0,.28);overflow:hidden;display:grid;grid-template-rows:auto 1fr}.table-card h3{margin:0;padding:7px 9px;color:var(--cyan);font-size:.75rem;border-bottom:1px solid rgba(0,255,225,.17)}.data-table{overflow:auto;font-size:.68rem}.data-table table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:5px 6px;border-bottom:1px solid rgba(0,255,225,.12);text-align:left;white-space:nowrap}.data-table th{position:sticky;top:0;background:#04101e;color:var(--cyan);z-index:1}.data-table td{color:#dffcff}.data-table .ok{color:var(--green)}.data-table .num{color:var(--amber)}.osc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:6px;overflow:auto}.osc-row{display:grid;grid-template-columns:30px 1fr 72px 54px;gap:4px;align-items:center;padding:5px;border:1px solid rgba(0,255,225,.22);border-radius:12px;background:rgba(0,0,0,.28)}.osc-row label{color:var(--cyan);font-size:.66rem}.osc-row .freq{grid-column:2/3}.osc-row .freq-num{grid-column:3/4;font-size:.6rem;padding:4px}.osc-row .hz{font-size:.62rem;color:var(--green);text-align:right}.osc-row .gain{grid-column:2/5}.osc-row .wave{grid-column:1/4}.osc-row .one{grid-column:4/5;padding:5px;font-size:.6rem}.osc-row input,.osc-row select{margin:0;padding:4px}.hidden{display:none}@media(max-width:1280px){.cockpit{grid-template-columns:310px 1fr 1fr;grid-template-rows:minmax(0,1fr) 230px}.left-panel{grid-template-rows:auto 140px 1fr}.osc-grid{grid-template-columns:1fr}.tables{grid-template-columns:1fr 1fr 1fr}}@media(max-width:980px){html,body{overflow:auto}.app-shell{height:auto;min-height:100vh}.topbar{align-items:flex-start;flex-direction:column}.status-panel{justify-content:flex-start}.cockpit{display:flex;flex-direction:column}.panel{min-height:360px}.left-panel{min-height:720px}.bottom-panel{min-height:620px}.tables{grid-template-columns:1fr}.center-panel,.right-panel{height:62vh}.camera-buttons{grid-template-columns:1fr}.formula{font-size:.65rem}.table-head{align-items:flex-start;flex-direction:column}}.tables-extended{grid-template-columns:1fr 1fr 1fr 1.35fr}.synth-card{min-width:0}.synth-panel{padding:7px;overflow:auto}.synth-status{padding:7px;margin:4px 0 8px;border:1px solid rgba(118,255,138,.35);border-radius:10px;background:rgba(0,0,0,.38);color:var(--green);font-size:.65rem;line-height:1.35}.virtual-keyboard{display:grid;gap:5px;overflow:auto;max-height:155px;padding-bottom:4px}.vk-row{display:flex;gap:4px;align-items:stretch}.vk-row-1{padding-left:10px}.vk-row-2{padding-left:22px}.vk-row-3{padding-left:38px}.vk-row-numpad{padding-top:5px;border-top:1px solid rgba(0,255,225,.18);flex-wrap:wrap}.vk-key{width:auto;min-width:34px;flex:1;margin:0;padding:5px 4px;border-color:rgba(0,255,225,.48);background:linear-gradient(145deg,rgba(0,25,38,.95),rgba(2,9,22,.95));box-shadow:inset 0 0 10px rgba(0,255,225,.08),0 0 8px rgba(0,255,225,.08);text-transform:none;letter-spacing:0}.vk-key.sharp{border-color:rgba(173,92,255,.68);background:linear-gradient(145deg,rgba(52,0,76,.92),rgba(5,8,22,.95));color:var(--violet)}.vk-key b,.vk-key span,.vk-key small{display:block}.vk-key b{font-size:.72rem;color:var(--cyan)}.vk-key span{font-size:.58rem;color:var(--amber)}.vk-key small{font-size:.5rem;color:var(--muted)}.vk-key.active{transform:translateY(1px) scale(.98);border-color:var(--green);box-shadow:0 0 18px rgba(118,255,138,.65),inset 0 0 18px rgba(118,255,138,.22);background:linear-gradient(145deg,rgba(0,70,48,.95),rgba(0,18,25,.95))}.copyright{position:fixed;right:12px;bottom:4px;color:rgba(234,255,255,.62);font-size:.62rem;text-shadow:0 0 8px rgba(0,255,225,.4);pointer-events:none}@media(max-width:1280px){.tables-extended{grid-template-columns:1fr 1fr}.virtual-keyboard{max-height:190px}}@media(max-width:980px){.tables-extended{grid-template-columns:1fr}.virtual-keyboard{max-height:none}.vk-row{flex-wrap:wrap;padding-left:0}.copyright{position:static;padding:0 12px 8px}}.note-monitor{padding:7px 8px;margin:5px 0 8px;border:1px solid rgba(255,214,107,.42);border-radius:10px;background:rgba(12,6,0,.42);color:var(--amber);font-size:.68rem;line-height:1.35;box-shadow:inset 0 0 14px rgba(255,214,107,.08)}.vk-row-label{font-size:.58rem;color:var(--muted);padding:2px 4px 0;text-transform:uppercase;letter-spacing:.06em}.virtual-keyboard{max-height:225px}.vk-key{min-width:31px}.vk-key.active span,.vk-key.active small,.vk-key.active b{color:#ffffff;text-shadow:0 0 8px var(--green)}.piano-title{font-size:.62rem;color:var(--cyan);padding:4px 6px;border:1px solid rgba(0,255,225,.22);border-radius:10px;background:rgba(0,0,0,.28);text-shadow:0 0 8px rgba(0,255,225,.5)}.piano-board{position:relative;display:grid;grid-template-columns:repeat(14,minmax(28px,1fr));gap:3px;min-height:96px;padding:6px;border:1px solid rgba(0,255,225,.26);border-radius:13px;background:linear-gradient(180deg,rgba(0,255,225,.07),rgba(0,0,0,.32));overflow:auto}.piano-key{position:relative;margin:0;padding:6px 3px;border-radius:8px;text-transform:none;letter-spacing:0;min-width:30px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px;touch-action:none;user-select:none}.piano-key.white{height:82px;background:linear-gradient(180deg,rgba(234,255,255,.96),rgba(123,224,255,.7));color:#001018;border-color:rgba(0,255,225,.72);box-shadow:inset 0 -10px 18px rgba(0,255,225,.15),0 0 10px rgba(0,255,225,.08)}.piano-key.black{height:58px;margin-bottom:24px;background:linear-gradient(180deg,rgba(28,0,48,.98),rgba(2,4,14,.98));color:#f6efff;border-color:rgba(173,92,255,.82);box-shadow:0 0 13px rgba(173,92,255,.25),inset 0 -8px 16px rgba(173,92,255,.2)}.piano-key span{font-size:.55rem;font-weight:900}.piano-key small{font-size:.47rem;opacity:.82}.piano-key.active,.piano-key:active{transform:translateY(2px) scale(.985);border-color:var(--green);box-shadow:0 0 20px rgba(118,255,138,.88),inset 0 0 18px rgba(118,255,138,.26);background:linear-gradient(180deg,rgba(118,255,138,.95),rgba(0,75,55,.86));color:#fff;text-shadow:0 0 8px #fff}.note-monitor small{display:block;margin-top:3px;color:rgba(234,255,255,.74);font-size:.56rem;line-height:1.28}.vk-key.active{animation:keyPulse .18s linear infinite alternate}@keyframes keyPulse{from{filter:brightness(1)}to{filter:brightness(1.45)}}@media(max-width:980px){.piano-board{grid-template-columns:repeat(8,minmax(30px,1fr));min-height:150px}.piano-key.white{height:70px}.piano-key.black{height:52px;margin-bottom:18px}}html{scroll-behavior:smooth}body{-webkit-user-select:none;user-select:none}input,textarea,[contenteditable="true"]{-webkit-user-select:text;user-select:text}img,canvas{max-width:100%}button,input,select{min-height:36px}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--green);outline-offset:2px;box-shadow:0 0 18px rgba(118,255,138,.45),inset 0 0 12px rgba(118,255,138,.12)}.copyright{position:fixed;right:14px;bottom:6px;z-index:50;padding:4px 9px;border:1px solid rgba(0,255,225,.22);border-radius:999px;background:rgba(0,0,0,.32);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:rgba(234,255,255,.8);font-size:.62rem;text-shadow:0 0 8px rgba(0,255,225,.55);pointer-events:none}.topbar h1::after{content:" @copyright";font-size:.52em;color:var(--amber);text-shadow:0 0 10px rgba(255,214,107,.5);letter-spacing:.06em}.panel{background:linear-gradient(145deg,rgba(3,9,22,.68),rgba(0,23,34,.50));backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.table-card,.metrics-grid div,.synth-status,.note-monitor{backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}@media(max-width:1440px){.cockpit{grid-template-columns:300px minmax(320px,1fr) minmax(320px,1fr);grid-template-rows:minmax(0,1fr) 285px}.tables-extended{grid-template-columns:1fr 1fr}.bottom-panel{min-height:285px}}@media(max-width:1100px){html,body{overflow:auto}.app-shell{height:auto;min-height:100vh}.cockpit{display:flex;flex-direction:column}.left-panel{min-height:690px}.center-panel,.right-panel{height:62vh;min-height:420px}.bottom-panel{min-height:780px}.tables,.tables-extended{grid-template-columns:1fr}.controls-block,.data-table,.synth-panel{max-height:none}}@media(max-width:720px){.app-shell{padding:6px;gap:6px}.topbar{padding:8px;align-items:flex-start;flex-direction:column}h1{font-size:1.1rem}p{font-size:.68rem}.status-panel span,.visual-head span{font-size:.62rem}.left-panel{min-height:780px}.center-panel,.right-panel{height:58vh;min-height:360px}.button-grid,.camera-buttons,.metrics-grid{grid-template-columns:1fr}.visual-head,.table-head{align-items:flex-start;flex-direction:column}.copyright{position:static;margin:0 6px 6px;display:inline-block}}@media(max-width:420px){button,select,input{font-size:.68rem}.panel{border-radius:13px}.osc-row{grid-template-columns:28px 1fr 62px 48px}.piano-board{grid-template-columns:repeat(6,minmax(28px,1fr))}}.assembly-search{margin:6px 0 8px;padding:7px;border:1px solid rgba(0,255,225,.22);border-radius:13px;background:rgba(0,0,0,.24);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.assembly-search input[type="search"]{border-color:rgba(118,255,138,.45);background:linear-gradient(145deg,rgba(0,20,28,.92),rgba(0,9,16,.92));color:var(--green)}.assembly-search input[type="search"]::placeholder{color:rgba(143,198,209,.72)}#assemblySearchInfo{margin-top:6px;font-size:.62rem;color:var(--amber);border-color:rgba(255,214,107,.3)}@media(max-width:720px){.assembly-search .button-grid{grid-template-columns:1fr}}#assemblySearchInfo::after{content:" · premiers 2000 = assemblages historiques";color:var(--green)}.synth-card{border-color:rgba(118,255,138,.36)}.assembly-search{margin:6px 0 8px;padding:7px;border:1px solid rgba(0,255,225,.22);border-radius:13px;background:rgba(0,0,0,.24);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.assembly-search input[type="search"]{border-color:rgba(118,255,138,.45);background:linear-gradient(145deg,rgba(0,20,28,.92),rgba(0,9,16,.92));color:var(--green)}.assembly-search input[type="search"]::placeholder{color:rgba(143,198,209,.72)}#assemblySearchInfo{margin-top:6px;font-size:.62rem;color:var(--amber);border-color:rgba(255,214,107,.3)}#randomEditAssembly{border-color:rgba(255,214,107,.62);color:var(--amber);background:linear-gradient(145deg,rgba(56,31,0,.92),rgba(3,12,22,.96))}#saveEditedAssembly{border-color:rgba(118,255,138,.62);color:var(--green);background:linear-gradient(145deg,rgba(0,55,38,.92),rgba(3,12,22,.96))}#showSavedAssemblies,#exportSavedAssemblies{border-color:rgba(173,92,255,.58);color:var(--violet)}@media(max-width:720px){.assembly-search .button-grid{grid-template-columns:1fr}}.assembly-search{margin:6px 0 8px;padding:7px;border:1px solid rgba(0,255,225,.22);border-radius:13px;background:rgba(0,0,0,.24);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}.assembly-search input[type="search"]{border-color:rgba(118,255,138,.45);background:linear-gradient(145deg,rgba(0,20,28,.92),rgba(0,9,16,.92));color:var(--green)}.assembly-search input[type="search"]::placeholder{color:rgba(143,198,209,.72)}#assemblySearchInfo{margin-top:6px;font-size:.62rem;color:var(--amber);border-color:rgba(255,214,107,.3)}#generateRandomAssembly,#randomEditAssembly{border-color:rgba(255,214,107,.62);color:var(--amber);background:linear-gradient(145deg,rgba(56,31,0,.92),rgba(3,12,22,.96))}#generateRelaxationMode{border-color:rgba(118,255,138,.62);color:var(--green);background:linear-gradient(145deg,rgba(0,55,38,.92),rgba(3,12,22,.96))}#generateSleepMode{border-color:rgba(173,92,255,.62);color:var(--violet);background:linear-gradient(145deg,rgba(35,0,55,.92),rgba(3,12,22,.96))}#saveEditedAssembly{border-color:rgba(118,255,138,.62);color:var(--green);background:linear-gradient(145deg,rgba(0,55,38,.92),rgba(3,12,22,.96))}#showSavedAssemblies,#exportSavedAssemblies{border-color:rgba(173,92,255,.58);color:var(--violet)}@media(max-width:720px){.assembly-search .button-grid{grid-template-columns:1fr}}#generateCellularMode{border-color:rgba(255,77,143,.72);color:var(--danger);background:linear-gradient(145deg,rgba(70,0,38,.92),rgba(3,12,22,.96));box-shadow:inset 0 0 12px rgba(255,77,143,.12)}#stopTherapyCycle{border-color:rgba(255,214,107,.62);color:var(--amber)}#therapyCycleType{border-color:rgba(173,92,255,.55)}#therapyCycleStatus{border-color:rgba(255,77,143,.32);color:#ffd6e5;background:rgba(20,0,12,.34)}#cellularCycleMode{border-color:rgba(255,77,143,.55);background:linear-gradient(145deg,rgba(40,0,30,.92),rgba(3,12,22,.96));color:#ffd6e5}#activateCellularCycle{border-color:rgba(255,77,143,.78);color:#ffd6e5;background:linear-gradient(145deg,rgba(85,0,45,.92),rgba(3,12,22,.96));box-shadow:0 0 14px rgba(255,77,143,.16),inset 0 0 12px rgba(255,77,143,.12)}#mutateCellularCycle{border-color:rgba(255,214,107,.68);color:var(--amber);background:linear-gradient(145deg,rgba(65,38,0,.92),rgba(3,12,22,.96))}

/* === FINAL PATCH V3 — search + cellular tab === */
.topbar{position:relative;background:linear-gradient(145deg,rgba(0,10,18,.30),rgba(0,36,52,.16))!important;border-color:rgba(0,255,225,.30)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.topbar h1{font-size:clamp(1.2rem,2vw,2.05rem)!important;color:#9ffcff!important;text-shadow:0 0 16px rgba(0,255,225,.9),0 0 28px rgba(173,92,255,.38)}
.topbar h1::after{content:"  Codé par Marc Goxe @copyright 2026";display:inline-block;margin-left:.65rem;font-size:.46em;color:var(--amber);letter-spacing:.08em;text-shadow:0 0 12px rgba(255,214,107,.7)}
.panel{background:linear-gradient(145deg,rgba(3,9,22,.62),rgba(0,23,34,.42))!important;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.immutable-copyright{position:fixed;left:50%;top:6px;transform:translateX(-50%);z-index:10000;padding:4px 13px;border:1px solid rgba(0,255,225,.22);border-radius:999px;background:rgba(0,0,0,.28);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);font-size:.62rem;color:rgba(234,255,255,.86);text-shadow:0 0 9px rgba(0,255,225,.75);pointer-events:none;user-select:none}
.window-fullscreen-btn{width:auto;min-width:112px;margin:0;padding:6px 10px;font-size:.62rem;border-color:rgba(255,214,107,.55);color:var(--amber);background:linear-gradient(145deg,rgba(40,24,0,.78),rgba(0,8,16,.75))}
.center-panel.fullscreen-window,.right-panel.fullscreen-window{position:fixed!important;inset:8px!important;z-index:9998!important;width:auto!important;height:auto!important;min-height:0!important;grid-column:auto!important;background:rgba(0,5,12,.86)!important}
body.window-fullscreen-active .panel:not(.fullscreen-window){filter:blur(1px) brightness(.55);pointer-events:none}
body.window-fullscreen-active .fullscreen-window{pointer-events:auto;box-shadow:0 0 42px rgba(0,255,225,.35),inset 0 0 30px rgba(0,255,225,.08)}

/* moteur recherche */
#assemblySearch{border-color:rgba(118,255,138,.55)!important;color:var(--green)!important;background:linear-gradient(145deg,rgba(0,20,28,.94),rgba(0,8,14,.94))!important}

/* Onglet modes cellulaires */
.cellular-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0}
.cellular-tab{border-color:rgba(255,77,143,.45);color:#ffd6e5;background:linear-gradient(145deg,rgba(45,0,30,.82),rgba(3,12,22,.95))}
.cellular-tab.active{border-color:rgba(0,255,225,.7);color:var(--cyan);box-shadow:0 0 16px rgba(0,255,225,.22)}
.cellular-tab-panel{display:none;padding:8px;border:1px solid rgba(255,77,143,.24);border-radius:13px;background:rgba(0,0,0,.24);margin:7px 0}
.cellular-tab-panel.active{display:block}
#cellularPresetMode{border-color:rgba(255,77,143,.55);background:linear-gradient(145deg,rgba(40,0,30,.92),rgba(3,12,22,.96));color:#ffd6e5}
#applyCellularPreset,#showCellularTable{border-color:rgba(255,77,143,.62);color:#ffd6e5;background:linear-gradient(145deg,rgba(65,0,38,.88),rgba(3,12,22,.96))}
.cellular-table-inline{max-height:360px;overflow:auto;font-size:.68rem}
.cellular-table-inline table{width:100%;border-collapse:collapse}
.cellular-table-inline th,.cellular-table-inline td{border-bottom:1px solid rgba(0,255,225,.18);padding:6px;text-align:left;vertical-align:top}
.cellular-table-inline th{color:var(--amber);position:sticky;top:0;background:#03101c}
.cellular-table-overlay{position:fixed;inset:18px;z-index:10001;overflow:auto;padding:18px;border:1px solid rgba(0,255,225,.45);border-radius:20px;background:rgba(0,8,18,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 0 48px rgba(0,255,225,.25)}
.cellular-table-overlay table{width:100%;border-collapse:collapse;font-size:.78rem}.cellular-table-overlay th,.cellular-table-overlay td{border-bottom:1px solid rgba(0,255,225,.18);padding:8px;text-align:left;vertical-align:top}.cellular-table-overlay th{color:var(--amber);background:#03101c}.close-cellular-table{width:auto}

/* Correctif contrôles oscillateurs */
.osc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.osc-row{display:grid!important;grid-template-columns:34px minmax(0,1fr) 82px!important;grid-template-rows:auto auto auto auto!important;gap:5px!important;align-items:center!important;padding:7px!important}
.osc-row label{grid-column:1/2;grid-row:1/2}.osc-row .freq{grid-column:2/3!important;grid-row:1/2!important;min-width:0!important}.osc-row .freq-num{grid-column:3/4!important;grid-row:1/2!important;width:100%!important;font-size:.58rem!important}.osc-row .hz{grid-column:1/4!important;grid-row:2/3!important;text-align:left!important;color:var(--green)!important}.osc-row .wave{grid-column:1/3!important;grid-row:3/4!important}.osc-row .gain{grid-column:1/4!important;grid-row:4/5!important}.osc-row .one{grid-column:3/4!important;grid-row:3/4!important;width:100%!important;font-size:.58rem!important;padding:6px 4px!important;min-height:31px!important}

/* mobile joysticks */
.mobile-joysticks{display:none;position:fixed;left:0;right:0;bottom:12px;z-index:9999;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 16px}
.joy-zone{width:118px;height:118px;border:1px solid rgba(0,255,225,.45);border-radius:50%;background:rgba(0,8,18,.38);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);position:relative;pointer-events:auto;touch-action:none;box-shadow:0 0 22px rgba(0,255,225,.18)}
.joy-zone span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:.62rem;color:rgba(234,255,255,.55)}
.joy-knob{width:42px;height:42px;border-radius:50%;position:absolute;left:37px;top:37px;background:radial-gradient(circle,var(--cyan),rgba(0,255,225,.12));box-shadow:0 0 18px rgba(0,255,225,.8)}
.mobile-exit{width:auto;min-width:92px;pointer-events:auto;border-color:rgba(255,214,107,.65);color:var(--amber);background:rgba(0,0,0,.5)}
@media(max-width:980px){.mobile-joysticks{display:flex}.osc-grid{grid-template-columns:1fr!important}.window-fullscreen-btn{min-width:94px;font-size:.58rem}}
@media(max-width:720px){.topbar h1::after{display:block;margin-left:0;margin-top:4px}.immutable-copyright{top:auto;bottom:4px;font-size:.55rem}.joy-zone{width:102px;height:102px}.joy-knob{left:31px;top:31px;width:40px;height:40px}}

/* === V4 THEME SYSTEM — Light / Dark / Matrix Neon === */
.theme-switcher{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;margin-bottom:5px}
.theme-btn{width:auto;min-width:72px;margin:0;padding:6px 9px;font-size:.62rem;border-radius:999px;border:1px solid rgba(0,255,225,.35);background:rgba(0,0,0,.35);color:var(--text);box-shadow:inset 0 0 10px rgba(0,255,225,.08)}
.theme-btn.active{border-color:var(--amber);color:var(--amber);box-shadow:0 0 16px rgba(255,214,107,.35),inset 0 0 12px rgba(255,214,107,.12)}
body.theme-light{--bg:#effaff;--panel:rgba(245,252,255,.78);--panel2:rgba(225,245,255,.68);--cyan:#007d91;--blue:#2157ff;--violet:#6f35cc;--green:#008b50;--amber:#a36400;--text:#06131b;--muted:#335866;--border:rgba(0,125,145,.34);--danger:#c5235d;background:#effaff;color:var(--text)}
body.theme-light:before{background:linear-gradient(180deg,rgba(255,255,255,.80),rgba(235,250,255,.62)),url("../backcel.png") center center/cover no-repeat fixed!important;filter:brightness(1.12) contrast(.92) saturate(.82)!important}
body.theme-light:after{background:radial-gradient(circle at 55% 18%,rgba(0,125,145,.10),transparent 36%),linear-gradient(90deg,rgba(0,125,145,.05) 1px,transparent 1px),linear-gradient(0deg,rgba(0,125,145,.04) 1px,transparent 1px)!important}
body.theme-light .panel,body.theme-light .topbar,body.theme-light .table-card,body.theme-light .metrics-grid div,body.theme-light .assembly-search,body.theme-light .cellular-tab-panel{background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(220,244,255,.54))!important;border-color:rgba(0,125,145,.28)!important;box-shadow:0 0 18px rgba(0,125,145,.10),inset 0 0 14px rgba(255,255,255,.35)!important}
body.theme-light button,body.theme-light select,body.theme-light input{background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(220,243,255,.88))!important;color:#06131b!important;border-color:rgba(0,125,145,.38)!important}
body.theme-light canvas{background:radial-gradient(circle at center,rgba(0,125,145,.09),rgba(255,255,255,.40) 66%)!important}
body.theme-dark{--bg:#01030a;--panel:rgba(3,9,22,.9);--panel2:rgba(0,23,34,.82);--cyan:#00d8ff;--blue:#2b7cff;--violet:#8b5cff;--green:#47ffa0;--amber:#ffc44d;--text:#eaffff;--muted:#8fc6d1;--border:rgba(0,216,255,.32);--danger:#ff4d8f;background:#01030a;color:var(--text)}
body.theme-dark:before{background:linear-gradient(180deg,rgba(0,5,15,.72),rgba(0,0,0,.78)),url("../backcel.png") center center/cover no-repeat fixed!important;filter:brightness(.76) contrast(1.12) saturate(.96)!important}
body.theme-neon{--cyan:#00ffe1;--blue:#2b7cff;--violet:#ad5cff;--green:#76ff8a;--amber:#ffd66b;--danger:#ff2d66;--orange:#ff8a1c;--red:#ff2b2b;--matrix:#39ff14}
body.theme-neon:before{background:radial-gradient(circle at 18% 55%,rgba(0,255,225,.24),transparent 38%),radial-gradient(circle at 82% 48%,rgba(173,92,255,.25),transparent 40%),linear-gradient(180deg,rgba(0,3,10,.42),rgba(0,0,0,.60)),url("../backcel.png") center center/cover no-repeat fixed!important;filter:brightness(.95) contrast(1.18) saturate(1.22)!important}
body.theme-neon:after{background:radial-gradient(circle at 25% 30%,rgba(57,255,20,.18),transparent 26%),radial-gradient(circle at 65% 35%,rgba(255,214,107,.13),transparent 28%),radial-gradient(circle at 82% 58%,rgba(255,43,43,.12),transparent 22%),linear-gradient(90deg,rgba(0,255,225,.045) 1px,transparent 1px),linear-gradient(0deg,rgba(57,255,20,.035) 1px,transparent 1px)!important;background-size:auto,auto,auto,38px 38px,38px 38px!important;animation:matrixPulse 7s ease-in-out infinite alternate}
@keyframes matrixPulse{0%{filter:hue-rotate(0deg) brightness(1)}50%{filter:hue-rotate(16deg) brightness(1.08)}100%{filter:hue-rotate(-12deg) brightness(1.02)}}
body.theme-neon button:nth-of-type(6n+1){border-color:var(--green)!important;color:var(--green)!important}
body.theme-neon button:nth-of-type(6n+2){border-color:var(--amber)!important;color:var(--amber)!important}
body.theme-neon button:nth-of-type(6n+3){border-color:var(--orange)!important;color:var(--orange)!important}
body.theme-neon button:nth-of-type(6n+4){border-color:var(--danger)!important;color:var(--danger)!important}
body.theme-neon button:nth-of-type(6n+5){border-color:var(--violet)!important;color:var(--violet)!important}
body.theme-neon button:nth-of-type(6n+6){border-color:var(--cyan)!important;color:var(--cyan)!important}
body.theme-neon .panel{box-shadow:0 0 26px rgba(0,255,225,.16),0 0 42px rgba(173,92,255,.08),inset 0 0 25px rgba(57,255,20,.035)!important}
@media(max-width:720px){.theme-switcher{justify-content:flex-start}.theme-btn{font-size:.56rem;min-width:66px}}


/* === V5 READABILITY + YOUPLUGS MARCK'S THEME === */

/* Background now sits next to index.html as /backcel.png */
body:before{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(0,3,10,.42),rgba(0,0,0,.58)),url("../backcel.png") center center/cover no-repeat fixed!important;
  z-index:-3!important;
  filter:brightness(.94) contrast(1.12) saturate(1.12)!important;
}

/* LIGHT MODE — no pale cyan text, high contrast everywhere */
body.theme-light{
  --bg:#f5fbff!important;
  --panel:rgba(255,255,255,.86)!important;
  --panel2:rgba(232,245,252,.78)!important;
  --cyan:#005f6f!important;
  --blue:#123ecf!important;
  --violet:#5425a8!important;
  --green:#006b3f!important;
  --amber:#7b4a00!important;
  --text:#05121a!important;
  --muted:#253f4a!important;
  --border:rgba(0,82,104,.34)!important;
  --danger:#9e1747!important;
  background:#f5fbff!important;
  color:#05121a!important;
}
body.theme-light:before{
  background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(241,249,252,.76)),url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(1.12) contrast(.94) saturate(.76)!important;
}
body.theme-light *{
  text-shadow:none!important;
}
body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light p,
body.theme-light label,
body.theme-light span,
body.theme-light div,
body.theme-light td,
body.theme-light th,
body.theme-light b{
  color:#05121a!important;
}
body.theme-light .topbar h1{
  color:#003e52!important;
  text-shadow:none!important;
  background:none!important;
  -webkit-text-fill-color:#003e52!important;
}
body.theme-light .topbar h1::after{
  color:#6b3d00!important;
  text-shadow:none!important;
}
body.theme-light .status-panel span,
body.theme-light .visual-head span,
body.theme-light .synth-status,
body.theme-light #assemblySearchInfo,
body.theme-light #therapyCycleStatus,
body.theme-light #cellularModeDescription{
  color:#083342!important;
  background:rgba(255,255,255,.82)!important;
  border-color:rgba(0,82,104,.32)!important;
  box-shadow:none!important;
}
body.theme-light .panel,
body.theme-light .topbar,
body.theme-light .table-card,
body.theme-light .metrics-grid div,
body.theme-light .assembly-search,
body.theme-light .cellular-tab-panel,
body.theme-light .controls-block{
  background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(230,244,250,.76))!important;
  border-color:rgba(0,82,104,.28)!important;
  box-shadow:0 0 18px rgba(0,82,104,.08),inset 0 0 14px rgba(255,255,255,.42)!important;
}
body.theme-light button,
body.theme-light select,
body.theme-light input,
body.theme-light textarea{
  background:#ffffff!important;
  color:#06131b!important;
  border-color:rgba(0,82,104,.42)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)!important;
}
body.theme-light select option{
  background:#ffffff!important;
  color:#06131b!important;
}
body.theme-light input::placeholder{
  color:#526b74!important;
}
body.theme-light .formula,
body.theme-light .hz,
body.theme-light .metrics-grid span,
body.theme-light .note-monitor,
body.theme-light .synth-status{
  color:#083342!important;
}
body.theme-light .cellular-tab{
  background:#ffffff!important;
  color:#06131b!important;
  border-color:rgba(0,82,104,.35)!important;
}
body.theme-light .cellular-tab.active{
  color:#003e52!important;
  border-color:#005f6f!important;
  background:#e6f6fb!important;
}
body.theme-light canvas{
  background:radial-gradient(circle at center,rgba(0,82,104,.08),rgba(255,255,255,.58) 66%)!important;
}
body.theme-light .immutable-copyright{
  background:rgba(255,255,255,.75)!important;
  color:#05121a!important;
  border-color:rgba(0,82,104,.32)!important;
}

/* YOUPLUGS MARCK'S — Youplugs Neon Cyber */
body.theme-youplugs{
  --bg:#05030B!important;
  --surface:#0B0618!important;
  --panel:rgba(11,6,24,.72)!important;
  --panel2:rgba(5,3,11,.72)!important;
  --pink:#FF2DF7!important;
  --cyan:#00D9FF!important;
  --blue:#00D9FF!important;
  --violet:#8A2CFF!important;
  --green:#74FFB2!important;
  --amber:#FFD166!important;
  --danger:#FF2D6D!important;
  --text:#F8F7FF!important;
  --muted:#9DA6FF!important;
  --border:rgba(255,255,255,.12)!important;
  background:#05030B!important;
  color:#F8F7FF!important;
  font-family:Inter,system-ui,sans-serif!important;
}
body.theme-youplugs:before{
  background:
    radial-gradient(circle at top left,rgba(255,45,247,.30),transparent 34%),
    radial-gradient(circle at bottom right,rgba(0,217,255,.30),transparent 35%),
    linear-gradient(180deg,rgba(5,3,11,.66),rgba(5,3,11,.82)),
    url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(.86) contrast(1.18) saturate(1.20)!important;
}
body.theme-youplugs:after{
  background:
    radial-gradient(circle at 18% 16%,rgba(255,45,247,.18),transparent 28%),
    radial-gradient(circle at 82% 82%,rgba(0,217,255,.18),transparent 30%),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,.028) 1px,transparent 1px)!important;
  background-size:auto,auto,42px 42px,42px 42px!important;
}
body.theme-youplugs .app-shell{
  font-family:Inter,system-ui,sans-serif!important;
}
body.theme-youplugs .topbar,
body.theme-youplugs .panel,
body.theme-youplugs .table-card,
body.theme-youplugs .assembly-search,
body.theme-youplugs .cellular-tab-panel,
body.theme-youplugs .metrics-grid div{
  background:linear-gradient(180deg,rgba(11,6,24,.68),rgba(5,3,11,.70))!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:28px!important;
  box-shadow:0 0 30px rgba(0,217,255,.18),0 0 22px rgba(255,45,247,.10)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
body.theme-youplugs h1,
body.theme-youplugs .topbar h1{
  font-family:Orbitron,Audiowide,sans-serif!important;
  letter-spacing:.08em!important;
  background:linear-gradient(135deg,#FF2DF7,#8A2CFF,#00D9FF)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  text-shadow:0 0 22px rgba(255,45,247,.50)!important;
}
body.theme-youplugs .topbar h1::after{
  color:#9DA6FF!important;
  -webkit-text-fill-color:#9DA6FF!important;
  background:none!important;
  text-shadow:0 0 12px rgba(0,217,255,.45)!important;
}
body.theme-youplugs h2,
body.theme-youplugs h3{
  color:#F8F7FF!important;
  text-shadow:0 0 12px rgba(255,45,247,.38),0 0 18px rgba(0,217,255,.28)!important;
}
body.theme-youplugs p,
body.theme-youplugs label,
body.theme-youplugs span,
body.theme-youplugs td,
body.theme-youplugs th,
body.theme-youplugs b,
body.theme-youplugs div{
  color:#F8F7FF;
}
body.theme-youplugs .status-panel span,
body.theme-youplugs .visual-head span,
body.theme-youplugs .synth-status,
body.theme-youplugs #assemblySearchInfo,
body.theme-youplugs #therapyCycleStatus{
  color:#9DA6FF!important;
  background:rgba(11,6,24,.62)!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 0 18px rgba(0,217,255,.18)!important;
}
body.theme-youplugs button,
body.theme-youplugs select,
body.theme-youplugs input{
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(11,6,24,.92),rgba(5,3,11,.92))!important;
  color:#F8F7FF!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 0 16px rgba(0,217,255,.10),inset 0 0 10px rgba(255,45,247,.08)!important;
}
body.theme-youplugs button:hover{
  border-color:#FF2DF7!important;
  box-shadow:0 0 12px #FF2DF7,0 0 28px #00D9FF!important;
}
body.theme-youplugs .theme-btn.active,
body.theme-youplugs #applyCellularPreset,
body.theme-youplugs #generateRandomAssembly,
body.theme-youplugs #generateCellularMode{
  background:linear-gradient(135deg,#FF2DF7,#8A2CFF,#00D9FF)!important;
  color:#05030B!important;
  border-color:transparent!important;
}
body.theme-youplugs .cellular-tab.active{
  background:linear-gradient(135deg,#FF2DF7,#8A2CFF,#00D9FF)!important;
  color:#05030B!important;
}
body.theme-youplugs canvas{
  background:radial-gradient(circle at center,rgba(255,45,247,.10),rgba(0,217,255,.08),rgba(5,3,11,.72) 68%)!important;
}
body.theme-youplugs .immutable-copyright{
  background:rgba(11,6,24,.62)!important;
  color:#F8F7FF!important;
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 0 18px rgba(255,45,247,.25),0 0 22px rgba(0,217,255,.20)!important;
}

@media(max-width:720px){
  body.theme-youplugs .topbar,
  body.theme-youplugs .panel{border-radius:22px!important}
}

/* === HOTFIX MARC LIGHT YOUPLUGS === */
body:before{content:""!important;position:fixed!important;inset:0!important;background:linear-gradient(180deg,rgba(0,3,10,.42),rgba(0,0,0,.58)),url("../backcel.png") center center/cover no-repeat fixed!important;z-index:-3!important;filter:brightness(.94) contrast(1.12) saturate(1.12)!important}
body.theme-light{--bg:#f6fbff!important;--panel:rgba(255,255,255,.92)!important;--panel2:rgba(232,245,252,.86)!important;--cyan:#003e52!important;--blue:#123ecf!important;--violet:#5425a8!important;--green:#005b36!important;--amber:#6d4100!important;--text:#041017!important;--muted:#243d48!important;--border:rgba(0,70,90,.38)!important;--danger:#99163f!important;background:#f6fbff!important;color:#041017!important}
body.theme-light:before{background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(242,249,252,.80)),url("../backcel.png") center center/cover no-repeat fixed!important;filter:brightness(1.10) contrast(.96) saturate(.74)!important}
body.theme-light:after{opacity:.32!important}
body.theme-light *,body.theme-light h1,body.theme-light h2,body.theme-light h3,body.theme-light h4,body.theme-light p,body.theme-light label,body.theme-light span,body.theme-light div,body.theme-light td,body.theme-light th,body.theme-light b,body.theme-light strong,body.theme-light small{color:#041017!important;text-shadow:none!important;-webkit-text-fill-color:initial!important}
body.theme-light .topbar h1{color:#003e52!important;-webkit-text-fill-color:#003e52!important;background:none!important}
body.theme-light .topbar h1::after{color:#5d3600!important;-webkit-text-fill-color:#5d3600!important;background:none!important}
body.theme-light .panel,body.theme-light .topbar,body.theme-light .table-card,body.theme-light .metrics-grid div,body.theme-light .assembly-search,body.theme-light .cellular-tab-panel,body.theme-light .controls-block,body.theme-light .data-table,body.theme-light .osc-row{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(231,244,250,.86))!important;border-color:rgba(0,70,90,.32)!important;box-shadow:0 0 14px rgba(0,70,90,.08),inset 0 0 12px rgba(255,255,255,.48)!important}
body.theme-light button,body.theme-light select,body.theme-light input,body.theme-light textarea{background:#fff!important;color:#041017!important;-webkit-text-fill-color:#041017!important;border-color:rgba(0,70,90,.45)!important;box-shadow:none!important}
body.theme-light select option{background:#fff!important;color:#041017!important}
body.theme-light input::placeholder{color:#4c646e!important;-webkit-text-fill-color:#4c646e!important}
body.theme-light .status-panel span,body.theme-light .visual-head span,body.theme-light .synth-status,body.theme-light #assemblySearchInfo,body.theme-light #therapyCycleStatus,body.theme-light #cellularModeDescription,body.theme-light .formula,body.theme-light .hz,body.theme-light .metrics-grid b,body.theme-light .metrics-grid span,body.theme-light .data-table th,body.theme-light .data-table td,body.theme-light .data-table .ok,body.theme-light .data-table .num,body.theme-light #baseFreq,body.theme-light #shapeMetric,body.theme-light #detMetric,body.theme-light #resultMetric{color:#041017!important;-webkit-text-fill-color:#041017!important;background:rgba(255,255,255,.84)!important;text-shadow:none!important}
body.theme-light .data-table th{background:#e6f3f8!important;color:#041017!important}
body.theme-light canvas{background:radial-gradient(circle at center,rgba(0,70,90,.08),rgba(255,255,255,.62) 66%)!important}
body.theme-light .cellular-tab,body.theme-light .theme-btn{background:#fff!important;color:#041017!important}
body.theme-light .cellular-tab.active,body.theme-light .theme-btn.active{background:#dff1f7!important;color:#002f3c!important;border-color:#003e52!important}
body.theme-light .immutable-copyright{background:rgba(255,255,255,.82)!important;color:#041017!important;border-color:rgba(0,70,90,.32)!important}
body.theme-youplugs .theme-btn[data-theme="youplugs"]{background:linear-gradient(135deg,#FF2DF7,#8A2CFF,#00D9FF)!important;color:#05030B!important;border-color:transparent!important}
.direct-osc-toggle{width:auto!important;min-width:150px!important;margin:0!important;padding:6px 10px!important;font-size:.62rem!important;border-color:rgba(255,214,107,.62)!important;color:var(--amber)!important}
body.hide-direct-osc #leftOscilloscope{display:none!important}
body.hide-direct-osc .left-panel{grid-template-rows:auto 1fr!important}
body.hide-direct-osc .controls-block{min-height:0!important}
body.hide-direct-osc .direct-osc-toggle{color:var(--green)!important;border-color:rgba(118,255,138,.62)!important}
body.theme-light .direct-osc-toggle{color:#041017!important;background:#fff!important;border-color:rgba(0,70,90,.45)!important}

/* === V7 UPDATE layout/search/history === */
.osc-row{display:grid!important;grid-template-columns:32px minmax(0,1fr) 96px!important;grid-template-rows:auto auto auto auto auto!important;gap:6px!important;padding:8px!important;align-items:center!important}
.osc-row label{grid-column:1/2!important;grid-row:1/2!important}.osc-row .freq{grid-column:1/4!important;grid-row:2/3!important;width:100%!important}.osc-row .freq-num{grid-column:1/3!important;grid-row:3/4!important;width:100%!important;font-size:.68rem!important}.osc-row .hz{grid-column:3/4!important;grid-row:3/4!important;text-align:right!important;font-size:.62rem!important;overflow:hidden;text-overflow:ellipsis!important}.osc-row .wave{grid-column:1/4!important;grid-row:4/5!important}.osc-row .gain{grid-column:1/3!important;grid-row:5/6!important}.osc-row .one{grid-column:3/4!important;grid-row:5/6!important;width:100%!important;min-height:34px!important;font-size:.62rem!important;padding:6px!important}
.visual-head{display:grid!important;grid-template-columns:1fr auto!important;grid-template-rows:auto auto!important;gap:6px!important;align-items:center!important}.visual-head h2{grid-column:1/2!important}.visual-head span{grid-column:1/2!important;grid-row:2/3!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.visual-actions{grid-column:2/3!important;grid-row:1/3!important;display:flex!important;gap:5px!important;max-width:230px!important}.visual-actions button,.window-fullscreen-btn,.window-min-btn,.window-close-btn{width:auto!important;min-width:42px!important;max-width:78px!important;margin:0!important;padding:6px 7px!important;font-size:.58rem!important;border-radius:10px!important}.window-fullscreen-btn{border-color:rgba(0,255,225,.58)!important;color:var(--cyan)!important}.window-min-btn{border-color:rgba(255,214,107,.62)!important;color:var(--amber)!important}.window-close-btn{border-color:rgba(255,77,143,.60)!important;color:var(--danger)!important}
body.hide-osc3d .center-panel{display:none!important}body.hide-spectrum3d .right-panel{display:none!important}body.min-osc3d .center-panel canvas,body.min-spectrum3d .right-panel canvas{display:none!important}body.min-osc3d .center-panel,body.min-spectrum3d .right-panel{min-height:58px!important}body.hide-osc3d.hide-spectrum3d .cockpit{grid-template-columns:minmax(340px,1fr)!important;grid-template-rows:minmax(0,1fr) minmax(240px,.5fr)!important}body.hide-osc3d.hide-spectrum3d .left-panel{grid-column:1/2!important;grid-template-rows:auto minmax(220px,38vh) 1fr!important}body.hide-osc3d.hide-spectrum3d .bottom-panel{grid-column:1/2!important}body.hide-osc3d:not(.hide-spectrum3d) .cockpit,body.hide-spectrum3d:not(.hide-osc3d) .cockpit{grid-template-columns:minmax(380px,1.1fr) minmax(420px,.9fr)!important}body.hide-osc3d:not(.hide-spectrum3d) .left-panel,body.hide-spectrum3d:not(.hide-osc3d) .left-panel{grid-column:1/2!important}body.hide-osc3d:not(.hide-spectrum3d) .right-panel{grid-column:2/3!important}body.hide-spectrum3d:not(.hide-osc3d) .center-panel{grid-column:2/3!important}body.hide-osc3d:not(.hide-spectrum3d) .bottom-panel,body.hide-spectrum3d:not(.hide-osc3d) .bottom-panel{grid-column:1/3!important}
.search-results-hint{font-size:.68rem;padding:6px 8px;border:1px solid rgba(0,255,225,.22);border-radius:10px;background:rgba(0,0,0,.22);margin:4px 0;color:var(--green)}
.user-entry-overlay{position:fixed;inset:0;z-index:20000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.72);backdrop-filter:blur(12px)}.user-entry-overlay.hidden{display:none!important}.user-entry-card{width:min(420px,92vw);padding:22px;border:1px solid rgba(0,255,225,.38);border-radius:24px;background:linear-gradient(145deg,rgba(5,3,11,.94),rgba(0,20,35,.90));box-shadow:0 0 38px rgba(0,255,225,.18)}.user-entry-card small{display:block;color:var(--muted);font-size:.64rem;margin-top:8px}.history-tabs{margin:8px 0}.history-tab{border-color:rgba(173,92,255,.52)!important;color:var(--violet)!important}.user-history-panel{display:none;margin:8px 0;padding:8px;border:1px solid rgba(173,92,255,.30);border-radius:14px;background:rgba(0,0,0,.24)}.user-history-panel.open{display:block}.history-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.history-head button{width:auto!important;min-width:70px!important}.history-summary{font-size:.68rem;color:var(--green);margin:6px 0}.user-history-panel table{width:100%;border-collapse:collapse}.user-history-panel th,.user-history-panel td{padding:5px 6px;border-bottom:1px solid rgba(0,255,225,.12);text-align:left}
@media(max-width:980px){html,body{overflow:auto!important}.app-shell{height:auto!important;min-height:100vh!important}.cockpit{display:flex!important;flex-direction:column!important}.left-panel{min-height:760px!important;grid-template-rows:auto 210px minmax(420px,1fr)!important}.center-panel,.right-panel{min-height:420px!important}.bottom-panel{min-height:360px!important}.visual-head{grid-template-columns:1fr!important}.visual-actions{grid-column:1/2!important;grid-row:3/4!important;max-width:none!important;justify-content:stretch!important}.visual-actions button{flex:1!important;max-width:none!important}.osc-grid{grid-template-columns:1fr!important}.button-grid{grid-template-columns:1fr!important}}@media(max-width:560px){.app-shell{padding:6px!important}.topbar{align-items:flex-start!important}.status-panel{justify-content:flex-start!important}.left-panel{min-height:860px!important}.controls-block{padding:8px!important}.user-entry-card{padding:16px}}
body.theme-light .visual-actions button,body.theme-light .window-fullscreen-btn,body.theme-light .window-min-btn,body.theme-light .window-close-btn,body.theme-light .history-tab,body.theme-light .user-history-panel,body.theme-light .search-results-hint{background:#fff!important;color:#041017!important;border-color:rgba(0,70,90,.45)!important;text-shadow:none!important}


/* === V8 MOBILE/THEMES/FLIP/BOARD UPDATE === */

/* Thèmes : forcer les boutons visibles sur mobile */
.theme-switcher{position:relative;z-index:50}
.theme-switcher .theme-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:32px!important}
body.theme-youplugs .theme-btn{
  border:1px solid rgba(255,255,255,.16)!important;
  background:linear-gradient(135deg,rgba(255,45,247,.22),rgba(138,44,255,.18),rgba(0,217,255,.18))!important;
  color:#f8f7ff!important;
  box-shadow:0 0 14px rgba(255,45,247,.20),inset 0 0 12px rgba(0,217,255,.08)!important;
}
body.theme-youplugs .theme-btn.active{
  background:linear-gradient(135deg,#ff2df7,#8a2cff,#00d9ff)!important;
  color:#05030b!important;
  box-shadow:0 0 16px rgba(255,45,247,.55),0 0 32px rgba(0,217,255,.38)!important;
}
body.theme-youplugs button{
  border:1px solid transparent!important;
  background:
    linear-gradient(#0b0618,#05030b) padding-box,
    linear-gradient(135deg,#ff2df7,#39ff14,#ffd66b,#ff7a18,#8a2cff,#00d9ff) border-box!important;
  color:#f8f7ff!important;
  box-shadow:0 0 12px rgba(255,45,247,.18),0 0 22px rgba(0,217,255,.12)!important;
}
body.theme-youplugs button:hover,body.theme-youplugs .view-tool:hover{
  box-shadow:0 0 16px rgba(255,45,247,.50),0 0 34px rgba(0,217,255,.34),inset 0 0 14px rgba(57,255,20,.10)!important;
}

/* Toolbar hors canvas, au-dessus des fenêtres 3D */
.view-toolbar{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  padding:7px 9px;
  border-bottom:1px solid rgba(0,255,225,.18);
  background:rgba(0,0,0,.20);
}
.view-tool{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  margin:0!important;
  padding:7px 5px!important;
  font-size:.58rem!important;
  border-radius:10px!important;
}
.visual-actions{display:none!important}

/* Boutons ouvrir/réduire/masquer opérationnels */
body.hide-osc3d .center-panel canvas,
body.hide-osc3d .center-panel .camera-buttons,
body.hide-osc3d .center-panel .view-toolbar .full,
body.hide-osc3d .center-panel .view-toolbar .reduce,
body.hide-osc3d .center-panel .view-toolbar .hide{display:none!important}
body.hide-spectrum3d .right-panel canvas,
body.hide-spectrum3d .right-panel .camera-buttons,
body.hide-spectrum3d .right-panel .view-toolbar .full,
body.hide-spectrum3d .right-panel .view-toolbar .reduce,
body.hide-spectrum3d .right-panel .view-toolbar .hide{display:none!important}
body.hide-osc3d .center-panel,body.hide-spectrum3d .right-panel{min-height:64px!important}
body.hide-osc3d .center-panel .view-toolbar,
body.hide-spectrum3d .right-panel .view-toolbar{grid-template-columns:1fr!important}
body:not(.hide-osc3d) #osc3dOpen,body:not(.hide-spectrum3d) #spec3dOpen{display:none!important}
body.min-osc3d .center-panel canvas,body.min-spectrum3d .right-panel canvas{height:120px!important;min-height:120px!important}
body.hide-osc3d.hide-spectrum3d .cockpit{grid-template-columns:minmax(340px,1fr)!important;grid-template-rows:minmax(0,1fr) minmax(290px,.55fr)!important}
body.hide-osc3d.hide-spectrum3d .left-panel{grid-column:1/2!important;grid-template-rows:auto minmax(260px,42vh) 1fr!important}
body.hide-osc3d.hide-spectrum3d .bottom-panel{grid-column:1/2!important}
body.hide-osc3d:not(.hide-spectrum3d) .cockpit,
body.hide-spectrum3d:not(.hide-osc3d) .cockpit{grid-template-columns:minmax(380px,1.15fr) minmax(420px,.85fr)!important}
body.hide-osc3d:not(.hide-spectrum3d) .bottom-panel,
body.hide-spectrum3d:not(.hide-osc3d) .bottom-panel{grid-column:1/3!important}

/* Joysticks : visibles quand navigation active, surtout mobile */
.mobile-joysticks{display:none;position:fixed;left:0;right:0;bottom:12px;z-index:12000;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 14px}
body.nav-3d-active .mobile-joysticks,body.window-fullscreen-active .mobile-joysticks{display:flex!important}
.joy-zone{width:112px;height:112px;border-radius:50%;border:1px solid rgba(0,255,225,.50);background:rgba(0,8,18,.42);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);position:relative;pointer-events:auto;touch-action:none}
.joy-knob{width:42px;height:42px;border-radius:50%;position:absolute;left:35px;top:35px;background:radial-gradient(circle,#00ffe1,rgba(0,255,225,.12));box-shadow:0 0 18px rgba(0,255,225,.85)}
.mobile-exit{pointer-events:auto;width:auto!important;min-width:86px!important}

/* Flip bas */
.bottom-panel{position:relative;display:block!important;overflow:hidden}
.flip-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:8px;border-bottom:1px solid rgba(0,255,225,.18)}
.flip-tab{font-size:.68rem!important;min-height:36px!important}
.board-tab{
  background:linear-gradient(135deg,#ff2df7,#39ff14,#ffd66b,#ff7a18,#8a2cff,#00d9ff)!important;
  color:#05030b!important;
  text-shadow:none!important;
}
.flip-stage{position:relative;min-height:220px;perspective:1200px}
.flip-face{display:none;transform-origin:top center;animation:flipDown .36s ease both}
.flip-face.active{display:block}
@keyframes flipDown{0%{transform:rotateX(-90deg);opacity:.2}100%{transform:rotateX(0deg);opacity:1}}

/* Users */
.users-panel,.board-panel{padding:10px;min-height:220px;overflow:auto}
.users-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
.last-user-top{font-size:.68rem;color:var(--amber);padding:5px 8px;border:1px solid rgba(255,214,107,.30);border-radius:999px;background:rgba(0,0,0,.35)}
.users-filters{display:grid;grid-template-columns:1fr 160px 180px;gap:8px;margin:8px 0}
.users-log-table table{width:100%;border-collapse:collapse}
.users-log-table th,.users-log-table td{padding:6px;border-bottom:1px solid rgba(0,255,225,.13);text-align:left;vertical-align:top}
.comment-title{cursor:pointer;color:var(--amber)!important;text-decoration:underline}
.comment-full{display:none;white-space:normal;line-height:1.4;color:var(--text)!important}
.comment-full.open{display:block}
.comment-box{margin-top:12px;padding:10px;border:1px solid rgba(173,92,255,.25);border-radius:14px;background:rgba(0,0,0,.22)}
.comment-box textarea{width:100%;min-height:80px;resize:vertical}

/* Youplugs Board */
.youplugs-board-title{
  font-size:1.25rem!important;
  background:linear-gradient(90deg,#ff2df7,#39ff14,#ffd66b,#ff7a18,#8a2cff,#00d9ff);
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
  text-shadow:0 0 18px rgba(255,45,247,.35);
}
.board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.board-actions{display:flex;gap:7px;flex-wrap:wrap}
.board-actions button,.import-label{width:auto!important;min-width:90px!important}
.import-label{display:inline-flex;align-items:center;justify-content:center;padding:7px 9px;border-radius:12px;border:1px solid rgba(0,255,225,.34);cursor:pointer}
.import-label input{display:none}
.board-monitor{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.board-monitor span,.board-octaves span{padding:6px 9px;border:1px solid rgba(0,255,225,.20);border-radius:999px;background:rgba(0,0,0,.24);font-size:.72rem}
.board-octaves{display:flex;align-items:center;gap:8px;margin:8px 0}
.board-octaves button{width:auto!important;min-width:90px!important}
.youplugs-piano{position:relative;height:210px;overflow-x:auto;overflow-y:hidden;border:1px solid rgba(0,255,225,.22);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(0,0,0,.35));padding:8px;display:flex;align-items:flex-end;touch-action:none}
.piano-key{position:relative;flex:0 0 42px;height:180px;margin-right:2px;border-radius:0 0 10px 10px;border:1px solid rgba(255,255,255,.30);background:linear-gradient(180deg,#f8f8ff,#cbd4e1);color:#05030b;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;font-size:.62rem;font-weight:900;user-select:none;touch-action:none}
.piano-key.black{flex-basis:28px;height:118px;margin-left:-16px;margin-right:-14px;z-index:2;background:linear-gradient(180deg,#161226,#01010a);color:#f8f7ff;border-color:rgba(255,255,255,.16);align-self:flex-start;padding-bottom:10px}
.piano-key.active{transform:translateY(5px);box-shadow:0 0 16px rgba(255,45,247,.65),0 0 28px rgba(0,217,255,.45);filter:saturate(1.35)}
.piano-key .key-freq{position:absolute;bottom:24px;font-size:.50rem;opacity:.75}
.board-customize-panel{display:none;margin-top:10px;padding:10px;border:1px solid rgba(255,214,107,.25);border-radius:14px;background:rgba(0,0,0,.25)}
.board-customize-panel.open{display:block}
.board-key-editor-row{display:grid;grid-template-columns:70px 1fr;gap:8px;align-items:center;margin:4px 0}

/* Mobile */
@media(max-width:980px){
  html,body{overflow:auto!important}
  .app-shell{height:auto!important;min-height:100vh!important}
  .theme-switcher{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  .cockpit{display:flex!important;flex-direction:column!important;min-height:auto!important}
  .left-panel{min-height:840px!important;grid-template-rows:auto 220px minmax(480px,1fr)!important}
  .center-panel,.right-panel{min-height:430px!important}
  .bottom-panel{min-height:560px!important}
  .view-toolbar{grid-template-columns:1fr 1fr!important}
  .users-filters{grid-template-columns:1fr!important}
  .flip-tabs{grid-template-columns:1fr!important}
  .board-head,.users-head{align-items:flex-start;flex-direction:column}
  .youplugs-piano{height:230px}
  .piano-key{flex-basis:46px}
  .piano-key.black{flex-basis:30px}
  body.nav-3d-active .mobile-joysticks{display:flex!important}
}
@media(max-width:560px){
  .joy-zone{width:96px;height:96px}.joy-knob{left:27px;top:27px}
  .mobile-exit{min-width:72px!important;font-size:.58rem!important}
  .board-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
}

/* Light readable for V8 */
body.theme-light .flip-tab,body.theme-light .users-panel,body.theme-light .board-panel,body.theme-light .users-log-table td,body.theme-light .users-log-table th,body.theme-light .board-monitor span,body.theme-light .board-octaves span,body.theme-light .comment-box,body.theme-light .view-tool,body.theme-light .last-user-top{background:#fff!important;color:#041017!important;border-color:rgba(0,70,90,.35)!important;text-shadow:none!important}
body.theme-light .youplugs-board-title{background:none!important;color:#003e52!important;-webkit-text-fill-color:#003e52!important}
body.theme-light .piano-key{background:linear-gradient(180deg,#fff,#dce8ef)!important;color:#041017!important}
body.theme-light .piano-key.black{background:linear-gradient(180deg,#30343d,#080b10)!important;color:#fff!important}


/* === V9 ROBUST FIX — mobile, tabs, board, users, matrix theme === */

/* Youplugs Marck's = Matrix vert néon premium */
body.theme-youplugs{
  --matrix:#39ff14!important;--matrix2:#00ff88!important;--matrixDark:#031406!important;
  --cyan:#00ffe1!important;--violet:#b45cff!important;--amber:#ffe66d!important;
  --danger:#ff2d6d!important;--text:#efffed!important;--muted:#9affb2!important;
  background:#010603!important;color:#efffed!important;
}
body.theme-youplugs:before{
  background:
    radial-gradient(circle at 12% 20%,rgba(57,255,20,.20),transparent 30%),
    radial-gradient(circle at 88% 30%,rgba(180,92,255,.18),transparent 34%),
    radial-gradient(circle at 50% 100%,rgba(0,255,136,.16),transparent 40%),
    linear-gradient(180deg,rgba(0,8,3,.72),rgba(0,0,0,.82)),
    url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(.82) contrast(1.22) saturate(1.18)!important;
}
body.theme-youplugs:after{
  background:
    linear-gradient(90deg,rgba(57,255,20,.08) 1px,transparent 1px),
    linear-gradient(0deg,rgba(57,255,20,.06) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,rgba(57,255,20,.10),transparent 45%)!important;
  background-size:34px 34px,34px 34px,auto!important;
  animation:v9MatrixDrift 9s linear infinite!important;
}
@keyframes v9MatrixDrift{0%{filter:hue-rotate(0deg) brightness(1)}50%{filter:hue-rotate(20deg) brightness(1.12)}100%{filter:hue-rotate(0deg) brightness(1)}}
body.theme-youplugs .panel,body.theme-youplugs .topbar,body.theme-youplugs .table-card,body.theme-youplugs .assembly-search,body.theme-youplugs .v9-card{
  background:linear-gradient(180deg,rgba(3,20,6,.78),rgba(0,8,3,.82))!important;
  border:1px solid rgba(57,255,20,.25)!important;
  box-shadow:0 0 18px rgba(57,255,20,.16),0 0 36px rgba(180,92,255,.10),inset 0 0 18px rgba(0,255,136,.05)!important;
  backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
}
body.theme-youplugs button,body.theme-youplugs .theme-btn,body.theme-youplugs select,body.theme-youplugs input,body.theme-youplugs textarea{
  border:1px solid transparent!important;
  background:linear-gradient(#031406,#010603) padding-box,linear-gradient(135deg,#39ff14,#00ff88,#ffe66d,#b45cff,#00ffe1) border-box!important;
  color:#efffed!important;box-shadow:0 0 12px rgba(57,255,20,.18),0 0 22px rgba(180,92,255,.10)!important;
}
body.theme-youplugs button:hover,body.theme-youplugs .theme-btn.active{
  color:#020902!important;background:linear-gradient(135deg,#39ff14,#00ff88,#ffe66d) padding-box,linear-gradient(135deg,#39ff14,#b45cff,#00ffe1) border-box!important;
  box-shadow:0 0 18px rgba(57,255,20,.60),0 0 38px rgba(180,92,255,.32)!important;
}

/* Toolbar 3D externe au canvas */
.v9-view-toolbar{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;
  padding:8px;border:1px solid rgba(0,255,225,.18);border-radius:14px;margin:6px 0 8px;
  background:rgba(0,0,0,.24);
}
.v9-view-toolbar button{width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;padding:7px 5px!important;font-size:.58rem!important;border-radius:10px!important}
.visual-actions{display:none!important}
body.v9-hide-osc3d .center-panel canvas,body.v9-hide-osc3d .center-panel .camera-buttons{display:none!important}
body.v9-hide-spec3d .right-panel canvas,body.v9-hide-spec3d .right-panel .camera-buttons{display:none!important}
body.v9-hide-osc3d .center-panel,body.v9-hide-spec3d .right-panel{min-height:72px!important}
body.v9-min-osc3d .center-panel canvas,body.v9-min-spec3d .right-panel canvas{height:120px!important;min-height:120px!important}
body.v9-hide-osc3d.v9-hide-spec3d .cockpit{grid-template-columns:minmax(340px,1fr)!important}
body.v9-hide-osc3d.v9-hide-spec3d .left-panel{grid-column:1/2!important;grid-template-rows:auto minmax(240px,40vh) 1fr!important}
body.v9-hide-osc3d.v9-hide-spec3d .bottom-panel{grid-column:1/2!important}
body.v9-hide-osc3d:not(.v9-hide-spec3d) .cockpit,body.v9-hide-spec3d:not(.v9-hide-osc3d) .cockpit{grid-template-columns:minmax(380px,1.1fr) minmax(420px,.9fr)!important}
body.v9-hide-osc3d:not(.v9-hide-spec3d) .bottom-panel,body.v9-hide-spec3d:not(.v9-hide-osc3d) .bottom-panel{grid-column:1/3!important}

/* Joysticks */
.mobile-joysticks{display:none;position:fixed;left:0;right:0;bottom:12px;z-index:14000;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 14px}
body.v9-nav-active .mobile-joysticks,body.window-fullscreen-active .mobile-joysticks{display:flex!important}
.joy-zone{width:112px;height:112px;border-radius:50%;border:1px solid rgba(57,255,20,.55);background:rgba(0,12,4,.46);backdrop-filter:blur(5px);position:relative;pointer-events:auto;touch-action:none}
.joy-knob{width:42px;height:42px;border-radius:50%;position:absolute;left:35px;top:35px;background:radial-gradient(circle,#39ff14,rgba(57,255,20,.14));box-shadow:0 0 18px rgba(57,255,20,.9)}
.mobile-exit{pointer-events:auto;width:auto!important;min-width:86px!important}

/* Bottom flip rebuilt */
.bottom-panel{display:block!important;overflow:hidden!important}
.v9-flip-tabs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:8px;border-bottom:1px solid rgba(57,255,20,.18)}
.v9-flip-tab{min-height:38px!important;font-size:.68rem!important}
.v9-board-tab{background:linear-gradient(90deg,#39ff14,#00ff88,#ffe66d,#b45cff,#00ffe1)!important;color:#010603!important;text-shadow:none!important}
.v9-flip-stage{perspective:1200px;min-height:300px}
.v9-flip-face{display:none;animation:v9Flip .36s ease both;transform-origin:top center}
.v9-flip-face.active{display:block}
@keyframes v9Flip{0%{transform:rotateX(-90deg);opacity:.2}100%{transform:rotateX(0deg);opacity:1}}

/* Users */
.v9-users,.v9-board{padding:12px;min-height:280px;overflow:auto}
.v9-users-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.v9-user-filters{display:grid;grid-template-columns:1fr 150px 180px;gap:8px;margin:10px 0}
.v9-user-table table{width:100%;border-collapse:collapse}.v9-user-table th,.v9-user-table td{padding:6px;border-bottom:1px solid rgba(57,255,20,.13);text-align:left;vertical-align:top}
.v9-comment-title{cursor:pointer;color:var(--amber)!important;text-decoration:underline}.v9-comment-full{display:none;line-height:1.4}.v9-comment-full.open{display:block}
.v9-comment-box{margin-top:12px;padding:10px;border:1px solid rgba(57,255,20,.22);border-radius:14px;background:rgba(0,0,0,.24)}
.v9-comment-box textarea{width:100%;min-height:82px;resize:vertical}

/* Board */
.v9-board-title{font-size:1.35rem!important;background:linear-gradient(90deg,#39ff14,#00ff88,#ffe66d,#b45cff,#00ffe1);-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:0 0 18px rgba(57,255,20,.42)}
.v9-board-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.v9-board-actions{display:flex;gap:7px;flex-wrap:wrap}
.v9-board-monitor{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.v9-board-monitor span,.v9-board-octaves span{padding:6px 9px;border:1px solid rgba(57,255,20,.20);border-radius:999px;background:rgba(0,0,0,.25);font-size:.72rem}.v9-board-octaves{display:flex;gap:8px;align-items:center;margin:8px 0}
.v9-piano{height:220px;overflow-x:auto;overflow-y:hidden;border:1px solid rgba(57,255,20,.25);border-radius:18px;background:linear-gradient(180deg,rgba(57,255,20,.05),rgba(0,0,0,.35));padding:8px;display:flex;align-items:flex-end;touch-action:none}
.v9-key{position:relative;flex:0 0 44px;height:180px;margin-right:2px;border-radius:0 0 10px 10px;border:1px solid rgba(255,255,255,.30);background:linear-gradient(180deg,#f8fff8,#b9d9c0);color:#020902;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;font-size:.62rem;font-weight:900;user-select:none;touch-action:none}
.v9-key.black{flex-basis:30px;height:120px;margin-left:-17px;margin-right:-15px;z-index:2;background:linear-gradient(180deg,#101a10,#000);color:#efffed;border-color:rgba(57,255,20,.22);align-self:flex-start}
.v9-key.active{transform:translateY(5px);box-shadow:0 0 18px rgba(57,255,20,.9),0 0 34px rgba(180,92,255,.45);filter:saturate(1.4)}
.v9-key .freq{position:absolute;bottom:24px;font-size:.50rem;opacity:.75}
.v9-editor{display:none;margin-top:10px;padding:10px;border:1px solid rgba(255,230,109,.25);border-radius:14px;background:rgba(0,0,0,.25)}.v9-editor.open{display:block}.v9-editor-row{display:grid;grid-template-columns:70px 1fr;gap:8px;margin:4px 0;align-items:center}
.v9-import input{display:none}

/* Mobile */
@media(max-width:980px){
  .theme-switcher{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  .cockpit{display:flex!important;flex-direction:column!important}.app-shell{height:auto!important;min-height:100vh!important}
  .left-panel{min-height:820px!important}.center-panel,.right-panel{min-height:430px!important}.bottom-panel{min-height:620px!important}
  .v9-view-toolbar{grid-template-columns:1fr 1fr!important}.v9-flip-tabs{grid-template-columns:1fr!important}.v9-user-filters{grid-template-columns:1fr!important}
  .v9-board-head,.v9-users-head{flex-direction:column;align-items:flex-start}.v9-piano{height:240px}.v9-key{flex-basis:48px}.v9-key.black{flex-basis:32px}
}
@media(max-width:560px){.joy-zone{width:96px;height:96px}.joy-knob{left:27px;top:27px}.mobile-exit{min-width:72px!important;font-size:.58rem!important}.v9-board-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}}

/* Light readable */
body.theme-light .v9-flip-tab,body.theme-light .v9-users,body.theme-light .v9-board,body.theme-light .v9-user-table td,body.theme-light .v9-user-table th,body.theme-light .v9-board-monitor span,body.theme-light .v9-board-octaves span,body.theme-light .v9-view-toolbar,body.theme-light .v9-comment-box{background:#fff!important;color:#041017!important;border-color:rgba(0,70,90,.35)!important;text-shadow:none!important}
body.theme-light .v9-board-title{background:none!important;color:#003e52!important;-webkit-text-fill-color:#003e52!important}
body.theme-light .v9-key{background:linear-gradient(180deg,#fff,#dce8ef)!important;color:#041017!important}body.theme-light .v9-key.black{background:linear-gradient(180deg,#30343d,#080b10)!important;color:#fff!important}


/* === V10 FINAL STABILITY PATCH — overflow, panels, mobile, search, neon === */

/* Global overflow stability */
html,body{max-width:100%;overflow-x:hidden!important}
*{box-sizing:border-box}
.app-shell,.cockpit,.panel{min-width:0!important}
.panel{overflow:hidden!important}
.controls-block,.bottom-panel,.left-panel,.center-panel,.right-panel{min-width:0!important}

/* Youplugs Marck's final: violet matrix neon luminous */
body.theme-youplugs{
  --text:#f9f5ff!important;--muted:#c9b6ff!important;--cyan:#00eaff!important;
  --violet:#b000ff!important;--pink:#ff2df7!important;--green:#39ff14!important;
  --amber:#ffe66d!important;--danger:#ff2d6d!important;
  background:#05000c!important;color:#f9f5ff!important;
}
body.theme-youplugs:before{
  background:
    radial-gradient(circle at 16% 18%,rgba(176,0,255,.28),transparent 32%),
    radial-gradient(circle at 84% 20%,rgba(0,234,255,.20),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(57,255,20,.18),transparent 40%),
    linear-gradient(180deg,rgba(5,0,12,.72),rgba(0,0,0,.86)),
    url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(.82) contrast(1.26) saturate(1.25)!important;
}
body.theme-youplugs:after{
  background:
    linear-gradient(90deg,rgba(176,0,255,.055) 1px,transparent 1px),
    linear-gradient(0deg,rgba(57,255,20,.038) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,rgba(255,45,247,.12),transparent 42%)!important;
  background-size:36px 36px,36px 36px,auto!important;
  animation:v10NeonAura 7s ease-in-out infinite alternate!important;
}
@keyframes v10NeonAura{0%{filter:hue-rotate(0deg) brightness(1)}50%{filter:hue-rotate(16deg) brightness(1.13)}100%{filter:hue-rotate(-10deg) brightness(1.04)}}
body.theme-youplugs .panel,body.theme-youplugs .topbar,body.theme-youplugs .table-card,body.theme-youplugs .assembly-search,body.theme-youplugs .v10-card{
  background:linear-gradient(180deg,rgba(18,0,38,.78),rgba(3,0,10,.86))!important;
  border:1px solid rgba(176,0,255,.34)!important;
  box-shadow:0 0 22px rgba(176,0,255,.26),0 0 38px rgba(0,234,255,.14),inset 0 0 20px rgba(57,255,20,.045)!important;
  backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important;
}
body.theme-youplugs button,body.theme-youplugs .theme-btn,body.theme-youplugs select,body.theme-youplugs input,body.theme-youplugs textarea,body.theme-youplugs .json-import-label{
  border:1px solid transparent!important;
  background:linear-gradient(#100021,#05000c) padding-box,linear-gradient(135deg,#ff2df7,#b000ff,#39ff14,#00eaff) border-box!important;
  color:#f9f5ff!important;
  box-shadow:0 0 12px rgba(176,0,255,.28),0 0 22px rgba(0,234,255,.14),inset 0 0 12px rgba(255,45,247,.06)!important;
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease!important;
}
body.theme-youplugs button:hover,body.theme-youplugs .theme-btn.active,body.theme-youplugs .json-import-label:hover{
  transform:translateY(-1px);
  color:#fff!important;
  box-shadow:0 0 18px rgba(255,45,247,.70),0 0 36px rgba(0,234,255,.40),0 0 52px rgba(57,255,20,.16)!important;
  filter:saturate(1.25);
}

/* Visual section command bars OUTSIDE canvases and always inside panel */
.v10-panel-menu{
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:8px!important;
  align-items:center!important;
  padding:8px 9px!important;
  margin:6px 0 8px!important;
  border:1px solid rgba(176,0,255,.24)!important;
  border-radius:14px!important;
  background:rgba(0,0,0,.24)!important;
  min-width:0!important;
}
.v10-panel-title{font-weight:800;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.v10-panel-actions{display:flex!important;gap:6px!important;flex-wrap:wrap!important;justify-content:flex-end!important;min-width:0!important}
.v10-panel-actions button{
  width:auto!important;min-width:58px!important;max-width:110px!important;
  padding:7px 7px!important;margin:0!important;border-radius:10px!important;font-size:.58rem!important;line-height:1!important;
}
.visual-actions,.view-toolbar,.v9-view-toolbar{display:none!important}

/* Hidden/reduced 3D states: menu stays visible, canvas never overflows */
.center-panel canvas,.right-panel canvas{
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  display:block!important;
  border-radius:14px!important;
}
body.v10-hide-osc3d .center-panel canvas,
body.v10-hide-osc3d .center-panel .camera-buttons{display:none!important}
body.v10-hide-spec3d .right-panel canvas,
body.v10-hide-spec3d .right-panel .camera-buttons{display:none!important}
body.v10-hide-osc3d .center-panel,
body.v10-hide-spec3d .right-panel{min-height:78px!important;height:auto!important}
body.v10-min-osc3d .center-panel canvas,
body.v10-min-spec3d .right-panel canvas{height:128px!important;min-height:128px!important;max-height:128px!important}
body.v10-hide-osc3d.v10-hide-spec3d .cockpit{grid-template-columns:minmax(320px,1fr)!important;grid-template-rows:minmax(0,1fr) minmax(320px,.60fr)!important}
body.v10-hide-osc3d.v10-hide-spec3d .left-panel{grid-column:1/2!important;grid-template-rows:auto minmax(260px,42vh) minmax(520px,1fr)!important}
body.v10-hide-osc3d.v10-hide-spec3d .bottom-panel{grid-column:1/2!important}
body.v10-hide-osc3d:not(.v10-hide-spec3d) .cockpit,
body.v10-hide-spec3d:not(.v10-hide-osc3d) .cockpit{grid-template-columns:minmax(380px,1.12fr) minmax(420px,.88fr)!important}
body.v10-hide-osc3d:not(.v10-hide-spec3d) .bottom-panel,
body.v10-hide-spec3d:not(.v10-hide-osc3d) .bottom-panel{grid-column:1/3!important}

/* Fullscreen remains contained */
.fullscreen-window{overflow:hidden!important}
.fullscreen-window canvas{height:calc(100vh - 120px)!important;max-height:calc(100vh - 120px)!important}

/* Joysticks only on mobile AND only when a 3D view is active */
.mobile-joysticks{display:none!important}
@media(max-width:980px){
  body.v10-nav-active .mobile-joysticks,
  body.window-fullscreen-active .mobile-joysticks{display:flex!important}
  .mobile-joysticks{position:fixed;left:0;right:0;bottom:12px;z-index:14000;pointer-events:none;justify-content:space-between;align-items:flex-end;padding:0 14px}
  .joy-zone{width:104px!important;height:104px!important;border-radius:50%;border:1px solid rgba(176,0,255,.55)!important;background:rgba(8,0,18,.50)!important;backdrop-filter:blur(5px);position:relative;pointer-events:auto;touch-action:none}
  .joy-knob{width:40px!important;height:40px!important;border-radius:50%;position:absolute;left:32px!important;top:32px!important;background:radial-gradient(circle,#ff2df7,rgba(0,234,255,.18))!important;box-shadow:0 0 18px rgba(255,45,247,.9),0 0 28px rgba(0,234,255,.4)!important}
  .mobile-exit{pointer-events:auto;width:auto!important;min-width:78px!important}
}

/* Bottom flip: scroll never clipped */
.bottom-panel{display:flex!important;flex-direction:column!important;overflow:hidden!important;min-height:420px!important}
.v10-flip-tabs{
  flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr 1fr;gap:7px;padding:8px;border-bottom:1px solid rgba(176,0,255,.22)
}
.v10-flip-tab{min-height:38px!important;font-size:.68rem!important}
.v10-board-tab{background:linear-gradient(90deg,#ff2df7,#b000ff,#39ff14,#00eaff)!important;color:#fff!important}
.v10-flip-stage{flex:1 1 auto;min-height:0!important;overflow:hidden!important;perspective:1200px!important}
.v10-flip-face{display:none;height:100%!important;min-height:0!important;overflow:auto!important;animation:v10Flip .34s ease both;transform-origin:top center;padding:0!important}
.v10-flip-face.active{display:block!important}
@keyframes v10Flip{0%{transform:rotateX(-82deg);opacity:.25}100%{transform:rotateX(0deg);opacity:1}}
.v10-users,.v10-board{padding:12px;min-height:100%;overflow:auto!important}
.v10-math-wrap{height:100%;overflow:auto!important;min-height:0!important}

/* Users */
.v10-users-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.v10-user-filters{display:grid;grid-template-columns:1fr 150px 185px;gap:8px;margin:10px 0}
.v10-user-table{overflow:auto;max-height:58vh;border-radius:12px}
.v10-user-table table{width:100%;border-collapse:collapse;min-width:760px}
.v10-user-table th,.v10-user-table td{padding:7px;border-bottom:1px solid rgba(176,0,255,.16);text-align:left;vertical-align:top}
.v10-comment-title{cursor:pointer;color:var(--amber)!important;text-decoration:underline}
.v10-comment-full{display:none;line-height:1.4;max-width:520px;white-space:normal}
.v10-comment-full.open{display:block}
.v10-comment-box{margin-top:12px;padding:10px;border:1px solid rgba(176,0,255,.26);border-radius:14px;background:rgba(0,0,0,.24)}
.v10-comment-box textarea{width:100%;min-height:86px;resize:vertical}
.v10-users-status{font-size:.68rem;color:var(--green);margin:6px 0}

/* Youplugs Board */
.v10-board-title{
  font-size:1.36rem!important;
  background:linear-gradient(90deg,#ff2df7,#b000ff,#39ff14,#ffe66d,#00eaff);
  -webkit-background-clip:text;background-clip:text;color:transparent!important;
  text-shadow:0 0 18px rgba(255,45,247,.42);
}
.v10-board-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}
.v10-board-actions{display:flex;gap:7px;flex-wrap:wrap}
.v10-board-actions button,.v10-import{width:auto!important;min-width:92px!important}
.v10-import input{display:none}
.v10-board-monitor{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.v10-board-monitor span,.v10-board-octaves span{padding:6px 9px;border:1px solid rgba(176,0,255,.22);border-radius:999px;background:rgba(0,0,0,.25);font-size:.72rem}
.v10-board-octaves{display:flex;gap:8px;align-items:center;margin:8px 0}
.v10-piano{height:230px;overflow-x:auto!important;overflow-y:hidden!important;border:1px solid rgba(176,0,255,.28);border-radius:18px;background:linear-gradient(180deg,rgba(176,0,255,.08),rgba(0,0,0,.35));padding:8px;display:flex;align-items:flex-end;touch-action:none;max-width:100%}
.v10-key{position:relative;flex:0 0 44px;height:182px;margin-right:2px;border-radius:0 0 10px 10px;border:1px solid rgba(255,255,255,.30);background:linear-gradient(180deg,#fff,#d8d7f0);color:#05000c;display:flex;align-items:flex-end;justify-content:center;padding-bottom:8px;font-size:.62rem;font-weight:900;user-select:none;touch-action:none}
.v10-key.black{flex-basis:30px;height:122px;margin-left:-17px;margin-right:-15px;z-index:2;background:linear-gradient(180deg,#180026,#000);color:#fff;border-color:rgba(255,45,247,.35);align-self:flex-start}
.v10-key.active{transform:translateY(5px);box-shadow:0 0 18px rgba(255,45,247,.90),0 0 34px rgba(0,234,255,.48);filter:saturate(1.5)}
.v10-key .freq{position:absolute;bottom:24px;font-size:.50rem;opacity:.78}
.v10-editor{display:none;margin-top:10px;padding:10px;border:1px solid rgba(255,230,109,.25);border-radius:14px;background:rgba(0,0,0,.25)}
.v10-editor.open{display:block}
.v10-editor-row{display:grid;grid-template-columns:70px 1fr;gap:8px;margin:4px 0;align-items:center}

/* Search and JSON tools */
.search-results-hint{font-size:.68rem;padding:6px 8px;border:1px solid rgba(176,0,255,.22);border-radius:10px;background:rgba(0,0,0,.22);margin:4px 0;color:var(--green)}
.freq-json-tools{margin-top:6px}
.json-import-label{display:flex;align-items:center;justify-content:center;padding:8px;border-radius:14px;cursor:pointer}
.json-import-label input{display:none}

/* Mobile layout */
@media(max-width:980px){
  html,body{overflow:auto!important}
  .app-shell{height:auto!important;min-height:100vh!important;padding:6px!important}
  .theme-switcher{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;gap:6px!important}
  .cockpit{display:flex!important;flex-direction:column!important;min-height:auto!important}
  .left-panel{min-height:880px!important;grid-template-rows:auto 230px minmax(520px,1fr)!important}
  .center-panel,.right-panel{min-height:450px!important;max-height:none!important}
  .bottom-panel{min-height:680px!important;height:680px!important}
  .v10-panel-menu{grid-template-columns:1fr!important}
  .v10-panel-actions{justify-content:stretch!important;display:grid!important;grid-template-columns:1fr 1fr!important}
  .v10-panel-actions button{max-width:none!important;width:100%!important}
  .v10-flip-tabs{grid-template-columns:1fr!important}
  .v10-user-filters{grid-template-columns:1fr!important}
  .v10-board-head,.v10-users-head{flex-direction:column;align-items:flex-start}
  .v10-board-actions{display:grid!important;grid-template-columns:1fr 1fr;width:100%}
  .v10-piano{height:250px}
  .v10-key{flex-basis:48px}
  .v10-key.black{flex-basis:32px}
}
@media(max-width:560px){
  .bottom-panel{height:720px!important}
  .v10-user-table{max-height:360px}
  .v10-panel-actions{grid-template-columns:1fr!important}
}

/* Light readable */
body.theme-light .v10-flip-tab,body.theme-light .v10-users,body.theme-light .v10-board,body.theme-light .v10-user-table td,body.theme-light .v10-user-table th,body.theme-light .v10-board-monitor span,body.theme-light .v10-board-octaves span,body.theme-light .v10-panel-menu,body.theme-light .v10-comment-box,body.theme-light .search-results-hint,body.theme-light .json-import-label{
  background:#fff!important;color:#041017!important;border-color:rgba(0,70,90,.35)!important;text-shadow:none!important
}
body.theme-light .v10-board-title{background:none!important;color:#003e52!important;-webkit-text-fill-color:#003e52!important}
body.theme-light .v10-key{background:linear-gradient(180deg,#fff,#dce8ef)!important;color:#041017!important}
body.theme-light .v10-key.black{background:linear-gradient(180deg,#30343d,#080b10)!important;color:#fff!important}


/* === V11 FINAL NO-OVERLAP + BOARD 10 OCTAVES === */

/* Page peut grandir : plus de chevauchements forcés */
html,body{height:auto!important;min-height:100%!important;overflow-x:hidden!important;overflow-y:auto!important}
.app-shell{height:auto!important;min-height:100vh!important;overflow:visible!important}
.cockpit{min-height:0!important;overflow:visible!important}
.panel{min-width:0!important;overflow:hidden!important}
.left-panel,.center-panel,.right-panel,.bottom-panel{min-width:0!important}

/* Empêcher l’oscillateur direct d’empiéter sur Audio Controls */
.left-panel{
  grid-template-rows:auto minmax(220px,32vh) minmax(520px,1fr)!important;
  overflow:hidden!important;
}
#leftOscilloscope{
  width:100%!important;
  max-width:100%!important;
  min-height:180px!important;
  max-height:36vh!important;
  display:block!important;
  flex:0 0 auto!important;
}
.controls-block{
  min-height:0!important;
  overflow:auto!important;
  max-height:none!important;
  padding-bottom:16px!important;
}

/* Masquage des fenêtres 3D : ne touche jamais à left-panel ni audio controls */
body.v10-hide-osc3d .left-panel,
body.v10-hide-spec3d .left-panel,
body.v11-hide-osc3d .left-panel,
body.v11-hide-spec3d .left-panel{
  display:grid!important;
}
body.v10-hide-osc3d .center-panel,
body.v11-hide-osc3d .center-panel{
  display:none!important;
}
body.v10-hide-spec3d .right-panel,
body.v11-hide-spec3d .right-panel{
  display:none!important;
}

/* Tabs de réouverture persistants */
.v11-collapsed-tabs{
  display:none;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:0 2px 8px;
}
.v11-open-tab{
  min-height:34px!important;
  border-radius:14px!important;
  border:1px solid rgba(176,0,255,.36)!important;
  background:linear-gradient(135deg,rgba(176,0,255,.18),rgba(0,234,255,.12))!important;
  color:var(--text)!important;
}
body.v11-hide-osc3d .v11-collapsed-tabs,
body.v11-hide-spec3d .v11-collapsed-tabs,
body.v10-hide-osc3d .v11-collapsed-tabs,
body.v10-hide-spec3d .v11-collapsed-tabs{
  display:grid!important;
}
body:not(.v11-hide-osc3d):not(.v10-hide-osc3d) #v11OpenOscTab{display:none!important}
body:not(.v11-hide-spec3d):not(.v10-hide-spec3d) #v11OpenSpecTab{display:none!important}

/* Quand une ou deux vues sont masquées, les autres colonnes se recomposent sans cacher les contrôles */
body.v11-hide-osc3d.v11-hide-spec3d .cockpit,
body.v10-hide-osc3d.v10-hide-spec3d .cockpit{
  grid-template-columns:minmax(320px,1fr)!important;
  grid-template-rows:auto auto!important;
}
body.v11-hide-osc3d.v11-hide-spec3d .left-panel,
body.v10-hide-osc3d.v10-hide-spec3d .left-panel{
  grid-column:1/2!important;
}
body.v11-hide-osc3d.v11-hide-spec3d .bottom-panel,
body.v10-hide-osc3d.v10-hide-spec3d .bottom-panel{
  grid-column:1/2!important;
}
body.v11-hide-osc3d:not(.v11-hide-spec3d) .cockpit,
body.v10-hide-osc3d:not(.v10-hide-spec3d) .cockpit,
body.v11-hide-spec3d:not(.v11-hide-osc3d) .cockpit,
body.v10-hide-spec3d:not(.v10-hide-osc3d) .cockpit{
  grid-template-columns:minmax(360px,1.1fr) minmax(380px,.9fr)!important;
}
body.v11-hide-osc3d:not(.v11-hide-spec3d) .right-panel,
body.v10-hide-osc3d:not(.v10-hide-spec3d) .right-panel{
  grid-column:2/3!important;
}
body.v11-hide-spec3d:not(.v11-hide-osc3d) .center-panel,
body.v10-hide-spec3d:not(.v10-hide-osc3d) .center-panel{
  grid-column:2/3!important;
}
body.v11-hide-osc3d:not(.v11-hide-spec3d) .bottom-panel,
body.v10-hide-osc3d:not(.v10-hide-spec3d) .bottom-panel,
body.v11-hide-spec3d:not(.v11-hide-osc3d) .bottom-panel,
body.v10-hide-spec3d:not(.v10-hide-osc3d) .bottom-panel{
  grid-column:1/3!important;
}

/* Menus 3D toujours au-dessus du canvas */
.v10-panel-menu,.v11-panel-menu{
  position:relative!important;
  z-index:5!important;
  display:grid!important;
  grid-template-columns:1fr auto!important;
  gap:8px!important;
  align-items:center!important;
  padding:8px!important;
  margin:0 0 8px!important;
  border-radius:14px!important;
  overflow:hidden!important;
}
.v10-panel-actions,.v11-panel-actions{display:flex!important;gap:6px!important;flex-wrap:wrap!important}
.v10-panel-actions button,.v11-panel-actions button{
  width:auto!important;
  min-width:64px!important;
  max-width:115px!important;
  margin:0!important;
  padding:7px 8px!important;
  font-size:.58rem!important;
}
.center-panel canvas,.right-panel canvas{
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:240px!important;
  max-height:calc(100vh - 220px)!important;
  object-fit:contain!important;
}

/* Joysticks uniquement mobile phone/tablette <= 9 pouces approx */
.mobile-joysticks{display:none!important}
@media (max-width: 900px) and (pointer: coarse){
  body.v11-nav-active:not(.v11-joysticks-hidden) .mobile-joysticks,
  body.v10-nav-active:not(.v11-joysticks-hidden) .mobile-joysticks,
  body.window-fullscreen-active:not(.v11-joysticks-hidden) .mobile-joysticks{
    display:flex!important;
  }
  .mobile-joysticks{
    position:fixed!important;
    left:0!important;right:0!important;bottom:10px!important;
    z-index:15000!important;
    pointer-events:none!important;
    justify-content:space-between!important;
    align-items:flex-end!important;
    padding:0 10px!important;
  }
  .mobile-mid-controls{display:flex;flex-direction:column;gap:6px;align-items:center;pointer-events:auto}
  .mobile-exit{pointer-events:auto!important;width:auto!important;min-width:82px!important;font-size:.56rem!important;padding:7px!important}
}
@media (min-width: 901px){
  .mobile-joysticks{display:none!important}
}

/* Bottom panel scroll: Users et Board accessibles */
.bottom-panel{
  min-height:720px!important;
  height:auto!important;
  max-height:none!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.v10-flip-stage,.v9-flip-stage,.flip-stage{
  flex:1 1 auto!important;
  min-height:620px!important;
  overflow:hidden!important;
}
.v10-flip-face,.v9-flip-face,.flip-face{
  height:100%!important;
  min-height:620px!important;
  overflow:auto!important;
}
.v10-users,.v10-board,.v9-users,.v9-board{
  min-height:620px!important;
  max-height:none!important;
  overflow:auto!important;
  padding-bottom:28px!important;
}

/* Youplugs Board 10 octaves + slider latéral */
.v11-board-range{
  display:grid;
  grid-template-columns:48px 1fr 48px;
  gap:8px;
  align-items:center;
  margin:8px 0;
}
.v11-slide-btn{
  height:210px!important;
  min-width:42px!important;
  width:100%!important;
  font-size:1.4rem!important;
  border-radius:18px!important;
}
.v10-piano,.v9-piano{
  scroll-behavior:smooth;
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
}
.v11-board-tools{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:10px 0;
}
.v11-board-tools button{width:auto!important;min-width:130px!important}
.v11-physical-on{
  box-shadow:0 0 20px rgba(57,255,20,.75),0 0 38px rgba(0,234,255,.35)!important;
}

/* Responsive totale */
@media(max-width:980px){
  .cockpit{display:flex!important;flex-direction:column!important}
  .left-panel{min-height:auto!important;grid-template-rows:auto 230px minmax(560px,auto)!important}
  #leftOscilloscope{max-height:260px!important}
  .controls-block{max-height:none!important;overflow:visible!important}
  .center-panel,.right-panel{min-height:380px!important}
  .v10-panel-menu,.v11-panel-menu{grid-template-columns:1fr!important}
  .v10-panel-actions,.v11-panel-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .v10-panel-actions button,.v11-panel-actions button{max-width:none!important;width:100%!important}
  .bottom-panel{min-height:760px!important}
  .v10-flip-stage,.v9-flip-stage,.flip-stage,.v10-flip-face,.v9-flip-face,.flip-face{min-height:680px!important}
  .v11-board-range{grid-template-columns:38px 1fr 38px}
  .v11-slide-btn{height:220px!important}
}
@media(max-width:560px){
  .bottom-panel{min-height:820px!important}
  .v10-flip-stage,.v9-flip-stage,.flip-stage,.v10-flip-face,.v9-flip-face,.flip-face{min-height:740px!important}
  .v11-board-tools{display:grid;grid-template-columns:1fr}
  .v11-board-tools button{width:100%!important}
}

/* Light readable for V11 */
body.theme-light .v11-collapsed-tabs button,
body.theme-light .v11-board-tools button,
body.theme-light .v11-slide-btn{
  background:#fff!important;
  color:#041017!important;
  border-color:rgba(0,70,90,.35)!important;
  text-shadow:none!important;
}


/* === V12 FINAL 15-INCH COHERENCE + NEON 3D SPHERE JOYSTICKS === */

/* Desktop 15": structure cohérente, deux visualiseurs 3D côte à côte */
@media (min-width:981px){
  html,body{
    height:auto!important;
    min-height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
  }
  .app-shell{
    height:auto!important;
    min-height:100vh!important;
    display:grid!important;
    grid-template-rows:auto auto 1fr!important;
    gap:8px!important;
    padding:8px!important;
  }
  .cockpit{
    display:grid!important;
    grid-template-columns:minmax(330px,.78fr) minmax(360px,1fr) minmax(360px,1fr)!important;
    grid-template-rows:minmax(540px,calc(100vh - 150px)) minmax(360px,auto)!important;
    gap:8px!important;
    align-items:stretch!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .left-panel{
    grid-column:1/2!important;
    grid-row:1/2!important;
    display:grid!important;
    grid-template-rows:auto minmax(150px,24vh) minmax(300px,1fr)!important;
    min-height:0!important;
    height:100%!important;
    max-height:calc(100vh - 150px)!important;
    overflow:hidden!important;
  }
  .center-panel{
    grid-column:2/3!important;
    grid-row:1/2!important;
    min-height:0!important;
    height:100%!important;
    max-height:calc(100vh - 150px)!important;
    overflow:hidden!important;
  }
  .right-panel{
    grid-column:3/4!important;
    grid-row:1/2!important;
    min-height:0!important;
    height:100%!important;
    max-height:calc(100vh - 150px)!important;
    overflow:hidden!important;
  }
  .bottom-panel{
    grid-column:1/4!important;
    grid-row:2/3!important;
    min-height:360px!important;
    height:420px!important;
    max-height:520px!important;
    overflow:hidden!important;
  }

  #leftOscilloscope{
    height:100%!important;
    min-height:140px!important;
    max-height:24vh!important;
  }
  .controls-block{
    min-height:0!important;
    height:100%!important;
    overflow:auto!important;
    padding:8px!important;
  }
  .center-panel canvas,
  .right-panel canvas{
    height:calc(100% - 128px)!important;
    min-height:300px!important;
    max-height:none!important;
  }
  .v10-panel-menu,.v11-panel-menu{
    margin:0 0 6px!important;
    padding:7px!important;
    min-height:52px!important;
  }
  .visual-head{
    min-height:44px!important;
    padding-bottom:4px!important;
  }
  .visual-head h2{
    font-size:.86rem!important;
  }
  .visual-head span{
    font-size:.58rem!important;
  }
}

/* Si une vue 3D est masquée, elle laisse un onglet de réouverture sans casser Audio Controls */
body.v11-hide-osc3d .center-panel,
body.v10-hide-osc3d .center-panel{
  display:none!important;
}
body.v11-hide-spec3d .right-panel,
body.v10-hide-spec3d .right-panel{
  display:none!important;
}
@media (min-width:981px){
  body.v11-hide-osc3d:not(.v11-hide-spec3d) .cockpit,
  body.v10-hide-osc3d:not(.v10-hide-spec3d) .cockpit{
    grid-template-columns:minmax(360px,.85fr) minmax(520px,1.15fr)!important;
  }
  body.v11-hide-osc3d:not(.v11-hide-spec3d) .left-panel,
  body.v10-hide-osc3d:not(.v10-hide-spec3d) .left-panel{grid-column:1/2!important}
  body.v11-hide-osc3d:not(.v11-hide-spec3d) .right-panel,
  body.v10-hide-osc3d:not(.v10-hide-spec3d) .right-panel{grid-column:2/3!important}
  body.v11-hide-osc3d:not(.v11-hide-spec3d) .bottom-panel,
  body.v10-hide-osc3d:not(.v10-hide-spec3d) .bottom-panel{grid-column:1/3!important}

  body.v11-hide-spec3d:not(.v11-hide-osc3d) .cockpit,
  body.v10-hide-spec3d:not(.v10-hide-osc3d) .cockpit{
    grid-template-columns:minmax(360px,.85fr) minmax(520px,1.15fr)!important;
  }
  body.v11-hide-spec3d:not(.v11-hide-osc3d) .left-panel,
  body.v10-hide-spec3d:not(.v10-hide-osc3d) .left-panel{grid-column:1/2!important}
  body.v11-hide-spec3d:not(.v11-hide-osc3d) .center-panel,
  body.v10-hide-spec3d:not(.v10-hide-osc3d) .center-panel{grid-column:2/3!important}
  body.v11-hide-spec3d:not(.v11-hide-osc3d) .bottom-panel,
  body.v10-hide-spec3d:not(.v10-hide-spec3d) .bottom-panel{grid-column:1/3!important}

  body.v11-hide-osc3d.v11-hide-spec3d .cockpit,
  body.v10-hide-osc3d.v10-hide-spec3d .cockpit{
    grid-template-columns:minmax(360px,1fr)!important;
    grid-template-rows:minmax(600px,auto) minmax(420px,auto)!important;
  }
  body.v11-hide-osc3d.v11-hide-spec3d .left-panel,
  body.v10-hide-osc3d.v10-hide-spec3d .left-panel{
    grid-column:1/2!important;
    max-height:none!important;
    height:auto!important;
    grid-template-rows:auto minmax(240px,32vh) minmax(520px,auto)!important;
  }
  body.v11-hide-osc3d.v11-hide-spec3d .bottom-panel,
  body.v10-hide-osc3d.v10-hide-spec3d .bottom-panel{
    grid-column:1/2!important;
  }
}

/* Onglets de réouverture plus propres */
.v11-collapsed-tabs{
  display:none;
  grid-template-columns:repeat(2,minmax(180px,1fr));
  gap:8px;
  padding:0 2px 6px;
}
body.v11-hide-osc3d .v11-collapsed-tabs,
body.v11-hide-spec3d .v11-collapsed-tabs,
body.v10-hide-osc3d .v11-collapsed-tabs,
body.v10-hide-spec3d .v11-collapsed-tabs{
  display:grid!important;
}
.v11-open-tab{
  min-height:34px!important;
  border-radius:13px!important;
  border:1px solid transparent!important;
  background:linear-gradient(#100021,#05000c) padding-box,linear-gradient(135deg,#ff2df7,#b000ff,#39ff14,#00eaff) border-box!important;
  color:#f9f5ff!important;
  box-shadow:0 0 12px rgba(176,0,255,.28),0 0 20px rgba(0,234,255,.12)!important;
}

/* Joysticks : jamais sur ordinateur. Mobile seulement + fenêtre active */
.mobile-joysticks{display:none!important}
@media (max-width:900px) and (pointer:coarse){
  body.v11-nav-active:not(.v11-joysticks-hidden) .mobile-joysticks,
  body.v10-nav-active:not(.v11-joysticks-hidden) .mobile-joysticks,
  body.window-fullscreen-active:not(.v11-joysticks-hidden) .mobile-joysticks{
    display:flex!important;
  }
}

/* Sphères 3D cadrillées futuristes */
.joy-zone.joy-sphere,.joy-zone{
  width:108px!important;
  height:108px!important;
  border-radius:50%!important;
  border:2px solid transparent!important;
  background:
    radial-gradient(circle at 35% 28%,rgba(255,255,255,.34),transparent 12%),
    radial-gradient(circle at 50% 55%,rgba(0,234,255,.18),rgba(176,0,255,.12) 55%,rgba(0,0,0,.58) 78%),
    linear-gradient(rgba(0,255,225,.22) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,45,247,.22) 1px,transparent 1px),
    linear-gradient(#070014,#030008) padding-box,
    linear-gradient(135deg,#ff2df7,#39ff14,#ffe66d,#00eaff,#b000ff) border-box!important;
  background-size:auto,auto,18px 18px,18px 18px,auto,auto!important;
  box-shadow:
    0 0 16px rgba(255,45,247,.58),
    0 0 30px rgba(0,234,255,.38),
    inset 0 0 22px rgba(57,255,20,.16)!important;
  animation:v12JoyHue 4.5s linear infinite!important;
  overflow:hidden!important;
}
@keyframes v12JoyHue{0%{filter:hue-rotate(0deg)}100%{filter:hue-rotate(360deg)}}
.joy-zone span{
  color:#fff!important;
  text-shadow:0 0 8px #ff2df7,0 0 14px #00eaff!important;
  font-weight:900!important;
}
.joy-knob{
  width:42px!important;
  height:42px!important;
  left:33px!important;
  top:33px!important;
  border-radius:50%!important;
  background:
    radial-gradient(circle at 30% 25%,#fff,rgba(255,45,247,.92) 25%,rgba(0,234,255,.55) 58%,rgba(0,0,0,.2))!important;
  box-shadow:0 0 16px rgba(255,45,247,.9),0 0 28px rgba(0,234,255,.7)!important;
}
.mobile-mid-controls{
  pointer-events:auto!important;
  display:flex!important;
  flex-direction:column!important;
  gap:6px!important;
  align-items:center!important;
}

/* Mobile cohérent */
@media(max-width:980px){
  .app-shell{height:auto!important;min-height:100vh!important;overflow:visible!important}
  .cockpit{display:flex!important;flex-direction:column!important;gap:8px!important}
  .left-panel{
    max-height:none!important;
    height:auto!important;
    min-height:auto!important;
    grid-template-rows:auto 220px minmax(560px,auto)!important;
  }
  .controls-block{overflow:visible!important;max-height:none!important}
  .center-panel,.right-panel{height:auto!important;max-height:none!important;min-height:420px!important}
  .center-panel canvas,.right-panel canvas{height:330px!important;min-height:300px!important;max-height:none!important}
  .bottom-panel{height:auto!important;min-height:760px!important;max-height:none!important}
}


/* === V13 ABSOLUTE SCROLL FIX — bottom sections never clipped === */

/* Standard web : la page entière peut grandir, aucun parent ne coupe les enfants */
html,
body{
  height:auto!important;
  min-height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:auto!important;
}

.app-shell{
  height:auto!important;
  min-height:100vh!important;
  max-height:none!important;
  overflow:visible!important;
  display:block!important;
  padding-bottom:40px!important;
}

.cockpit{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  display:grid!important;
}

/* Les panels ne doivent pas couper le bas des contenus */
.panel,
.left-panel,
.center-panel,
.right-panel,
.bottom-panel{
  max-height:none!important;
  overflow:visible!important;
}

/* Structure desktop : le haut reste en grille, mais la section basse sort du piège 100vh */
@media (min-width:981px){
  .cockpit{
    grid-template-columns:minmax(330px,.78fr) minmax(360px,1fr) minmax(360px,1fr)!important;
    grid-template-rows:auto auto!important;
    align-items:start!important;
  }

  .left-panel,
  .center-panel,
  .right-panel{
    height:auto!important;
    min-height:560px!important;
    max-height:none!important;
  }

  .left-panel{
    grid-template-rows:auto minmax(170px,240px) minmax(420px,auto)!important;
  }

  #leftOscilloscope{
    height:220px!important;
    min-height:170px!important;
    max-height:240px!important;
  }

  .controls-block{
    height:auto!important;
    min-height:420px!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .center-panel canvas,
  .right-panel canvas{
    height:420px!important;
    min-height:360px!important;
    max-height:460px!important;
  }

  .bottom-panel{
    grid-column:1/4!important;
    grid-row:2/3!important;
    height:auto!important;
    min-height:640px!important;
    max-height:none!important;
    overflow:visible!important;
  }
}

/* La zone inférieure doit être un document normal avec scroll interne de confort, jamais coupée */
.bottom-panel{
  display:block!important;
  position:relative!important;
  height:auto!important;
  min-height:680px!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:32px!important;
}

.v10-flip-tabs,
.v9-flip-tabs,
.flip-tabs,
.v10-flip-stage,
.v9-flip-stage,
.flip-stage{
  position:relative!important;
}

.v10-flip-stage,
.v9-flip-stage,
.flip-stage{
  height:auto!important;
  min-height:720px!important;
  max-height:none!important;
  overflow:visible!important;
  perspective:1200px!important;
}

/* Les faces ne doivent plus dépendre de la hauteur de viewport */
.v10-flip-face,
.v9-flip-face,
.flip-face{
  height:auto!important;
  min-height:720px!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:36px!important;
}

/* Seule la face active prend la place normale */
.v10-flip-face:not(.active),
.v9-flip-face:not(.active),
.flip-face:not(.active){
  display:none!important;
}

.v10-flip-face.active,
.v9-flip-face.active,
.flip-face.active{
  display:block!important;
}

/* Chaque section inférieure peut être vue en entier */
.v10-math-wrap,
.v9-math-wrap,
.v10-users,
.v9-users,
.v10-board,
.v9-board,
.users-panel,
.board-panel{
  height:auto!important;
  min-height:680px!important;
  max-height:none!important;
  overflow:visible!important;
  padding-bottom:42px!important;
}

/* Les tableaux peuvent scroller horizontalement mais ne coupent plus verticalement */
.v10-user-table,
.v9-user-table,
.users-log-table,
.data-table{
  max-height:none!important;
  height:auto!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding-bottom:12px!important;
}

/* Youplugs Board : le piano scroll horizontal, mais le panneau reste visible entièrement */
.v10-piano,
.v9-piano,
.youplugs-piano{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  max-width:100%!important;
  height:250px!important;
  min-height:230px!important;
}

.v10-editor,
.v9-editor,
.board-customize-panel{
  max-height:none!important;
  overflow:visible!important;
}

/* Si les deux vues 3D sont masquées, le bas reste sous les contrôles et n'est pas absorbé */
body.v11-hide-osc3d.v11-hide-spec3d .cockpit,
body.v10-hide-osc3d.v10-hide-spec3d .cockpit{
  grid-template-columns:minmax(320px,1fr)!important;
  grid-template-rows:auto auto!important;
}

body.v11-hide-osc3d.v11-hide-spec3d .bottom-panel,
body.v10-hide-osc3d.v10-hide-spec3d .bottom-panel{
  grid-column:1/2!important;
  height:auto!important;
  min-height:720px!important;
  max-height:none!important;
}

/* Mobile : page longue normale, aucun contenu coupé */
@media(max-width:980px){
  .app-shell{
    display:block!important;
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
    padding-bottom:64px!important;
  }

  .cockpit{
    display:flex!important;
    flex-direction:column!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .left-panel,
  .center-panel,
  .right-panel,
  .bottom-panel{
    height:auto!important;
    min-height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .controls-block{
    overflow:visible!important;
    max-height:none!important;
  }

  .bottom-panel{
    min-height:760px!important;
    padding-bottom:72px!important;
  }

  .v10-flip-stage,
  .v9-flip-stage,
  .flip-stage,
  .v10-flip-face,
  .v9-flip-face,
  .flip-face{
    min-height:780px!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  .v10-math-wrap,
  .v10-users,
  .v10-board,
  .v9-users,
  .v9-board{
    min-height:760px!important;
    height:auto!important;
    overflow:visible!important;
  }
}

/* Très petit écran : on laisse encore plus d'espace vertical */
@media(max-width:560px){
  .bottom-panel{
    min-height:880px!important;
  }

  .v10-flip-stage,
  .v9-flip-stage,
  .flip-stage,
  .v10-flip-face,
  .v9-flip-face,
  .flip-face{
    min-height:900px!important;
  }

  .v10-math-wrap,
  .v10-users,
  .v10-board,
  .v9-users,
  .v9-board{
    min-height:880px!important;
  }
}


/* === V14 FINAL MODULE LAYOUT + NEON BORDER IDENTITY === */

/* Pseudonyme supprimé : entrée automatique par ID aléatoire */
#userEntryOverlay{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Layout final : première ligne = 3 visualisations, deuxième ligne = Control audio pleine largeur, troisième ligne = bas */
@media(min-width:981px){
  .cockpit{
    display:grid!important;
    grid-template-columns:minmax(330px,.95fr) minmax(360px,1fr) minmax(360px,1fr)!important;
    grid-template-rows:auto auto auto!important;
    gap:10px!important;
    align-items:start!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }

  .left-panel{
    grid-column:1/2!important;
    grid-row:1/2!important;
    display:grid!important;
    grid-template-rows:auto minmax(260px,34vh)!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
  }

  .center-panel{
    grid-column:2/3!important;
    grid-row:1/2!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
  }

  .right-panel{
    grid-column:3/4!important;
    grid-row:1/2!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
  }

  .v14-audio-panel{
    grid-column:1/4!important;
    grid-row:2/3!important;
    display:block!important;
    min-height:360px!important;
    height:auto!important;
    overflow:visible!important;
  }

  .bottom-panel{
    grid-column:1/4!important;
    grid-row:3/4!important;
  }

  #leftOscilloscope{
    height:34vh!important;
    min-height:260px!important;
    max-height:380px!important;
  }

  .center-panel canvas,
  .right-panel canvas{
    height:38vh!important;
    min-height:300px!important;
    max-height:430px!important;
  }
}

/* Control audio devient une vraie section séparée */
.v14-audio-panel{
  padding:10px!important;
  border-radius:18px!important;
  border:1px solid rgba(0,234,255,.24)!important;
  background:linear-gradient(180deg,rgba(18,0,38,.54),rgba(3,0,10,.70))!important;
  box-shadow:0 0 20px rgba(176,0,255,.16),0 0 30px rgba(0,234,255,.10),inset 0 0 18px rgba(255,255,255,.025)!important;
  min-width:0!important;
}
.v14-audio-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 0 8px!important;
}
.v14-audio-head h2{
  margin:0!important;
  font-size:1rem!important;
  letter-spacing:.08em!important;
  color:var(--text)!important;
}
.v14-section-close{
  width:32px!important;
  min-width:32px!important;
  height:32px!important;
  padding:0!important;
  border-radius:10px!important;
  font-size:1rem!important;
  line-height:1!important;
}

/* Empêcher l’ancien emplacement audio de dicter la hauteur du panneau direct */
.left-panel .controls-block.v14-moved{
  display:none!important;
}
.v14-audio-panel .controls-block{
  display:block!important;
  height:auto!important;
  max-height:none!important;
  min-height:260px!important;
  overflow:visible!important;
  padding:8px!important;
}

/* Grille de contrôles audio plus confortable quand pleine largeur */
@media(min-width:981px){
  .v14-audio-panel .osc-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:8px!important;
  }
}
@media(min-width:1300px){
  .v14-audio-panel .osc-grid{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
}

/* Fermeture/ouverture par sections : onglets persistants */
.v14-module-tabs{
  display:none;
  grid-template-columns:repeat(4,minmax(140px,1fr));
  gap:8px;
  padding:0 2px 8px;
}
.v14-module-tab{
  min-height:34px!important;
  border-radius:14px!important;
  font-size:.65rem!important;
}
body.v14-hide-direct .v14-module-tabs,
body.v14-hide-osc3d .v14-module-tabs,
body.v14-hide-spec3d .v14-module-tabs,
body.v14-hide-audio .v14-module-tabs{
  display:grid!important;
}
body:not(.v14-hide-direct) #v14OpenDirect{display:none!important}
body:not(.v14-hide-osc3d) #v14OpenOsc3D{display:none!important}
body:not(.v14-hide-spec3d) #v14OpenSpec3D{display:none!important}
body:not(.v14-hide-audio) #v14OpenAudio{display:none!important}

body.v14-hide-direct .left-panel{display:none!important}
body.v14-hide-osc3d .center-panel{display:none!important}
body.v14-hide-spec3d .right-panel{display:none!important}
body.v14-hide-audio .v14-audio-panel{display:none!important}

/* Recomposition desktop quand modules fermés */
@media(min-width:981px){
  body.v14-hide-direct:not(.v14-hide-osc3d):not(.v14-hide-spec3d) .cockpit,
  body.v14-hide-osc3d:not(.v14-hide-direct):not(.v14-hide-spec3d) .cockpit,
  body.v14-hide-spec3d:not(.v14-hide-direct):not(.v14-hide-osc3d) .cockpit{
    grid-template-columns:repeat(2,minmax(380px,1fr))!important;
  }
  body.v14-hide-direct:not(.v14-hide-osc3d):not(.v14-hide-spec3d) .center-panel{grid-column:1/2!important}
  body.v14-hide-direct:not(.v14-hide-osc3d):not(.v14-hide-spec3d) .right-panel{grid-column:2/3!important}
  body.v14-hide-osc3d:not(.v14-hide-direct):not(.v14-hide-spec3d) .left-panel{grid-column:1/2!important}
  body.v14-hide-osc3d:not(.v14-hide-direct):not(.v14-hide-spec3d) .right-panel{grid-column:2/3!important}
  body.v14-hide-spec3d:not(.v14-hide-direct):not(.v14-hide-osc3d) .left-panel{grid-column:1/2!important}
  body.v14-hide-spec3d:not(.v14-hide-direct):not(.v14-hide-osc3d) .center-panel{grid-column:2/3!important}

  body.v14-hide-direct.v14-hide-osc3d:not(.v14-hide-spec3d) .cockpit,
  body.v14-hide-direct.v14-hide-spec3d:not(.v14-hide-osc3d) .cockpit,
  body.v14-hide-osc3d.v14-hide-spec3d:not(.v14-hide-direct) .cockpit{
    grid-template-columns:minmax(480px,1fr)!important;
  }
  body.v14-hide-direct.v14-hide-osc3d:not(.v14-hide-spec3d) .right-panel,
  body.v14-hide-direct.v14-hide-spec3d:not(.v14-hide-osc3d) .center-panel,
  body.v14-hide-osc3d.v14-hide-spec3d:not(.v14-hide-direct) .left-panel{
    grid-column:1/2!important;
  }

  .v14-audio-panel,
  .bottom-panel{
    grid-column:1/-1!important;
  }
}

/* Croix sur les panneaux 3D et direct */
.v14-close-x{
  width:30px!important;
  min-width:30px!important;
  height:30px!important;
  padding:0!important;
  border-radius:10px!important;
  font-size:.95rem!important;
  margin-left:auto!important;
}
.v10-panel-title,.v11-panel-title,.visual-head h2{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}

/* Nouvelle identité visuelle : fonds plus sobres, bordures technologiques lumineuses */
body.theme-youplugs button,
body.theme-youplugs .theme-btn,
body.theme-youplugs .json-import-label,
body.theme-youplugs .v14-module-tab,
body.theme-youplugs select,
body.theme-youplugs input,
body.theme-youplugs textarea{
  background:linear-gradient(180deg,rgba(14,0,30,.86),rgba(4,0,10,.92)) padding-box!important;
  border:1px solid transparent!important;
  border-image:linear-gradient(135deg,#ff2df7,#b000ff,#00eaff,#39ff14) 1!important;
  color:#f9f5ff!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.035) inset,
    0 0 10px rgba(176,0,255,.22),
    0 0 18px rgba(0,234,255,.10)!important;
}
body.theme-youplugs button:hover,
body.theme-youplugs .theme-btn.active,
body.theme-youplugs .v14-module-tab:hover{
  background:linear-gradient(180deg,rgba(25,0,52,.92),rgba(6,0,16,.96)) padding-box!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 0 16px rgba(255,45,247,.55),
    0 0 30px rgba(0,234,255,.28),
    0 0 44px rgba(57,255,20,.10)!important;
}

/* Rôles visuels : fermeture, ouverture, plein écran, action */
body.theme-youplugs .v14-section-close,
body.theme-youplugs .v14-close-x,
body.theme-youplugs [id*="Hide"]{
  border-image:linear-gradient(135deg,#ff2d6d,#ff2df7,#b000ff) 1!important;
}
body.theme-youplugs [id*="Open"],
body.theme-youplugs .v14-module-tab{
  border-image:linear-gradient(135deg,#39ff14,#00eaff,#b000ff) 1!important;
}
body.theme-youplugs [id*="Full"]{
  border-image:linear-gradient(135deg,#00eaff,#39ff14,#ffe66d) 1!important;
}

/* Mobile : modules empilés, audio section séparée */
@media(max-width:980px){
  .cockpit{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
  }
  .left-panel,.center-panel,.right-panel,.v14-audio-panel,.bottom-panel{
    display:block!important;
    height:auto!important;
    max-height:none!important;
  }
  body.v14-hide-direct .left-panel,
  body.v14-hide-osc3d .center-panel,
  body.v14-hide-spec3d .right-panel,
  body.v14-hide-audio .v14-audio-panel{
    display:none!important;
  }
  .v14-module-tabs{
    grid-template-columns:1fr!important;
  }
  .v14-audio-panel .osc-grid{
    grid-template-columns:1fr!important;
  }
}

/* Très important : aucune section ne doit couper ses enfants */
.v14-audio-panel,
.v14-audio-panel .controls-block,
.bottom-panel,
.v10-flip-stage,
.v10-flip-face,
.v10-users,
.v10-board{
  overflow:visible!important;
  max-height:none!important;
}


/* === V15 FINAL INTERACTION PATCH === */

/* Boutons : fonds transparents, bordures néon, reflets au hover */
body.theme-youplugs button,
body.theme-youplugs .theme-btn,
body.theme-youplugs .json-import-label,
body.theme-youplugs .v14-module-tab,
body.theme-youplugs select,
body.theme-youplugs input,
body.theme-youplugs textarea{
  background:
    linear-gradient(180deg,rgba(18,0,38,.36),rgba(4,0,10,.48)) padding-box,
    linear-gradient(135deg,#ff2df7,#b000ff,#00eaff,#39ff14) border-box!important;
  border:1px solid transparent!important;
  color:#f9f5ff!important;
  box-shadow:
    inset 0 0 18px rgba(255,255,255,.025),
    0 0 10px rgba(176,0,255,.20),
    0 0 18px rgba(0,234,255,.10)!important;
  position:relative;
  overflow:hidden;
}
body.theme-youplugs button::before,
body.theme-youplugs .theme-btn::before,
body.theme-youplugs .json-import-label::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.18) 45%,transparent 58%);
  transform:translateX(-130%);
  transition:transform .42s ease;
  pointer-events:none;
}
body.theme-youplugs button:hover::before,
body.theme-youplugs .theme-btn:hover::before,
body.theme-youplugs .json-import-label:hover::before{
  transform:translateX(130%);
}
body.theme-youplugs button:hover,
body.theme-youplugs .theme-btn.active,
body.theme-youplugs .v14-module-tab:hover{
  background:
    linear-gradient(180deg,rgba(28,0,58,.50),rgba(6,0,16,.62)) padding-box,
    linear-gradient(135deg,#39ff14,#00eaff,#b000ff,#ff2df7) border-box!important;
  box-shadow:
    inset 0 0 18px rgba(255,255,255,.04),
    0 0 16px rgba(255,45,247,.52),
    0 0 28px rgba(0,234,255,.30),
    0 0 44px rgba(57,255,20,.12)!important;
}

/* Joysticks sphères : fermeture propre */
.mobile-mid-controls{pointer-events:auto!important;display:flex!important;flex-direction:column!important;gap:6px!important;align-items:center!important}
body.v15-joysticks-hidden .mobile-joysticks{display:none!important}
@media (max-width:900px) and (pointer:coarse){
  body.v11-nav-active:not(.v15-joysticks-hidden) .mobile-joysticks,
  body.v10-nav-active:not(.v15-joysticks-hidden) .mobile-joysticks,
  body.window-fullscreen-active:not(.v15-joysticks-hidden) .mobile-joysticks{
    display:flex!important;
  }
}

/* Youplugs Board : navigation 10 octaves et slide visuel */
.v15-board-octave-rail{
  display:flex;
  gap:6px;
  align-items:center;
  margin:8px 0;
  overflow-x:auto;
  padding:6px 0;
}
.v15-octave-pill{
  flex:0 0 auto;
  min-width:54px!important;
  padding:7px 8px!important;
  border-radius:999px!important;
  font-size:.62rem!important;
  opacity:.72;
}
.v15-octave-pill.active{
  opacity:1;
  box-shadow:0 0 18px rgba(57,255,20,.60),0 0 28px rgba(0,234,255,.30)!important;
}
.v10-piano,.v9-piano{
  scroll-behavior:smooth!important;
}

/* Users : affichage par lots de 10 + visiteurs cliquables */
.v15-load-more{
  width:100%!important;
  margin:10px 0!important;
  min-height:36px!important;
}
.v15-visitor-link{
  cursor:pointer;
  color:var(--amber)!important;
  text-decoration:underline;
  font-weight:800;
}
.v15-top-assemblies{
  margin:8px 0;
  padding:8px;
  border:1px solid rgba(0,234,255,.22);
  border-radius:14px;
  background:rgba(0,0,0,.22);
}
.v15-top-assemblies h3{margin:0 0 6px!important;font-size:.82rem!important}
.v15-top-assemblies button{
  width:auto!important;
  min-width:140px!important;
  margin:3px!important;
  padding:6px 8px!important;
  font-size:.62rem!important;
}

/* Import/export JSON clairement visibles */
.v15-json-row{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:8px 0;
}
.v15-json-row button,.v15-json-row label{width:auto!important;min-width:150px!important}


/* === V16 KEYBOARD LAYOUT FIX === */
.v10-board,
.v9-board{
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}

.v10-piano,
.v9-piano,
.youplugs-piano{
  display:flex!important;
  align-items:flex-end!important;
  position:relative!important;
  width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:12px 14px 20px!important;
  gap:2px!important;
  min-height:280px!important;
  height:320px!important;
  scroll-behavior:smooth!important;
}

.v10-key,
.v9-key{
  flex:0 0 64px!important;
  width:64px!important;
  min-width:64px!important;
  height:240px!important;
  border-radius:0 0 14px 14px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  align-items:center!important;
  padding:10px 4px!important;
  position:relative!important;
  overflow:hidden!important;
  z-index:1!important;
}

.v10-key.black,
.v9-key.black{
  flex:0 0 42px!important;
  width:42px!important;
  min-width:42px!important;
  height:150px!important;
  margin-left:-22px!important;
  margin-right:-22px!important;
  z-index:5!important;
}

.v10-key span,
.v9-key span{
  font-size:.62rem!important;
  line-height:1.1!important;
  text-align:center!important;
  white-space:nowrap!important;
}

.v10-key .freq,
.v9-key .freq{
  opacity:.82!important;
  font-size:.54rem!important;
}

.v10-key.active,
.v9-key.active{
  transform:translateY(3px) scale(.985)!important;
}

@media(max-width:980px){
  .v10-piano,
  .v9-piano{
    min-height:240px!important;
    height:260px!important;
  }

  .v10-key,
  .v9-key{
    flex:0 0 52px!important;
    width:52px!important;
    min-width:52px!important;
    height:190px!important;
  }

  .v10-key.black,
  .v9-key.black{
    flex:0 0 34px!important;
    width:34px!important;
    min-width:34px!important;
    height:120px!important;
    margin-left:-18px!important;
    margin-right:-18px!important;
  }
}

@media(max-width:560px){
  .v10-key,
  .v9-key{
    flex:0 0 46px!important;
    width:46px!important;
    min-width:46px!important;
    height:170px!important;
  }

  .v10-key.black,
  .v9-key.black{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
    height:105px!important;
    margin-left:-15px!important;
    margin-right:-15px!important;
  }
}


/* === V17 YOUPLUGS BOARD CENTERED KEYBOARD FIX === */

/* Le clavier est au centre, les boutons latéraux sont petits et visibles */
.v11-board-range{
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) 44px!important;
  gap:8px!important;
  align-items:center!important;
  width:100%!important;
  max-width:100%!important;
  margin:10px 0!important;
  overflow:visible!important;
}

.v11-board-range .v10-piano,
.v11-board-range .v9-piano,
.v11-board-range .youplugs-piano{
  grid-column:2/3!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

.v11-slide-btn,
#v11BoardLeft,
#v11BoardRight{
  width:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  height:96px!important;
  min-height:96px!important;
  max-height:96px!important;
  padding:0!important;
  margin:0!important;
  font-size:1.35rem!important;
  line-height:1!important;
  border-radius:16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:center!important;
  z-index:8!important;
}

#v11BoardLeft{grid-column:1/2!important}
#v11BoardRight{grid-column:3/4!important}

/* Piano: plus d’écrasement vertical/horizontal */
.v10-piano,
.v9-piano,
.youplugs-piano{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:300px!important;
  min-height:300px!important;
  max-height:300px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:14px 18px 22px!important;
  gap:0!important;
  box-sizing:border-box!important;
  white-space:nowrap!important;
  scroll-behavior:smooth!important;
}

/* Touches blanches confortables */
.v10-key,
.v9-key{
  flex:0 0 58px!important;
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  height:225px!important;
  min-height:225px!important;
  max-height:225px!important;
  margin:0 2px 0 0!important;
  padding:10px 4px!important;
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-end!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  z-index:1!important;
}

/* Touches noires superposées sans casser la largeur */
.v10-key.black,
.v9-key.black{
  flex:0 0 36px!important;
  width:36px!important;
  min-width:36px!important;
  max-width:36px!important;
  height:142px!important;
  min-height:142px!important;
  max-height:142px!important;
  margin-left:-20px!important;
  margin-right:-18px!important;
  align-self:flex-start!important;
  z-index:5!important;
}

.v10-key span,
.v9-key span{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

.v10-key .freq,
.v9-key .freq{
  position:static!important;
  display:block!important;
  margin-top:4px!important;
}

/* Si un ancien style donne une hauteur énorme aux boutons latéraux */
.v11-board-range > button{
  height:96px!important;
}

/* Mobile : boutons encore plus compacts */
@media(max-width:980px){
  .v11-board-range{
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    gap:6px!important;
  }

  .v11-slide-btn,
  #v11BoardLeft,
  #v11BoardRight{
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:84px!important;
    min-height:84px!important;
    max-height:84px!important;
    font-size:1.1rem!important;
    border-radius:14px!important;
  }

  .v10-piano,
  .v9-piano{
    height:250px!important;
    min-height:250px!important;
    max-height:250px!important;
    padding:12px 12px 18px!important;
  }

  .v10-key,
  .v9-key{
    flex:0 0 48px!important;
    width:48px!important;
    min-width:48px!important;
    max-width:48px!important;
    height:188px!important;
    min-height:188px!important;
    max-height:188px!important;
  }

  .v10-key.black,
  .v9-key.black{
    flex:0 0 30px!important;
    width:30px!important;
    min-width:30px!important;
    max-width:30px!important;
    height:118px!important;
    min-height:118px!important;
    max-height:118px!important;
    margin-left:-16px!important;
    margin-right:-15px!important;
  }
}

@media(max-width:560px){
  .v11-board-range{
    grid-template-columns:34px minmax(0,1fr) 34px!important;
  }

  .v11-slide-btn,
  #v11BoardLeft,
  #v11BoardRight{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:74px!important;
    min-height:74px!important;
    max-height:74px!important;
    font-size:1rem!important;
  }
}


/* === V18 STARPLUGS THEME === */
/* Inspiré du CSS fourni, adapté localement sans dépendre d’images externes. */
body.theme-starplugs{
  --starplug:#0099ff;
  --starplug-rgb:0,153,255;
  --starplug-dark:#001f3f;
  --text:#dcefff;
  --muted:#8fbce8;
  --cyan:#9cf;
  --violet:#6ab7ff;
  --green:#9cf;
  --amber:#f0c66a;
  --danger:#ff6688;
  background:#020711!important;
  color:#dcefff!important;
  font-family:"Eurostile Extd","Source Sans Pro",Inter,system-ui,sans-serif!important;
}

body.theme-starplugs:before{
  background:
    radial-gradient(circle at 18% 18%,rgba(var(--starplug-rgb),.28),transparent 34%),
    radial-gradient(circle at 82% 32%,rgba(153,204,255,.16),transparent 35%),
    linear-gradient(180deg,rgba(0,0,0,.82),rgba(0,18,38,.88)),
    url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(.76) contrast(1.22) saturate(1.1)!important;
}

body.theme-starplugs:after{
  background:
    linear-gradient(90deg,rgba(153,204,255,.045) 1px,transparent 1px),
    linear-gradient(0deg,rgba(var(--starplug-rgb),.045) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,rgba(var(--starplug-rgb),.10),transparent 42%)!important;
  background-size:42px 42px,42px 42px,auto!important;
}

body.theme-starplugs .panel,
body.theme-starplugs .topbar,
body.theme-starplugs .table-card,
body.theme-starplugs .assembly-search,
body.theme-starplugs .v14-audio-panel,
body.theme-starplugs .bottom-panel{
  background:
    linear-gradient(180deg,rgba(0,0,0,.78),rgba(0,31,63,.72))!important;
  border:1px solid rgba(var(--starplug-rgb),.34)!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.62),
    0 8px 32px rgba(0,0,0,.42),
    0 0 26px rgba(var(--starplug-rgb),.16),
    inset 0 0 24px rgba(153,204,255,.035)!important;
}

/* Boutons Starplugs */
body.theme-starplugs button,
body.theme-starplugs .theme-btn,
body.theme-starplugs .json-import-label,
body.theme-starplugs .v14-module-tab,
body.theme-starplugs .v10-flip-tab,
body.theme-starplugs .v9-flip-tab,
body.theme-starplugs .flip-tab,
body.theme-starplugs select,
body.theme-starplugs input,
body.theme-starplugs textarea,
body.theme-starplugs .import-label,
body.theme-starplugs .v10-import,
body.theme-starplugs .v9-import{
  font-weight:700!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
  text-shadow:0 1px 2px rgba(0,0,0,.8),0 4px 8px rgba(0,0,0,.6)!important;
  background-color:transparent!important;
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.90),rgba(var(--starplug-rgb),.30)),
    linear-gradient(90deg,rgba(153,204,255,.16),transparent 18%,transparent 82%,rgba(153,204,255,.16))!important;
  background-origin:border-box!important;
  color:#9cf!important;
  font-family:"Eurostile Extd","Source Sans Pro",Inter,system-ui,sans-serif!important;
  line-height:1!important;
  position:relative!important;
  text-align:center!important;
  text-decoration:none!important;
  transition:color .2s,filter .2s,opacity .2s,transform .2s,box-shadow .2s!important;
  user-select:none!important;
  border:2px solid transparent!important;
  border-radius:2px 18px 2px 18px!important;
  padding:.625rem 1.05rem!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.60),
    0 8px 32px rgba(0,0,0,.40),
    0 0 0 1px rgba(153,204,255,.18) inset,
    0 0 18px rgba(var(--starplug-rgb),.16)!important;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)!important;
  overflow:hidden!important;
}

/* Bordure façon sci-fi Starplugs en CSS pur */
body.theme-starplugs button::after,
body.theme-starplugs .theme-btn::after,
body.theme-starplugs .json-import-label::after,
body.theme-starplugs .v14-module-tab::after,
body.theme-starplugs .v10-flip-tab::after,
body.theme-starplugs .v9-flip-tab::after,
body.theme-starplugs .flip-tab::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border:1px solid rgba(153,204,255,.58);
  clip-path:polygon(11px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 11px);
  box-shadow:inset 0 0 14px rgba(var(--starplug-rgb),.24);
}

body.theme-starplugs button::before,
body.theme-starplugs .theme-btn::before,
body.theme-starplugs .json-import-label::before,
body.theme-starplugs .v14-module-tab::before,
body.theme-starplugs .v10-flip-tab::before,
body.theme-starplugs .v9-flip-tab::before,
body.theme-starplugs .flip-tab::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:90%;
  height:100%;
  background:linear-gradient(100deg,transparent,rgba(153,204,255,.28),transparent);
  transform:skewX(-18deg);
  transition:left .38s ease;
  pointer-events:none;
}

body.theme-starplugs button:hover,
body.theme-starplugs .theme-btn:hover,
body.theme-starplugs .json-import-label:hover,
body.theme-starplugs .v14-module-tab:hover,
body.theme-starplugs .v10-flip-tab:hover,
body.theme-starplugs .v9-flip-tab:hover,
body.theme-starplugs .flip-tab:hover{
  color:#fff!important;
  filter:brightness(1.18) saturate(1.25)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.70),
    0 8px 32px rgba(0,0,0,.50),
    0 0 0 1px rgba(153,204,255,.36) inset,
    0 0 20px rgba(var(--starplug-rgb),.42),
    0 0 36px rgba(153,204,255,.20)!important;
}

body.theme-starplugs button:hover::before,
body.theme-starplugs .theme-btn:hover::before,
body.theme-starplugs .json-import-label:hover::before,
body.theme-starplugs .v14-module-tab:hover::before,
body.theme-starplugs .v10-flip-tab:hover::before,
body.theme-starplugs .v9-flip-tab:hover::before,
body.theme-starplugs .flip-tab:hover::before{
  left:130%;
}

/* Variante primaire/active */
body.theme-starplugs .theme-btn.active,
body.theme-starplugs .v10-flip-tab.active,
body.theme-starplugs .v9-flip-tab.active,
body.theme-starplugs .flip-tab.active,
body.theme-starplugs .v10-board-tab,
body.theme-starplugs .v9-board-tab,
body.theme-starplugs .board-tab{
  color:#fff!important;
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.88),rgba(var(--starplug-rgb),.58))!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.70),
    0 8px 32px rgba(0,0,0,.44),
    0 0 20px rgba(var(--starplug-rgb),.46),
    inset 0 0 16px rgba(153,204,255,.12)!important;
}

/* Variante dorée pour actions importantes */
body.theme-starplugs #applyCellularPreset,
body.theme-starplugs #generateRandomAssembly,
body.theme-starplugs #v11TuneBoard,
body.theme-starplugs #v15LoadMore{
  color:#ffe7a1!important;
  background-image:linear-gradient(180deg,rgba(0,0,0,.90),rgba(102,68,0,.72))!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.62),
    0 8px 32px rgba(0,0,0,.42),
    0 0 20px rgba(255,190,70,.28)!important;
}

/* Color picker */
.starplugs-color-label{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#9cf!important;
  font-size:.62rem!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  padding:4px 8px!important;
  border:1px solid rgba(153,204,255,.22)!important;
  border-radius:12px!important;
  background:rgba(0,0,0,.28)!important;
}
.starplugs-color-label input{
  width:34px!important;
  min-width:34px!important;
  height:24px!important;
  padding:0!important;
  border-radius:6px!important;
  clip-path:none!important;
}

/* Texte et titres */
body.theme-starplugs h1,
body.theme-starplugs h2,
body.theme-starplugs h3{
  color:#dcefff!important;
  text-shadow:0 0 12px rgba(var(--starplug-rgb),.40),0 1px 2px rgba(0,0,0,.85)!important;
}

body.theme-starplugs .synth-status,
body.theme-starplugs .status-panel span,
body.theme-starplugs .last-user-top,
body.theme-starplugs .board-monitor span,
body.theme-starplugs .v10-board-monitor span,
body.theme-starplugs .v9-board-monitor span{
  color:#9cf!important;
  border-color:rgba(var(--starplug-rgb),.28)!important;
  background:rgba(0,0,0,.34)!important;
}

/* Piano adapté Starplugs */
body.theme-starplugs .v10-piano,
body.theme-starplugs .v9-piano{
  border-color:rgba(var(--starplug-rgb),.34)!important;
  background:linear-gradient(180deg,rgba(0,0,0,.62),rgba(0,31,63,.32))!important;
}

body.theme-starplugs .v10-key,
body.theme-starplugs .v9-key{
  background:linear-gradient(180deg,#eaf6ff,#9cf)!important;
  color:#001a33!important;
  border-color:rgba(255,255,255,.36)!important;
}

body.theme-starplugs .v10-key.black,
body.theme-starplugs .v9-key.black{
  background:linear-gradient(180deg,#061a33,#00050a)!important;
  color:#9cf!important;
  border-color:rgba(var(--starplug-rgb),.42)!important;
}

body.theme-starplugs .v10-key.active,
body.theme-starplugs .v9-key.active{
  box-shadow:0 0 18px rgba(var(--starplug-rgb),.75),0 0 34px rgba(153,204,255,.40)!important;
}


/* === V19 YOUPLUGS MARCK'S COLOR THEME — Starplugs removed === */

/* Hide old Starplugs UI if cached */
[data-theme="starplugs"],
.starplugs-color-label{
  display:none!important;
}

/* Youplugs Marck's now uses the sci-fi cut-border style with real-time color control */
:root{
  --youplugs-accent:#b000ff;
  --youplugs-accent-rgb:176,0,255;
  --youplugs-accent-2:#00eaff;
  --youplugs-accent-3:#39ff14;
}

body.theme-youplugs{
  --text:#f9f5ff!important;
  --muted:#cdbaff!important;
  --cyan:var(--youplugs-accent-2)!important;
  --violet:var(--youplugs-accent)!important;
  --pink:#ff2df7!important;
  --green:var(--youplugs-accent-3)!important;
  --amber:#ffe66d!important;
  --danger:#ff2d6d!important;
  background:#05000c!important;
  color:#f9f5ff!important;
  font-family:"Eurostile Extd","Source Sans Pro",Inter,system-ui,sans-serif!important;
}

body.theme-youplugs:before{
  background:
    radial-gradient(circle at 16% 18%,rgba(var(--youplugs-accent-rgb),.30),transparent 32%),
    radial-gradient(circle at 84% 20%,rgba(0,234,255,.20),transparent 30%),
    radial-gradient(circle at 50% 100%,rgba(57,255,20,.14),transparent 40%),
    linear-gradient(180deg,rgba(5,0,12,.72),rgba(0,0,0,.86)),
    url("../backcel.png") center center/cover no-repeat fixed!important;
  filter:brightness(.82) contrast(1.26) saturate(1.25)!important;
}

body.theme-youplugs:after{
  background:
    linear-gradient(90deg,rgba(var(--youplugs-accent-rgb),.06) 1px,transparent 1px),
    linear-gradient(0deg,rgba(57,255,20,.035) 1px,transparent 1px),
    radial-gradient(circle at 50% 50%,rgba(255,45,247,.12),transparent 42%)!important;
  background-size:36px 36px,36px 36px,auto!important;
  animation:v19YouplugsAura 7s ease-in-out infinite alternate!important;
}
@keyframes v19YouplugsAura{
  0%{filter:hue-rotate(0deg) brightness(1)}
  50%{filter:hue-rotate(14deg) brightness(1.12)}
  100%{filter:hue-rotate(-8deg) brightness(1.04)}
}

body.theme-youplugs .panel,
body.theme-youplugs .topbar,
body.theme-youplugs .table-card,
body.theme-youplugs .assembly-search,
body.theme-youplugs .v14-audio-panel,
body.theme-youplugs .bottom-panel{
  background:linear-gradient(180deg,rgba(18,0,38,.76),rgba(3,0,10,.86))!important;
  border:1px solid rgba(var(--youplugs-accent-rgb),.34)!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.60),
    0 8px 32px rgba(0,0,0,.42),
    0 0 24px rgba(var(--youplugs-accent-rgb),.22),
    0 0 38px rgba(0,234,255,.12),
    inset 0 0 22px rgba(57,255,20,.035)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}

/* Youplugs buttons: Starcraft-like geometry but native/offline CSS */
body.theme-youplugs button,
body.theme-youplugs .theme-btn,
body.theme-youplugs .json-import-label,
body.theme-youplugs .v14-module-tab,
body.theme-youplugs .v10-flip-tab,
body.theme-youplugs .v9-flip-tab,
body.theme-youplugs .flip-tab,
body.theme-youplugs select,
body.theme-youplugs input,
body.theme-youplugs textarea,
body.theme-youplugs .import-label,
body.theme-youplugs .v10-import,
body.theme-youplugs .v9-import{
  font-weight:700!important;
  letter-spacing:.05em!important;
  text-transform:uppercase!important;
  text-shadow:0 1px 2px rgba(0,0,0,.8),0 4px 8px rgba(0,0,0,.6)!important;
  background-color:transparent!important;
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.90),rgba(var(--youplugs-accent-rgb),.28)),
    linear-gradient(90deg,rgba(255,255,255,.10),transparent 18%,transparent 82%,rgba(0,234,255,.12))!important;
  color:#e9ddff!important;
  font-family:"Eurostile Extd","Source Sans Pro",Inter,system-ui,sans-serif!important;
  line-height:1!important;
  position:relative!important;
  text-align:center!important;
  text-decoration:none!important;
  transition:color .2s,filter .2s,opacity .2s,transform .2s,box-shadow .2s!important;
  user-select:none!important;
  border:2px solid transparent!important;
  border-radius:2px 18px 2px 18px!important;
  padding:.625rem 1.05rem!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.60),
    0 8px 32px rgba(0,0,0,.40),
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 0 18px rgba(var(--youplugs-accent-rgb),.18)!important;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)!important;
  overflow:hidden!important;
}

body.theme-youplugs button::after,
body.theme-youplugs .theme-btn::after,
body.theme-youplugs .json-import-label::after,
body.theme-youplugs .v14-module-tab::after,
body.theme-youplugs .v10-flip-tab::after,
body.theme-youplugs .v9-flip-tab::after,
body.theme-youplugs .flip-tab::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border:1px solid rgba(var(--youplugs-accent-rgb),.62);
  clip-path:polygon(11px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 11px);
  box-shadow:
    inset 0 0 14px rgba(var(--youplugs-accent-rgb),.26),
    0 0 16px rgba(var(--youplugs-accent-rgb),.16);
}

body.theme-youplugs button::before,
body.theme-youplugs .theme-btn::before,
body.theme-youplugs .json-import-label::before,
body.theme-youplugs .v14-module-tab::before,
body.theme-youplugs .v10-flip-tab::before,
body.theme-youplugs .v9-flip-tab::before,
body.theme-youplugs .flip-tab::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:90%;
  height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.24),transparent);
  transform:skewX(-18deg);
  transition:left .38s ease;
  pointer-events:none;
}

body.theme-youplugs button:hover,
body.theme-youplugs .theme-btn:hover,
body.theme-youplugs .json-import-label:hover,
body.theme-youplugs .v14-module-tab:hover,
body.theme-youplugs .v10-flip-tab:hover,
body.theme-youplugs .v9-flip-tab:hover,
body.theme-youplugs .flip-tab:hover{
  color:#fff!important;
  filter:brightness(1.18) saturate(1.25)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.70),
    0 8px 32px rgba(0,0,0,.50),
    0 0 0 1px rgba(255,255,255,.18) inset,
    0 0 22px rgba(var(--youplugs-accent-rgb),.50),
    0 0 38px rgba(0,234,255,.22)!important;
}

body.theme-youplugs button:hover::before,
body.theme-youplugs .theme-btn:hover::before,
body.theme-youplugs .json-import-label:hover::before,
body.theme-youplugs .v14-module-tab:hover::before,
body.theme-youplugs .v10-flip-tab:hover::before,
body.theme-youplugs .v9-flip-tab:hover::before,
body.theme-youplugs .flip-tab:hover::before{
  left:130%;
}

/* Active/primary Youplugs */
body.theme-youplugs .theme-btn.active,
body.theme-youplugs .v10-flip-tab.active,
body.theme-youplugs .v9-flip-tab.active,
body.theme-youplugs .flip-tab.active,
body.theme-youplugs .v10-board-tab,
body.theme-youplugs .v9-board-tab,
body.theme-youplugs .board-tab{
  color:#fff!important;
  background-image:linear-gradient(180deg,rgba(0,0,0,.88),rgba(var(--youplugs-accent-rgb),.56))!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.70),
    0 8px 32px rgba(0,0,0,.44),
    0 0 22px rgba(var(--youplugs-accent-rgb),.48),
    inset 0 0 16px rgba(255,255,255,.10)!important;
}

/* Golden important actions */
body.theme-youplugs #applyCellularPreset,
body.theme-youplugs #generateRandomAssembly,
body.theme-youplugs #v11TuneBoard,
body.theme-youplugs #v15LoadMore{
  color:#ffe7a1!important;
  background-image:linear-gradient(180deg,rgba(0,0,0,.90),rgba(102,68,0,.70))!important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.62),
    0 8px 32px rgba(0,0,0,.42),
    0 0 20px rgba(255,190,70,.30)!important;
}

/* Youplugs live color picker */
.youplugs-color-label{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#e9ddff!important;
  font-size:.62rem!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  padding:4px 8px!important;
  border:1px solid rgba(var(--youplugs-accent-rgb),.32)!important;
  border-radius:12px!important;
  background:rgba(0,0,0,.28)!important;
  box-shadow:0 0 12px rgba(var(--youplugs-accent-rgb),.20)!important;
}
.youplugs-color-label input{
  width:34px!important;
  min-width:34px!important;
  height:24px!important;
  padding:0!important;
  border-radius:6px!important;
  clip-path:none!important;
}

/* Piano harmonized */
body.theme-youplugs .v10-piano,
body.theme-youplugs .v9-piano{
  border-color:rgba(var(--youplugs-accent-rgb),.36)!important;
  background:linear-gradient(180deg,rgba(0,0,0,.62),rgba(var(--youplugs-accent-rgb),.10))!important;
}

body.theme-youplugs .v10-key,
body.theme-youplugs .v9-key{
  background:linear-gradient(180deg,#f7edff,#caa4ff)!important;
  color:#170026!important;
  border-color:rgba(255,255,255,.38)!important;
}

body.theme-youplugs .v10-key.black,
body.theme-youplugs .v9-key.black{
  background:linear-gradient(180deg,#1e0038,#030006)!important;
  color:#e9ddff!important;
  border-color:rgba(var(--youplugs-accent-rgb),.48)!important;
}

body.theme-youplugs .v10-key.active,
body.theme-youplugs .v9-key.active{
  box-shadow:0 0 18px rgba(var(--youplugs-accent-rgb),.78),0 0 34px rgba(0,234,255,.42)!important;
}

/* V20 extended cellular modes */
#cellularPresetMode option:disabled{color:var(--amber);font-weight:900;background:#050b18}.cellular-table-inline table{min-width:980px}.cellular-table-inline th,.cellular-table-inline td{white-space:normal;vertical-align:top}.medical-note{margin:8px;padding:8px;border:1px solid rgba(255,214,107,.35);border-radius:12px;background:rgba(0,0,0,.34);color:var(--amber);font-size:.68rem;line-height:1.35}.synth-status{line-height:1.35}

/* === V27 PATCH — Joysticks ultra futuristes néon + masquage fiable === */
body.v27-joysticks-hidden .mobile-joysticks,
body.v15-joysticks-hidden .mobile-joysticks,
body.v11-joysticks-hidden .mobile-joysticks{
  display:none!important;
  opacity:0!important;
  pointer-events:none!important;
  visibility:hidden!important;
}
@media(max-width:980px){
  body.v11-nav-active:not(.v27-joysticks-hidden):not(.v15-joysticks-hidden):not(.v11-joysticks-hidden) .mobile-joysticks,
  body.v10-nav-active:not(.v27-joysticks-hidden):not(.v15-joysticks-hidden):not(.v11-joysticks-hidden) .mobile-joysticks,
  body.window-fullscreen-active:not(.v27-joysticks-hidden):not(.v15-joysticks-hidden):not(.v11-joysticks-hidden) .mobile-joysticks{
    display:flex!important;
    opacity:1!important;
    visibility:visible!important;
  }
}
.mobile-joysticks{
  filter:drop-shadow(0 0 14px rgba(0,234,255,.55)) drop-shadow(0 0 28px rgba(190,0,255,.38));
}
.joy-zone.joy-sphere,.joy-zone{
  width:128px!important;
  height:128px!important;
  border-radius:50%!important;
  position:relative!important;
  pointer-events:auto!important;
  overflow:hidden!important;
  border:1px solid rgba(0,234,255,.95)!important;
  background:
    radial-gradient(circle at 32% 24%,rgba(255,255,255,.33),rgba(0,234,255,.12) 22%,rgba(98,0,255,.12) 52%,rgba(5,9,28,.74) 74%,rgba(0,0,0,.88))!important;
  box-shadow:
    0 0 20px rgba(0,234,255,.95),
    0 0 42px rgba(160,0,255,.72),
    inset 0 0 22px rgba(0,234,255,.42),
    inset 0 0 45px rgba(255,0,255,.18)!important;
  backdrop-filter:blur(12px) saturate(1.55)!important;
  -webkit-backdrop-filter:blur(12px) saturate(1.55)!important;
  animation:v27JoyPulse 2.4s ease-in-out infinite!important;
}
.joy-zone.joy-sphere:before,.joy-zone:before{
  content:""!important;
  position:absolute!important;
  inset:9px!important;
  border-radius:50%!important;
  border:1px dashed rgba(255,255,255,.46)!important;
  box-shadow:0 0 18px rgba(0,234,255,.42)!important;
  animation:v27JoyHalo 8s linear infinite!important;
}
.joy-zone.joy-sphere:after,.joy-zone:after{
  content:""!important;
  position:absolute!important;
  inset:24px!important;
  border-radius:50%!important;
  border:1px solid rgba(255,0,255,.42)!important;
  box-shadow:0 0 22px rgba(255,0,255,.38), inset 0 0 14px rgba(0,234,255,.25)!important;
}
.joy-zone span{
  position:absolute!important;
  left:0!important;right:0!important;bottom:12px!important;
  color:#f4ffff!important;
  text-shadow:0 0 10px #00eaff,0 0 18px #ff2df7!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
  z-index:3!important;
  font-size:.66rem!important;
}
.joy-knob{
  width:46px!important;
  height:46px!important;
  left:41px!important;
  top:41px!important;
  border-radius:50%!important;
  position:absolute!important;
  z-index:4!important;
  border:1px solid rgba(255,255,255,.82)!important;
  background:
    radial-gradient(circle at 35% 25%,#ffffff 0%,#8cfbff 18%,#00eaff 42%,#9b2dff 78%,#070013 100%)!important;
  box-shadow:
    0 0 16px rgba(255,255,255,.82),
    0 0 30px rgba(0,234,255,.98),
    0 0 62px rgba(255,45,247,.76),
    inset 0 0 16px rgba(255,255,255,.34)!important;
}
.mobile-exit{
  border:1px solid rgba(0,234,255,.9)!important;
  background:linear-gradient(135deg,rgba(0,31,55,.92),rgba(74,0,109,.78),rgba(0,0,0,.92))!important;
  color:#f4ffff!important;
  text-shadow:0 0 10px #00eaff!important;
  box-shadow:0 0 15px rgba(0,234,255,.45), inset 0 0 18px rgba(255,0,255,.16)!important;
}
@keyframes v27JoyHalo{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes v27JoyPulse{0%,100%{box-shadow:0 0 20px rgba(0,234,255,.85),0 0 42px rgba(160,0,255,.55),inset 0 0 22px rgba(0,234,255,.35)}50%{box-shadow:0 0 36px rgba(0,234,255,1),0 0 72px rgba(255,45,247,.78),inset 0 0 32px rgba(0,234,255,.48)}}
@media(max-width:560px){.joy-zone.joy-sphere,.joy-zone{width:106px!important;height:106px!important}.joy-knob{width:40px!important;height:40px!important;left:33px!important;top:33px!important}}