:root{--red:#d71920;--red-dark:#a90f15;--ink:#111315;--panel:#181b1f;--panel-2:#20242a;--line:#30353c;--muted:#8d949e;--text:#eef0f2;--green:#41c77a;--amber:#f0b44b;--danger:#f05252;--studio-font:"Bahnschrift Condensed","Arial Narrow",Arial,sans-serif;--body-font:Inter,"Segoe UI",Arial,sans-serif}
.table-context-menu{position:fixed;z-index:300;width:244px;padding:12px;background:#181b1f;color:#eef0f2;border:1px solid #4a5058;border-top:3px solid var(--red);box-shadow:0 16px 42px #0009;font-size:10px}.table-context-menu[hidden]{display:none}.table-context-menu header{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:9px;border-bottom:1px solid #343941}.table-context-menu header div{display:flex;flex-direction:column;gap:3px}.table-context-menu header small{color:#8d949e;font:700 8px var(--studio-font);letter-spacing:1.3px}.table-context-menu header strong{font:800 15px var(--studio-font)}.table-context-menu header button{width:25px;height:25px;padding:0;border:0;background:transparent;color:#cfd3d8;font-size:17px;cursor:pointer}.table-context-menu>label,.table-counts label{display:grid;grid-template-columns:76px 1fr;align-items:center;gap:7px;margin-top:9px;color:#aab0b7}.table-context-menu input,.table-context-menu select{min-width:0;width:100%;padding:7px;background:#101215;color:#fff;border:1px solid #3b4149;font-size:10px}.table-counts{display:grid;grid-template-columns:1fr 1fr;gap:7px}.table-counts label{grid-template-columns:35px 1fr}.context-color{display:grid;grid-template-columns:30px 1fr}.context-color input[type=color]{height:30px;padding:2px}.table-context-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:11px}.table-context-actions button{padding:8px;border:1px solid #454b53;background:#24282e;color:#fff;font:700 9px var(--studio-font);cursor:pointer}.table-context-actions .accent{background:var(--red);border-color:var(--red)}.table-context-note{display:block;margin-top:9px;color:#858d97;line-height:1.4}.table-edit-target{outline:2px solid var(--red)!important;outline-offset:-2px}.table-row>span,.table-row>strong,.wtd-row>span,.wtd-row>strong{cursor:context-menu}
*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:#0f1113;color:var(--text);font-family:var(--body-font);overflow:hidden}button,input,select,textarea{font:inherit}.studio-topbar{height:64px;display:flex;align-items:center;border-bottom:1px solid var(--line);background:#131518;padding:0 18px;gap:24px}.studio-brand{display:flex;align-items:center;gap:11px;min-width:280px}.studio-brand .brand-mark,.sidebar-logo{display:grid;place-items:center;background:var(--red);color:#fff;font-family:var(--studio-font);font-weight:900}.studio-brand .brand-mark{width:34px;height:34px;font-size:21px}.studio-brand div{display:flex;flex-direction:column;line-height:1}.studio-brand strong{font-family:var(--studio-font);font-size:19px;letter-spacing:1px}.studio-brand span:last-child{font-size:10px;color:var(--muted);letter-spacing:1.4px;margin-top:5px}.studio-status{margin-right:auto;display:flex;align-items:center;gap:8px;color:#a9afb6;font-size:12px}.studio-status i,.health i{width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px color-mix(in srgb,var(--amber) 70%,transparent)}.studio-actions{display:flex;gap:7px}.studio-actions button,.workspace-toolbar button,.panel button,.code-actions button{color:#cfd3d8;background:#202329;border:1px solid #373c44;padding:8px 11px;cursor:pointer;border-radius:2px;font-size:11px;font-weight:700;letter-spacing:.35px}.studio-actions button:hover,.workspace-toolbar button:hover,.panel button:hover{border-color:#686f79;color:#fff}.studio-actions .accent,.code-actions .accent{background:var(--red);border-color:var(--red);color:#fff}.studio-shell{height:calc(100vh - 64px);display:grid;grid-template-columns:238px minmax(500px,1fr) 286px}.panel{background:var(--panel);overflow:auto}.component-panel{border-right:1px solid var(--line)}.inspector-panel{border-left:1px solid var(--line)}.panel-heading{position:sticky;top:0;z-index:2;height:43px;background:#171a1e;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 13px;font-family:var(--studio-font);font-size:12px;letter-spacing:1.3px}.panel-heading button{border:0;background:transparent;padding:4px;font-size:18px}.search-field{margin:13px;display:flex;align-items:center;background:#111316;border:1px solid #30353c}.search-field span{padding-left:9px;color:#737a84}.search-field input{width:100%;border:0;background:transparent;color:#fff;padding:9px;outline:0;font-size:12px}.library-section{padding:4px 13px 13px}.library-section h2,.inspector-section h2{font-family:var(--studio-font);font-size:10px;letter-spacing:1.5px;color:#747c86;margin:13px 0 7px}.component-item{width:100%;display:flex;align-items:center;gap:10px!important;margin:4px 0!important;padding:9px!important;text-align:left!important;background:#1e2227!important}.component-item b{display:grid;place-items:center;width:22px;height:22px;background:#2b3037;color:#c4c9cf;font-size:14px}.component-item span{font-size:12px}.library-tip{margin:10px 13px 18px;padding:11px;border-left:2px solid var(--red);background:#131518;color:#858d97;font-size:10px;line-height:1.5}.workspace{display:flex;min-width:0;flex-direction:column;background:#0d0f11}.workspace-toolbar{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#17191d;border-bottom:1px solid var(--line)}.view-tabs,.viewport-controls{display:flex;align-items:center;gap:4px}.workspace-toolbar button{border:0;background:transparent;color:#7f8791;padding:9px}.workspace-toolbar button.active{color:#fff;background:#262a30;border-bottom:2px solid var(--red)}.viewport-controls label{margin-left:8px;color:#7f8791;font-size:10px;display:flex;align-items:center;gap:6px}.viewport-controls input{width:75px;accent-color:var(--red)}.view{display:none;min-height:0;flex:1}.view.active{display:flex}.canvas-stage{flex:1;overflow:auto;padding:24px;background-image:linear-gradient(#171a1e 1px,transparent 1px),linear-gradient(90deg,#171a1e 1px,transparent 1px);background-size:24px 24px}.viewport-frame{width:calc(var(--viewport-width) * var(--zoom));min-width:520px;margin:auto;box-shadow:0 20px 70px #0008}.design-canvas{width:var(--viewport-width);transform:scale(var(--zoom));transform-origin:top left;background:#f1f2f3;color:#16181a;font-family:var(--body-font);min-height:900px}.mock-native-bar{height:46px;background:#14171b;color:#d9dde1;display:flex;align-items:center;gap:16px;padding:0 18px;font-size:12px}.mock-amazon{font-weight:800;color:#fff}.native-search{margin-right:auto;width:330px;background:#272c32;border:1px solid #3a4048;padding:8px 12px;color:#838b95}.app-shell{display:grid;grid-template-columns:74px 1fr;min-height:854px}.app-sidebar{background:#1a1d21;display:flex;flex-direction:column;align-items:center;padding:14px 8px;gap:6px}.sidebar-logo{width:37px;height:37px;margin-bottom:13px}.app-sidebar button{width:56px;min-height:51px;border:0;background:transparent;color:#8e969f;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;font-size:16px;cursor:default}.app-sidebar button span{font-family:var(--studio-font);font-size:9px;text-transform:uppercase;letter-spacing:.6px}.app-sidebar button.active{background:#2a2e34;color:#fff;border-left:3px solid var(--red)}.app-body{padding:26px 30px;background:#f2f3f4;min-width:0}.app-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}.app-header small,.section-title small,.hero-strip small,.metric-grid small{font-family:var(--studio-font);font-weight:700;letter-spacing:1.5px;color:#7b8188}.app-header h1{font-family:var(--studio-font);font-size:32px;line-height:1;margin:5px 0 4px;text-transform:uppercase;letter-spacing:.4px}.app-header p{margin:0;color:#777e86;font-size:12px}.health{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #d8dbde;padding:9px 12px;font-family:var(--studio-font);font-size:10px;font-weight:700;letter-spacing:1px}.drop-zone{display:flex;flex-direction:column;gap:16px}.design-component{position:relative;outline:1px solid transparent;transition:outline-color .12s,box-shadow .12s}.design-component:hover{outline:1px dashed #e44}.design-component.selected{outline:2px solid var(--red);box-shadow:0 0 0 4px #d7192018}.drag-handle{display:none;position:absolute!important;z-index:5!important;top:5px!important;left:-25px!important;width:22px!important;height:32px!important;border:0!important;background:var(--red)!important;color:#fff!important;cursor:grab!important;padding:0!important}.design-component.selected>.drag-handle{display:block}.hero-strip{display:grid;grid-template-columns:180px minmax(160px,1fr) repeat(3,115px);align-items:center;gap:18px;background:#191c20;color:#fff;padding:18px 21px;border-left:4px solid var(--red)}.hero-strip strong{display:block;font-family:var(--studio-font);text-transform:uppercase;font-size:18px;margin-top:4px}.shift-meter{height:5px;background:#343941}.shift-meter span{height:100%;display:block;background:var(--red)}.hero-stat{border-left:1px solid #343941;padding-left:17px}.hero-stat b{display:block;font-family:var(--studio-font);font-size:22px}.hero-stat span{font-size:10px;color:#959ca5}.hero-stat.warning b{color:var(--amber)}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric-grid article{background:#fff;border:1px solid #d9dcdf;padding:17px 18px;min-height:105px}.metric-grid strong{font-family:var(--studio-font);font-size:28px;display:block;margin:8px 0}.metric-grid em{font-style:normal;color:#9ba0a6;font-size:15px}.signal{font-size:10px;font-weight:700}.signal:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:6px}.green:before{background:var(--green)}.amber:before{background:var(--amber)}.red:before{background:var(--danger)}.planner-panel{background:#fff;border:1px solid #d9dcdf;padding:20px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-title h2{font-family:var(--studio-font);text-transform:uppercase;margin:3px 0 0;font-size:21px}.section-title button{background:#fff;border:1px solid #1c1f22;border-radius:0;padding:7px 12px;font-family:var(--studio-font);font-size:10px;font-weight:700}.planner-table{border-top:2px solid #222}.table-row{display:grid;grid-template-columns:2fr repeat(4,1fr);align-items:center;min-height:48px;border-bottom:1px solid #e1e3e5;font-size:12px}.table-row>span:not(:first-child){text-align:center}.table-row span:first-child{padding-left:10px}.table-row b,.table-row small{display:block}.table-row small{color:#8c9299;margin-top:3px}.table-head{min-height:32px;background:#f0f1f2;font-family:var(--studio-font);font-size:9px;font-weight:700;letter-spacing:1px}.pill{justify-self:center;padding:5px 8px;font-family:var(--studio-font);font-size:9px;font-weight:800}.pill.green{background:#e7f7ed;color:#248d50}.pill.amber{background:#fff3dc;color:#a96c09}.selection-summary{padding:15px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:4px}.selection-summary small{font-size:9px;color:#707883;letter-spacing:1.4px}.selection-summary strong{font-family:var(--studio-font);font-size:17px}.selection-summary code{color:#d46d70;font-size:10px}.inspector-section{padding:1px 14px 14px;border-bottom:1px solid var(--line)}.inspector-section label{display:grid;grid-template-columns:82px 1fr;align-items:center;gap:7px;color:#9ca3ac;font-size:10px;margin:7px 0}.inspector-section input,.inspector-section select{width:100%;min-width:0;background:#101215;border:1px solid #343941;color:#ddd;padding:7px;font-size:10px}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}.segmented button{padding:6px}.segmented button.active{border-color:var(--red);color:#fff}.color-input{display:grid;grid-template-columns:28px 1fr}.color-input input[type=color]{padding:2px;height:29px}.row-actions{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:10px}.row-actions .danger{color:#ff8c8c}.code-view{padding:18px;gap:12px;flex-wrap:wrap;background:#101215}.code-column{flex:1;min-width:320px;display:flex;flex-direction:column;gap:7px}.code-column label{font-family:var(--studio-font);font-size:11px;letter-spacing:1.2px;color:#858d97}.code-column textarea{flex:1;resize:none;background:#171a1e;color:#d8dce1;border:1px solid #333941;padding:14px;font-family:Consolas,monospace;font-size:12px;line-height:1.5}.code-actions{width:100%;display:flex;align-items:center;gap:13px}.code-actions span{color:#737b85;font-size:10px}.export-view{padding:35px;flex-direction:column;overflow:auto}.export-view h2{font-family:var(--studio-font);text-transform:uppercase}.export-view p{color:#8b939d}.export-view pre{background:#16191d;border:1px solid #32373f;padding:20px;white-space:pre-wrap;color:#cfd4da;font:11px/1.55 Consolas,monospace}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;background:#111418;border:1px solid #3b4149;border-left:3px solid var(--red);padding:10px 15px;font-size:11px;transition:.2s;pointer-events:none;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:1080px){.studio-shell{grid-template-columns:190px minmax(450px,1fr) 250px}.studio-brand{min-width:200px}.studio-actions button:nth-child(-n+2){display:none}}
.autosave-toggle{display:flex;align-items:center;gap:5px;padding:6px 8px;border:1px solid #373c44;color:#aeb5bd;font-size:10px;font-weight:700;white-space:nowrap}.autosave-toggle input{accent-color:var(--red)}.studio-inner-selected{outline:2px dashed #248fd6!important;outline-offset:2px}.element-align,.content-align{margin-bottom:5px}.quick-remove{width:100%;margin-top:6px!important;background:#5b171b!important;border-color:#a52a31!important;color:#fff!important}.quick-remove:hover{background:#861e24!important}.inspector-wide-action{width:100%;margin:4px 0!important}