:root{font-family:"Segoe UI",system-ui,sans-serif;color:#12345c;background:#f3f7ff;font-size:clamp(12px,.85vw,16px);--blue:#0066ff;--line:#cbdcf4;--panel:#fff}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit;color:inherit}button{border:1px solid var(--line);border-radius:7px;background:linear-gradient(#fff,#edf4ff);padding:.55em .8em;cursor:pointer;min-height:34px}button:hover{border-color:var(--blue);background:#e5f0ff}button:disabled{opacity:.5;cursor:default}button.primary,button[aria-pressed=true],nav button[aria-current]{background:linear-gradient(#0785ff,#0044cd);color:#fff;border-color:#0066ff}button img{width:21px;height:21px;vertical-align:middle}input,select,textarea{border:1px solid var(--line);border-radius:6px;padding:.45em;max-width:100%;background:#fff}input[type=range]{padding:0;width:100%;accent-color:var(--blue)}[hidden]{display:none!important}body>header{height:88px;display:flex;border-bottom:1px solid var(--line);background:#eaf3ff;gap:1rem}header .brand{display:flex;gap:1rem;align-items:center;color:#fff;background:#1e609e;border-bottom-right-radius:25px;padding:12px 24px;min-width:280px;width:28%}.brand img{width:44px;filter:brightness(0) invert(1)}.brand strong{font-size:clamp(19px,1.7vw,32px)}small{display:block;color:#526c8f;font-size:.82em;line-height:1.4}.brand small{color:white}nav{display:flex;flex:1;justify-content:space-around;align-items:center}nav button{border:0;background:transparent;min-width:90px}nav img{display:block;width:29px;height:29px;margin:0 auto 4px}main{padding:8px}.project-line{display:flex;align-items:center;gap:1rem;min-height:38px;padding-bottom:7px}.project-line #engine{flex:1}.project-line #connection{font-size:.8em}.operation{display:grid;grid-template-columns:minmax(170px,15%) minmax(360px,40%) minmax(0,1fr);gap:9px;height:calc(100dvh - 178px);min-height:560px}.panel,details{border:1px solid var(--line);background:var(--panel);border-radius:10px;overflow:hidden}aside{min-width:0;overflow:auto}details{margin-bottom:8px}summary,h2{padding:.6em .7em;font-weight:600;background:#eaf2ff;border-bottom:1px solid var(--line);margin:0;font-size:1.06em}summary{cursor:pointer}details>div,details>p,details>small,details>label{margin:8px}.scene-list{display:grid;gap:4px}.scene-list button{text-align:left}.deck{display:flex;flex-direction:column;min-width:0}.bank-head{display:flex;gap:5px;padding:7px;background:#edf4ff;align-items:start}#banks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;flex:1}#banks button{overflow-wrap:anywhere;min-height:38px;font-weight:600}.bank-head>button{padding:6px}.layer-actions{display:flex;gap:6px;flex-wrap:wrap;padding:8px;border-top:1px solid var(--line)}#clip-grid{display:grid;grid-template-columns:minmax(95px,1.1fr) repeat(5,minmax(0,1fr));gap:5px;padding:6px;align-content:start;overflow:auto;flex:1;min-height:180px}.col{min-height:30px;padding:4px}.layer-label{background:#ecf3ff;display:flex;flex-direction:column;gap:5px;padding:5px;border-radius:5px;min-width:0}.layer-label>button{text-align:left;padding:3px;border:0;background:transparent;overflow-wrap:anywhere}.layer-icons{display:flex;gap:2px;flex-wrap:wrap}.layer-icons button{padding:3px;min-height:25px;font-size:11px}.slot{position:relative;background:#064b9f;border-radius:7px;min-height:78px;aspect-ratio:1.2;overflow:hidden;display:flex;flex-direction:column}.slot>button:first-child{border:0;border-radius:0;background:transparent;color:white;flex:1;min-height:0;padding:4px;display:flex;align-items:center;justify-content:center;overflow:hidden}.slot img.thumb{width:100%;height:100%;position:absolute;inset:0;object-fit:contain;background:#071524}.slot .caption{position:relative;font-weight:600;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:clamp(10px,.85vw,15px);z-index:1}.slot.has-image .caption{align-self:end;font-size:11px;background:#001632bb;padding:2px;max-width:100%}.slot.empty{background:#f3f7ff;border:1px dashed #cbdcf4}.slot.empty>button:first-child{color:#679fe4}.slot .edit{position:absolute;right:2px;top:2px;padding:2px;min-height:22px;z-index:2;background:#fff}.slot .edit img{width:16px;height:16px}.inspector{padding:10px;background:#f9fbff;border-top:1px solid var(--line)}#layer-controls{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding-top:6px}#layer-controls label{display:flex;align-items:center;gap:4px}#layer-controls input[type=number]{width:65px}.monitors{min-width:0;display:flex;flex-direction:column;gap:8px}.buses{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.screen{aspect-ratio:16/9;background:#071524;position:relative;overflow:hidden;margin:5px}.screen>img{width:100%;height:100%;object-fit:contain}.screen>span{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:white;padding:10px;background:#071524dd;font-size:.85em}.screen>span:empty{display:none}.bus-meta{display:flex;gap:5px;align-items:center;padding:5px;flex-wrap:wrap;font-size:.8em}.bus-meta>span:first-child{flex:1;min-width:50px}.bus-meta button{min-height:27px;padding:3px 7px}.live-dot{display:inline-block;width:10px;height:10px;background:#f52222;border-radius:50%;margin-right:4px}.transport{display:flex;gap:6px;flex-wrap:wrap;padding:8px;align-items:center}.transport input{width:57px}.transport small{flex-basis:100%;font-size:10px}.output-panel{flex:1;min-height:0;display:flex;flex-direction:column}.outputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:7px;flex:1;align-content:start;overflow:auto}.output{border:1px solid var(--line);border-radius:7px;padding:5px;min-width:0}.output>header{display:flex;gap:4px;align-items:center}.output strong{flex:1;min-width:0;overflow-wrap:anywhere}.output button{min-height:27px;padding:3px 8px}.output .screen{margin:5px 0 0}.output small{font-size:10px}.meters{display:flex;gap:4px}meter{width:50%;height:18px}#effects label{display:grid;grid-template-columns:1fr 65px;gap:4px;align-items:center;margin-bottom:7px}#effects input{width:65px}#module{padding:22px;min-height:60vh}#module-body{display:grid;gap:10px}.login{max-width:440px;margin:6vh auto;padding:25px}.login input{width:100%;margin:5px 0 12px}.login h1{font-size:1.5em}.login button{width:100%;background:var(--blue);color:#fff}.login .hint{color:#526c8f;font-size:.85em}#message{min-height:20px;margin:3px;font-size:12px}.error{color:#b52323}footer{display:flex;justify-content:space-between;padding:5px 12px;border-top:1px solid var(--line);font-size:11px;color:#526c8f}dialog{border:1px solid var(--line);border-radius:12px;width:min(620px,95vw);box-shadow:0 15px 50px #12345c44}dialog::backdrop{background:#12345c66}dialog header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}textarea{display:block;width:100%;resize:vertical;margin:6px 0 12px}.actions{display:flex;gap:6px;flex-wrap:wrap}.module-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.module-list button{text-align:left;padding:15px}a{color:#0066ff}
@media(max-width:1250px){body>header{height:74px}.brand{min-width:220px!important;padding:10px!important}.brand img{width:32px}.brand strong{font-size:20px}nav button{min-width:65px}.operation{grid-template-columns:165px minmax(300px,1fr) minmax(300px,1fr);height:calc(100dvh - 164px)}.slot{min-height:66px}#clip-grid{grid-template-columns:80px repeat(5,minmax(0,1fr))}.layer-icons button{font-size:10px}}
@media(max-width:1000px){.operation{height:auto;min-height:0;grid-template-columns:180px minmax(0,1fr)}.deck{min-height:500px}.monitors{grid-column:1/-1}.outputs{grid-template-columns:repeat(4,minmax(0,1fr))}.brand{width:auto!important}nav img{width:24px;height:24px}nav button{min-width:55px;padding:6px}.brand small{font-size:10px}#engine{display:none}.project-line{flex-wrap:wrap}.buses .screen{max-height:none}}
@media(max-width:600px){:root{font-size:13px}body>header{height:auto;display:block}.brand{border-radius:0!important;width:100%!important;padding:9px 14px!important}.brand strong{font-size:22px}nav{padding:4px}nav button{flex:1;font-size:11px}.operation{grid-template-columns:minmax(0,1fr)}aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;overflow:visible}details{margin:0}aside details[open]{grid-column:1/-1}.deck{min-height:430px}.monitors{grid-column:auto}.outputs{grid-template-columns:repeat(2,minmax(0,1fr))}.buses{gap:5px}.buses h2{font-size:12px;padding:7px 5px}.bus-meta{font-size:10px}.slot{min-height:62px;aspect-ratio:1}.slot .caption{font-size:10px}#clip-grid{grid-template-columns:70px repeat(5,minmax(0,1fr));gap:3px;padding:4px}.layer-label{font-size:11px}.layer-icons{gap:1px}.layer-icons button{font-size:9px;padding:2px}.project-line{gap:5px}.project-line strong{width:100%}.project-line #connection{flex:1}.transport button{flex:1}.output strong{font-size:11px}.output header{flex-wrap:wrap}.brand img{width:30px}footer{font-size:10px}#banks{grid-template-columns:repeat(4,minmax(0,1fr))}#banks button{font-size:11px;padding:3px}.bank-head{gap:3px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(min-width:1001px){body{height:100dvh;display:flex;flex-direction:column}body>header,body>footer{flex-shrink:0}main{flex:1;min-height:0;display:flex;flex-direction:column}#console{flex:1;min-height:0;display:flex;flex-direction:column}.project-line{flex-shrink:0}.operation{flex:1;min-height:0;height:auto;grid-template-rows:minmax(0,1fr)}.operation>*,.outputs{min-height:0}.outputs{grid-template-rows:repeat(2,minmax(0,1fr));align-content:stretch}.output{display:flex;flex-direction:column}.output .screen{flex:1;min-height:0;aspect-ratio:auto}.output header,.output small{flex-shrink:0}#message{flex-shrink:0}#module{overflow:auto;min-height:0;flex:1}}

.layer-label>button[aria-pressed=true]{background:#0066ff;color:white;border-radius:5px}nav button[aria-current] img{filter:brightness(0) invert(1)}
