/* Midnight Studio: layout is shared; brand colors are configurable independently. */
:root{color-scheme:dark;--studio-bg:#0c1218;--studio-panel:#141d26;--studio-raised:#1b2732;--studio-text:#edf3f7;--studio-muted:#a0afbc;--studio-accent:#39dfca;--line:#2b3945;background:var(--studio-bg);color:var(--studio-text)}
body{background:radial-gradient(ellipse at 50% 0,#19313844,transparent 55%),var(--studio-bg);color:var(--studio-text)}
header{background:var(--studio-bg);border-color:var(--line);padding:16px 28px;gap:20px}.wordmark{font-size:29px;letter-spacing:-1.2px}.pill{color:var(--studio-accent);border-color:var(--line);font-size:9px}.tenant-picker{color:var(--studio-muted)}main{max-width:1900px;padding:20px 28px 0}.intro{margin-bottom:12px;gap:20px}.intro h1{font-size:25px;letter-spacing:-.7px;margin:5px 0}.intro h1 br{display:none}.intro .eyebrow{font-size:9px;margin:0;color:var(--studio-accent)}.intro>div>p:last-child{color:var(--studio-muted);margin:6px 0;font-size:12px}.notice{border:1px solid var(--line);border-radius:10px;background:var(--studio-panel);padding:10px 14px;max-width:270px;color:var(--studio-muted)}.notice p{display:none}.notice strong{color:var(--studio-text)}nav{margin:12px 0 18px;gap:8px}nav button{font-size:11px;padding:8px 16px;color:var(--studio-muted)}nav button[aria-pressed=true]{background:var(--studio-raised);color:var(--studio-accent);border-color:var(--studio-accent)}
.workspace{gap:18px}.materials,.inspector,.stage{background:var(--studio-panel);border:1px solid var(--line);border-radius:14px}.materials{padding:14px}.inspector{padding:16px}.stage-top{background:var(--studio-panel);padding:12px 16px}.step{border-color:var(--line);color:var(--studio-accent)}.section-title h2{font-size:14px}.stage-top>span,.muted,.eyebrow,.material small,.inspector p,#empty p{color:var(--studio-muted)}.canvas-wrap{background:var(--studio-bg);min-height:420px}.empty-icon{color:var(--studio-accent)}#empty{padding:60px 20px}#empty h2{font-size:28px}
.material{color:var(--studio-text);padding:8px;margin:8px 0;gap:11px;transition:background .15s,border-color .15s}.material:hover{background:var(--studio-raised)}.material[aria-pressed=true]{background:var(--studio-raised);border-color:var(--studio-accent);box-shadow:0 0 0 1px var(--studio-accent)}.swatch{width:68px;height:64px;border:1px solid #ffffff20;border-radius:8px}.material strong{font-size:12px;font-weight:600}.material small{font-size:9px;margin-top:5px}#materials h3{color:var(--studio-muted);font-size:10px;text-transform:uppercase;letter-spacing:.8px}#material-filters label{color:var(--studio-muted);font-size:10px}#material-filters select{font-size:11px}
select,input:not([type=range]):not([type=checkbox]):not([type=file]){background:var(--studio-bg);color:var(--studio-text);border:1px solid var(--line);border-radius:8px}input[type=range],input[type=checkbox]{accent-color:var(--studio-accent)}.primary{background:var(--studio-accent);border-color:var(--studio-accent);color:#061917;font-weight:700;border-radius:10px;min-height:44px}.primary:hover{filter:brightness(1.08)}.secondary,.edit-actions .text-button,.history-card button{background:var(--studio-raised);color:var(--studio-text);border-color:var(--line);border-radius:8px}.text-button,footer a{color:var(--studio-muted)}button:focus-visible,a:focus-visible,canvas:focus-visible,label:focus-within{outline-color:var(--studio-accent)}
.photo-tools{background:var(--studio-panel);border-color:var(--line);padding:10px 14px;gap:8px}.selection-bar{background:var(--studio-bg);padding:12px}.edit-card,.shared-editor,.history-card{background:var(--studio-panel);border-color:var(--line);color:var(--studio-text)}.edit-card h3{color:var(--studio-text)}.handle-legend{background:var(--studio-raised);color:var(--studio-muted)!important;border-radius:6px}.shared-editor #protect-save{background:var(--studio-accent);color:#061917}.info-tip,.info-tip summary{color:var(--studio-muted);border-color:var(--studio-muted)}.info-tip span{background:var(--studio-raised);color:var(--studio-text)}.review-guide{background:var(--studio-raised);border-color:var(--studio-accent)}#message{color:var(--studio-accent);padding-top:10px}.inspector #render-reason{color:var(--studio-muted)}.inspector h3{font-size:17px}.inspector .primary{margin-top:12px;min-height:48px}.inspector .edit-card{background:var(--studio-bg)}.control-group{border-top:1px solid var(--line);padding:12px 0;margin-top:10px}.control-group>summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--studio-text);padding:6px 0}.control-group[open]>summary{margin-bottom:12px}.studio-guide{background:var(--studio-raised);color:var(--studio-text);border-color:var(--studio-accent);box-shadow:0 12px 48px #0006}.guide-highlight{outline-color:var(--studio-accent)!important}.studio-guide p{color:var(--studio-muted)}.history{margin-top:26px}footer{color:var(--studio-muted)}*{scrollbar-color:#425463 var(--studio-bg);scrollbar-width:thin}
@media(min-width:1051px){.workspace{grid-template-columns:220px minmax(350px,1fr) 280px}.materials{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto}.inspector{background:var(--studio-panel);max-height:calc(100vh - 32px)}.canvas-wrap{max-height:66vh!important}}
@media(max-width:1050px){.workspace{grid-template-columns:200px minmax(300px,1fr)}.inspector{display:block}.control-group{width:100%}.intro h1{font-size:24px}}
@media(max-width:650px){header{padding:14px 16px;gap:10px}header .pill{display:none}main{padding:16px}.intro .notice{display:none}.workspace{display:flex}.materials{padding:10px}#materials .material{min-width:160px}.swatch{width:52px;height:52px}.inspector{width:100%}.canvas-wrap{min-height:260px}.intro h1{font-size:23px}.tenant-picker{order:3}#guide-toggle{margin-left:auto}}

.primary,.shared-editor #protect-save{color:var(--studio-button-text,#061917)}
.notice strong,.notice span{display:block}.notice span{margin-top:5px}.inspector p>label{display:block;margin:0 0 9px;color:var(--studio-muted);font-size:11px}.inspector p>input[type=range]{width:calc(100% - 36px);vertical-align:middle}.inspector output{display:inline-block;min-width:27px;text-align:right;font-size:11px;color:var(--studio-text)}.inspector p{margin:16px 0}.inspector .privacy{line-height:1.7}.control-group summary::marker{color:var(--studio-muted)}

/* Photo viewport: fit the complete upload before zooming for detailed mapping. */
.canvas-wrap.has-photo{display:block;min-height:0;height:66vh;max-height:66vh!important;overflow:auto;scrollbar-gutter:stable}
.canvas-wrap.has-photo #surface{flex:none;margin:0 auto}
.photo-zoom{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:8px 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--studio-panel);flex-wrap:wrap;font-size:12px}
.photo-zoom>span{margin-right:auto;color:var(--studio-muted)}
.photo-zoom p{display:flex;align-items:center;gap:8px;margin:0;font-size:11px}
.photo-zoom label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.photo-zoom input{width:110px}.photo-zoom output{min-width:36px}
.photo-zoom .secondary{min-height:32px;padding:5px 10px}
@media(max-width:650px){.canvas-wrap.has-photo{height:58vh;max-height:58vh!important}.photo-zoom{gap:5px;padding:8px}.photo-zoom input{width:85px}}

.pattern-peek{position:fixed;z-index:10000;width:min(340px,calc(100vw - 24px));padding:12px;border:1px solid #51616d;border-radius:18px;background:#141d26;color:#edf3f7;box-shadow:0 16px 60px #0009;pointer-events:none;font:13px Arial,sans-serif}.pattern-peek[hidden]{display:none}.pattern-peek img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;margin-bottom:10px}.pattern-peek small{display:block;color:#adbdc9;margin-top:5px}.pattern-hold{touch-action:pan-y;-webkit-touch-callout:none;user-select:none}.pattern-hold img{-webkit-user-drag:none}