:root{color-scheme:dark;--bg: oklch(.155 .012 265);--panel: oklch(.205 .012 265);--panel-2: oklch(.245 .012 265);--panel-3: oklch(.295 .012 265);--canvas: oklch(.935 .01 255);--canvas-grid: oklch(.68 .018 255 / 18%);--text: oklch(.93 .008 255);--muted: oklch(.69 .012 255);--subtle: oklch(.55 .012 255);--border: oklch(.34 .014 260);--border-soft: oklch(.285 .014 260);--accent: oklch(.72 .15 232);--accent-soft: oklch(.43 .08 232);--accent-ink: oklch(.13 .018 250);--success: oklch(.73 .15 156);--warning: oklch(.78 .14 76);--danger: oklch(.67 .18 25);--radius: 8px;--shadow: 0 24px 80px oklch(.08 .008 260 / 52%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0;min-width:1180px;min-height:100vh;overflow:hidden;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button{color:inherit}.studio-shell{height:100vh;display:grid;grid-template-rows:48px minmax(0,1fr) 28px;background:linear-gradient(180deg,oklch(.18 .014 265),var(--bg) 38%),var(--bg)}.studio-topbar,.studio-statusbar{display:flex;align-items:center;border-color:var(--border-soft);background:#0d0f15}.studio-topbar{display:grid;grid-template-columns:minmax(210px,260px) minmax(320px,1fr) auto minmax(260px,auto);justify-content:initial;gap:14px;padding:0 12px;border-bottom:1px solid var(--border-soft)}.brand-lockup{display:flex;align-items:center;gap:9px;min-width:220px}.brand-mark{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:var(--accent);color:var(--accent-ink)}.brand-lockup strong,.brand-lockup span{display:block;line-height:1.1}.brand-lockup strong{font-size:13px;font-weight:700}.brand-lockup span{margin-top:3px;color:var(--muted);font-size:11px}.topbar-segment,.topbar-actions,.toolbar-group,.statusbar-actions,.selection-path,.access-actions{display:flex;align-items:center;gap:8px;min-width:0}.topbar-segment.center{position:static;transform:none;justify-self:center;padding:3px;border:1px solid var(--border-soft);border-radius:8px;background:#080a0f}.topbar-actions{justify-self:end}.ghost-select,.mode-button,.tool-chip,.icon-button,.primary-button,.secondary-button,.panel-icon-button{min-height:30px;border:1px solid var(--border);border-radius:7px;background:var(--panel-2);color:var(--text);display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 10px;cursor:pointer;white-space:nowrap}.ghost-select{color:var(--muted);min-width:0;overflow:hidden;text-overflow:ellipsis}.ghost-select.wide{max-width:210px;flex:1 1 auto;justify-content:space-between}.ghost-select svg{flex:0 0 auto}.mode-button{min-height:24px;border-color:transparent;background:transparent;color:var(--muted);font-size:12px}.mode-button.active,.tool-chip.active,.rail-button.active,.inspector-tab.active{background:var(--panel-3);color:var(--text);border-color:var(--border)}.primary-button{border-color:#0398cd;background:var(--accent);color:var(--accent-ink);font-weight:700}.primary-button:disabled{cursor:not-allowed;filter:grayscale(.7);opacity:.55}.secondary-button{background:var(--panel-3)}.primary-button.full,.secondary-button.full{width:100%}.icon-button,.panel-icon-button{width:30px;padding:0}.status-pill,.validation-pill{height:24px;display:inline-flex;align-items:center;gap:5px;border-radius:999px;border:1px solid var(--border);padding:0 9px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:0}.status-pill.live,.validation-pill.ok{border-color:#358056;color:var(--success)}.validation-pill.warning{border-color:#a27734;color:var(--warning)}.studio-workspace{min-height:0;display:grid;grid-template-columns:46px 300px minmax(460px,1fr) 326px}.studio-rail,.studio-sidebar,.studio-inspector{min-height:0;border-right:1px solid var(--border-soft);background:var(--panel)}.studio-rail{display:flex;flex-direction:column;gap:6px;align-items:center;padding:8px 6px}.rail-button{width:34px;height:34px;display:grid;place-items:center;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted);cursor:pointer}.studio-sidebar,.studio-inspector{display:grid;grid-template-rows:55px minmax(0,1fr)}.studio-inspector{grid-template-rows:55px 38px minmax(0,1fr);border-right:0;border-left:1px solid var(--border-soft)}.panel-header{display:flex;align-items:center;justify-content:space-between;min-height:55px;padding:0 12px;border-bottom:1px solid var(--border-soft)}.panel-header span,.section-label,.studio-statusbar,.compact-field span,.control-field span,.property-row span{color:var(--subtle);font-size:11px}.panel-header strong{display:block;margin-top:3px;font-size:13px}.sidebar-scroll,.inspector-scroll{min-height:0;overflow:auto;padding:10px}.panel-stack{display:flex;flex-direction:column;gap:12px}.panel-section{display:flex;flex-direction:column;gap:8px}.section-label{display:flex;align-items:center;justify-content:space-between;text-transform:uppercase;letter-spacing:0}.document-list,.screen-list,.layer-tree,.component-grid,.template-grid,.asset-grid{display:flex;flex-direction:column;gap:6px}.document-row,.screen-row,.layer-row,.component-tile,.template-button,.recommendation-row,.asset-tile{width:100%;border:1px solid var(--border-soft);border-radius:7px;background:#111419;display:flex;align-items:center;gap:9px;padding:9px;text-align:left;cursor:pointer}.document-row.active,.screen-row.active,.layer-row.active,.recommendation-row.active{border-color:var(--accent-soft);background:#17232d}.document-row span,.screen-row span,.component-tile span,.template-button span,.recommendation-row span{min-width:0;display:grid;gap:3px}.document-row strong,.screen-row strong,.component-tile strong,.template-button strong,.recommendation-row strong,.field-row strong{font-size:12px}.document-row small,.screen-row small,.component-tile small,.template-button small,.recommendation-row small,.field-row span,.release-card span{color:var(--muted);font-size:11px;line-height:1.35}.document-row em,.recommendation-row em,.field-row em,.release-card em,.locale-row em{margin-left:auto;flex:0 0 auto;color:var(--subtle);font-size:10px;font-style:normal}.screen-index{width:24px;height:24px;display:grid;place-items:center;border-radius:6px;background:var(--panel-3);color:var(--muted);font-size:11px}.template-button{align-items:flex-start}.component-tile{min-height:58px}.asset-drop,.discovery-card,.safety-note,.runtime-note,.access-code{border:1px solid var(--border-soft);border-radius:8px;background:#111419}.asset-drop{display:grid;justify-items:start;gap:6px;padding:14px}.asset-drop span,.safety-note span,.runtime-note span{color:var(--muted);font-size:12px;line-height:1.4}.asset-tile{min-height:42px}.field-row,.locale-row,.logic-row,.mini-row,.property-row,.condition-row{display:flex;align-items:center;gap:8px;min-height:32px;border:1px solid var(--border-soft);border-radius:7px;background:#111419;padding:7px 8px}.field-row div{display:grid;gap:2px}code{color:#7bc2e6;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:11px}.discovery-card{display:flex;flex-direction:column;gap:10px;padding:10px}.discovery-heading{display:flex;align-items:center;gap:9px}.discovery-heading strong,.discovery-heading span{display:block}.discovery-heading strong{font-size:13px}.discovery-heading span{margin-top:2px;color:var(--muted);font-size:11px}.brief-list{display:grid;gap:7px}.compact-field,.control-field,.field-block{display:grid;gap:5px}.compact-field input,.control-field input,.control-field select,.control-field textarea,.field-block input{width:100%;min-height:30px;border:1px solid var(--border);border-radius:7px;background:#080a0f;color:var(--text);padding:0 9px;outline:none}.control-field textarea{min-height:86px;padding:8px 9px;resize:vertical}.compact-field input:focus,.control-field input:focus,.control-field select:focus,.control-field textarea:focus,.field-block input:focus{border-color:var(--accent)}.recommendation-row{align-items:flex-start}.recommendation-row>span{flex:1 1 auto;min-width:0}.recommendation-row code{display:block;width:fit-content;max-width:100%;overflow-wrap:anywhere}.approval-dot{width:9px;height:9px;flex:0 0 auto;margin-top:4px;border-radius:999px;border:1px solid var(--border)}.approval-dot.approved{border-color:var(--success);background:var(--success)}.field-detail{display:grid;gap:6px}.safety-note,.runtime-note{display:flex;align-items:flex-start;gap:8px;padding:9px}.runtime-note{margin-top:4px}.logic-row code,.condition-row code{margin-left:auto}.release-card{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--border-soft);border-radius:8px;background:#111419;padding:10px}.release-card.current{border-color:var(--accent-soft)}.release-card strong{display:block;margin:3px 0;font-size:12px}.studio-canvas-zone{min-width:0;min-height:0;display:grid;grid-template-rows:42px minmax(0,1fr);background:linear-gradient(90deg,var(--canvas-grid) 1px,transparent 1px),linear-gradient(var(--canvas-grid) 1px,transparent 1px),#101216;background-size:24px 24px}.canvas-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--border-soft);background:#0d0f15eb}.tool-chip{min-height:26px;font-size:12px}.zoom-label{color:var(--muted);font-size:12px}.canvas-stage{min-height:0;display:grid;place-items:center;position:relative;padding:42px 36px 68px}.device-shell{width:326px;height:664px;display:grid;grid-template-rows:28px minmax(0,1fr) 22px;border:1px solid oklch(.29 .012 265);border-radius:42px;background:#030407;box-shadow:var(--shadow);padding:10px}.device-top,.device-home{display:grid;place-items:center}.device-top span{width:78px;height:20px;border-radius:999px;background:#010203}.device-home:before{content:"";width:96px;height:4px;border-radius:999px;background:#36383c}.device-frame{min-height:0;overflow:hidden;border-radius:31px;background:var(--canvas)}.device-safe-area{height:100%;padding:28px 20px;color:#13161c}.screen-stack{min-height:100%}.preview-component{position:relative;border:1px solid transparent;outline:0}.preview-component.selected{border-color:#009fd6;border-color:oklch(.66 .16 232);box-shadow:0 0 0 2px #009fd640;box-shadow:0 0 0 2px oklch(.66 .16 232 / 25%)}.preview-component.text{margin:0;color:#13161c}h2.preview-component.text{font-size:30px;line-height:35px;letter-spacing:0}p.preview-component.text{color:#51555c;font-size:15px;line-height:22px}.phone-button{min-height:48px;border-radius:12px;border:0;background:#13161c;color:#eff2f7;font-weight:750}.choice-group{display:grid;gap:9px}.choice-option{min-height:48px;border:1px solid oklch(.86 .012 260);border-radius:12px;background:#fafcff;color:#171b20;display:grid;gap:3px;text-align:left;padding:9px 12px}.choice-option small{color:#5a5e65}.input-preview,.toggle-preview,.media-placeholder,.plan-summary{min-height:48px;display:flex;align-items:center;gap:8px;border:1px solid oklch(.86 .012 260);border-radius:12px;background:#fafcff;padding:0 12px}.input-preview,.media-placeholder{color:#5f636a}.toggle-preview{justify-content:space-between;color:#13161c}.toggle-preview i{width:38px;height:22px;border-radius:999px;background:#6bc891}.feature-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.feature-list li{display:flex;align-items:center;gap:8px;color:#1c1f25}.plan-summary{min-height:88px;align-items:flex-start;justify-content:center;flex-direction:column}.plan-summary strong{font-size:24px}.plan-summary small{color:#5a5e65}.progress-preview{height:7px;border-radius:999px;background:#d3d8e0;overflow:hidden}.progress-preview span{display:block;width:42%;height:100%;background:#0085b4;background:oklch(.58 .16 232)}.spacer-preview{height:24px}.stack{min-height:56px;border-radius:12px}.stack-placeholder{color:#656970;font-size:12px}.event-trace{position:absolute;right:22px;bottom:18px;min-width:260px;border:1px solid var(--border-soft);border-radius:8px;background:#0b0d13eb;padding:9px;display:grid;gap:7px}.event-trace div{display:flex;justify-content:space-between;gap:12px}.event-trace span,.event-trace strong{font-size:11px}.event-trace span{color:var(--muted)}.inspector-tabs{display:flex;align-items:center;gap:3px;overflow-x:auto;padding:6px;border-bottom:1px solid var(--border-soft)}.inspector-tab{min-height:25px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted);padding:0 8px;font-size:11px;cursor:pointer}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mini-list{display:grid;gap:6px}.mini-row{justify-content:space-between}.binding-preview{display:flex;align-items:center;gap:8px;border:1px solid var(--accent-soft);border-radius:8px;background:#0c1721;padding:10px}.binding-preview span{color:var(--muted)}.empty-panel{min-height:120px;display:grid;place-items:center;align-content:center;gap:8px;color:var(--muted);border:1px dashed var(--border);border-radius:8px;text-align:center}.empty-panel.compact{min-height:56px}.studio-statusbar{justify-content:space-between;border-top:1px solid var(--border-soft);padding:0 10px}.selection-path span,.statusbar-actions span{color:var(--subtle)}.selection-path strong{color:var(--muted);font-weight:500}.access-screen{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 0%,oklch(.3 .05 232 / 45%),transparent 42%),var(--bg);padding:32px}.access-panel{width:min(470px,100%);border:1px solid var(--border);border-radius:12px;background:var(--panel);box-shadow:var(--shadow);padding:24px}.access-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:var(--accent);color:var(--accent-ink)}.eyebrow{margin:18px 0 0;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:0}.access-panel h1{margin:7px 0 8px;font-size:25px;letter-spacing:0}.access-panel p{color:var(--muted);line-height:1.55}.field-block{margin-top:18px}.field-block code,.access-panel p code{color:#7bc2e6}.auth-mode-switch{width:fit-content;display:flex;align-items:center;gap:4px;margin-top:18px;padding:3px;border:1px solid var(--border-soft);border-radius:8px;background:#080a0f}.access-actions{margin-top:16px}.inline-error{margin-top:12px;border:1px solid oklch(.55 .15 25);border-radius:8px;background:#2b1311;color:#f9aea7;padding:9px 10px;font-size:13px}.inline-notice{margin-top:12px;border:1px solid oklch(.48 .09 232);border-radius:8px;background:#0a1723;color:#96cdea;padding:9px 10px;font-size:13px}.access-code{margin-top:16px;padding:10px;overflow-x:auto}@media(max-width:1260px){body{min-width:1040px}.studio-workspace{grid-template-columns:46px 270px minmax(410px,1fr) 300px}.event-trace{display:none}}