/* Nous Studio chrome. Owns the workspace and manipulation affordances; the source kit stays isolated in its viewport. */
:root{color-scheme:dark;--bg:#15151a;--panel:#1e1e24;--raise:#27272f;--line:#34343f;--ink:#f2f0f5;--muted:#9b99a9;--accent:#bfa7ff;--accent2:#6b43d8;--danger:#ffb1ae;--canvas:#111115;--font:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font:13px/1.45 var(--font);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}button{border:1px solid transparent;border-radius:7px;min-height:31px;padding:5px 9px;background:transparent;cursor:pointer}button:hover{background:var(--raise)}button:disabled{opacity:.3;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.primary{background:var(--accent);color:#25153c;font-weight:650}button[aria-pressed=true]{background:#3c3156;color:#e6d8ff}input,select,textarea{min-width:0;background:var(--raise);border:1px solid var(--line);border-radius:6px;padding:7px}select{cursor:pointer}input[type=checkbox]{accent-color:var(--accent)}input[type=range]{width:100%;accent-color:var(--accent);padding:0;border:0}h1,h2,h3,h4,p{margin:0}h2{font-size:17px;font-weight:600}h3{font-size:12px;font-weight:650}a{color:var(--accent);text-decoration:none}small,.quiet{color:var(--muted);font-size:11px}kbd{font:10px ui-monospace,monospace;border:1px solid var(--line);padding:1px 4px;border-radius:4px;color:var(--muted)}.row{display:flex;align-items:center;gap:7px}.topbar{height:57px;display:flex;align-items:center;gap:14px;padding:0 16px;border-bottom:1px solid var(--line);background:var(--panel);position:relative;z-index:20}.logo{font-size:25px;letter-spacing:-1.6px;font-weight:800;color:var(--ink);white-space:nowrap}.logo span{color:#ff5c50}.logo i{font-style:normal;font-size:11px;letter-spacing:.3px;margin-left:7px;color:var(--muted);font-weight:450}.topdivider{height:19px;border-left:1px solid var(--line)}#project-name{width:180px;background:transparent;border-color:transparent;padding:5px;font-weight:550}.saved{font-size:11px;color:var(--muted)}.topactions{display:flex;align-items:center;gap:5px;margin-left:auto}.workspace{display:grid;grid-template-columns:248px minmax(200px,1fr) 284px;height:calc(100% - 57px)}.left-pane,.right-pane{min-width:0;background:var(--panel);display:flex;flex-direction:column}.left-pane{border-right:1px solid var(--line)}.right-pane{border-left:1px solid var(--line)}.pane-tabs,.inspector-tabs{display:flex;height:45px;align-items:center;padding:0 12px;border-bottom:1px solid var(--line);gap:5px}.pane-tabs button,.inspector-tabs button{border-radius:0;height:45px;font-size:12px;color:var(--muted)}.pane-tabs button.active,.inspector-tabs button.active{color:var(--ink);border-bottom:2px solid var(--accent)}.sidebar-search{margin:12px;display:flex;align-items:center;gap:5px;background:var(--raise);border:1px solid var(--line);border-radius:7px;padding:0 7px}.sidebar-search input{border:0;background:transparent;padding:7px 0;width:100%}.left-scroll,.inspector-scroll{overflow:auto;min-height:0;flex:1;padding:0 10px 15px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.group-title{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;padding:15px 8px 7px;display:flex;justify-content:space-between}.page-item{width:100%;text-align:left;display:flex;align-items:center;gap:9px;padding:8px 10px;min-height:35px;color:#bdbbc9;border-radius:7px;font-size:12px}.page-item .page-icon{color:var(--muted);font-size:15px}.page-item small{margin-left:auto;font-size:9px}.page-item.active{background:#332b49;color:#e7daff}.page-item.active .page-icon{color:var(--accent)}.source-stamp{border-top:1px solid var(--line);padding:12px;display:flex;gap:8px;align-items:center}.source-stamp div{display:grid;gap:2px;flex:1}.source-stamp b{font-weight:500;font-size:10px}.source-stamp a{font-size:10px;color:var(--muted)}.source-dot,.live-dot{width:6px;height:6px;display:inline-block;background:#97bea7;border-radius:50%;flex-shrink:0}.workspace-center{min-width:0;display:flex;flex-direction:column}.canvas-toolbar{height:45px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:8px;padding:0 12px;background:#19191f;position:relative;z-index:10}.canvas-toolbar select{border:0;background:transparent;padding:4px;max-width:160px;font-size:11px}.device-select{display:flex;align-items:center;gap:5px}.canvas-toolbar .tool{font-size:19px;min-height:27px}.canvas-toolbar button{font-size:11px}.stage{position:relative;flex:1;min-height:100px;overflow:hidden;background-color:var(--canvas);background-image:radial-gradient(#383740 0.65px,transparent .65px);background-size:16px 16px;touch-action:none}.world{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}.board-label{position:absolute;bottom:calc(100% + 13px);left:4px;color:#aaa7b7;font-size:12px;white-space:nowrap;letter-spacing:.1px}.board-label b{color:#dbd7e5;font-weight:500}.board-label span{margin-left:8px;color:#797586}.hardware{position:relative;isolation:isolate;background:#252529;border:1px solid #5b5a60;border-radius:65px;padding:10px 8px;box-shadow:0 0 0 2px #111114,0 0 0 3px #49484c,0 24px 70px #0008;box-sizing:content-box;flex-shrink:0}.hardware.tablet{border-radius:34px;padding:18px}.hardware.android{border-radius:44px;padding:7px}.hardware.browser,.hardware.desktop{border-radius:16px;padding:8px;border-color:#77747d}.hardware.hinge{border-radius:7px 48px 48px 7px;padding:9px 9px 9px 12px}.hardware.fold{border-radius:42px;padding:9px}.device-screen{position:relative;overflow:hidden;border-radius:55px;isolation:isolate}.hardware.tablet .device-screen{border-radius:18px}.hardware.android .device-screen{border-radius:37px}.hardware.browser .device-screen,.hardware.desktop .device-screen{border-radius:8px}.hardware.hinge .device-screen{border-radius:0 38px 38px 0}.hardware.fold .device-screen{border-radius:32px}iframe{display:block;border:0;width:100%;height:100%;background:transparent}.camera{position:absolute;z-index:80;width:126px;height:36px;top:11px;left:50%;margin-left:-63px;background:#08080a;border-radius:24px;pointer-events:none;box-shadow:inset 0 0 1px 1px #16161b}.camera:after{content:'';position:absolute;right:12px;top:12px;width:11px;height:11px;border-radius:50%;background:radial-gradient(#18334c,#080c14 55%,#1d1e26 70%)}.camera.punch{width:17px;height:17px;top:10px;margin-left:-8.5px;box-shadow:0 0 0 2px #343239}.camera.punch:after{inset:3px;width:11px;height:11px}.camera.hidden{display:none}.physical-button{position:absolute;background:#68666b;width:3px;border:1px solid #25252a;border-radius:3px;top:180px;height:65px;right:-4px}.physical-button.volume{left:-4px;top:155px;height:75px}.hardware.tablet .physical-button,.hardware.browser .physical-button,.hardware.desktop .physical-button{display:none}.canvas-hit{position:absolute;inset:0;z-index:100;cursor:default;touch-action:none}.canvas-hit.browse{pointer-events:none}.canvas-hit.hand{cursor:grab}.canvas-hit.grabbing{cursor:grabbing}.selection-box{position:absolute;border:1.5px solid #9f6dff;pointer-events:none;transform-origin:center}.selection-tag{position:absolute;top:-23px;left:-1px;font-size:11px;background:#8045d9;color:#fff;padding:2px 6px;border-radius:3px;white-space:nowrap;pointer-events:none}.resize-handle{position:absolute;width:8px;height:8px;border:1px solid #8045d9;background:#fff;pointer-events:auto}.resize-handle[data-corner=nw]{left:-5px;top:-5px;cursor:nwse-resize}.resize-handle[data-corner=ne]{right:-5px;top:-5px;cursor:nesw-resize}.resize-handle[data-corner=sw]{left:-5px;bottom:-5px;cursor:nesw-resize}.resize-handle[data-corner=se]{right:-5px;bottom:-5px;cursor:nwse-resize}.safe-overlay{position:absolute;inset:0;pointer-events:none;z-index:90;border-left:1px dashed #ffab6699;border-right:1px dashed #ffab6699}.safe-overlay .unsafe{position:absolute;left:0;right:0;background:#e58d3930;color:#ffd7a9;display:flex;align-items:center;justify-content:center;font-size:11px;border-bottom:1px dashed #ffab66}.safe-overlay .unsafe.bottom{bottom:0;border-bottom:0;border-top:1px dashed #ffab66}.safe-overlay .column-guide{position:absolute;inset-block:0;left:50%;transform:translateX(-50%);border-inline:1px dashed #a678ff70}.guide{position:absolute;pointer-events:none;background:#ff659c;z-index:120}.guide.vertical{width:1px;top:0;bottom:0}.guide.horizontal{height:1px;left:0;right:0}.floating-tools{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;gap:3px;padding:5px;background:#26262eea;border:1px solid #454450;border-radius:12px;box-shadow:0 8px 30px #0006;z-index:140}.floating-tools button{width:35px;font-size:19px;height:35px}.floating-tools span{border-left:1px solid var(--line);margin:5px 2px}.zoom-control{position:absolute;bottom:20px;right:12px;display:flex;align-items:center;padding:3px;background:#26262eea;border:1px solid #454450;border-radius:9px;z-index:140;font-size:11px}.zoom-control button{font-size:12px;padding:3px 7px;min-height:28px}.zoom-control input{width:34px;padding:1px;background:transparent;border:0;appearance:textfield;text-align:right}.zoom-control input::-webkit-inner-spin-button{display:none}.bottomline{height:29px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);font-size:10px;color:var(--muted);background:#19191f}.bottomline button{font-size:10px;min-height:23px}.compare-board{position:absolute;top:0}.compare-board[hidden]{display:none}.compare-board .board-label select{background:transparent;border:0;color:#bbb6c7;font-size:12px}.inspector-scroll{padding:0}.inspect-section{padding:15px;border-bottom:1px solid var(--line);display:grid;gap:10px}.inspect-heading{display:flex;align-items:center;justify-content:space-between}.inspect-heading small{font-size:10px}.inspect-title{font-weight:600;font-size:13px}.pill{display:inline-flex;padding:2px 6px;font-size:10px;border-radius:4px;background:#33303e;color:#c9bfdf}.property-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.numfield{background:var(--raise);border-radius:6px;display:flex;align-items:center;padding:2px 8px;border:1px solid transparent;gap:7px;color:var(--muted);font-size:11px}.numfield:focus-within{border-color:var(--accent)}.numfield input{width:100%;border:0;background:transparent;padding:5px 0;appearance:textfield;color:var(--ink);font-size:12px}.numfield input::-webkit-inner-spin-button{appearance:none}.alignment{display:flex;gap:3px;justify-content:space-between}.alignment button{background:var(--raise);font-size:17px;width:32px;padding:3px;min-height:29px}.field{display:grid;gap:6px;font-size:11px;color:var(--muted)}.field input,.field select,.field textarea{font-size:12px;color:var(--ink);width:100%}.field textarea{resize:vertical;min-height:60px}.checkbox{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted)}.metric{display:grid;gap:5px}.metric-label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.metric input[type=number]{width:65px;font-size:11px;padding:3px 5px}.metric-source{font-size:9px;color:#7e788d}.metric details{display:grid;gap:8px}.inspect-section summary{font-size:11px;color:#c5bece;cursor:pointer}.help{color:var(--muted);font-size:11px;line-height:1.6}.help strong{font-weight:500;color:#d4cbdc}.selection-footer{display:flex;align-items:center;justify-content:space-between;padding:4px 12px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.layer-item{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:5px;font-size:11px;min-height:33px;cursor:default}.layer-item.active{background:#392b53}.layer-item.hidden-layer{opacity:.45}.layer-item .layer-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-item button{min-height:24px;font-size:12px;padding:2px 3px;color:var(--muted)}.layer-type{color:var(--accent);font-size:13px}.layer-item[draggable=true]{cursor:grab}.library-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px 2px}.library-tile{border:1px solid var(--line);background:#25252c;padding:0;overflow:hidden;text-align:left;min-width:0;border-radius:9px}.library-tile:hover{border-color:var(--accent);background:#2d2938}.tile-preview{height:76px;position:relative;overflow:hidden;background:#f5f0eb;pointer-events:none}.tile-preview iframe{position:absolute;left:50%;top:50%;width:320px;height:180px;transform:translate(-50%,-50%) scale(.33);transform-origin:center;border:0;pointer-events:none}.library-tile .tile-label{display:block;padding:7px 8px;font-size:10px;font-weight:500}.planned-item{padding:10px 8px;border-bottom:1px solid var(--line);font-size:11px;display:grid;gap:4px}.planned-item span{font-size:10px;color:var(--muted)}.source-code{font:11px/1.6 ui-monospace,'SF Mono',monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:#c8bdd9;padding:14px;margin:0;background:#17151e}.source-file{font:10px ui-monospace,monospace;color:var(--muted);overflow-wrap:anywhere}.empty-inspector{padding:22px 15px;display:grid;gap:16px}.empty-inspector .large-icon{font-size:30px;color:#6e6385}.empty-inspector h2{font-size:15px}.empty-inspector p{font-size:12px;color:var(--muted);line-height:1.7}.actionrow{display:flex;gap:6px;flex-wrap:wrap}.actionrow button{font-size:11px;border-color:var(--line)}.screen-inventory{margin-top:14px;font-size:10px;line-height:1.6;color:var(--muted)}.screen-inventory a{display:block}.new-page{width:100%;text-align:left;color:var(--accent);font-size:11px;border:1px dashed var(--line);margin:10px 0 0}.status-chip{background:#2c4037;color:#b1d6c1;border-radius:4px;padding:2px 5px;font-size:9px}.project-card{border:1px solid var(--line);border-radius:9px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0}.project-card span{display:grid;gap:3px}.project-card small{font-size:10px}.export-options{display:grid;gap:9px}.export-options button{display:flex;align-items:center;justify-content:space-between;text-align:left;padding:12px;border:1px solid var(--line);background:var(--raise);min-height:60px}.export-options button span{display:grid;gap:3px}.export-options button small{font-size:10px}.coverage{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:12px 0}.coverage div{background:var(--raise);border-radius:8px;padding:15px}.coverage b{display:block;font-size:26px;font-weight:550}.coverage small{font-size:10px}.checklist{margin:12px 0;padding-left:20px;color:var(--muted);font-size:12px;line-height:1.7}.dialog-actions{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}dialog{background:#202027;color:var(--ink);border:1px solid #494552;border-radius:15px;padding:0;width:min(640px,calc(100% - 24px));max-height:85vh;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#08070cb3;backdrop-filter:blur(4px)}dialog header{padding:17px 20px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}dialog #menu-content{padding:18px 20px;max-height:65vh;overflow:auto}dialog textarea{margin:18px 20px;width:calc(100% - 40px);resize:vertical}dialog footer{display:flex;justify-content:flex-end;padding:12px 20px;gap:8px}#toast{position:fixed;left:50%;bottom:65px;transform:translateX(-50%);background:#35303f;border:1px solid #625676;border-radius:9px;padding:10px 16px;font-size:12px;z-index:300;max-width:80%;box-shadow:0 8px 35px #0006;opacity:0;pointer-events:none;transition:opacity .15s}#toast.show{opacity:1}.marquee{position:absolute;border:1px solid #b28df8;background:#a76eff15;pointer-events:none}.stage-empty{padding:50px;color:var(--muted)}#rulers{position:absolute;inset:0;pointer-events:none;z-index:150}.presenting .left-pane,.presenting .right-pane,.presenting .canvas-toolbar,.presenting .floating-tools,.presenting .bottomline{display:none}.presenting .workspace{grid-template-columns:1fr}.presenting .topbar .saved{display:none}.presenting #present{background:#3b2d50;color:#e5d5ff}.presenting .canvas-hit{pointer-events:none}.presenting #rulers{display:none}@media(max-width:1150px){.workspace{grid-template-columns:215px minmax(200px,1fr) 250px}.saved{display:none}.canvas-toolbar .quiet{display:none}.floating-tools{left:12px;transform:none}.zoom-control{right:8px}.topbar{gap:8px}#project-name{width:155px}}@media(max-width:850px){.workspace{grid-template-columns:180px minmax(200px,1fr)}.right-pane{position:absolute;right:10px;top:111px;bottom:60px;width:250px;border:1px solid var(--line);border-radius:10px;z-index:160;display:none}.right-pane.open{display:flex}.logo i,.topdivider,#project-name{display:none}.canvas-toolbar{padding:0 5px}.canvas-toolbar select{max-width:120px}.topactions{gap:2px}.topactions button{font-size:11px;padding:5px}.zoom-control input{width:28px}.floating-tools button{width:29px;font-size:15px}.floating-tools{bottom:60px}}@media(max-width:560px){.workspace{grid-template-columns:135px minmax(160px,1fr)}.left-scroll{padding-inline:5px}.pane-tabs{padding:0 3px;gap:0}.pane-tabs button{padding-inline:5px;font-size:11px}.sidebar-search{margin:8px 5px}.sidebar-search kbd{display:none}.source-stamp{padding:8px 5px}.source-stamp a{display:none}.library-grid{grid-template-columns:1fr}.canvas-toolbar .row:last-child{gap:0}#look{display:none}.topactions #projects-btn{display:none}#device{max-width:102px}#compare{display:none}.bottomline #canvas-description{max-width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bottomline button{display:none}.page-item{padding:6px;font-size:11px}.group-title{font-size:9px;padding-inline:5px}.source-stamp b{font-size:9px}.topbar{padding-inline:9px}.logo{font-size:22px}.zoom-control{bottom:14px}.floating-tools{left:8px}}

/* Grid tracks must shrink within the application viewport, independent of inspector length. */
.workspace{grid-template-rows:minmax(0,1fr)}.workspace-center,.left-pane,.right-pane{min-height:0}