:root{color-scheme:dark;--bg:#08070b;--panel:#121016;--panel2:#19141f;--line:#2c2432;--text:#f6f2f7;--muted:#a69da9;--rose:#ff6d8f;--violet:#a78bfa;--cyan:#67d7df;--green:#6ed6a2;--amber:#e9b86c;--shadow:0 18px 60px rgba(0,0,0,.42)}
*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden;background:#08070b;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit}.app-shell{height:100dvh;display:grid;grid-template-rows:56px minmax(0,1fr) 34px}.topbar{display:flex;align-items:center;gap:16px;padding:0 16px;border-bottom:1px solid var(--line);background:rgba(8,7,11,.95);z-index:30}.brand{display:flex;align-items:center;gap:8px;min-width:138px}.brand img{width:108px;height:auto}.brand span{font-size:10px;letter-spacing:.2em;color:#b8afb9}.product-title{display:flex;flex-direction:column;gap:1px;min-width:210px}.product-title b{font-size:14px}.product-title span{font-size:10px;color:var(--muted)}.view-tabs{display:flex;align-items:center;gap:5px}.view-tabs a{font-size:11px;color:#aaa0af;padding:8px 11px;border-radius:9px}.view-tabs a.active,.view-tabs a:hover{color:#fff;background:#1c1721}.rust-badge{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:10px;color:#c7bec9}.rust-badge i{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--green),var(--cyan));box-shadow:0 0 14px rgba(110,214,162,.4)}
.workspace{position:relative;min-height:0;display:grid;grid-template-columns:176px minmax(0,1fr) 300px;gap:10px;padding:10px}.left-rail,.stage-panel,.right-panel{min-height:0;border:1px solid var(--line);background:linear-gradient(180deg,#15111a,#0d0b10);border-radius:14px;box-shadow:var(--shadow)}.left-rail{padding:12px 9px;display:flex;flex-direction:column;overflow:hidden}.rail-title{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#887e8e;padding:7px 9px 10px}.rail-item{display:flex;align-items:center;gap:10px;padding:10px 9px;border:0;background:transparent;width:100%;text-align:left;border-radius:10px;font-size:11px;color:#aaa1af;margin-bottom:3px;cursor:pointer}.rail-item:hover,.rail-item.active{background:#1b1621;color:#fff}.rail-item i{width:10px;height:10px;border-radius:3px}.rose{background:var(--rose)}.violet{background:var(--violet)}.cyan{background:var(--cyan)}.green{background:var(--green)}.amber{background:var(--amber)}.rail-spacer{flex:1}.rail-trust{margin:8px 5px 2px;padding:10px;border:1px solid #302737;border-radius:10px;background:#110e15}.rail-trust b{display:block;font-size:10px}.rail-trust span{display:block;font-size:9px;color:#857b8a;margin-top:3px}
.stage-panel{display:grid;grid-template-rows:48px minmax(0,1fr) 44px;overflow:hidden}.stage-toolbar{display:flex;align-items:center;gap:12px;padding:0 12px;border-bottom:1px solid var(--line);background:#100d14}.stage-toolbar>div:first-child{display:flex;flex-direction:column;gap:1px;min-width:170px}.eyebrow{font-size:8px;letter-spacing:.18em;color:#dd83b2;font-weight:800}.stage-toolbar b{font-size:13px}.stage-actions{margin-left:auto;display:flex;align-items:center;gap:6px}.stage-actions button,.stage-link{border:1px solid #332a3b;background:#18131d;color:#d8d0da;border-radius:8px;padding:6px 9px;font-size:9px;cursor:pointer}.stage-actions button:hover,.stage-link:hover{background:#211927;color:#fff}.toolbar-meta{display:flex;gap:5px}.toolbar-meta span{font-size:8px;color:#aaa1ae;padding:5px 7px;border:1px solid #302737;border-radius:999px;background:#151119}.pixel-stage{position:relative;min-height:0;overflow:hidden;background:#030304;outline:none;transition:background .5s ease}.pixel-stage video,.pixel-stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#030304;z-index:1}.pixel-stage canvas{image-rendering:auto}.pixel-stage[data-stream="pixeld"] #linuxVideo{display:none}.pixel-stage[data-stream="video"] #pixelCanvas{display:none}.media-wait{position:absolute;inset:0;z-index:3;display:grid;place-content:center;text-align:center;gap:9px;background:linear-gradient(135deg,#0b0910,#121019);transition:.2s}.media-wait.hide{opacity:0;pointer-events:none}.media-wait b{font-size:14px}.media-wait span{font-size:10px;color:var(--muted)}.spinner{width:32px;height:32px;border-radius:50%;border:2px solid #392e42;border-top-color:var(--rose);margin:auto;animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.control-surface{position:absolute;inset:0;z-index:4;pointer-events:none;outline:none}.control-surface.enabled{pointer-events:auto;cursor:default}.meet-view .control-surface.enabled{cursor:crosshair}.meet-view .control-surface.enabled:after{content:"REMOTE CONTROL";position:absolute;right:14px;bottom:13px;padding:6px 9px;border:1px solid rgba(255,109,143,.34);border-radius:999px;background:rgba(13,9,13,.8);font-size:8px;letter-spacing:.14em;color:#ff9eb3}.approval-card{position:absolute;z-index:10;left:50%;top:50%;transform:translate(-50%,-50%);width:min(460px,calc(100% - 36px));padding:22px;border-radius:18px;border:1px solid rgba(255,109,143,.38);background:linear-gradient(180deg,rgba(29,19,30,.99),rgba(15,12,18,.99));box-shadow:0 28px 100px rgba(0,0,0,.56)}.approval-card>span{font-size:9px;letter-spacing:.18em;color:var(--rose);font-weight:800}.approval-card>b{display:block;font-size:18px;margin-top:8px}.approval-card p{font-size:12px;line-height:1.55;color:var(--muted)}.approval-card>div{display:flex;justify-content:flex-end;gap:8px}.control-active{position:absolute;z-index:9;left:12px;right:12px;top:12px;display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid rgba(110,214,162,.38);border-radius:10px;background:rgba(9,23,17,.94)}.control-active i{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 14px rgba(110,214,162,.6)}.control-active b{font-size:9px;letter-spacing:.12em;color:#baf0d2}.control-active span{font-size:9px;color:#94bfa8}.control-active button{margin-left:auto}.status-note{position:absolute;z-index:9;left:50%;top:14px;transform:translateX(-50%);padding:8px 12px;border:1px solid #3b3042;border-radius:999px;background:rgba(22,17,26,.94);font-size:10px;color:#d0c8d2}.request-control-fab{position:absolute;z-index:9;left:50%;bottom:18px;transform:translateX(-50%);border:0;border-radius:11px;padding:11px 18px;color:white;font-weight:800;font-size:11px;cursor:pointer;background:linear-gradient(135deg,#ff6d8f,#d84c74);box-shadow:0 14px 40px rgba(255,109,143,.22)}
.runtime-strip{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line);background:#0e0b11}.runtime-strip>div{padding:8px 10px;border-right:1px solid var(--line);min-width:0}.runtime-strip>div:last-child{border:0}.runtime-strip span{display:block;font-size:7px;letter-spacing:.1em;text-transform:uppercase;color:#716a76}.runtime-strip b{display:block;margin-top:3px;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.right-panel{overflow:auto;padding:13px}.side-block{padding:8px 3px 14px;border-bottom:1px solid var(--line);margin-bottom:8px}.side-block:last-child{border:0;margin:0}.side-kicker{display:block;font-size:8px;letter-spacing:.18em;color:#cf7eaa;font-weight:800;margin:5px 0 9px}.kv,.feature-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0}.kv span,.feature-row span{font-size:9px;color:var(--muted)}.kv b,.feature-row b{font-size:9px;text-align:right}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8px!important}.state-granted{color:var(--green)}.state-requested{color:var(--amber)}.state-denied,.state-revoked{color:var(--rose)}.btn{border:1px solid transparent;border-radius:9px;padding:8px 10px;color:#f5f0f6;background:#19141e;font-size:10px;font-weight:700;cursor:pointer}.btn.primary{background:linear-gradient(135deg,#ff6d8f,#d95077)}.btn.ghost{border-color:#342a3c}.btn.tiny{padding:5px 8px;font-size:8px}.btn.wide{width:100%;margin:7px 0}.person{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:8px;padding:8px 0}.person i{width:26px;height:26px;border-radius:9px;background:linear-gradient(135deg,#ff6d8f,#a78bfa)}.person i.p2{background:linear-gradient(135deg,#a78bfa,#67d7df)}.person i.p3{background:linear-gradient(135deg,#67d7df,#6ed6a2)}.person b{display:block;font-size:9px}.person span{display:block;font-size:8px;color:var(--muted);margin-top:2px}.person em{font-style:normal;font-size:7px;border:1px solid #332a3a;border-radius:999px;padding:4px 6px;color:#a99eae}.flow-step{display:grid;grid-template-columns:24px 1fr;gap:8px;align-items:center;padding:7px 0}.flow-step b{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#211927;color:#ff9ab2;font-size:9px}.flow-step span{font-size:9px;color:#b2a8b5}.storage-item{display:flex;align-items:center;gap:8px;padding:8px 0}.storage-item i{width:24px;height:24px;border-radius:8px;background:linear-gradient(135deg,#67d7df,#a78bfa)}.storage-item b{display:block;font-size:9px}.storage-item span{display:block;font-size:8px;color:var(--muted);margin-top:2px}.empty-note,.small-note{font-size:9px;line-height:1.45;color:var(--muted)}.storage-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;margin-top:8px}.storage-form input{min-width:0;border:1px solid #342a3b;border-radius:9px;background:#0f0c13;color:#eee9f0;padding:8px 9px;font-size:9px;outline:none}
.commandbar{display:flex;align-items:center;gap:8px;padding:0 10px;border-top:1px solid var(--line);background:#0d0a10;font-size:8px}.commandbar a{padding:5px 8px;border:1px solid #2e2635;border-radius:7px;color:#c1b8c4}.session-chip{display:flex;align-items:center;gap:6px;min-width:0}.session-chip span{color:#776f7c}.session-chip b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.production-safe{margin-left:auto;color:#8d8492}.production-safe:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:6px}#toast{position:fixed;left:50%;bottom:48px;transform:translate(-50%,12px);opacity:0;pointer-events:none;z-index:100;padding:8px 11px;border-radius:9px;background:#1b1520;border:1px solid #362b3e;font-size:10px;transition:.18s}#toast.show{opacity:1;transform:translate(-50%,0)}
.perf-panel{position:absolute;z-index:20;right:14px;top:14px;width:min(480px,calc(100% - 28px));max-height:calc(100% - 28px);overflow:auto;padding:14px;border:1px solid #3a3042;border-radius:14px;background:rgba(15,12,18,.97);box-shadow:0 24px 80px rgba(0,0,0,.5);transform:translateX(calc(100% + 30px));opacity:0;pointer-events:none;transition:.2s}.perf-open .perf-panel{transform:none;opacity:1;pointer-events:auto}.perf-panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.perf-panel header span{display:block;font-size:8px;letter-spacing:.18em;color:#d47fae}.perf-panel header b{display:block;font-size:13px;margin-top:3px}.perf-panel header button{border:1px solid #342b3c;background:#17121c;color:#ddd5df;border-radius:8px;padding:6px 8px}.perf-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.perf-grid>div{padding:9px;border:1px solid #2d2534;border-radius:10px;background:#110e15}.perf-grid span{display:block;font-size:8px;color:#8f8594}.perf-grid b{display:block;font-size:11px;margin-top:4px}.perf-note{display:flex;flex-direction:column;gap:4px;margin:10px 0;padding:10px;border-left:3px solid var(--cyan);background:#121019}.perf-note b{font-size:10px}.perf-note span{font-size:9px;line-height:1.45;color:var(--muted)}#benchmarkResult{white-space:pre-wrap;font:9px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;color:#c4bbc8;background:#09070b;padding:10px;border-radius:9px;border:1px solid #2a2231}
/* Desktop is pixel-first: no duplicate browser app rail, no approval UI, no footer tax. */
.desktop-view .app-shell{grid-template-rows:54px minmax(0,1fr)}.desktop-view .commandbar{display:none}.desktop-view .workspace{display:block;padding:0}.desktop-view .left-rail{display:none}.desktop-view .stage-panel{height:100%;border:0;border-radius:0;box-shadow:none;grid-template-rows:46px minmax(0,1fr)}.desktop-view .runtime-strip{display:none}.desktop-view .right-panel{position:absolute;z-index:24;right:12px;top:58px;bottom:12px;width:310px;transform:translateX(calc(100% + 28px));opacity:0;pointer-events:none;transition:.2s}.desktop-view.right-open .right-panel{transform:none;opacity:1;pointer-events:auto}.desktop-view .stage-toolbar{background:#0f0c12}.desktop-view .product-title span{display:none}.desktop-view .pixel-stage{background:#020203}
/* Meet keeps collaboration chrome, but both rails can collapse. */
.meet-view.left-open .left-rail{display:flex}.meet-view.right-open .right-panel{display:block}.meet-view:not(.left-open) .workspace{grid-template-columns:minmax(0,1fr) 300px}.meet-view:not(.left-open) .left-rail{display:none}.meet-view:not(.right-open) .workspace{grid-template-columns:176px minmax(0,1fr)}.meet-view:not(.right-open) .right-panel{display:none}.meet-view:not(.left-open):not(.right-open) .workspace{grid-template-columns:minmax(0,1fr)}
@media(max-width:900px){.topbar{gap:9px;padding:0 10px}.brand{min-width:auto}.brand img{width:92px}.brand span,.product-title,.toolbar-meta{display:none}.view-tabs{margin-left:auto}.rust-badge span{display:none}.workspace{display:block;padding:0}.left-rail,.right-panel{position:absolute;z-index:25;top:8px;bottom:8px;width:min(310px,88vw);display:none}.left-rail{left:8px}.right-panel{right:8px}.left-open .left-rail,.right-open .right-panel{display:flex}.right-open .right-panel{display:block}.stage-panel{height:100%;border:0;border-radius:0;grid-template-rows:44px minmax(0,1fr)}.runtime-strip{display:none}.commandbar{display:none}.app-shell{grid-template-rows:52px minmax(0,1fr)}.stage-toolbar>div:first-child{min-width:auto}.stage-actions{gap:4px}.stage-actions button,.stage-link{padding:6px 7px;font-size:8px}.perf-panel{top:8px;right:8px;width:calc(100% - 16px);max-height:calc(100% - 16px)}}

/* v48.2 desktop-first refinement */
html,body{font-size:16px}
.app-shell{grid-template-rows:50px minmax(0,1fr) 28px}
.topbar{gap:12px;padding:0 12px}
.brand{min-width:118px}.brand img{width:96px}.brand span{font-size:11px}
.product-title{min-width:190px}.product-title b{font-size:15px}.product-title span{font-size:11px}
.view-tabs a{font-size:12px;padding:7px 10px}.rust-badge{font-size:11px}
.workspace{gap:0;padding:0;background:#030304}
.desktop-view .stage-panel{border:0;border-radius:0;box-shadow:none}
.desktop-view .workspace{grid-template-columns:minmax(0,1fr)}
.desktop-view .left-rail{display:none}
.desktop-view .right-panel{position:absolute;z-index:25;right:10px;top:10px;bottom:10px;width:min(360px,calc(100vw - 28px));transform:translateX(calc(100% + 22px));transition:transform .18s ease;border-radius:14px}
.desktop-view.right-open .right-panel{transform:translateX(0)}
.stage-panel{grid-template-rows:44px minmax(0,1fr) 30px;border-radius:0}
.stage-toolbar{padding:0 10px;gap:8px}
.stage-toolbar>div:first-child{min-width:150px}.eyebrow{font-size:9px}.stage-toolbar b{font-size:14px}
.stage-actions{gap:5px}.stage-actions button,.stage-link{padding:6px 9px;font-size:11px}
.toolbar-meta span{font-size:9px;padding:4px 6px}
.runtime-strip{min-height:28px;font-size:10px}
.right-panel{font-size:13px}.side-kicker{font-size:10px}.kv span,.kv b,.feature-row b,.feature-row span{font-size:12px}
.small-note{font-size:12px;line-height:1.55}.storage-item b{font-size:12px}.storage-item span{font-size:10px}
.settings-form{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}
.settings-form label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--muted)}
.settings-form select{width:100%;border:1px solid #3a3042;background:#120f16;color:#f5eff6;border-radius:9px;padding:8px;font-size:12px}
.settings-form .wide{grid-column:1/-1}
.perf-panel{width:min(560px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto}
.perf-panel header b{font-size:15px}.perf-grid span{font-size:10px}.perf-grid b{font-size:14px}
@media(max-width:900px){
 .product-title span,.toolbar-meta{display:none}.view-tabs a{font-size:11px}
 .stage-toolbar>div:first-child{min-width:110px}
 .stage-actions button,.stage-link{padding:6px 8px}
}

.stream-choice.active{border-color:rgba(255,109,143,.65)!important;background:rgba(255,109,143,.14)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,109,143,.14)}

/* v49.1 presentation desktop: maximize real desktop canvas */
:root{--chrome:44px;--toolbar:38px;--surface:#0b0c0f;--surface2:#111318;--line2:rgba(255,255,255,.08);--soft-shadow:0 10px 34px rgba(0,0,0,.28)}
.desktop-view .app-shell{grid-template-rows:var(--chrome) minmax(0,1fr)!important;background:#050608}
.desktop-view .topbar{height:var(--chrome);padding:0 10px;gap:8px;border-bottom:1px solid var(--line2);background:rgba(8,9,12,.96);backdrop-filter:blur(14px)}
.desktop-view .brand{min-width:auto;gap:7px}.desktop-view .brand img{width:82px}.desktop-view .brand span{display:none}
.desktop-view .product-title{min-width:0;margin-right:4px}.desktop-view .product-title b{font-size:12px;line-height:1}.desktop-view .view-tabs{gap:2px}.desktop-view .view-tabs a{font-size:10px;padding:5px 8px;border-radius:7px}.desktop-view .rust-badge{font-size:9px;gap:5px}
.desktop-view .workspace{height:100%;padding:0;background:#020304}.desktop-view .stage-panel{height:100%;display:grid;grid-template-rows:var(--toolbar) minmax(0,1fr)!important;overflow:hidden;background:#020304}
.desktop-view .stage-toolbar{min-height:var(--toolbar);padding:0 8px;border-bottom:1px solid var(--line2);background:linear-gradient(180deg,#101217,#0b0d11);gap:7px}.desktop-view .stage-toolbar>div:first-child{min-width:0;display:flex;flex-direction:row;align-items:center;gap:7px}.desktop-view .eyebrow{display:none}.desktop-view .stage-toolbar b{font-size:11px;white-space:nowrap}.desktop-view .toolbar-meta{display:flex;gap:4px;min-width:0}.desktop-view .toolbar-meta span{font-size:8px;padding:3px 5px;border-color:var(--line2);background:#0c0e12;color:#aeb5c0}
.desktop-view .stage-actions{gap:4px;min-width:0}.desktop-view .stage-actions button,.desktop-view .stage-link{height:26px;padding:0 8px;font-size:9px;border-radius:7px;border-color:var(--line2);background:#12151b;color:#d9dee6}.desktop-view .stage-actions button:hover,.desktop-view .stage-link:hover{background:#1b2028}.desktop-view .stream-choice.active{background:rgba(110,214,162,.12)!important;border-color:rgba(110,214,162,.38)!important;box-shadow:none!important;color:#dff7e9!important}
.desktop-view .pixel-stage{background:#000;isolation:isolate}.desktop-view .pixel-stage video,.desktop-view .pixel-stage canvas{background:#000}.desktop-view .right-panel{top:8px;right:8px;bottom:8px;width:min(330px,calc(100vw - 20px));border-radius:11px;border:1px solid var(--line2);background:rgba(14,16,21,.97);box-shadow:0 18px 55px rgba(0,0,0,.46);padding:10px;backdrop-filter:blur(16px)}
.desktop-view .side-block{padding:5px 2px 10px;margin-bottom:5px;border-color:var(--line2)}.desktop-view .side-kicker{font-size:8px;margin:4px 0 6px}.desktop-view .kv,.desktop-view .feature-row{padding:5px 0}.desktop-view .kv span,.desktop-view .feature-row span,.desktop-view .kv b,.desktop-view .feature-row b{font-size:10px}.desktop-view .small-note{font-size:10px;line-height:1.4}.desktop-view .settings-form{gap:6px;margin-top:7px}.desktop-view .settings-form label{font-size:9px;gap:3px}.desktop-view .settings-form select{padding:6px;font-size:10px;border-radius:7px}.desktop-view .btn{padding:6px 8px;font-size:9px;border-radius:7px}.desktop-view .storage-item{padding:5px 0}
.desktop-view .perf-panel{top:8px;right:8px;width:min(460px,calc(100% - 16px));max-height:calc(100% - 16px);padding:10px;border-radius:11px;border-color:var(--line2);background:rgba(13,15,19,.98);box-shadow:0 18px 55px rgba(0,0,0,.46);backdrop-filter:blur(16px)}.desktop-view .perf-panel header{margin-bottom:8px}.desktop-view .perf-panel header span{font-size:7px}.desktop-view .perf-panel header b{font-size:12px}.desktop-view .perf-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.desktop-view .perf-grid>div{padding:7px;border-radius:7px;border-color:var(--line2);background:#0c0e12}.desktop-view .perf-grid span{font-size:7px}.desktop-view .perf-grid b{font-size:10px;margin-top:2px}.desktop-view .perf-note{margin:7px 0;padding:8px}.desktop-view .perf-note b{font-size:9px}.desktop-view .perf-note span{font-size:8px}.desktop-view #benchmarkResult{font-size:8px;line-height:1.4;padding:8px}
.desktop-view .media-wait{background:#06070a}.desktop-view .media-wait b{font-size:12px}.desktop-view .media-wait span{font-size:9px}.desktop-view .control-active{top:8px;left:8px;right:auto;max-width:min(520px,calc(100% - 16px));padding:6px 8px}.desktop-view #toast{bottom:14px}
@media(max-width:1100px){.desktop-view .toolbar-meta{display:none}.desktop-view .product-title{display:none}.desktop-view .brand img{width:76px}.desktop-view .perf-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){:root{--chrome:40px;--toolbar:34px}.desktop-view .topbar{padding:0 6px}.desktop-view .view-tabs a{padding:4px 6px;font-size:9px}.desktop-view .rust-badge span{display:none}.desktop-view .stage-toolbar{padding:0 5px}.desktop-view .stage-toolbar b{display:none}.desktop-view .stage-actions{margin-left:0;width:100%;justify-content:flex-end}.desktop-view .stage-actions button,.desktop-view .stage-link{height:24px;padding:0 6px;font-size:8px}.desktop-view .perf-grid{grid-template-columns:1fr 1fr}}


/* AIOTOR PixelD platform shell */
.desktop-view .app-shell{grid-template-rows:42px minmax(0,1fr)!important;background:#020304}
.desktop-view .topbar{
  height:42px!important;padding:0 12px!important;gap:10px!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
  background:rgba(7,8,11,.97)!important;backdrop-filter:blur(18px)
}
.desktop-view .brand{min-width:auto!important}.desktop-view .brand img{width:78px!important}
.desktop-view .product-title{min-width:154px!important;margin-right:4px!important}
.desktop-view .product-title b{font-size:13px!important;font-weight:700!important;letter-spacing:-.01em}
.desktop-view .product-title span{display:block!important;font-size:8px!important;color:#7f8792!important;letter-spacing:.08em;text-transform:uppercase}
.desktop-view .view-tabs{gap:0!important;flex:1;justify-content:center;min-width:0}
.desktop-view .view-tabs a{
  position:relative;background:transparent!important;color:#8f96a1!important;
  padding:13px 10px 12px!important;border-radius:0!important;font-size:10px!important;font-weight:600
}
.desktop-view .view-tabs a:hover{color:#f3f5f7!important}
.desktop-view .view-tabs a.active{color:#fff!important}
.desktop-view .view-tabs a.active:after{
  content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;border-radius:2px;
  background:linear-gradient(90deg,#ff6d8f,#a78bfa)
}
.desktop-view .view-tabs a[aria-disabled="true"]{opacity:.62;cursor:default}
.desktop-view .rust-badge{font-size:9px!important;color:#aeb6c0!important;white-space:nowrap}
.desktop-view .rust-badge i{width:7px;height:7px;box-shadow:0 0 12px rgba(110,214,162,.45)}

.desktop-view .workspace{position:relative;height:100%;display:block!important;background:#000}
.desktop-view .stage-panel{
  position:relative;height:100%;display:block!important;overflow:hidden!important;
  background:#000;border:0!important;border-radius:0!important;box-shadow:none!important
}
.desktop-view .pixel-stage{position:absolute!important;inset:0!important;background:#000!important}
.desktop-view .pixel-stage video,.desktop-view .pixel-stage canvas{width:100%!important;height:100%!important;object-fit:contain!important}

.desktop-view .stage-toolbar{
  position:absolute!important;z-index:18!important;top:10px!important;left:50%!important;transform:translateX(-50%);
  width:auto!important;min-width:0!important;height:34px!important;min-height:34px!important;
  display:flex!important;align-items:center!important;gap:6px!important;padding:4px 6px!important;
  border:1px solid rgba(255,255,255,.10)!important;border-radius:10px!important;
  background:rgba(11,13,17,.84)!important;backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 10px 34px rgba(0,0,0,.28)!important
}
.desktop-view .stage-toolbar>div:first-child{display:none!important}
.desktop-view .stage-actions{display:flex!important;gap:4px!important;margin:0!important}
.desktop-view .stage-actions button,.desktop-view .stage-link{
  height:24px!important;padding:0 8px!important;border-radius:7px!important;
  border:1px solid transparent!important;background:transparent!important;color:#b7bec8!important;
  font-size:9px!important;font-weight:650!important
}
.desktop-view .stage-actions button:hover,.desktop-view .stage-link:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
.desktop-view .stream-choice.active{
  background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.08)!important;color:#fff!important
}
.desktop-view .toolbar-meta{display:flex!important;gap:4px!important}
.desktop-view .toolbar-meta span{
  border:0!important;background:transparent!important;color:#69717c!important;
  font-size:8px!important;padding:0 3px!important
}
.desktop-view .toolbar-meta span:last-child{display:none}

.desktop-view .right-panel{
  position:absolute!important;z-index:30!important;top:10px!important;right:10px!important;bottom:10px!important;
  width:min(360px,calc(100vw - 20px))!important;padding:12px!important;
  border:1px solid rgba(255,255,255,.09)!important;border-radius:14px!important;
  background:rgba(12,14,19,.96)!important;backdrop-filter:blur(20px)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.48)!important
}
.desktop-view .perf-panel{
  top:10px!important;right:10px!important;border-radius:14px!important;
  border-color:rgba(255,255,255,.09)!important;background:rgba(12,14,19,.97)!important;
  backdrop-filter:blur(20px)!important
}
.desktop-view .media-wait{background:radial-gradient(circle at 50% 45%,#15121a 0,#08090c 38%,#020304 75%)}
.desktop-view .media-wait b{font-size:13px;letter-spacing:.01em}
.desktop-view .media-wait span{font-size:9px;color:#747c87}
.desktop-view .spinner{width:26px;height:26px;border-width:2px}

.desktop-view .runtime-strip,.desktop-view .commandbar,.desktop-view .left-rail{display:none!important}
.desktop-view #toast{bottom:16px!important}

@media(max-width:980px){
  .desktop-view .product-title span{display:none!important}
  .desktop-view .product-title{min-width:auto!important}
  .desktop-view .view-tabs a{padding-left:7px!important;padding-right:7px!important;font-size:9px!important}
}
@media(max-width:760px){
  .desktop-view .product-title{display:none!important}
  .desktop-view .view-tabs a[aria-disabled="true"]{display:none!important}
  .desktop-view .stage-toolbar{top:7px!important;max-width:calc(100vw - 14px)}
  .desktop-view .toolbar-meta{display:none!important}
}


/* Premium PixelD workspace drawer */
.desktop-view .right-panel{
  width:min(390px,calc(100vw - 20px))!important;
  padding:14px!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(14,16,22,.985),rgba(9,11,15,.985))!important
}
.desktop-view .side-kicker{
  display:block;margin:1px 0 10px!important;font-size:8px!important;letter-spacing:.18em!important;
  color:#c487a4!important;font-weight:800!important
}
.app-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.app-grid button{
  min-height:66px;text-align:left;padding:11px;border:1px solid rgba(255,255,255,.075);
  border-radius:12px;background:linear-gradient(180deg,#12151b,#0d1015);color:#eef2f5;cursor:pointer;
  transition:transform .14s ease,border-color .14s ease,background .14s ease
}
.app-grid button:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.16);background:#151922}
.app-grid button:active{transform:none}
.app-grid button b{display:block;font-size:11px;letter-spacing:-.01em}
.app-grid button span{display:block;margin-top:5px;color:#707986;font-size:8px}
.desktop-view .side-block{padding:7px 2px 13px!important;margin-bottom:6px!important}
.desktop-view .feature-row{padding:6px 0!important}
.desktop-view .feature-row b{font-size:10px!important;color:#dfe4e9!important;font-weight:650}
.desktop-view .feature-row span{font-size:9px!important;color:#777f8a!important}

.settings-form.presets{display:block!important}
.preset-group{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:8px 0 10px}
.preset-group>span{grid-column:1/-1;font-size:8px;color:#717985;margin-left:2px}
.preset-group label{display:block!important}
.preset-group input{position:absolute;opacity:0;pointer-events:none}
.preset-group label b{
  display:block;text-align:center;padding:8px 4px;border-radius:8px;border:1px solid rgba(255,255,255,.07);
  background:#0d1015;color:#7d8590;font-size:9px;font-weight:650;cursor:pointer
}
.preset-group label:has(input:checked) b{
  color:#fff;border-color:rgba(255,109,143,.40);
  background:linear-gradient(180deg,rgba(255,109,143,.12),rgba(167,139,250,.07))
}
.desktop-view .storage-form{grid-template-columns:minmax(0,1fr) auto;gap:7px}
.desktop-view .storage-form input{background:#090b0f;border-color:rgba(255,255,255,.08)}
.desktop-view .btn.primary{
  background:linear-gradient(135deg,#ff6d8f,#b85ee0)!important;
  box-shadow:0 7px 22px rgba(220,86,145,.12)
}

/* PixelD true viewport fill */
.desktop-view .product-title{display:none!important}
.desktop-view .topbar{padding-left:10px!important}
.desktop-view .brand{min-width:86px!important}
.desktop-view .brand img{width:80px!important}
.desktop-view .workspace,.desktop-view .stage-panel,.desktop-view .pixel-stage{
  width:100%!important;height:100%!important;max-width:none!important;max-height:none!important
}
.desktop-view .pixel-stage video,
.desktop-view .pixel-stage canvas{
  position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;
  object-fit:fill!important;
  display:block!important
}
.desktop-view .control-surface{position:absolute!important;inset:0!important;width:100%!important;height:100%!important}
.desktop-view .right-panel{max-height:calc(100% - 20px)!important;overflow:auto!important}

/* PixelD brand restore */
.desktop-view .brand{display:flex!important;align-items:center!important;gap:9px!important;min-width:128px!important}
.desktop-view .brand img{width:78px!important;height:auto!important;display:block!important}
.desktop-view .brand-product{
  display:inline-block!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:750!important;
  letter-spacing:-.015em!important;
  color:#f6f7f9!important;
}
.desktop-view .product-title{display:none!important}

/* PixelD single-row header */
.desktop-view .topbar{
  height:46px!important;
  min-height:46px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 10px!important;
}
.desktop-view .view-tabs{
  flex:1 1 auto!important;
  justify-content:center!important;
  min-width:0!important;
}
.desktop-view .top-actions{
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  margin-left:auto!important;
  white-space:nowrap!important;
}
.desktop-view .top-actions button,
.desktop-view .top-actions .stage-link{
  height:28px!important;
  padding:0 8px!important;
  border:1px solid transparent!important;
  border-radius:7px!important;
  background:transparent!important;
  color:#aeb5bf!important;
  font-size:9px!important;
  font-weight:650!important;
  cursor:pointer!important;
}
.desktop-view .top-actions button:hover,
.desktop-view .top-actions .stage-link:hover{
  color:#fff!important;
  background:rgba(255,255,255,.07)!important;
}
.desktop-view .top-actions .stream-choice.active{
  color:#fff!important;
  background:rgba(255,255,255,.09)!important;
  border-color:rgba(255,255,255,.08)!important;
}
.desktop-view .stage-toolbar{
  display:none!important;
  height:0!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:0!important;
  border:0!important;
}
.desktop-view .stage-panel{
  position:relative!important;
  height:100%!important;
  display:block!important;
}
.desktop-view .pixel-stage{
  position:absolute!important;
  inset:0!important;
}
.desktop-view .app-shell{
  grid-template-rows:46px minmax(0,1fr)!important;
}
@media(max-width:1100px){
  .desktop-view .view-tabs a{padding-left:6px!important;padding-right:6px!important}
  .desktop-view .top-actions button{padding:0 6px!important;font-size:8px!important}
  .desktop-view .rust-badge span{display:none!important}
}
@media(max-width:820px){
  .desktop-view .view-tabs a:nth-child(3),
  .desktop-view .view-tabs a:nth-child(4){display:none!important}
  .desktop-view .top-actions .stream-choice{display:none!important}
}

/* PixelD window switcher */
.window-list{display:flex;flex-direction:column;gap:7px}
.window-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px;border:1px solid rgba(255,255,255,.07);border-radius:10px;
  background:#0c0f14
}
.window-item>div:first-child{min-width:0;flex:1}
.window-item b{
  display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:10px;color:#eef2f6;font-weight:650
}
.window-item span{display:block;margin-top:3px;font-size:7px;color:#626b76}
.window-actions{display:flex;gap:3px;flex:0 0 auto}
.window-actions button{
  height:24px;padding:0 6px;border-radius:6px;border:1px solid rgba(255,255,255,.07);
  background:#12161c;color:#8f98a4;font-size:8px;cursor:pointer
}
.window-actions button:hover{background:#1a2028;color:#fff}
.window-actions button[data-window-action="close"]:hover{
  border-color:rgba(255,109,143,.35);color:#ff9bb1;background:rgba(255,109,143,.08)
}
.window-empty{padding:9px;color:#68717c;font-size:9px;border:1px dashed rgba(255,255,255,.07);border-radius:9px}

/* FINAL PixelD surface authority: only the selected desktop surface may render. */
.desktop-view .pixel-stage[data-stream="pixeld"] #pixelCanvas{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  z-index:2!important;
}
.desktop-view .pixel-stage[data-stream="pixeld"] #linuxVideo{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  z-index:1!important;
}
.desktop-view .pixel-stage[data-stream="video"] #linuxVideo{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  z-index:2!important;
}
.desktop-view .pixel-stage[data-stream="video"] #pixelCanvas{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  z-index:1!important;
}

/* FINAL desktop-first product shell */
.desktop-view .view-tabs,
.desktop-view .top-actions,
.desktop-view .desktop-only-actions{
  display:none!important;
}
.desktop-view .topbar{
  height:46px!important;
  min-height:46px!important;
  padding:0 8px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.desktop-view .brand-menu-trigger{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  background:transparent!important;
  padding:0 6px!important;
  margin:0!important;
  height:38px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  color:#f4f6f8!important;
  cursor:pointer!important;
  border-radius:8px!important;
}
.desktop-view .brand-menu-trigger:hover,
.desktop-view.menu-open .brand-menu-trigger{
  background:rgba(255,255,255,.07)!important;
}
.desktop-view .rust-badge{
  margin-left:auto!important;
}
.desktop-view .workspace{
  width:100%!important;
  height:100%!important;
  padding:0!important;
  margin:0!important;
}
.desktop-view .stage-panel,
.desktop-view .pixel-stage{
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
}
.desktop-menu{
  position:fixed;
  z-index:60;
  top:52px;
  left:8px;
  width:min(310px,calc(100vw - 16px));
  max-height:calc(100vh - 60px);
  overflow:auto;
  padding:12px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(11,13,17,.97);
  box-shadow:0 24px 80px rgba(0,0,0,.52);
  backdrop-filter:blur(18px);
  transform:translateX(calc(-100% - 18px));
  opacity:0;
  pointer-events:none;
  transition:transform .18s ease,opacity .18s ease;
}
.desktop-view.menu-open .desktop-menu{
  transform:translateX(0);
  opacity:1;
  pointer-events:auto;
}
.desktop-menu-head{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:4px 4px 12px;
  border-bottom:1px solid rgba(255,255,255,.07);
  margin-bottom:10px;
}
.desktop-menu-head b{font-size:13px}
.desktop-menu-head span{font-size:9px;color:#7e8792}
.desktop-menu section{
  padding:8px 2px 10px;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.desktop-menu section:last-child{border-bottom:0}
.menu-kicker{
  display:block;
  margin:0 4px 7px;
  font-size:8px;
  letter-spacing:.14em;
  color:#747d88;
}
.menu-app-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.menu-app-grid button,
.desktop-menu .menu-row,
.desktop-menu section>a{
  width:100%;
  border:1px solid rgba(255,255,255,.06);
  border-radius:9px;
  background:#10141a;
  color:#d9dfe6;
  min-height:38px;
  padding:8px 9px;
  text-align:left;
  cursor:pointer;
  font-size:10px;
}
.menu-app-grid button:hover,
.desktop-menu .menu-row:hover,
.desktop-menu section>a:hover{
  background:#171c24;
  color:#fff;
}
.menu-app-grid button b{display:block;font-size:10px}
.menu-app-grid button span{display:block;margin-top:2px;font-size:8px;color:#707985}
.desktop-menu section>a{
  display:flex;
  align-items:center;
  margin-bottom:5px;
}
.desktop-menu .menu-row{
  display:block;
  margin-bottom:5px;
}
.desktop-menu .stream-choice.active{
  background:rgba(255,255,255,.09)!important;
  border-color:rgba(255,255,255,.10)!important;
  color:#fff!important;
}
@media(max-width:720px){
  .desktop-menu{top:48px;left:5px;width:calc(100vw - 10px);max-height:calc(100vh - 54px)}
}

/* AIOTOR PixelD Linux boot experience */
.linux-boot{
  position:absolute;
  inset:0;
  z-index:48;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:
    radial-gradient(circle at 22% 18%,rgba(168,95,45,.24),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(116,43,35,.22),transparent 42%),
    linear-gradient(145deg,#1d120e 0%,#100d0d 46%,#08090b 100%);
  color:#f5f7fa;
  transition:opacity .48s ease,transform .48s ease;
  pointer-events:none;
}
.linux-boot.ready{
  opacity:0;
  transform:scale(1.015);
}
.linux-boot-logo{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.linux-boot-logo img{width:88px;height:auto;opacity:.96}
.linux-boot-logo span{font-size:15px;font-weight:650;letter-spacing:.01em}
.linux-boot-kicker{
  margin-top:8px;
  color:#9ba4af;
  font-size:9px;
  letter-spacing:.22em;
}
.linux-boot>b{
  font-size:22px;
  font-weight:600;
  letter-spacing:-.02em;
}
.linux-boot p{
  margin:0;
  max-width:420px;
  text-align:center;
  color:#858f9b;
  font-size:11px;
}
.linux-boot small{
  margin-top:5px;
  color:#c7ccd3;
  font-size:10px;
}
.linux-boot-ring{
  position:relative;
  width:54px;
  height:54px;
  margin-bottom:3px;
}
.linux-boot-ring i{
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.09);
}
.linux-boot-ring i:nth-child(1){
  border-top-color:#d99358;
  animation:pixeldBootSpin 1.15s linear infinite;
}
.linux-boot-ring i:nth-child(2){
  inset:7px;
  border-right-color:#9e6250;
  animation:pixeldBootSpin .9s linear infinite reverse;
}
.linux-boot-ring i:nth-child(3){
  inset:15px;
  border-bottom-color:#d7b07b;
  animation:pixeldBootPulse 1.2s ease-in-out infinite;
}
.linux-boot-progress{
  position:relative;
  width:min(260px,55vw);
  height:3px;
  overflow:hidden;
  border-radius:99px;
  background:rgba(255,255,255,.08);
  margin:3px 0 2px;
}
.linux-boot-progress i{
  position:absolute;
  inset:0 auto 0 0;
  width:42%;
  border-radius:inherit;
  background:linear-gradient(90deg,#8b4b32,#d49359,#b86b4a,#7b382f);
  animation:pixeldBootProgress 1.25s cubic-bezier(.55,.02,.25,1) infinite;
}
@keyframes pixeldBootSpin{to{transform:rotate(360deg)}}
@keyframes pixeldBootPulse{50%{transform:scale(.7);opacity:.38}}
@keyframes pixeldBootProgress{
  0%{transform:translateX(-110%)}
  55%{transform:translateX(105%)}
  100%{transform:translateX(260%)}
}

/* Running-app switcher inside the logo menu */
.menu-window-list{
  display:flex;
  flex-direction:column;
  gap:5px;
  max-height:220px;
  overflow:auto;
}
.menu-window-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) 30px;
  gap:5px;
  align-items:stretch;
}
.menu-window-front{
  min-width:0;
  border:1px solid rgba(255,255,255,.06);
  background:#10141a;
  color:#e5e8ec;
  border-radius:9px;
  padding:7px 9px;
  text-align:left;
  cursor:pointer;
}
.menu-window-front:hover{background:#171d25}
.menu-window-front b{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:10px;
}
.menu-window-front span{
  display:block;
  margin-top:2px;
  color:#707984;
  font-size:8px;
}
.menu-window-close{
  border:1px solid rgba(255,255,255,.06);
  border-radius:9px;
  background:#10141a;
  color:#7f8791;
  cursor:pointer;
}
.menu-window-close:hover{background:#24171c;color:#fff}

.linux-boot-footer{
  position:absolute;
  left:20px;
  right:20px;
  bottom:18px;
  text-align:center;
  color:#68717c;
  font-size:9px;
  letter-spacing:.04em;
}

/* Empty-workspace information: animated ready state, visually continuous with boot. */
.desktop-idle{
  position:absolute;
  z-index:8;
  left:50%;
  top:50%;
  width:min(680px,76vw);
  min-height:320px;
  padding:58px 62px 48px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(210,126,102,.15);
  border-radius:32px;
  transform:translate(-50%,-46%) scale(.985);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  text-align:center;
  color:#f6f0ee;
  background:
    radial-gradient(circle at 50% 28%,rgba(214,92,104,.19),transparent 31%),
    radial-gradient(circle at 22% 82%,rgba(137,54,43,.24),transparent 40%),
    radial-gradient(circle at 82% 76%,rgba(94,25,39,.25),transparent 43%),
    linear-gradient(145deg,rgba(41,18,17,.96),rgba(17,10,12,.97) 50%,rgba(10,9,11,.98));
  box-shadow:
    0 36px 100px rgba(0,0,0,.48),
    0 0 90px rgba(127,31,46,.13),
    inset 0 1px 0 rgba(255,255,255,.04);
  transition:opacity .42s ease,transform .42s ease,visibility .42s;
  isolation:isolate;
}
.desktop-idle::before{
  content:"";
  position:absolute;
  z-index:-2;
  width:520px;
  height:520px;
  left:50%;
  top:50%;
  margin:-260px 0 0 -260px;
  border-radius:50%;
  background:
    conic-gradient(from 20deg,
      transparent 0 12%,
      rgba(216,71,91,.18) 20%,
      transparent 34%,
      rgba(179,87,52,.16) 49%,
      transparent 63%,
      rgba(122,37,64,.22) 80%,
      transparent 100%);
  filter:blur(18px);
  animation:pixeldIdleOrbit 18s linear infinite;
}
.desktop-idle::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:16px;
  border-radius:25px;
  background:
    radial-gradient(ellipse at 50% 42%,rgba(238,126,120,.10),transparent 37%),
    linear-gradient(120deg,transparent 15%,rgba(255,255,255,.022) 46%,transparent 72%);
  opacity:.8;
  animation:pixeldIdleBreath 5.2s ease-in-out infinite;
}
.desktop-view.desktop-ready .desktop-idle.show{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,-50%) scale(1);
}
.desktop-idle-mark{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(6,6,8,.22);
  backdrop-filter:blur(10px);
}
.desktop-idle-mark img{width:96px;height:auto;opacity:.96}
.desktop-idle-mark span{font-size:14px;font-weight:680;color:#f3e9e6}
.desktop-idle>b{
  display:block;
  font-size:28px;
  font-weight:640;
  letter-spacing:-.025em;
  text-shadow:0 3px 28px rgba(0,0,0,.42);
}
.desktop-idle p{
  margin:9px auto 0;
  color:#d3b9b4;
  font-size:13px;
}
.desktop-idle small{
  display:block;
  max-width:500px;
  margin:12px auto 0;
  color:#b9a7a7;
  font-size:10.5px;
  line-height:1.6;
}
.desktop-idle-meta{
  margin-top:20px;
  padding-top:14px;
  width:min(430px,90%);
  border-top:1px solid rgba(255,255,255,.06);
  font-size:9px;
  color:#9b7c7d;
  letter-spacing:.045em;
}
@keyframes pixeldIdleOrbit{to{transform:rotate(360deg)}}
@keyframes pixeldIdleBreath{
  0%,100%{opacity:.58;transform:scale(.985)}
  50%{opacity:1;transform:scale(1.02)}
}
@media (max-width:720px){
  .desktop-idle{width:84vw;min-height:280px;padding:42px 26px 38px;border-radius:26px}
  .desktop-idle>b{font-size:24px}
}

.menu-profile-note{font-size:10px;color:#9ea4ad;padding:4px 8px 8px;line-height:1.4}
.security-panel{z-index:58;display:none}
body.security-open #securityPanel{display:flex}

.control-surface{
  user-select:none!important;
  -webkit-user-select:none!important;
  touch-action:none!important;
  -webkit-user-drag:none!important;
}
.desktop-view.idle-workspace .pixel-stage{
  background:
    radial-gradient(circle at 50% 44%,rgba(125,43,78,.20),transparent 28%),
    radial-gradient(circle at 22% 74%,rgba(119,35,45,.13),transparent 38%),
    radial-gradient(circle at 80% 24%,rgba(67,43,112,.15),transparent 36%),
    linear-gradient(145deg,#09090c 0%,#100a0e 48%,#090811 100%);
}
.desktop-view.idle-workspace .pixel-stage::before{
  content:"";
  position:absolute;
  inset:-25%;
  z-index:0;
  pointer-events:none;
  background:
    conic-gradient(from 30deg at 50% 50%,
      transparent 0 18%,
      rgba(128,38,61,.10) 27%,
      transparent 39%,
      rgba(77,50,130,.09) 53%,
      transparent 68%,
      rgba(151,52,58,.08) 82%,
      transparent 100%);
  filter:blur(48px);
  animation:pixeldStageDrift 24s linear infinite;
}
@keyframes pixeldStageDrift{to{transform:rotate(360deg) scale(1.035)}}

.desktop-view.idle-workspace .desktop-idle{
  width:min(620px,74vw);
  min-height:0;
  padding:34px 42px 30px;
  border:0;
  border-radius:28px;
  background:rgba(8,7,11,.18);
  box-shadow:none;
  backdrop-filter:blur(7px);
}
.desktop-view.idle-workspace .desktop-idle::before{
  width:360px;height:360px;margin:-180px 0 0 -180px;
  opacity:.46;filter:blur(30px);
}
.desktop-view.idle-workspace .desktop-idle::after{
  inset:8px;
  border:1px solid rgba(255,255,255,.025);
  background:radial-gradient(ellipse at 50% 40%,rgba(147,52,87,.07),transparent 55%);
}
.desktop-view.idle-workspace .desktop-idle-mark{
  background:rgba(7,7,10,.28);
  border-color:rgba(178,116,150,.10);
}
.desktop-view.idle-workspace .desktop-idle>b{color:#f2edf3}
.desktop-view.idle-workspace .desktop-idle p{color:#c4b9c8}
.desktop-view.idle-workspace .desktop-idle small{color:#a89fac}
.desktop-view.idle-workspace .desktop-idle-meta{color:#766f7d}

body.relative-input .control-surface.enabled{cursor:none!important}
body.relative-input .pixel-stage{box-shadow:inset 0 0 0 2px rgba(185,78,105,.38)}
[data-pointer-lock].active{border-color:rgba(192,83,117,.46)!important;color:#fff!important;background:rgba(119,31,64,.22)!important}


/* V5018 — desktop consumes the viewport; controls float instead of reserving rows */
.desktop-view .app-shell{
  display:block!important;
  height:100dvh!important;
  width:100vw!important;
  overflow:hidden!important;
}
.desktop-view .topbar{
  position:absolute!important;
  z-index:58!important;
  top:8px!important;
  left:8px!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
.desktop-view .topbar > *{display:none!important}
.desktop-view .topbar .brand-menu-trigger{
  display:none!important;
}
.desktop-view .workspace{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  padding:0!important;
  margin:0!important;
}
.desktop-view .stage-panel{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:#000!important;
}
.desktop-view .stage-toolbar,
.desktop-view .runtime-strip,
.desktop-view .commandbar{
  display:none!important;
}
.desktop-view .pixel-stage{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  background:#000!important;
}
.desktop-view .pixel-stage video,
.desktop-view .pixel-stage canvas{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#000!important;
}
.pixeld-bottom-dock{
  position:absolute;
  z-index:72;
  left:50%;
  bottom:9px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:4px;
  max-width:calc(100% - 18px);
  padding:4px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
  background:rgba(8,10,13,.88);
  box-shadow:0 12px 38px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.pixeld-bottom-dock button{
  height:28px;
  min-width:0;
  padding:0 9px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#cbd1d8;
  font-size:9px;
  font-weight:650;
  cursor:pointer;
  white-space:nowrap;
}
.pixeld-bottom-dock button:hover,
.pixeld-bottom-dock button.active,
.pixeld-bottom-dock .stream-choice.active{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.08);
  color:#fff;
}
.pixeld-bottom-dock .dock-brand{
  display:flex;
  align-items:center;
  gap:6px;
  padding-left:7px;
  padding-right:9px;
}
.pixeld-bottom-dock .dock-brand img{
  width:44px;
  height:auto;
  display:block;
}
.pixeld-bottom-dock .dock-brand span{
  font-size:9px;
}
.desktop-menu{
  top:auto!important;
  left:50%!important;
  bottom:47px!important;
  transform:translate(-50%,16px)!important;
  max-height:min(70vh,620px)!important;
}
.desktop-view.menu-open .desktop-menu{
  transform:translate(-50%,0)!important;
}
.desktop-view .right-panel{
  top:8px!important;
  bottom:48px!important;
}
.desktop-view .perf-panel,
.desktop-view .security-panel{
  top:8px!important;
  bottom:48px!important;
  max-height:calc(100% - 56px)!important;
}
.desktop-view #toast{bottom:52px!important}

@media(max-width:720px){
  .pixeld-bottom-dock{
    bottom:6px;
    gap:2px;
    padding:3px;
    max-width:calc(100% - 10px);
  }
  .pixeld-bottom-dock button{
    height:26px;
    padding:0 6px;
    font-size:8px;
  }
  .pixeld-bottom-dock .dock-brand img{width:38px}
  .pixeld-bottom-dock .dock-brand span{display:none}
  .desktop-menu{
    bottom:40px!important;
    width:calc(100vw - 10px)!important;
  }
}


/* V5019 readiness polish — no card tax on an idle desktop */
.desktop-view.idle-workspace .desktop-idle{
  width:min(520px,70vw)!important;
  padding:18px 24px 58px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.desktop-view.idle-workspace .desktop-idle::before,
.desktop-view.idle-workspace .desktop-idle::after{display:none!important}
.desktop-view.idle-workspace .desktop-idle-mark{
  display:inline-flex!important;
  width:auto!important;
  padding:6px 10px!important;
  border-radius:9px!important;
  background:rgba(8,9,12,.42)!important;
  border:1px solid rgba(255,255,255,.055)!important;
}
.desktop-view.idle-workspace .desktop-idle>b{
  margin-top:12px!important;
  font-size:24px!important;
  letter-spacing:-.025em!important;
}
.desktop-view.idle-workspace .desktop-idle p{
  margin:6px 0 0!important;
  font-size:11px!important;
}
.desktop-view.idle-workspace .desktop-idle small{
  display:none!important;
}
.desktop-view.idle-workspace .desktop-idle-meta{
  margin-top:9px!important;
  font-size:8px!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
}

/* V5020 fullscreen-safe menu */
.desktop-view .pixel-stage > .desktop-menu{
  position:absolute!important;
  z-index:80!important;
  left:50%!important;
  bottom:47px!important;
  top:auto!important;
}
.desktop-view.menu-open .pixel-stage > .desktop-menu{
  pointer-events:auto!important;
}
.pixeld-bottom-dock{pointer-events:auto!important}
.pixeld-bottom-dock button{pointer-events:auto!important;touch-action:manipulation}

.pixeld-policy-select{
  width:100%;height:30px;margin:4px 0 5px;padding:0 9px;
  border:1px solid rgba(255,255,255,.09);border-radius:8px;
  background:rgba(255,255,255,.045);color:#eef1f5;
  font-size:9px;font-weight:650;outline:none
}
.pixeld-policy-select:focus{border-color:rgba(186,62,97,.55)}

.desktop-view .pixel-stage .hold-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  z-index:6!important;
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  background:#000!important;
}
.desktop-view .pixel-stage .hold-frame.active{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
}

/* V5031 Motion presentation: decoded video is never shown directly. */
.desktop-view #linuxVideo{
  display:block!important;
  visibility:hidden!important;
  opacity:0!important;
  z-index:0!important;
  pointer-events:none!important;
}
.desktop-view .pixel-stage .motion-frame{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#030304!important;
  image-rendering:auto;
  pointer-events:none!important;
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  z-index:1!important;
}
.desktop-view .pixel-stage[data-stream="video"] #motionCanvas{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  z-index:3!important;
}
.desktop-view .pixel-stage[data-stream="video"] #pixelCanvas{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}
.desktop-view .pixel-stage[data-stream="pixeld"] #motionCanvas{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}


.auth-modal{
  position:fixed;inset:0;z-index:220;display:none;place-items:center;
  padding:28px;
  background:
    radial-gradient(circle at 19% 24%,rgba(255,255,255,.94),rgba(255,255,255,0) 34%),
    radial-gradient(circle at 76% 76%,rgba(0,110,112,.10),rgba(0,110,112,0) 34%),
    linear-gradient(145deg,#eef1ef 0%,#e5e9e7 48%,#dfe4e1 100%);
  color:#152021;
}
.auth-modal::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.26;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.3),transparent 78%);
}
.auth-modal.open{display:grid}
.auth-modal form{
  position:relative;z-index:1;
  width:min(820px,calc(100vw - 44px));min-height:470px;
  display:grid;grid-template-columns:1.08fr .92fr;overflow:hidden;
  border:1px solid rgba(255,255,255,.82);border-radius:30px;
  background:rgba(246,248,247,.72);
  box-shadow:0 36px 120px rgba(50,67,66,.17),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(26px) saturate(120%);
}
.auth-identity{
  position:relative;display:flex;flex-direction:column;justify-content:space-between;
  padding:42px 42px 36px;
  border-right:1px solid rgba(90,110,108,.10);
  background:
    radial-gradient(circle at 68% 72%,rgba(0,112,113,.14),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.56),rgba(237,242,240,.32));
  overflow:hidden;
}
.auth-identity::after{
  content:"";position:absolute;width:250px;height:250px;right:-72px;bottom:-95px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,91,94,.16),rgba(0,91,94,0) 68%);filter:blur(8px)
}
.pixeld-glass-mark{position:relative;width:255px;height:260px;margin:5px 0 0 4px;filter:drop-shadow(0 14px 22px rgba(32,66,65,.09))}
.pixeld-glass-mark i{position:absolute;display:block;background:linear-gradient(180deg,rgba(255,255,255,.9) 0%,rgba(243,247,245,.76) 63%,rgba(4,97,99,.72) 100%);border:1px solid rgba(255,255,255,.86);box-shadow:inset 0 1px 3px rgba(255,255,255,.9),0 3px 10px rgba(30,64,63,.08)}
.mark-stem{left:12px;top:78px;width:62px;height:148px;border-radius:0 0 28px 28px}
.mark-loop{left:72px;top:24px;width:170px;height:175px;border-radius:0 88px 88px 0;border-left-width:0!important}
.mark-loop::after{content:"";position:absolute;left:0;top:49px;width:113px;height:82px;border-radius:0 45px 45px 0;background:rgba(237,241,239,.86);box-shadow:inset 0 0 0 1px rgba(81,105,102,.08)}
.mark-foot{left:74px;top:148px;width:166px;height:48px;border-radius:24px;background:linear-gradient(90deg,rgba(0,93,95,.78),rgba(255,255,255,.60))}
.auth-kicker,.auth-eyebrow{font-size:10px;letter-spacing:.20em;font-weight:800;color:#55716f}
.auth-product{margin-top:7px;font-size:31px;line-height:1;font-weight:720;letter-spacing:-.04em;color:#142021}
.auth-identity-copy p{margin:8px 0 0;font-size:12px;color:#6d7c79}
.auth-login{display:flex;flex-direction:column;justify-content:center;padding:42px 48px;background:rgba(255,255,255,.40)}
.auth-login h2{font-size:28px;line-height:1.1;margin:12px 0 8px;color:#111b1b;letter-spacing:-.035em}
.auth-login>p{font-size:12px;line-height:1.5;color:#697775;margin:0 0 27px}
.auth-login label{display:block;margin:0 0 15px;font-size:10px;font-weight:700;color:#4c5c5a}
.auth-login label span{display:block;margin-bottom:7px}
.auth-login input{
  display:block;width:100%;height:46px;padding:0 14px;
  border:1px solid rgba(68,92,89,.18);border-radius:12px;
  background:rgba(255,255,255,.72);color:#112020;outline:none;
  font:inherit;font-size:13px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.92);
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.auth-login input:focus{border-color:rgba(0,111,113,.55);background:#fff;box-shadow:0 0 0 4px rgba(0,111,113,.08)}
.auth-error{min-height:19px;margin:-4px 0 8px;font-size:10px;color:#9b2f4d}
.auth-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:3px}
.auth-actions button{height:40px;padding:0 16px;border-radius:11px;border:1px solid rgba(54,77,74,.16);background:rgba(255,255,255,.58);color:#42504e;font-weight:700;font-size:11px;cursor:pointer}
.auth-actions button:hover{background:#fff}
.auth-actions button[type="submit"]{min-width:116px;border-color:#0d6768;background:linear-gradient(180deg,#147b7c,#075b5d);color:white;box-shadow:0 8px 20px rgba(5,86,88,.18)}
.auth-trust{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin-top:18px;font-size:9px;color:#81908d}
.auth-trust i{width:6px;height:6px;border-radius:50%;background:#168487;box-shadow:0 0 0 4px rgba(22,132,135,.09)}
@media(max-width:720px){
  .auth-modal{padding:16px}
  .auth-modal form{grid-template-columns:1fr;width:min(430px,calc(100vw - 24px));min-height:0;border-radius:24px}
  .auth-identity{min-height:190px;padding:24px;border-right:0;border-bottom:1px solid rgba(90,110,108,.10)}
  .pixeld-glass-mark{position:absolute;right:12px;top:3px;transform:scale(.53);transform-origin:top right}
  .auth-identity-copy{margin-top:88px}
  .auth-login{padding:30px 26px 26px}
}

.auth-logo-wrap{
  width:122px;height:122px;display:grid;place-items:center;
  border-radius:28px;
  background:linear-gradient(145deg,rgba(7,73,75,.96),rgba(10,111,113,.84));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 18px 48px rgba(17,82,82,.16),inset 0 1px 0 rgba(255,255,255,.30);
}
.auth-logo{
  width:86px;height:auto;display:block;object-fit:contain;
  filter:drop-shadow(0 5px 12px rgba(0,0,0,.10));
}

.pixeld-glass-mark{display:none!important}

/* PixelD 5040 — blue/silver boot + popup authentication */
.linux-boot{
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.92),rgba(255,255,255,0) 34%),
    radial-gradient(circle at 78% 72%,rgba(54,104,190,.18),rgba(54,104,190,0) 38%),
    linear-gradient(145deg,#eef3f8 0%,#e7edf5 46%,#dce5f0 100%)!important;
  color:#17263a!important;
}
.linux-boot::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.22) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);
  background-size:46px 46px;
  opacity:.30;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.32),transparent 78%);
}
.linux-boot>*{position:relative;z-index:1}
.linux-boot-logo{
  padding:13px 18px;border-radius:18px;
  background:linear-gradient(145deg,rgba(41,76,137,.94),rgba(62,109,188,.84));
  border:1px solid rgba(255,255,255,.76);
  box-shadow:0 16px 46px rgba(53,79,118,.16),inset 0 1px 0 rgba(255,255,255,.30);
}
.linux-boot-logo img{width:88px!important;opacity:1!important}
.linux-boot-logo span{color:#fff;font-size:15px!important;font-weight:690!important}
.linux-boot-kicker{color:#607793!important}
.linux-boot>b{color:#17263a!important}
.linux-boot p{color:#66788d!important}
.linux-boot small{color:#6e7d90!important}
.linux-boot-ring i{border-color:rgba(66,93,132,.13)!important}
.linux-boot-ring i:nth-child(1){border-top-color:#4a78c4!important}
.linux-boot-ring i:nth-child(2){border-right-color:#7498d2!important}
.linux-boot-ring i:nth-child(3){border-bottom-color:#315eaa!important}
.linux-boot-progress{background:rgba(57,84,122,.11)!important}
.linux-boot-progress i{
  background:linear-gradient(90deg,#315ea9,#4f7fc9,#7aa0db,#315ea9)!important;
  box-shadow:0 0 18px rgba(67,112,190,.18);
}
.linux-boot-footer{color:#738296!important}

/* Login is only a modal popup; keep blue/silver language consistent with boot. */
.auth-modal{
  background:
    radial-gradient(circle at 17% 18%,rgba(255,255,255,.95),rgba(255,255,255,0) 34%),
    radial-gradient(circle at 79% 76%,rgba(63,109,188,.16),rgba(63,109,188,0) 36%),
    linear-gradient(145deg,#eef3f8 0%,#e5ecf5 50%,#dbe5f1 100%)!important;
}
.auth-identity{
  background:
    radial-gradient(circle at 68% 72%,rgba(61,108,190,.14),transparent 31%),
    linear-gradient(145deg,rgba(255,255,255,.62),rgba(232,239,248,.40))!important;
}
.auth-logo-wrap{
  background:linear-gradient(145deg,rgba(43,76,136,.97),rgba(62,108,187,.88))!important;
  box-shadow:0 18px 48px rgba(48,75,119,.17),inset 0 1px 0 rgba(255,255,255,.30)!important;
}
.auth-kicker,.auth-eyebrow{color:#607793!important}
.auth-login input:focus{
  border-color:rgba(67,111,187,.60)!important;
  box-shadow:0 0 0 4px rgba(67,111,187,.09)!important;
}
.auth-actions button[type="submit"]{
  border-color:#365f9f!important;
  background:linear-gradient(180deg,#4e7fc9,#315fa8)!important;
  box-shadow:0 8px 20px rgba(49,94,168,.19)!important;
}
.auth-trust i{
  background:#4d7fc9!important;
  box-shadow:0 0 0 4px rgba(77,127,201,.10)!important;
}

/* PixelD 5041 — locked shell is welcome-first, never black. */
.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),rgba(255,255,255,0) 32%),
    radial-gradient(circle at 78% 76%,rgba(59,103,183,.15),rgba(59,103,183,0) 36%),
    linear-gradient(145deg,#eef3f8 0%,#e6edf6 50%,#dce6f1 100%)!important;
}
.desktop-view.auth-locked #pixelCanvas,
.desktop-view.auth-locked #linuxVideo,
.desktop-view.auth-locked #motionCanvas,
.desktop-view.auth-locked #holdCanvas{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}
.desktop-view.auth-locked .desktop-idle{
  z-index:8!important;
  display:flex!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:none!important;
  color:#18283d!important;
  background:
    radial-gradient(circle at 50% 40%,rgba(255,255,255,.72),rgba(255,255,255,0) 34%),
    linear-gradient(145deg,rgba(247,250,253,.54),rgba(225,234,246,.24))!important;
}
.desktop-view.auth-locked .desktop-idle::before,
.desktop-view.auth-locked .desktop-idle::after{opacity:.22!important}
.desktop-view.auth-locked .desktop-idle-mark{
  background:linear-gradient(145deg,rgba(43,76,136,.97),rgba(62,108,187,.88))!important;
  border-color:rgba(255,255,255,.78)!important;
}
.desktop-view.auth-locked .desktop-idle-mark span,
.desktop-view.auth-locked .desktop-idle>b{color:#18283d!important}
.desktop-view.auth-locked .desktop-idle p{color:#65778e!important}
.desktop-view.auth-locked .desktop-idle small,
.desktop-view.auth-locked .desktop-idle-meta{color:#718298!important}

/* PixelD 5043 — auth-locked surfaces must never cover welcome. */
body.desktop-view.auth-locked .pixel-stage[data-stream] #pixelCanvas,
body.desktop-view.auth-locked .pixel-stage[data-stream] #linuxVideo,
body.desktop-view.auth-locked .pixel-stage[data-stream] #motionCanvas,
body.desktop-view.auth-locked .pixel-stage[data-stream] #holdCanvas{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
body.desktop-view.auth-locked .pixel-stage #desktopIdle{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  z-index:20!important;
}

/* PixelD 5045 — aurora product shell inspired by the approved reference.
   Stream pixels remain neutral; this styling applies only to boot/welcome/auth chrome. */
.linux-boot,
.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(ellipse at 8% 8%,rgba(86,112,255,.72) 0%,rgba(86,112,255,0) 34%),
    radial-gradient(ellipse at 32% 14%,rgba(239,146,205,.62) 0%,rgba(239,146,205,0) 36%),
    radial-gradient(ellipse at 70% 4%,rgba(130,224,218,.65) 0%,rgba(130,224,218,0) 38%),
    radial-gradient(ellipse at 84% 46%,rgba(247,225,132,.55) 0%,rgba(247,225,132,0) 36%),
    radial-gradient(ellipse at 38% 72%,rgba(255,174,123,.62) 0%,rgba(255,174,123,0) 40%),
    linear-gradient(145deg,#eef2f7 0%,#e9edf2 46%,#e3e8ee 100%)!important;
  color:#101418!important;
}
.linux-boot::after,
.desktop-view.auth-locked .pixel-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:radial-gradient(rgba(255,255,255,.34) .7px,transparent .9px);
  background-size:4px 4px;opacity:.18;mix-blend-mode:soft-light;
}
.linux-boot>*,
.desktop-view.auth-locked .pixel-stage>*{position:relative;z-index:1}

.linux-boot-logo{
  display:flex!important;align-items:center!important;gap:10px!important;
  padding:11px 16px!important;border-radius:18px!important;
  background:rgba(8,10,14,.90)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  box-shadow:0 18px 48px rgba(10,14,22,.18),inset 0 1px 0 rgba(255,255,255,.10)!important;
  backdrop-filter:blur(18px) saturate(120%)!important;
}
.linux-boot-logo img{width:84px!important;height:auto!important}
.linux-boot-logo span{
  color:#fff!important;font-size:15px!important;font-weight:780!important;
  letter-spacing:-.025em!important;line-height:1!important;
}
.linux-boot-kicker{color:#566274!important;font-weight:780!important}
.linux-boot>b{color:#11161d!important;font-weight:720!important;letter-spacing:-.025em!important}
.linux-boot p{color:#5f6977!important}
.linux-boot small,.linux-boot-footer{color:#707a86!important}
.linux-boot-progress{background:rgba(12,17,25,.10)!important}
.linux-boot-progress i{
  background:linear-gradient(90deg,#5b6fe9,#c871cf,#f39a6d,#72cfd3,#5b6fe9)!important;
  box-shadow:0 0 20px rgba(91,111,233,.22)!important;
}
.linux-boot-ring i{border-color:rgba(13,18,28,.10)!important}
.linux-boot-ring i:nth-child(1){border-top-color:#596fea!important}
.linux-boot-ring i:nth-child(2){border-right-color:#cf75c3!important}
.linux-boot-ring i:nth-child(3){border-bottom-color:#5cc8ce!important}

/* Welcome authority while locked: no black canvas. */
body.desktop-view.auth-locked .pixel-stage #desktopIdle{
  color:#11161d!important;
  background:rgba(248,250,252,.22)!important;
  backdrop-filter:blur(3px) saturate(110%)!important;
}
body.desktop-view.auth-locked .desktop-idle-mark{
  display:flex!important;align-items:center!important;gap:10px!important;
  padding:11px 15px!important;border-radius:18px!important;
  background:rgba(8,10,14,.90)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 16px 42px rgba(9,13,20,.16)!important;
}
body.desktop-view.auth-locked .desktop-idle-mark img{width:82px!important}
body.desktop-view.auth-locked .desktop-idle-mark span{
  color:#fff!important;font-size:15px!important;font-weight:780!important;letter-spacing:-.025em!important;
}
body.desktop-view.auth-locked .desktop-idle>b{color:#11161d!important;font-weight:720!important}
body.desktop-view.auth-locked .desktop-idle p{color:#596574!important}
body.desktop-view.auth-locked .desktop-idle small,
body.desktop-view.auth-locked .desktop-idle-meta{color:#6b7787!important}

/* Bottom dock remains the constant PixelD control surface. */
.pixeld-bottom-dock{
  background:rgba(6,8,12,.92)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 14px 42px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.07)!important;
  backdrop-filter:blur(22px) saturate(120%)!important;
}
.pixeld-bottom-dock .dock-brand span{
  color:#f8fafc!important;font-weight:780!important;letter-spacing:-.025em!important;
}
.pixeld-bottom-dock button{color:#cbd1da!important;font-weight:680!important}
.pixeld-bottom-dock button.active,
.pixeld-bottom-dock .stream-choice.active{
  background:rgba(255,255,255,.13)!important;color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)!important;
}

/* Login remains popup-only: compact dark glass card over the aurora shell. */
.auth-modal{
  background:rgba(232,237,244,.46)!important;
  backdrop-filter:blur(14px) saturate(115%)!important;
}
.auth-modal form{
  width:min(720px,calc(100vw - 36px))!important;min-height:390px!important;
  grid-template-columns:.95fr 1.05fr!important;
  border-radius:28px!important;
  background:rgba(12,14,19,.94)!important;
  border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 34px 110px rgba(13,17,25,.28),inset 0 1px 0 rgba(255,255,255,.08)!important;
  color:#f7f9fc!important;
}
.auth-identity{
  background:
    radial-gradient(circle at 30% 25%,rgba(100,124,239,.25),transparent 35%),
    radial-gradient(circle at 75% 70%,rgba(204,111,193,.20),transparent 37%),
    linear-gradient(155deg,rgba(24,28,38,.95),rgba(12,14,19,.92))!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
}
.auth-logo-wrap{
  width:116px!important;height:116px!important;border-radius:26px!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.auth-logo{width:82px!important}
.auth-kicker,.auth-eyebrow{color:#9aa8be!important}
.auth-product{color:#fff!important;font-weight:780!important;letter-spacing:-.035em!important}
.auth-identity-copy p,.auth-login>p{color:#9ba6b6!important}
.auth-login{background:rgba(8,10,14,.34)!important}
.auth-login h2{color:#fff!important}
.auth-login label{color:#bdc6d2!important}
.auth-login input{
  background:rgba(255,255,255,.07)!important;
  color:#fff!important;border-color:rgba(255,255,255,.12)!important;
}
.auth-login input:focus{
  background:rgba(255,255,255,.10)!important;
  border-color:rgba(111,137,240,.66)!important;
  box-shadow:0 0 0 4px rgba(111,137,240,.10)!important;
}
.auth-actions button{background:rgba(255,255,255,.07)!important;color:#dce2ea!important;border-color:rgba(255,255,255,.11)!important}
.auth-actions button[type="submit"]{
  background:linear-gradient(90deg,#586fe3,#8b69dc)!important;
  border-color:rgba(127,113,231,.75)!important;color:#fff!important;
  box-shadow:0 9px 22px rgba(91,111,227,.22)!important;
}
.auth-trust{color:#8691a0!important}.auth-trust i{background:#6f86ef!important}
@media(max-width:720px){
  .auth-modal form{grid-template-columns:1fr!important}
  .auth-identity{min-height:160px!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
}

/* PixelD 5046 — readable 4K typography authority. */
html,body{font-size:18px!important}

.linux-boot-logo span{font-size:18px!important}
.linux-boot-kicker{font-size:12px!important}
.linux-boot>b{font-size:30px!important;line-height:1.14!important}
.linux-boot p{font-size:15px!important;line-height:1.5!important}
.linux-boot small{font-size:13px!important;line-height:1.5!important}
.linux-boot-footer{font-size:12px!important}

.desktop-idle-mark span,
body.desktop-view.auth-locked .desktop-idle-mark span{font-size:18px!important}
.desktop-idle>b,
body.desktop-view.auth-locked .desktop-idle>b{font-size:32px!important;line-height:1.16!important}
.desktop-idle p,
body.desktop-view.auth-locked .desktop-idle p{font-size:16px!important;line-height:1.5!important}
.desktop-idle small,
body.desktop-view.auth-locked .desktop-idle small{font-size:13px!important;line-height:1.55!important}
.desktop-idle-meta,
body.desktop-view.auth-locked .desktop-idle-meta{font-size:12px!important}

.pixeld-bottom-dock{min-height:46px!important;padding:5px 7px!important;gap:3px!important}
.pixeld-bottom-dock button{font-size:12px!important;padding:0 12px!important;min-height:36px!important}
.pixeld-bottom-dock .dock-brand span{font-size:12px!important}
.pixeld-bottom-dock .dock-brand img{width:48px!important}

.desktop-menu{font-size:14px!important}
.desktop-menu-head b{font-size:17px!important}
.desktop-menu-head span{font-size:12px!important}
.desktop-menu-section>span,.menu-profile-note{font-size:12px!important}
.menu-app-grid button b{font-size:13px!important}
.menu-app-grid button span{font-size:11px!important}
.preset-group>span{font-size:11px!important}
.preset-group button{font-size:12px!important}
.window-item b{font-size:13px!important}
.window-item span,.window-empty{font-size:11px!important}

.desktop-view .perf-panel header span{font-size:10px!important}
.desktop-view .perf-panel header b{font-size:16px!important}
.desktop-view .perf-grid span{font-size:10px!important}
.desktop-view .perf-grid b{font-size:13px!important}
.desktop-view .perf-note b{font-size:12px!important}
.desktop-view .perf-note span{font-size:11px!important;line-height:1.5!important}
.desktop-view #benchmarkResult{font-size:11px!important;line-height:1.5!important}
.desktop-view .kv span,.desktop-view .feature-row span,
.desktop-view .kv b,.desktop-view .feature-row b{font-size:12px!important}
.desktop-view .small-note{font-size:12px!important;line-height:1.5!important}
.desktop-view .settings-form label{font-size:11px!important}
.desktop-view .settings-form select{font-size:12px!important}
.desktop-view .btn{font-size:11px!important}

.auth-kicker,.auth-eyebrow{font-size:12px!important}
.auth-product{font-size:36px!important}
.auth-identity-copy p{font-size:14px!important}
.auth-login h2{font-size:32px!important}
.auth-login>p{font-size:14px!important}
.auth-login label{font-size:12px!important}
.auth-login input{font-size:15px!important;height:48px!important}
.auth-error{font-size:12px!important}
.auth-actions button{font-size:13px!important;height:42px!important}
.auth-trust{font-size:11px!important}

#toast{font-size:12px!important}

@media(max-width:720px){
  .pixeld-bottom-dock button{font-size:11px!important;padding:0 9px!important}
  .pixeld-bottom-dock .dock-brand span{display:none!important}
  .auth-login h2{font-size:28px!important}
  .desktop-idle>b{font-size:28px!important}
}
/* PixelD 5047 — unified single boot + production shell. */
.desktop-view .app-shell,
.desktop-view .workspace,
.desktop-view .stage-panel,
.desktop-view .pixel-stage{
  width:100%!important;
  max-width:none!important;
}
.desktop-view .pixel-stage{inset:0!important}

/* One boot experience only. The same background remains after boot; no second welcome card. */
body.desktop-view.auth-locked .desktop-idle{display:none!important}
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(ellipse at 8% 8%,rgba(86,112,255,.72) 0%,rgba(86,112,255,0) 34%),
    radial-gradient(ellipse at 32% 14%,rgba(239,146,205,.62) 0%,rgba(239,146,205,0) 36%),
    radial-gradient(ellipse at 70% 4%,rgba(130,224,218,.65) 0%,rgba(130,224,218,0) 38%),
    radial-gradient(ellipse at 84% 46%,rgba(247,225,132,.55) 0%,rgba(247,225,132,0) 36%),
    radial-gradient(ellipse at 38% 72%,rgba(255,174,123,.62) 0%,rgba(255,174,123,0) 40%),
    linear-gradient(145deg,#eef2f7 0%,#e9edf2 46%,#e3e8ee 100%)!important;
}
body.desktop-view.auth-locked .pixel-stage::before{
  content:"AIOTOR  PixelD";
  position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);
  z-index:2;color:rgba(18,23,32,.42);font-size:28px;font-weight:780;letter-spacing:-.035em;
  pointer-events:none;white-space:nowrap;
}
body.desktop-view.auth-locked .pixel-stage::after{
  content:"Select Apps or a protected control to unlock your workspace";
  position:absolute;left:50%;top:calc(48% + 38px);transform:translateX(-50%);
  z-index:2;color:rgba(38,47,61,.58);font-size:13px;font-weight:600;
  pointer-events:none;white-space:nowrap;
}

/* Session controls appear only while authenticated. */
.session-signout,.session-timeout-note{display:block!important}
body.auth-locked .session-signout,
body.auth-locked .session-timeout-note{display:none!important}
.session-signout{color:#ffc4cf!important;border-color:rgba(255,112,139,.20)!important}
.session-signout:hover{background:rgba(255,83,118,.10)!important;color:#fff!important}

/* Overlays never reserve desktop width. */
.desktop-view .right-panel{
  width:min(420px,calc(100vw - 28px))!important;
  position:absolute!important;
}
.settings-form .preset-group label b{font-size:13px!important}
.settings-form .small-note{font-size:12px!important}
/* PixelD 5048 — single dark boot/locked shell matching authentication. */
.linux-boot,
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 16% 20%,rgba(76,94,170,.22) 0%,rgba(76,94,170,0) 34%),
    radial-gradient(circle at 80% 70%,rgba(116,70,135,.18) 0%,rgba(116,70,135,0) 36%),
    linear-gradient(145deg,#161a25 0%,#11151d 48%,#0f1318 100%)!important;
  color:#f5f7fb!important;
}
.linux-boot::before,
body.desktop-view.auth-locked .pixel-stage::before{
  content:""!important;
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);
  background-size:44px 44px;
  opacity:.45;
}
body.desktop-view.auth-locked .pixel-stage::after{content:none!important}

/* Single boot composition. */
.linux-boot-logo{
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 18px 54px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.08)!important;
  backdrop-filter:blur(18px)!important;
}
.linux-boot-logo span{color:#fff!important}
.linux-boot-kicker{color:#a9b4c8!important}
.linux-boot>b{color:#fff!important}
.linux-boot p{color:#aeb8c7!important}
.linux-boot small,.linux-boot-footer{color:#818c9d!important}
.linux-boot-progress{background:rgba(255,255,255,.07)!important}
.linux-boot-progress i{
  background:linear-gradient(90deg,#6078ee,#816de3,#b06eb9,#6078ee)!important;
  box-shadow:0 0 20px rgba(100,118,235,.22)!important;
}
.linux-boot-ring i{border-color:rgba(255,255,255,.08)!important}
.linux-boot-ring i:nth-child(1){border-top-color:#667dee!important}
.linux-boot-ring i:nth-child(2){border-right-color:#8a74e7!important}
.linux-boot-ring i:nth-child(3){border-bottom-color:#aa71bf!important}

/* Remove every legacy post-boot welcome/idle presentation. */
.desktop-idle,#desktopIdle{display:none!important}

/* PixelD control plane stays pinned at the bottom; no duplicate loose Apps pill. */
body.desktop-view .pixeld-bottom-dock{
  left:50%!important;right:auto!important;bottom:14px!important;
  transform:translateX(-50%)!important;
  width:auto!important;max-width:calc(100vw - 28px)!important;
}
body.desktop-view .apps-tab,
body.desktop-view [data-apps-tab]{display:none!important}

/* App/Desktop area always consumes the whole viewport. */
body.desktop-view .app-shell,
body.desktop-view .workspace,
body.desktop-view .stage-panel,
body.desktop-view .pixel-stage{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;
}
/* PixelD 5050 — unified command panels + Rust-rendered welcome story. */
:root{
  --pd-bg:#111318;
  --pd-panel:#14171d;
  --pd-panel-2:#191c23;
  --pd-border:rgba(255,255,255,.11);
  --pd-text:#f6f7fa;
  --pd-muted:#9da6b5;
  --pd-maroon:#7d2948;
  --pd-maroon-2:#a34b69;
  --pd-violet:#7569c8;
}

/* Boot and locked shell are one product family. */
.linux-boot,
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 18% 20%,rgba(125,41,72,.25),transparent 34%),
    radial-gradient(circle at 78% 70%,rgba(98,79,154,.20),transparent 36%),
    linear-gradient(145deg,#181b22 0%,#111318 52%,#0d0f13 100%)!important;
}
.linux-boot-logo{
  background:rgba(255,255,255,.045)!important;
  border:1px solid var(--pd-border)!important;
}
.linux-boot-progress i{
  background:linear-gradient(90deg,var(--pd-maroon),var(--pd-maroon-2),var(--pd-violet),var(--pd-maroon))!important;
}
.linux-boot-ring i:nth-child(1){border-top-color:var(--pd-maroon-2)!important}
.linux-boot-ring i:nth-child(2){border-right-color:var(--pd-violet)!important}
.linux-boot-ring i:nth-child(3){border-bottom-color:#bd6882!important}

/* Rust-rendered locked welcome: content only, no second card. */
.locked-marketing{display:none}
body.desktop-view.auth-locked.desktop-ready .locked-marketing{
  position:absolute;inset:0;z-index:3;
  display:grid;grid-template-columns:minmax(300px,520px) minmax(320px,540px);
  gap:clamp(38px,6vw,100px);align-content:center;justify-content:center;
  padding:72px 7vw 120px;
  color:var(--pd-text);pointer-events:none;
}
.locked-marketing-brand{
  grid-column:1 / -1;display:flex;align-items:center;gap:11px;
  width:max-content;padding:9px 13px;border-radius:13px;
  background:rgba(255,255,255,.05);border:1px solid var(--pd-border);
}
.locked-marketing-brand img{width:72px;height:auto}
.locked-marketing-brand span{font-size:17px;font-weight:800;letter-spacing:-.035em}
.locked-marketing-copy{align-self:center;max-width:520px}
.locked-kicker{font-size:11px;font-weight:800;letter-spacing:.18em;color:#c9899f}
.locked-marketing-copy h1{
  margin:13px 0 15px;font-size:clamp(30px,3vw,47px);line-height:1.04;
  letter-spacing:-.045em;max-width:520px;color:#fff;
}
.locked-marketing-copy p{margin:0;color:#aab2bf;font-size:15px;line-height:1.6;max-width:500px}

.usecase-rotator{
  position:relative;align-self:center;height:210px;
  border-left:1px solid rgba(255,255,255,.10);padding-left:34px;
}
.usecase-rotator article{
  position:absolute;left:34px;right:0;top:50%;transform:translateY(-42%);
  opacity:0;animation:pdUsecaseCycle 25s infinite;
}
.usecase-rotator article:nth-child(2){animation-delay:5s}
.usecase-rotator article:nth-child(3){animation-delay:10s}
.usecase-rotator article:nth-child(4){animation-delay:15s}
.usecase-rotator article:nth-child(5){animation-delay:20s}
.usecase-rotator b{display:block;color:#fff;font-size:26px;line-height:1.1;letter-spacing:-.035em;margin-bottom:12px}
.usecase-rotator span{display:block;color:#a9b1bd;font-size:14px;line-height:1.58;max-width:460px}
@keyframes pdUsecaseCycle{
  0%{opacity:0;transform:translateY(-34%) translateX(12px)}
  5%,17%{opacity:1;transform:translateY(-50%) translateX(0)}
  20%,100%{opacity:0;transform:translateY(-62%) translateX(-9px)}
}
.locked-marketing-cta{
  grid-column:1 / -1;display:flex;align-items:center;gap:10px;
  color:#aeb6c2;font-size:12px;font-weight:700;letter-spacing:.02em;
}
.locked-marketing-cta i{width:42px;height:2px;background:linear-gradient(90deg,var(--pd-maroon-2),transparent)}

body:not(.auth-locked) .locked-marketing{display:none!important}

/* Shared command-panel geometry. */
.desktop-menu.command-panel{
  position:fixed!important;
  left:50%!important;bottom:72px!important;top:auto!important;
  transform:translateX(-50%) translateY(10px)!important;
  width:min(920px,calc(100vw - 32px))!important;
  max-height:min(72vh,680px)!important;
  grid-template-columns:280px minmax(0,1fr)!important;
  overflow:hidden!important;
  padding:0!important;
  border-radius:24px!important;
  background:rgba(16,18,23,.965)!important;
  border:1px solid var(--pd-border)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(22px) saturate(115%)!important;
}
.desktop-view.menu-open .desktop-menu.command-panel{
  display:grid!important;opacity:1!important;pointer-events:auto!important;
  transform:translateX(-50%) translateY(0)!important;
}
.command-panel-identity{
  display:flex!important;flex-direction:column!important;align-items:flex-start!important;
  padding:30px!important;margin:0!important;border:0!important;
  background:
    radial-gradient(circle at 30% 25%,rgba(125,41,72,.24),transparent 36%),
    linear-gradient(155deg,#1b1d25,#13151a)!important;
  border-right:1px solid var(--pd-border)!important;
}
.command-brand{display:flex;align-items:center;gap:10px;margin-bottom:32px}
.command-brand img{width:76px;height:auto}
.command-brand span{font-size:18px;font-weight:800;letter-spacing:-.04em;color:#fff}
.command-panel-identity h3{font-size:25px;line-height:1.1;margin:12px 0;color:#fff;letter-spacing:-.04em}
.command-panel-identity p{font-size:13px;line-height:1.55;color:#9fa8b6;margin:0 0 24px}
.command-package-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto}
.command-package-chips span{
  padding:6px 8px;border-radius:7px;background:rgba(125,41,72,.13);
  border:1px solid rgba(181,82,113,.20);font-size:10px;color:#d6a2b3;font-weight:700;
}
.command-panel-options{
  display:grid;grid-template-columns:1fr 1fr;align-content:start;
  overflow:auto;max-height:min(72vh,680px);padding:18px;
  background:rgba(15,17,21,.80);
}
.command-panel-options>section{
  min-width:0;margin:0!important;padding:14px!important;
  border-bottom:1px solid rgba(255,255,255,.06)!important;
}
.command-panel-options>section:nth-child(odd){border-right:1px solid rgba(255,255,255,.06)}
.command-panel-options .menu-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.command-panel-options .menu-row,
.command-panel-options section>a{
  min-height:38px!important;font-size:12px!important;
}

/* Authentication is now a menu-sized panel, never a page overlay. */
.auth-modal{
  position:fixed!important;inset:auto!important;
  left:50%!important;bottom:72px!important;transform:translateX(-50%)!important;
  z-index:230!important;width:min(760px,calc(100vw - 32px))!important;
  height:auto!important;padding:0!important;background:transparent!important;
  backdrop-filter:none!important;display:none!important;
}
.auth-modal::before{display:none!important}
.auth-modal.open{display:block!important}
.auth-modal form{
  width:100%!important;min-height:0!important;max-height:min(72vh,580px)!important;
  grid-template-columns:260px minmax(0,1fr)!important;
  border-radius:24px!important;overflow:hidden!important;
  background:rgba(16,18,23,.97)!important;border:1px solid var(--pd-border)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.auth-identity{padding:28px!important}
.auth-logo-wrap{width:98px!important;height:98px!important}
.auth-logo{width:72px!important}
.auth-product{font-size:31px!important}
.auth-login{padding:30px 34px!important;justify-content:center!important}
.auth-login h2{font-size:29px!important;margin-top:9px!important}
.auth-login>p{margin-bottom:20px!important}
.auth-actions{margin-top:4px!important}

/* Maroon accent across shared UI. */
.auth-actions button[type="submit"],
.desktop-menu .stream-choice.active{
  background:linear-gradient(90deg,#7d2948,#9f4765)!important;
  border-color:#9f4765!important;
}
.auth-login input:focus{border-color:#a44a69!important;box-shadow:0 0 0 4px rgba(125,41,72,.16)!important}
.auth-trust i{background:#a54b69!important}
.pixeld-bottom-dock button.active,
.pixeld-bottom-dock .stream-choice.active{
  background:rgba(125,41,72,.26)!important;
  box-shadow:inset 0 0 0 1px rgba(180,82,112,.24)!important;
}

@media(max-width:760px){
  body.desktop-view.auth-locked.desktop-ready .locked-marketing{
    grid-template-columns:1fr;padding:52px 26px 104px;gap:26px;
  }
  .locked-marketing-brand{grid-column:1}
  .usecase-rotator{height:170px;border-left:0;border-top:1px solid rgba(255,255,255,.10);padding:22px 0 0}
  .usecase-rotator article{left:0;top:58%}
  .locked-marketing-cta{grid-column:1}
  .desktop-menu.command-panel{grid-template-columns:1fr!important;width:calc(100vw - 20px)!important}
  .command-panel-identity{display:none!important}
  .command-panel-options{grid-template-columns:1fr!important}
  .command-panel-options>section:nth-child(odd){border-right:0}
  .auth-modal{width:calc(100vw - 20px)!important;bottom:66px!important}
  .auth-modal form{grid-template-columns:1fr!important}
  .auth-identity{display:none!important}
}
/* PixelD 5051 — Rust-authoritative welcome story + state-aware dock. */
body.auth-locked .dock-auth-only{display:none!important}
body:not(.auth-locked) .dock-locked-only{display:none!important}
.pixeld-bottom-dock .dock-link{
  display:flex;align-items:center;justify-content:center;
  min-height:36px;padding:0 12px;border-radius:10px;
  color:#cbd1da;text-decoration:none;font-size:12px;font-weight:680;
}
.pixeld-bottom-dock .dock-link:hover{background:rgba(255,255,255,.08);color:#fff}

body.desktop-view.auth-locked.desktop-ready .locked-marketing{
  grid-template-columns:minmax(320px,520px) minmax(480px,700px)!important;
  grid-template-rows:auto auto auto!important;
  gap:28px clamp(42px,6vw,92px)!important;
  padding:58px 6vw 102px!important;
  pointer-events:auto!important;
}
.locked-marketing-copy{grid-column:1;grid-row:2}
.locked-promises{
  grid-column:1;grid-row:3;
  display:grid;grid-template-columns:1fr;gap:8px;
}
.locked-promises>span{
  display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:start;
  padding:10px 0;border-top:1px solid rgba(255,255,255,.07);
}
.locked-promises b{font-size:12px;color:#f5f6f9}
.locked-promises small{font-size:11px;line-height:1.45;color:#8f99a8}

.pixeld-story{
  grid-column:2;grid-row:2 / span 2;align-self:center;
  min-height:390px;padding:20px;border-radius:20px;
  background:rgba(18,20,26,.76);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 26px 70px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter:blur(16px);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease;
}
.pixeld-story-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:13px}
.pixeld-story-head>div{display:flex;flex-direction:column;gap:3px}
.pixeld-story-head span{font-size:9px;letter-spacing:.16em;font-weight:800;color:#b16d86}
.pixeld-story-head b{font-size:13px;color:#f4f5f8}
.pixeld-story-head>em{font-style:normal;font-size:10px;color:#8f9bad}
.pixeld-story-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.pixeld-story-tabs button{
  border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(255,255,255,.035);
  color:#9fa8b6;font-size:10px;font-weight:700;padding:7px 9px;cursor:pointer;
}
.pixeld-story-tabs button.active{
  color:#fff;background:rgba(125,41,72,.28);border-color:rgba(179,78,111,.34);
}
.pixeld-story-stage{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:18px}
.pixeld-story-active{
  min-height:230px;padding:18px;border-radius:14px;background:rgba(255,255,255,.028);
  border:1px solid rgba(255,255,255,.06);
}
.pixeld-story-labels{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.pixeld-story-labels span{font-size:9px;letter-spacing:.15em;font-weight:800;color:#c07a91}
.pixeld-story-labels em{font-style:normal;font-size:9px;color:#8e9baa}
.pixeld-story-active h3{margin:0 0 9px;font-size:21px;line-height:1.12;letter-spacing:-.03em;color:#fff}
.pixeld-story-active p{margin:0;color:#9ca6b4;font-size:12px;line-height:1.55}
.pixeld-story-progress{height:4px;margin-top:23px;border-radius:999px;background:rgba(255,255,255,.065);overflow:hidden}
.pixeld-story-progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#7d2948,#a34b69,#7569c8);transition:width .45s ease}
.pixeld-story-timeline{display:flex;flex-direction:column;gap:7px}
.pixeld-story-timeline article{
  display:grid;grid-template-columns:24px 1fr auto;gap:7px;align-items:center;
  padding:9px;border-radius:10px;background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.05);opacity:0;transform:translateY(7px);
  transition:opacity .3s ease,transform .3s ease;
}
.pixeld-story-timeline article.visible{opacity:1;transform:none}
.pixeld-story-timeline article>span{font-size:9px;color:#6f7988}
.pixeld-story-timeline small{display:block;font-size:8px;color:#a9657e;letter-spacing:.08em}
.pixeld-story-timeline b{display:block;margin-top:2px;font-size:10px;color:#e9ebef;line-height:1.2}
.pixeld-story-timeline em{font-style:normal;font-size:8px;color:#8794a5}
.pixeld-story-outcome{
  margin-top:12px;padding:10px 12px;border-radius:10px;
  background:rgba(125,41,72,.10);border:1px solid rgba(166,69,101,.16);
  color:#c7cdd7;font-size:10px;line-height:1.45;
}

/* Use cases acts like a page, but remains one transient overlay surface. */
.pixeld-story.expanded{
  position:fixed!important;z-index:218!important;
  left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;
  width:min(1080px,calc(100vw - 36px))!important;
  min-height:min(650px,calc(100vh - 120px))!important;
  max-height:calc(100vh - 110px)!important;overflow:auto!important;
  padding:28px!important;background:rgba(14,16,21,.985)!important;
  box-shadow:0 40px 120px rgba(0,0,0,.55)!important;
}
.pixeld-story.expanded .pixeld-story-stage{grid-template-columns:minmax(0,1fr) 320px}
.pixeld-story.expanded .pixeld-story-active{min-height:320px}
.pixeld-story.expanded .pixeld-story-active h3{font-size:29px}
.pixeld-story.expanded .pixeld-story-active p{font-size:14px}

/* Story disappears immediately after unlock so the stream owns the viewport. */
body:not(.auth-locked) .locked-marketing{display:none!important}

@media(max-width:900px){
  body.desktop-view.auth-locked.desktop-ready .locked-marketing{
    grid-template-columns:1fr!important;grid-template-rows:auto!important;overflow:auto!important;
    padding:40px 24px 100px!important;
  }
  .locked-marketing-brand,.locked-marketing-copy,.locked-promises,.pixeld-story,.locked-marketing-cta{
    grid-column:1!important;grid-row:auto!important;
  }
  .pixeld-story-stage,.pixeld-story.expanded .pixeld-story-stage{grid-template-columns:1fr!important}
  .pixeld-story-timeline{display:none}
}
/* PixelD 5052 — stable dock + Rust-driven control-fabric animation. */

/* The command dock never participates in welcome layout. It is fixed to the viewport
   from first paint, shrink-wrapped to its controls, and never animated/reflowed. */
body.desktop-view .pixeld-bottom-dock{
  position:fixed!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:16px!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  min-width:0!important;
  max-width:calc(100vw - 24px)!important;
  min-height:46px!important;
  height:auto!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  padding:5px 7px!important;
  margin:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  white-space:nowrap!important;
  transition:none!important;
  animation:none!important;
  contain:layout style!important;
  z-index:240!important;
}
body.desktop-view .pixeld-bottom-dock>*{flex:0 0 auto!important}
body.desktop-view .pixeld-bottom-dock button,
body.desktop-view .pixeld-bottom-dock .dock-link{
  min-height:34px!important;
  height:34px!important;
  padding:0 11px!important;
  margin:0!important;
  font-size:11px!important;
  line-height:34px!important;
}
body.desktop-view .pixeld-bottom-dock .dock-brand{
  height:34px!important;
  padding:0 10px 0 8px!important;
}

/* The welcome uses the full viewport; only the fixed command capsule overlays it. */
body.desktop-view.auth-locked.desktop-ready .locked-marketing{
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  align-content:center!important;
  box-sizing:border-box!important;
  padding:54px 6vw 94px!important;
}
.locked-marketing-cta{display:none!important}

/* Runtime fabric replaces the card timeline. */
.pixeld-story{
  min-height:0!important;
  padding:20px 20px 18px!important;
}
.pixeld-runtime-map{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto 1fr auto 1fr auto 1fr auto 1fr auto;
  align-items:start;
  gap:8px;
  margin:20px 2px 22px;
  padding:5px 2px 0;
}
.pd-runtime-node{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  min-width:48px;
  color:#697383;
  transition:color .22s ease,transform .22s ease;
}
.pd-runtime-node i{
  position:relative;
  display:block;
  width:13px;height:13px;
  border-radius:50%;
  background:#242832;
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 0 0 5px rgba(255,255,255,.018);
  transition:background .25s ease,border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}
.pd-runtime-node span{
  font-size:8px;
  font-weight:760;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.pd-runtime-node.done{color:#a8b0bc}
.pd-runtime-node.done i{
  background:#713147;
  border-color:#a24a68;
  box-shadow:0 0 0 4px rgba(125,41,72,.10);
}
.pd-runtime-node.active{
  color:#fff;
  transform:translateY(-1px);
}
.pd-runtime-node.active i{
  background:#b34f71;
  border-color:#d77a99;
  transform:scale(1.15);
  box-shadow:
    0 0 0 5px rgba(163,75,105,.14),
    0 0 18px rgba(177,69,106,.42);
  animation:pdRuntimePulse 1.15s ease-in-out infinite;
}
@keyframes pdRuntimePulse{
  0%,100%{box-shadow:0 0 0 4px rgba(163,75,105,.10),0 0 12px rgba(177,69,106,.28)}
  50%{box-shadow:0 0 0 8px rgba(163,75,105,.03),0 0 24px rgba(177,69,106,.48)}
}
.pd-runtime-link{
  position:relative;
  display:block;
  align-self:start;
  height:2px;
  margin-top:6px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.065);
}
.pd-runtime-link::after{
  content:"";
  position:absolute;inset:0;
  transform:translateX(-101%);
  background:linear-gradient(90deg,#7d2948,#a34b69,#7569c8);
  transition:transform .42s cubic-bezier(.2,.8,.2,1);
}
.pd-runtime-link.done::after{transform:translateX(0)}

.pixeld-story-active{
  min-height:184px!important;
  padding:19px 20px!important;
  background:
    radial-gradient(circle at 92% 10%,rgba(125,41,72,.10),transparent 34%),
    rgba(255,255,255,.025)!important;
}
.pixeld-story-active h3{
  font-size:24px!important;
  max-width:560px;
}
.pixeld-story-active p{
  max-width:620px;
  font-size:12px!important;
  line-height:1.6!important;
}
.pixeld-story-progress{
  margin-top:20px!important;
}
.pixeld-story-progress i{
  transition:width .55s cubic-bezier(.2,.8,.2,1)!important;
}
.pixeld-story-outcome{
  margin-top:10px!important;
  animation:pdOutcomeIn .34s ease both;
}
@keyframes pdOutcomeIn{
  from{opacity:0;transform:translateY(5px)}
  to{opacity:1;transform:none}
}

/* Tone comes from Rust. Only presentation changes in CSS. */
.pixeld-story[data-tone="good"] .pd-runtime-node.active i{
  background:#6f416f;border-color:#a978a8;
}
.pixeld-story[data-tone="warn"] .pd-runtime-node.active i{
  background:#9d5a42;border-color:#c57a5f;
}

/* Expanded use-cases remains one centered surface, not a permanent sidebar. */
.pixeld-story.expanded{
  width:min(1120px,calc(100vw - 32px))!important;
  min-height:min(620px,calc(100vh - 110px))!important;
  padding:28px!important;
}
.pixeld-story.expanded .pixeld-runtime-map{margin:26px 8px 30px}
.pixeld-story.expanded .pd-runtime-node i{width:17px;height:17px}
.pixeld-story.expanded .pd-runtime-node span{font-size:10px}
.pixeld-story.expanded .pd-runtime-link{margin-top:8px}
.pixeld-story.expanded .pixeld-story-active{min-height:270px!important;padding:28px!important}
.pixeld-story.expanded .pixeld-story-active h3{font-size:32px!important}
.pixeld-story.expanded .pixeld-story-active p{font-size:14px!important}

/* No second in-Linux launcher rail; browser PixelD is the only product control plane. */
body:not(.auth-locked) .locked-marketing{display:none!important}

@media(max-width:760px){
  body.desktop-view .pixeld-bottom-dock{
    left:8px!important;right:8px!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    justify-content:flex-start!important;
    bottom:8px!important;
  }
  .pixeld-runtime-map{
    grid-template-columns:repeat(6,1fr);
    gap:4px;
  }
  .pd-runtime-link{display:none}
  .pd-runtime-node{min-width:0}
  .pd-runtime-node span{font-size:7px}
}
/* PixelD 5053 — full-viewport applications + blue/crimson/white runtime fabric. */

.pd-d{color:#d83f61!important}

/* After authentication, applications own the complete browser viewport.
   PixelD controls are overlays only; they reserve no streamed desktop pixels. */
body.desktop-view:not(.auth-locked) .topbar,
body.desktop-view:not(.auth-locked) .stage-toolbar,
body.desktop-view:not(.auth-locked) .runtime-strip,
body.desktop-view:not(.auth-locked) .commandbar{
  display:none!important;
}
body.desktop-view:not(.auth-locked) .app-shell{
  position:fixed!important;inset:0!important;
  width:100vw!important;height:100vh!important;
  display:block!important;overflow:hidden!important;
  background:#000!important;
}
body.desktop-view:not(.auth-locked) .workspace,
body.desktop-view:not(.auth-locked) .stage-panel,
body.desktop-view:not(.auth-locked) .pixel-stage{
  position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;
  max-width:none!important;max-height:none!important;
  margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
body.desktop-view:not(.auth-locked) .pixel-stage video,
body.desktop-view:not(.auth-locked) .pixel-stage canvas,
body.desktop-view:not(.auth-locked) #pixelCanvas,
body.desktop-view:not(.auth-locked) #linuxVideo,
body.desktop-view:not(.auth-locked) #motionCanvas,
body.desktop-view:not(.auth-locked) #holdCanvas{
  position:absolute!important;inset:0!important;
  width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;
  object-fit:fill!important;
  margin:0!important;padding:0!important;
  border:0!important;
}

/* Blue + crimson + white product language. */
:root{
  --pd-blue:#3f78ff;
  --pd-blue-soft:#72a0ff;
  --pd-crimson:#d83f61;
  --pd-crimson-deep:#982842;
  --pd-white:#f8fbff;
}
.linux-boot,
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 18% 20%,rgba(63,120,255,.20),transparent 34%),
    radial-gradient(circle at 78% 68%,rgba(216,63,97,.17),transparent 36%),
    linear-gradient(145deg,#161a24 0%,#0f131b 52%,#0b0d12 100%)!important;
}
.linux-boot-progress i,
.pixeld-story-progress i{
  background:linear-gradient(90deg,var(--pd-blue),#f7f9ff 48%,var(--pd-crimson))!important;
}
.linux-boot-ring i:nth-child(1){border-top-color:var(--pd-blue)!important}
.linux-boot-ring i:nth-child(2){border-right-color:#fff!important}
.linux-boot-ring i:nth-child(3){border-bottom-color:var(--pd-crimson)!important}
.locked-kicker,
.pixeld-story-head span,
.pixeld-story-labels span{color:#e06984!important}
.auth-actions button[type="submit"]{
  background:linear-gradient(90deg,#3f78ff,#735fce 48%,#d83f61)!important;
  border-color:rgba(255,255,255,.15)!important;
}
.pixeld-bottom-dock button.active,
.pixeld-bottom-dock .stream-choice.active{
  background:linear-gradient(180deg,rgba(63,120,255,.20),rgba(216,63,97,.20))!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.10)!important;
}

/* Graphical compute-fabric signal. Position changes only when Rust advances data-step. */
.pixeld-runtime-map{
  isolation:isolate;
}
.pixeld-runtime-map::before{
  content:"";
  position:absolute;
  left:2%;right:2%;top:10px;height:1px;
  z-index:0;
  background:linear-gradient(90deg,
    rgba(63,120,255,.42),
    rgba(255,255,255,.16) 48%,
    rgba(216,63,97,.40));
}
.pixeld-runtime-map::after{
  content:"";
  position:absolute;
  top:3px;left:2%;
  width:15px;height:15px;border-radius:50%;
  z-index:5;
  background:#fff;
  border:2px solid var(--pd-blue);
  box-shadow:
    0 0 0 5px rgba(63,120,255,.10),
    0 0 22px rgba(63,120,255,.58),
    0 0 36px rgba(216,63,97,.24);
  transition:left .72s cubic-bezier(.2,.82,.2,1),border-color .35s ease,box-shadow .35s ease;
}
.pixeld-story[data-step="1"] .pixeld-runtime-map::after{left:2%;border-color:var(--pd-blue)}
.pixeld-story[data-step="2"] .pixeld-runtime-map::after{left:20%;border-color:#6f91ff}
.pixeld-story[data-step="3"] .pixeld-runtime-map::after{left:39%;border-color:#a9bcff}
.pixeld-story[data-step="4"] .pixeld-runtime-map::after{left:58%;border-color:#fff}
.pixeld-story[data-step="5"] .pixeld-runtime-map::after{left:77%;border-color:#ec8098}
.pixeld-story[data-step="6"] .pixeld-runtime-map::after{
  left:96%;border-color:var(--pd-crimson);
  box-shadow:0 0 0 5px rgba(216,63,97,.10),0 0 24px rgba(216,63,97,.65);
}
.pd-runtime-link::after{
  background:linear-gradient(90deg,var(--pd-blue),#eef4ff,var(--pd-crimson))!important;
}
.pd-runtime-node.done i{
  background:#315cae!important;border-color:#5c8dff!important;
}
.pd-runtime-node.active i{
  background:var(--pd-crimson)!important;border-color:#ff8aa2!important;
}
.pixeld-story[data-tone="good"] .pd-runtime-node.active i{
  background:#fff!important;border-color:var(--pd-blue)!important;
  box-shadow:0 0 0 5px rgba(63,120,255,.10),0 0 24px rgba(255,255,255,.44)!important;
}
.pixeld-story[data-tone="warn"] .pd-runtime-node.active i{
  background:var(--pd-crimson)!important;border-color:#ff8aa2!important;
}

/* Very subtle data-field motion; state movement still comes from Rust. */
.pixeld-story::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background-image:
    linear-gradient(rgba(86,130,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(216,63,97,.018) 1px,transparent 1px);
  background-size:28px 28px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 85%);
}
/* PixelD 5054 — separate platform surface + refined developer workspace presentation. */
.platform-overview{
  display:none;
  position:fixed;inset:34px 34px 76px;
  z-index:222;
  overflow:auto;
  padding:34px;
  border-radius:26px;
  color:#f7f9fd;
  background:
    radial-gradient(circle at 16% 10%,rgba(63,120,255,.16),transparent 30%),
    radial-gradient(circle at 86% 78%,rgba(216,63,97,.13),transparent 34%),
    linear-gradient(145deg,rgba(17,21,30,.99),rgba(10,12,18,.99));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 36px 120px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(22px);
}
body.platform-open .platform-overview{display:grid}
.platform-head{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start;
  max-width:1180px;margin:0 auto 28px;width:100%;
}
.platform-head h2{
  margin:10px 0 12px;max-width:800px;
  font-size:clamp(30px,4vw,52px);line-height:1.02;letter-spacing:-.05em;
}
.platform-head p{max-width:760px;margin:0;color:#9ea9b8;font-size:14px;line-height:1.65}
.platform-head button{
  width:40px;height:40px;border-radius:12px;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);color:#fff;font-size:23px;cursor:pointer;
}
.platform-head button:hover{background:rgba(216,63,97,.15)}

.platform-orbit{
  position:relative;width:min(720px,82vw);height:280px;margin:2px auto 32px;
  display:grid;place-items:center;
}
.platform-core{
  position:relative;z-index:4;width:150px;height:150px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 30% 25%,rgba(63,120,255,.25),transparent 48%),
    radial-gradient(circle at 70% 75%,rgba(216,63,97,.20),transparent 45%),
    #141923;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 0 0 12px rgba(255,255,255,.018),0 28px 70px rgba(0,0,0,.38);
}
.platform-core b{font-size:25px;letter-spacing:-.04em}
.platform-core small{margin-top:6px;color:#8f9aaa;font-size:10px}
.orbit-ring{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.08);border-radius:50%;
  pointer-events:none;
}
.orbit-a{width:390px;height:190px}
.orbit-b{width:610px;height:260px;border-color:rgba(88,133,255,.08)}
.orbit-node{
  position:absolute;z-index:3;padding:8px 11px;border-radius:999px;
  font-size:10px;font-weight:760;color:#dce4f0;
  background:#151a23;border:1px solid rgba(255,255,255,.09);
  box-shadow:0 12px 30px rgba(0,0,0,.25);
}
.orbit-node::before{
  content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;
  background:#4f83ff;box-shadow:0 0 12px rgba(79,131,255,.55);
}
.n-linux{left:4%;top:50%}
.n-windows{left:19%;top:5%}
.n-mac{right:20%;top:6%}
.n-android{right:4%;top:50%}
.n-ios{left:50%;bottom:0;transform:translateX(-50%)}
.n-ios::before,.n-android::before{background:#d83f61;box-shadow:0 0 12px rgba(216,63,97,.48)}

.platform-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;
  width:100%;max-width:1180px;margin:0 auto;
}
.platform-grid article{
  min-height:172px;padding:18px;border-radius:16px;
  background:rgba(255,255,255,.027);border:1px solid rgba(255,255,255,.07);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.platform-grid article:hover{transform:translateY(-2px);border-color:rgba(100,143,255,.22);background:rgba(255,255,255,.038)}
.platform-grid article>span{display:block;font-size:9px;letter-spacing:.14em;color:#69778b}
.platform-grid article>b{display:block;margin:13px 0 8px;font-size:17px;letter-spacing:-.025em}
.platform-grid article>p{margin:0;color:#96a2b2;font-size:11px;line-height:1.55}
.platform-grid article>em{
  display:inline-block;margin-top:13px;padding:5px 7px;border-radius:6px;
  font-style:normal;font-size:8px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:#b9c9e7;background:rgba(63,120,255,.08);border:1px solid rgba(63,120,255,.12);
}

.platform-benefits{
  max-width:1180px;width:100%;margin:14px auto 0;
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid rgba(255,255,255,.07);
}
.platform-benefits span{padding:18px 18px 0 0}
.platform-benefits b{display:block;font-size:12px}
.platform-benefits small{display:block;margin-top:5px;color:#8490a0;font-size:10px;line-height:1.45}

body.platform-open .locked-marketing{filter:blur(9px) brightness(.42);pointer-events:none}
body.platform-open .pixeld-bottom-dock{z-index:240}

@media(max-width:900px){
  .platform-overview{inset:12px 12px 66px;padding:22px}
  .platform-grid{grid-template-columns:1fr 1fr}
  .platform-orbit{transform:scale(.85);width:100%}
}
@media(max-width:620px){
  .platform-grid,.platform-benefits{grid-template-columns:1fr}
  .platform-orbit{height:230px;transform:scale(.72)}
}
/* PixelD 5055 — auto-minimized authenticated dock + reliable overlay close behavior. */

/* Pre-login dock remains fully visible. Authenticated dock collapses to the brand pill. */
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock{
  gap:3px!important;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock .dock-auth-only{
  max-width:0!important;
  min-width:0!important;
  width:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  margin-left:0!important;
  margin-right:0!important;
  border-width:0!important;
  opacity:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
  transform:translateY(2px);
  transition:max-width .20s ease,opacity .14s ease,padding .20s ease,transform .18s ease!important;
}
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock:hover .dock-auth-only,
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock:focus-within .dock-auth-only,
body.desktop-view:not(.auth-locked).dock-pinned .pixeld-bottom-dock .dock-auth-only,
body.desktop-view:not(.auth-locked).menu-open .pixeld-bottom-dock .dock-auth-only,
body.desktop-view:not(.auth-locked).perf-open .pixeld-bottom-dock .dock-auth-only,
body.desktop-view:not(.auth-locked).security-open .pixeld-bottom-dock .dock-auth-only,
body.desktop-view:not(.auth-locked).right-open .pixeld-bottom-dock .dock-auth-only{
  max-width:140px!important;
  padding-left:11px!important;
  padding-right:11px!important;
  border-width:1px!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:none;
}
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock .dock-pin{
  color:#9ba6b7!important;
}
body.desktop-view:not(.auth-locked).dock-pinned .pixeld-bottom-dock .dock-pin{
  color:#fff!important;
  background:rgba(63,120,255,.14)!important;
}
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock:not(:hover):not(:focus-within){
  background:rgba(12,15,20,.88)!important;
  box-shadow:0 14px 42px rgba(0,0,0,.24)!important;
}
body.desktop-view:not(.auth-locked) .pixeld-bottom-dock .dock-brand{
  cursor:default!important;
}

/* Every close control is visually and behaviorally consistent. */
[data-panel-close],[data-platform-close],[data-auth-cancel]{
  cursor:pointer!important;
}
[data-panel-close]:hover,[data-platform-close]:hover,[data-auth-cancel]:hover{
  border-color:rgba(216,63,97,.28)!important;
  background:rgba(216,63,97,.10)!important;
  color:#fff!important;
}
/* PixelD 5056 — final brand, boot alignment and overlay authority. */
:root{
  --pd-violet-light:#c9c7ff;
  --pd-violet:#8c88ff;
  --pd-blue-deep:#0d1630;
  --pd-blue:#2f5ed8;
  --pd-white:#fbfcff;
  --pd-crimson:#d83f61;
  --pd-panel:rgba(13,18,33,.965);
  --pd-border:rgba(255,255,255,.11);
}
.pd-d{color:var(--pd-crimson)!important}

/* Boot: one centered composition. No inherited absolute child offsets. */
.linux-boot{
  position:absolute!important;inset:0!important;
  display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:center!important;
  gap:13px!important;
  padding:44px 28px!important;margin:0!important;
  text-align:center!important;overflow:hidden!important;
  background:
    radial-gradient(circle at 18% 18%,rgba(201,199,255,.27),transparent 32%),
    radial-gradient(circle at 82% 76%,rgba(47,94,216,.27),transparent 38%),
    linear-gradient(145deg,#151b31 0%,#0d1630 48%,#f6f7ff 180%)!important;
}
.linux-boot>*{
  position:relative!important;left:auto!important;right:auto!important;
  top:auto!important;bottom:auto!important;transform:none!important;
  margin:0!important;
}
.linux-boot-logo{
  display:flex!important;align-items:center!important;justify-content:center!important;gap:12px!important;
  min-width:168px!important;padding:10px 15px!important;border-radius:15px!important;
  background:rgba(255,255,255,.065)!important;border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:0 18px 52px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.linux-boot-logo img{width:82px!important;height:auto!important;display:block!important}
.linux-boot-logo span{font-size:18px!important;font-weight:820!important;color:#fff!important;letter-spacing:-.035em!important}
.linux-boot-ring{
  width:74px!important;height:74px!important;flex:0 0 74px!important;margin:5px 0 1px!important;
}
.linux-boot-ring i{position:absolute!important;inset:0!important;border-radius:50%!important}
.linux-boot-kicker{font-size:11px!important;letter-spacing:.18em!important;color:#c6c8ff!important;font-weight:800!important}
.linux-boot>b{font-size:31px!important;line-height:1.08!important;letter-spacing:-.04em!important;color:#fff!important}
.linux-boot-progress{width:min(330px,62vw)!important;height:5px!important;border-radius:999px!important;background:rgba(255,255,255,.08)!important;overflow:hidden!important}
.linux-boot-progress i{display:block!important;height:100%!important;background:linear-gradient(90deg,#c9c7ff,#ffffff,#2f5ed8,#d83f61)!important}
.linux-boot p{font-size:14px!important;line-height:1.45!important;color:#e9edf8!important}
.linux-boot small{font-size:12px!important;line-height:1.45!important;color:#aeb9d0!important}
.linux-boot-footer{margin-top:6px!important;font-size:10px!important;letter-spacing:.06em!important;color:#8796b6!important}

/* Locked welcome: premium violet/blue/white product canvas. */
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 12% 16%,rgba(201,199,255,.24),transparent 30%),
    radial-gradient(circle at 86% 18%,rgba(92,111,232,.18),transparent 32%),
    radial-gradient(circle at 78% 80%,rgba(255,255,255,.07),transparent 34%),
    linear-gradient(145deg,#171b31 0%,#0d1530 55%,#0a0f20 100%)!important;
}
body.desktop-view.auth-locked.desktop-ready .locked-marketing{
  align-content:center!important;
  color:#fff!important;
}
.locked-marketing-copy h1{color:#fff!important;text-wrap:balance!important}
.locked-marketing-copy p{color:#bac4da!important}
.locked-kicker{color:#c8c6ff!important}
.locked-promises>span{border-top-color:rgba(255,255,255,.08)!important}
.locked-promises b{color:#fff!important}
.locked-promises small{color:#9eabc5!important}

/* Main Rust story uses violet/blue/white; crimson remains the PixelD signature. */
.pixeld-story{
  position:relative!important;
  background:
    radial-gradient(circle at 12% 10%,rgba(201,199,255,.08),transparent 28%),
    radial-gradient(circle at 90% 78%,rgba(47,94,216,.08),transparent 30%),
    rgba(12,17,31,.84)!important;
  border-color:rgba(201,199,255,.12)!important;
}
.pixeld-story-tabs button.active{
  background:linear-gradient(180deg,rgba(140,136,255,.20),rgba(47,94,216,.14))!important;
  border-color:rgba(201,199,255,.26)!important;color:#fff!important;
}
.pixeld-story-progress i,
.pd-runtime-link::after{
  background:linear-gradient(90deg,#c9c7ff,#ffffff,#2f5ed8,#d83f61)!important;
}

/* One shared visual language for every popup/panel. */
.desktop-menu.command-panel,
.auth-modal form,
.platform-overview,
.perf-panel,
.right-panel{
  background:
    radial-gradient(circle at 12% 10%,rgba(201,199,255,.07),transparent 27%),
    radial-gradient(circle at 90% 80%,rgba(47,94,216,.08),transparent 31%),
    var(--pd-panel)!important;
  border:1px solid var(--pd-border)!important;
  box-shadow:0 34px 100px rgba(2,5,14,.50),inset 0 1px 0 rgba(255,255,255,.055)!important;
}
.command-panel{position:fixed!important}
.command-panel-close,
.auth-close{
  position:absolute!important;z-index:12!important;right:14px!important;top:14px!important;
  width:36px!important;height:36px!important;padding:0!important;
  display:grid!important;place-items:center!important;
  border-radius:11px!important;border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(255,255,255,.045)!important;color:#dfe5f3!important;
  font-size:21px!important;line-height:1!important;cursor:pointer!important;
}
.command-panel-close:hover,
.auth-close:hover{
  background:rgba(216,63,97,.12)!important;
  border-color:rgba(216,63,97,.28)!important;color:#fff!important;
}
.auth-modal form{position:relative!important}
.auth-identity{
  background:
    radial-gradient(circle at 28% 20%,rgba(201,199,255,.18),transparent 36%),
    linear-gradient(155deg,#181d36,#10172c)!important;
}
.auth-logo-wrap{background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.12)!important}
.auth-kicker,.auth-eyebrow{color:#c8c6ff!important}
.auth-login input:focus{border-color:#8c88ff!important;box-shadow:0 0 0 4px rgba(140,136,255,.15)!important}
.auth-actions button[type="submit"]{
  background:linear-gradient(90deg,#8c88ff,#2f5ed8 62%,#d83f61)!important;
}

/* Platform page inherits the same palette. */
.platform-overview{
  background:
    radial-gradient(circle at 12% 10%,rgba(201,199,255,.16),transparent 30%),
    radial-gradient(circle at 86% 76%,rgba(47,94,216,.18),transparent 34%),
    linear-gradient(145deg,#151a31,#0c142a 62%,#090d1b)!important;
}
.platform-core{
  background:
    radial-gradient(circle at 28% 22%,rgba(201,199,255,.18),transparent 45%),
    radial-gradient(circle at 72% 78%,rgba(47,94,216,.19),transparent 44%),
    #12192d!important;
}

/* Dock remains stable and uses product palette. */
.pixeld-bottom-dock{
  background:rgba(8,12,24,.92)!important;
  border-color:rgba(201,199,255,.12)!important;
}
.pixeld-bottom-dock button.active,
.pixeld-bottom-dock .stream-choice.active{
  background:linear-gradient(180deg,rgba(140,136,255,.20),rgba(47,94,216,.16))!important;
}

/* Reduced motion respects OS preference without changing Rust state semantics. */
@media(prefers-reduced-motion:reduce){
  .pd-runtime-node.active i,.pixeld-story-outcome{animation:none!important}
  .pixeld-runtime-map::after,.pixeld-story-progress i,.pd-runtime-link::after{transition:none!important}
}
/* PixelD 5058 — full-screen product visual, Rust-state driven. */
body.desktop-view.auth-locked.desktop-ready .welcome-experience{
  position:absolute!important;inset:0!important;
  display:grid!important;
  grid-template-rows:auto auto 1fr!important;
  grid-template-columns:1fr!important;
  gap:18px!important;
  width:100vw!important;height:100vh!important;
  padding:28px 42px 84px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  align-content:stretch!important;
  color:#fff!important;
  pointer-events:auto!important;
}
.welcome-topline{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:18px!important;min-height:42px!important;
}
.welcome-status{
  display:flex;align-items:center;gap:9px;
  color:#98a7c7;font-size:10px;font-weight:760;letter-spacing:.08em;text-transform:uppercase;
}
.welcome-status i{
  width:6px;height:6px;border-radius:50%;
  background:#c9c7ff;box-shadow:0 0 14px rgba(201,199,255,.55);
}
.welcome-status b{color:#fff;font-size:10px;font-weight:760}

.welcome-copy{
  max-width:1050px!important;
  margin:0 auto!important;
  text-align:center!important;
  align-self:start!important;
}
.welcome-copy h1{
  margin:0!important;
  font-size:clamp(38px,5.4vw,78px)!important;
  line-height:.98!important;
  letter-spacing:-.055em!important;
  color:#fff!important;
  text-wrap:balance!important;
}
.welcome-copy p{
  max-width:820px!important;
  margin:14px auto 0!important;
  font-size:clamp(14px,1.45vw,20px)!important;
  line-height:1.5!important;
  color:#b9c6df!important;
  text-wrap:balance!important;
}

.visual-story{
  position:relative!important;
  width:min(1500px,100%)!important;
  height:100%!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:14px 18px 18px!important;
  display:grid!important;
  grid-template-rows:auto 1fr auto!important;
  overflow:hidden!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 15% 20%,rgba(201,199,255,.08),transparent 25%),
    radial-gradient(circle at 84% 74%,rgba(47,94,216,.10),transparent 28%),
    linear-gradient(145deg,rgba(10,15,31,.88),rgba(7,11,23,.94))!important;
  border:1px solid rgba(201,199,255,.10)!important;
  box-shadow:0 36px 120px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.04)!important;
  backdrop-filter:blur(18px)!important;
}
.visual-story::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(rgba(201,199,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(47,94,216,.016) 1px,transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 90%);
}
.visual-story-toolbar{
  position:relative;z-index:4;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  min-height:44px;padding:0 2px;
}
.visual-story-toolbar .pixeld-story-tabs{
  display:flex;gap:7px;flex-wrap:nowrap;margin:0!important;overflow-x:auto;
}
.visual-story-toolbar .pixeld-story-tabs button{
  min-height:34px;padding:0 13px!important;
  border-radius:9px!important;
  white-space:nowrap;
  font-size:10px!important;
}
.story-runtime-health{
  flex:0 0 auto;color:#8e9bb7;font-size:10px;font-weight:700;
}

.visual-story-stage{
  position:relative;z-index:2;
  display:grid;
  grid-template-columns:minmax(140px,.72fr) minmax(60px,.30fr) minmax(520px,2.4fr) minmax(60px,.30fr) minmax(220px,1.05fr);
  gap:18px;
  align-items:center;
  min-height:0;
  padding:10px 2px 12px;
}

.visual-device{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  opacity:.62;transform:translateX(-6px) scale(.96);
  transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}
.device-screen{
  width:100%;min-height:150px;border-radius:22px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;
  background:linear-gradient(160deg,rgba(201,199,255,.10),rgba(47,94,216,.07));
  border:1px solid rgba(201,199,255,.12);
  box-shadow:0 18px 48px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.04);
}
.device-dot{
  width:18px;height:18px;border-radius:50%;
  background:#c9c7ff;box-shadow:0 0 0 8px rgba(201,199,255,.06),0 0 28px rgba(201,199,255,.42);
}
.device-screen b{font-size:18px;color:#fff}
.device-screen small{font-size:10px;color:#8f9db8;text-align:center;line-height:1.45}
.visual-device>em{font-style:normal;font-size:9px;letter-spacing:.14em;color:#6f7d98}

.visual-link{
  position:relative;height:8px;align-self:center;overflow:visible;
}
.visual-link::before{
  content:"";position:absolute;left:0;right:0;top:3px;height:2px;border-radius:999px;
  background:rgba(255,255,255,.07);
}
.visual-link i{
  position:absolute;top:-1px;left:-4px;width:12px;height:12px;border-radius:50%;
  background:#fff;border:2px solid #8c88ff;
  box-shadow:0 0 0 5px rgba(140,136,255,.06),0 0 20px rgba(140,136,255,.42);
  opacity:0;
}
.visual-story[data-step="1"] .visual-link-a i,
.visual-story[data-step="2"] .visual-link-a i,
.visual-story[data-step="3"] .visual-link-a i{
  opacity:1;animation:pdSignalA 1.15s linear infinite;
}
.visual-story[data-step="4"] .visual-link-b i,
.visual-story[data-step="5"] .visual-link-b i,
.visual-story[data-step="6"] .visual-link-b i{
  opacity:1;animation:pdSignalB 1.15s linear infinite;
}
@keyframes pdSignalA{from{left:-3px}to{left:calc(100% - 8px)}}
@keyframes pdSignalB{from{left:-3px}to{left:calc(100% - 8px)}}

.visual-workspace{
  position:relative;
  min-height:330px;height:78%;
  max-height:520px;
  border-radius:24px;overflow:hidden;
  background:#0b1020;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 30px 80px rgba(0,0,0,.44),0 0 0 1px rgba(201,199,255,.025) inset;
  transform:scale(.97);
  opacity:.82;
  transition:transform .5s cubic-bezier(.2,.85,.2,1),opacity .4s ease,box-shadow .4s ease;
}
.workspace-titlebar{
  height:44px;display:flex;align-items:center;justify-content:space-between;
  padding:0 15px;border-bottom:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.025);
}
.workspace-titlebar>span{display:flex;align-items:center;gap:8px}
.workspace-titlebar img{width:58px;height:auto}
.workspace-titlebar b{font-size:13px;color:#fff}
.workspace-titlebar em{font-style:normal;font-size:9px;color:#77849d}
.workspace-preview{
  display:grid;grid-template-columns:1fr 110px;
  height:calc(100% - 98px);
}
.preview-main{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 60% 45%,rgba(47,94,216,.10),transparent 28%),
    linear-gradient(145deg,#10172a,#0a0f1f);
}
.preview-grid-lines{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(201,199,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(47,94,216,.024) 1px,transparent 1px);
  background-size:32px 32px;
}
.preview-app-title{
  position:absolute;left:18px;top:16px;
  color:#7f8da9;font-size:9px;letter-spacing:.10em;text-transform:uppercase;
}
.preview-window{
  position:absolute;padding:13px 14px;border-radius:12px;
  background:rgba(16,23,42,.92);border:1px solid rgba(255,255,255,.08);
  box-shadow:0 16px 44px rgba(0,0,0,.25);
  transition:transform .45s ease,opacity .45s ease,border-color .35s ease;
}
.preview-window b{display:block;font-size:13px;color:#fff}
.preview-window small{display:block;margin-top:5px;font-size:9px;color:#8695b0}
.preview-window.w1{left:13%;top:22%;width:42%}
.preview-window.w2{right:10%;top:42%;width:38%}
.preview-window.w3{left:24%;bottom:12%;width:46%}
.workspace-preview aside{
  display:flex;flex-direction:column;gap:6px;padding:12px 9px;
  border-left:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.018);
}
.workspace-preview aside span{
  padding:8px;border-radius:8px;background:rgba(255,255,255,.025);
  color:#73819b;font-size:8px;font-weight:700;
}
.workspace-state{
  position:absolute;left:0;right:0;bottom:0;height:54px;
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;
  padding:0 14px;
  background:rgba(8,12,25,.94);border-top:1px solid rgba(255,255,255,.07);
}
.workspace-state span,.workspace-state em{font-size:8px;letter-spacing:.10em;color:#9b83dd;font-style:normal}
.workspace-state b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#eef2fb}

.visual-compute{
  position:relative;min-height:290px;height:72%;
  display:grid;place-items:center;
  opacity:.62;transform:translateX(6px) scale(.96);
  transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.2,1);
}
.compute-core{
  position:relative;z-index:3;
  width:112px;height:112px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:
    radial-gradient(circle at 32% 26%,rgba(201,199,255,.18),transparent 46%),
    radial-gradient(circle at 72% 76%,rgba(47,94,216,.18),transparent 45%),
    #11182d;
  border:1px solid rgba(201,199,255,.15);
  box-shadow:0 0 0 14px rgba(255,255,255,.015),0 24px 60px rgba(0,0,0,.38);
}
.compute-core b{font-size:17px;color:#fff}
.compute-core small{margin-top:5px;color:#8794ad;font-size:9px}
.compute-node{
  position:absolute;z-index:2;min-width:88px;padding:10px;border-radius:11px;
  background:#12192c;border:1px solid rgba(255,255,255,.08);
  transition:transform .38s ease,border-color .38s ease,box-shadow .38s ease,opacity .38s ease;
}
.compute-node b{display:block;font-size:11px;color:#fff}
.compute-node small{display:block;margin-top:3px;font-size:8px;color:#77869f}
.compute-node.gpu{top:8%;left:3%}
.compute-node.apps{top:9%;right:2%}
.compute-node.data{bottom:7%;left:1%}
.compute-node.sec{bottom:6%;right:1%}

.visual-story-footer{
  position:relative;z-index:4;
  display:grid;grid-template-columns:minmax(420px,1fr) minmax(300px,.8fr);gap:18px;
  align-items:end;
  min-height:66px;padding:8px 2px 0;
}
.story-step-row{
  display:grid;grid-template-columns:repeat(6,1fr);gap:6px;
}
.story-step-row span{
  position:relative;padding-top:15px;
  color:#5f6d86;font-size:8px;font-weight:760;letter-spacing:.06em;text-transform:uppercase;
  text-align:center;
  transition:color .28s ease;
}
.story-step-row span::before{
  content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:7px;height:7px;border-radius:50%;
  background:#273149;border:1px solid rgba(255,255,255,.08);
  transition:background .28s ease,box-shadow .28s ease,transform .28s ease;
}
.story-step-row span.done{color:#a6b1c8}
.story-step-row span.done::before{background:#2f5ed8}
.story-step-row span.active{color:#fff}
.story-step-row span.active::before{
  background:#d83f61;transform:translateX(-50%) scale(1.25);
  box-shadow:0 0 0 5px rgba(216,63,97,.08),0 0 18px rgba(216,63,97,.40);
}
.story-detail p{
  margin:0 0 9px;color:#a4b0c5;font-size:10px;line-height:1.45;
}
.story-detail .pixeld-story-progress{
  margin:0!important;height:3px!important;
}
.visual-story-footer .pixeld-story-outcome{
  grid-column:1/-1;margin-top:0!important;padding:8px 10px!important;
  font-size:9px!important;
}

/* Rust-phase visual emphasis. */
.visual-story[data-step="1"] .visual-device,
.visual-story[data-step="2"] .visual-device{
  opacity:1;transform:none;
}
.visual-story[data-step="2"] .visual-workspace,
.visual-story[data-step="3"] .visual-workspace{
  opacity:1;transform:scale(1);
  box-shadow:0 32px 90px rgba(0,0,0,.45),0 0 36px rgba(140,136,255,.10);
}
.visual-story[data-step="3"] .preview-window.w2{
  border-color:rgba(140,136,255,.30);transform:translateY(-4px);
}
.visual-story[data-step="4"] .visual-compute,
.visual-story[data-step="5"] .visual-compute,
.visual-story[data-step="6"] .visual-compute{
  opacity:1;transform:none;
}
.visual-story[data-step="4"] .compute-node.gpu,
.visual-story[data-step="4"] .compute-node.apps{
  border-color:rgba(47,94,216,.38);
  box-shadow:0 0 24px rgba(47,94,216,.12);
  transform:translateY(-3px);
}
.visual-story[data-step="5"] .compute-node.sec,
.visual-story[data-step="5"] .compute-node.data{
  border-color:rgba(201,199,255,.34);
  box-shadow:0 0 24px rgba(201,199,255,.10);
  transform:translateY(-3px);
}
.visual-story[data-step="6"] .visual-workspace{
  opacity:1;transform:scale(1);
  border-color:rgba(216,63,97,.30);
  box-shadow:0 32px 90px rgba(0,0,0,.45),0 0 44px rgba(216,63,97,.12);
}
.visual-story[data-step="6"] .compute-core{
  border-color:rgba(216,63,97,.36);
  box-shadow:0 0 0 14px rgba(216,63,97,.025),0 0 42px rgba(216,63,97,.14);
}

@media(max-width:1050px){
  body.desktop-view.auth-locked.desktop-ready .welcome-experience{
    padding:22px 22px 78px!important;
  }
  .welcome-copy h1{font-size:clamp(34px,7vw,60px)!important}
  .visual-story-stage{
    grid-template-columns:120px 44px minmax(400px,1fr) 44px 180px;
    gap:10px;
  }
  .visual-workspace{min-height:280px}
  .visual-story-footer{grid-template-columns:1fr}
}
@media(max-width:760px){
  body.desktop-view.auth-locked.desktop-ready .welcome-experience{
    overflow:auto!important;display:block!important;padding:18px 16px 74px!important;
  }
  .welcome-topline{margin-bottom:20px}
  .welcome-copy{margin-bottom:20px!important}
  .visual-story{height:auto!important;min-height:620px!important}
  .visual-story-stage{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  .visual-link{height:30px;width:2px;justify-self:center}
  .visual-link::before{left:0;right:auto;top:0;bottom:0;width:2px;height:auto}
  .visual-link i{display:none}
  .visual-device,.visual-compute{min-height:150px;height:auto}
  .visual-workspace{height:340px}
  .visual-story-footer{display:block}
  .story-step-row{margin-bottom:12px}
}
/* PixelD 5059 — enforce the new welcome as a true full-width single-column experience. */
body.desktop-view.auth-locked.desktop-ready .welcome-experience{
  grid-template-columns:1fr!important;
}
.welcome-experience>.welcome-topline,
.welcome-experience>.welcome-copy,
.welcome-experience>.visual-story{
  grid-column:1!important;
  width:100%!important;
  max-width:none!important;
}
.welcome-copy{max-width:1100px!important;justify-self:center!important}
.visual-story{justify-self:stretch!important}

@media(max-width:1280px){
  body.desktop-view.auth-locked.desktop-ready .welcome-experience{
    padding:24px 28px 82px!important;
  }
  .visual-story-stage{
    grid-template-columns:126px 46px minmax(0,1fr) 46px 190px!important;
    gap:10px!important;
  }
  .visual-workspace{min-width:0!important}
  .visual-compute{min-width:0!important}
}
/* PixelD 5060 — authoritative welcome ordering. */
.welcome-experience>.welcome-topline{grid-row:1!important}
.welcome-experience>.welcome-copy{grid-row:2!important}
.welcome-experience>.visual-story{grid-row:3!important}
body.desktop-view.auth-locked.desktop-ready .welcome-experience{
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
/* PixelD 5061 — clean landing page */
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 14% 12%,rgba(189,184,255,.42),transparent 30%),
    radial-gradient(circle at 88% 18%,rgba(150,185,255,.30),transparent 32%),
    linear-gradient(135deg,#fbfcff 0%,#f1f3ff 42%,#e8eefb 100%)!important;
}
body.desktop-view.auth-locked .pixeld-bottom-dock{display:none!important}

body.desktop-view.auth-locked.desktop-ready .landing-welcome{
  position:absolute!important;inset:0!important;
  display:grid!important;
  grid-template-rows:auto auto minmax(0,1fr)!important;
  grid-template-columns:1fr!important;
  gap:18px!important;
  width:100vw!important;height:100vh!important;
  padding:24px 42px 28px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  color:#11172a!important;
  pointer-events:auto!important;
}
.landing-nav{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:20px!important;
  min-height:48px!important;
}
.landing-nav .locked-marketing-brand{
  display:flex!important;align-items:center!important;gap:10px!important;
  width:max-content!important;
  padding:8px 12px!important;
  border-radius:13px!important;
  background:#11172a!important;
  border:1px solid rgba(17,23,42,.08)!important;
  box-shadow:0 12px 30px rgba(47,56,96,.12)!important;
}
.landing-nav .locked-marketing-brand img{width:72px!important;height:auto!important}
.landing-nav .locked-marketing-brand span{font-size:16px!important;font-weight:800!important;color:#fff!important}
.landing-nav nav{display:flex;align-items:center;gap:6px}
.landing-nav nav button,
.landing-nav nav a{
  min-height:36px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  padding:0 13px!important;
  border-radius:10px!important;
  border:1px solid transparent!important;
  background:transparent!important;
  color:#4e5871!important;
  text-decoration:none!important;
  font-size:11px!important;font-weight:720!important;
  cursor:pointer!important;
}
.landing-nav nav button:hover,
.landing-nav nav a:hover{
  background:rgba(255,255,255,.65)!important;
  border-color:rgba(73,88,140,.10)!important;
  color:#11172a!important;
}
.landing-nav .landing-login{
  background:#11172a!important;
  color:#fff!important;
  border-color:#11172a!important;
  padding:0 16px!important;
}
.landing-nav .landing-login:hover{
  background:#1a2341!important;
  color:#fff!important;
}

.landing-hero{
  width:min(980px,100%)!important;
  justify-self:center!important;
  text-align:center!important;
  padding:4px 12px 0!important;
}
.landing-kicker{
  display:block!important;
  margin-bottom:10px!important;
  color:#626ea2!important;
  font-size:10px!important;
  font-weight:850!important;
  letter-spacing:.16em!important;
}
.landing-hero h1{
  margin:0!important;
  color:#11172a!important;
  font-size:clamp(40px,5vw,70px)!important;
  line-height:.98!important;
  letter-spacing:-.052em!important;
  text-wrap:balance!important;
}
.landing-hero p{
  max-width:820px!important;
  margin:16px auto 0!important;
  color:#5f6c84!important;
  font-size:clamp(14px,1.35vw,19px)!important;
  line-height:1.52!important;
  text-wrap:balance!important;
}
.landing-benefits{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  max-width:820px!important;
  margin:18px auto 0!important;
}
.landing-benefits span{
  display:flex!important;align-items:flex-start!important;gap:8px!important;
  padding:10px 12px!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.70)!important;
  border:1px solid rgba(66,82,135,.08)!important;
  box-shadow:0 8px 20px rgba(65,75,120,.05)!important;
  text-align:left!important;
}
.landing-benefits b{
  flex:0 0 auto!important;
  color:#17203a!important;
  font-size:11px!important;
}
.landing-benefits small{
  color:#71809b!important;
  font-size:9px!important;
  line-height:1.35!important;
}

.landing-visual{
  position:relative!important;
  width:min(1360px,100%)!important;
  height:100%!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:18px 24px!important;
  border-radius:26px!important;
  background:rgba(255,255,255,.70)!important;
  border:1px solid rgba(67,82,135,.10)!important;
  box-shadow:0 24px 70px rgba(72,85,140,.12),inset 0 1px 0 rgba(255,255,255,.85)!important;
  backdrop-filter:blur(18px)!important;
  overflow:hidden!important;
}
.landing-visual::before{
  content:"";
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 50% 50%,rgba(126,132,255,.08),transparent 36%),
    linear-gradient(90deg,rgba(91,103,181,.025) 1px,transparent 1px),
    linear-gradient(rgba(91,103,181,.025) 1px,transparent 1px);
  background-size:auto,40px 40px,40px 40px;
}
.landing-scene{
  position:relative;z-index:2;
  display:grid!important;
  grid-template-columns:minmax(130px,.85fr) minmax(60px,.32fr) minmax(460px,2.4fr) minmax(60px,.32fr) minmax(170px,1fr)!important;
  gap:16px!important;
  align-items:center!important;
  width:100%!important;height:100%!important;
}
.scene-device,.scene-compute{
  opacity:.72;
  transition:opacity .4s ease,transform .4s ease;
}
.scene-screen{
  min-height:150px!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;
  padding:16px!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(80,95,150,.10)!important;
  box-shadow:0 18px 45px rgba(73,85,135,.10)!important;
}
.scene-screen i{
  width:18px;height:18px;border-radius:50%;
  background:linear-gradient(135deg,#9d9aff,#4c75e8);
  box-shadow:0 0 0 7px rgba(119,120,240,.08),0 10px 24px rgba(72,91,194,.18);
}
.scene-screen b{font-size:17px!important;color:#17203a!important}
.scene-screen small{font-size:9px!important;line-height:1.4!important;color:#7a879f!important;text-align:center!important}

.scene-flow{
  position:relative;height:3px!important;
  background:rgba(90,104,160,.12)!important;
  border-radius:999px!important;
  overflow:visible!important;
}
.scene-flow::before{
  content:"";
  position:absolute;left:0;right:0;top:0;bottom:0;
  border-radius:999px;
  background:linear-gradient(90deg,#aaa8ff,#ffffff,#4f73e9);
  transform:scaleX(.1);
  transform-origin:left center;
  opacity:.34;
  transition:transform .55s ease,opacity .35s ease;
}
.scene-flow i{
  position:absolute;top:50%;left:0;
  width:11px;height:11px;border-radius:50%;
  transform:translate(-50%,-50%);
  background:#fff;
  border:2px solid #7778ef;
  box-shadow:0 0 0 5px rgba(119,120,239,.07),0 0 18px rgba(77,94,219,.25);
  opacity:0;
}
.landing-visual[data-step="1"] .flow-in::before,
.landing-visual[data-step="2"] .flow-in::before,
.landing-visual[data-step="3"] .flow-in::before{transform:scaleX(1);opacity:.9}
.landing-visual[data-step="1"] .flow-in i,
.landing-visual[data-step="2"] .flow-in i,
.landing-visual[data-step="3"] .flow-in i{opacity:1;animation:landingSignal 1.15s linear infinite}
.landing-visual[data-step="4"] .flow-out::before,
.landing-visual[data-step="5"] .flow-out::before,
.landing-visual[data-step="6"] .flow-out::before{transform:scaleX(1);opacity:.9}
.landing-visual[data-step="4"] .flow-out i,
.landing-visual[data-step="5"] .flow-out i,
.landing-visual[data-step="6"] .flow-out i{opacity:1;animation:landingSignal 1.15s linear infinite}
@keyframes landingSignal{from{left:0}to{left:100%}}

.scene-desktop{
  position:relative!important;
  height:86%!important;
  min-height:300px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#121a31!important;
  border:1px solid rgba(31,47,91,.18)!important;
  box-shadow:0 28px 60px rgba(49,62,111,.22)!important;
  transform:scale(.98);
  transition:transform .4s ease,box-shadow .4s ease;
}
.scene-desktop-bar{
  height:44px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  padding:0 14px!important;
  background:#18213d!important;
  border-bottom:1px solid rgba(255,255,255,.06)!important;
}
.scene-desktop-bar>span{display:flex!important;align-items:center!important;gap:8px!important}
.scene-desktop-bar img{width:58px!important;height:auto!important}
.scene-desktop-bar b{font-size:12px!important;color:#fff!important}
.scene-desktop-bar em{font-style:normal!important;font-size:9px!important;color:#91a1c0!important}
.scene-desktop-body{
  position:relative!important;
  height:calc(100% - 98px)!important;
  background:
    radial-gradient(circle at 60% 42%,rgba(80,111,233,.15),transparent 30%),
    linear-gradient(145deg,#11182e,#0b1123)!important;
}
.scene-window{
  position:absolute!important;
  padding:14px 16px!important;
  border-radius:14px!important;
  background:rgba(26,36,66,.94)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 15px 40px rgba(0,0,0,.25)!important;
}
.scene-window b{display:block!important;color:#fff!important;font-size:13px!important}
.scene-window small{display:block!important;margin-top:5px!important;color:#93a2be!important;font-size:9px!important}
.main-window{left:10%!important;top:18%!important;width:52%!important}
.side-window{right:8%!important;bottom:16%!important;width:42%!important}
.scene-status{
  position:absolute!important;left:0!important;right:0!important;bottom:0!important;
  height:54px!important;
  display:grid!important;grid-template-columns:auto 1fr auto!important;
  align-items:center!important;gap:12px!important;
  padding:0 14px!important;
  background:#0d1428!important;
  border-top:1px solid rgba(255,255,255,.06)!important;
}
.scene-status span,.scene-status em{
  font-size:8px!important;letter-spacing:.09em!important;
  color:#9c9aff!important;font-style:normal!important;
}
.scene-status b{
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  font-size:11px!important;color:#f3f6ff!important;
}
.landing-visual[data-step="3"] .scene-desktop,
.landing-visual[data-step="4"] .scene-desktop,
.landing-visual[data-step="5"] .scene-desktop,
.landing-visual[data-step="6"] .scene-desktop{
  transform:scale(1);
  box-shadow:0 30px 70px rgba(49,62,111,.26),0 0 0 1px rgba(157,154,255,.08);
}

.scene-compute{
  display:flex!important;align-items:center!important;justify-content:center!important;
}
.compute-stack{
  width:100%!important;
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;
  padding:16px!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(80,95,150,.10)!important;
  box-shadow:0 18px 45px rgba(73,85,135,.10)!important;
}
.compute-stack>b{
  grid-column:1/-1!important;
  margin-bottom:4px!important;
  color:#17203a!important;
  font-size:16px!important;
}
.compute-stack span{
  display:flex!important;align-items:center!important;justify-content:center!important;
  min-height:36px!important;
  border-radius:10px!important;
  background:#f4f6ff!important;
  color:#53617d!important;
  font-size:9px!important;font-weight:760!important;
  border:1px solid rgba(77,91,145,.06)!important;
}
.landing-visual[data-step="4"] .scene-compute,
.landing-visual[data-step="5"] .scene-compute,
.landing-visual[data-step="6"] .scene-compute{
  opacity:1!important;
  transform:translateY(-2px)!important;
}

.landing-story-meta{
  display:none!important;
}
.landing-visual.expanded{
  position:fixed!important;
  left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;
  z-index:222!important;
  width:min(1100px,calc(100vw - 36px))!important;
  height:auto!important;max-height:calc(100vh - 90px)!important;
  overflow:auto!important;
  padding:26px!important;
  background:#fff!important;
}
.landing-visual.expanded .landing-story-meta{
  display:block!important;
  margin-top:18px!important;
  color:#26304a!important;
}
.landing-visual.expanded .pixeld-story-tabs{
  display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin-bottom:14px!important;
}
.landing-visual.expanded .story-step-row{
  display:grid!important;grid-template-columns:repeat(6,1fr)!important;gap:6px!important;margin-top:14px!important;
}
.landing-visual.expanded .story-step-row span{color:#78849d!important}
.landing-visual.expanded .story-step-row span.active{color:#1c2846!important}

@media(max-width:1100px){
  body.desktop-view.auth-locked.desktop-ready .landing-welcome{
    padding:18px 22px 22px!important;
  }
  .landing-scene{
    grid-template-columns:110px 40px minmax(0,1fr) 40px 150px!important;
    gap:10px!important;
  }
  .landing-benefits{max-width:760px!important}
}
@media(max-width:760px){
  body.desktop-view.auth-locked.desktop-ready .landing-welcome{
    display:block!important;
    overflow:auto!important;
    padding:16px!important;
  }
  .landing-nav{position:relative!important}
  .landing-nav nav{gap:3px!important;overflow-x:auto!important}
  .landing-nav nav button,.landing-nav nav a{padding:0 9px!important}
  .landing-hero{padding:30px 0 18px!important}
  .landing-benefits{grid-template-columns:1fr!important}
  .landing-visual{height:auto!important;min-height:600px!important}
  .landing-scene{grid-template-columns:1fr!important;gap:12px!important}
  .scene-flow{width:3px!important;height:28px!important;justify-self:center!important}
  .scene-flow::before{transform:scaleY(.1)!important;transform-origin:center top!important}
  .scene-flow i{display:none!important}
  .scene-desktop{height:340px!important}
}
/* PixelD 5062 — hard reset landing layout: no inherited split grid. */
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  gap:16px!important;
  grid-template-columns:none!important;
  grid-template-rows:none!important;
  width:100vw!important;
  height:100vh!important;
  padding:22px 38px 24px!important;
  overflow:hidden!important;
}
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-nav,
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-hero,
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-visual{
  grid-column:auto!important;
  grid-row:auto!important;
  width:100%!important;
  max-width:none!important;
}
.landing-nav{flex:0 0 auto!important}
.landing-hero{
  flex:0 0 auto!important;
  width:min(980px,100%)!important;
  max-width:980px!important;
  margin:0 auto!important;
  padding:2px 0 0!important;
}
.landing-hero h1{
  font-size:clamp(42px,4.6vw,66px)!important;
  line-height:.99!important;
}
.landing-hero p{
  max-width:760px!important;
  font-size:clamp(14px,1.25vw,18px)!important;
  margin-top:12px!important;
}
.landing-benefits{
  max-width:760px!important;
  margin-top:14px!important;
}
.landing-benefits span{
  padding:9px 11px!important;
}
.landing-visual{
  flex:1 1 auto!important;
  min-height:0!important;
  width:min(1360px,100%)!important;
  max-width:1360px!important;
  margin:0 auto!important;
  padding:18px 22px!important;
}

/* Simplify the visual: one clear device → workspace → compute story. */
.landing-scene{
  grid-template-columns:minmax(120px,.75fr) minmax(54px,.26fr) minmax(500px,2.6fr) minmax(54px,.26fr) minmax(160px,.9fr)!important;
  gap:14px!important;
}
.scene-desktop{
  min-width:0!important;
  height:84%!important;
  min-height:290px!important;
}
.scene-desktop-body{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
}
.scene-window.main-window{
  position:relative!important;
  left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;
  width:min(560px,84%)!important;
  min-height:132px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(42,57,103,.98),rgba(27,39,74,.98))!important;
}
.scene-window.main-window b{
  font-size:22px!important;
  letter-spacing:-.03em!important;
}
.scene-window.main-window small{
  font-size:11px!important;
  margin-top:8px!important;
}
.scene-window.side-window{display:none!important}
.scene-compute{min-width:0!important}
.compute-stack{
  grid-template-columns:1fr 1fr!important;
  padding:14px!important;
}
.compute-stack>b{
  font-size:14px!important;
  text-align:center!important;
}
.compute-stack span{
  min-height:34px!important;
}

/* Keep details out of the hero until Use cases is explicitly opened. */
.landing-story-meta{display:none!important}

@media(max-width:900px){
  body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
    padding:18px 20px 20px!important;
  }
  .landing-scene{
    grid-template-columns:100px 34px minmax(0,1fr) 34px 135px!important;
    gap:8px!important;
  }
}
/* PixelD 5063 — premium dark-blue landing with lower menu restored. */
body.desktop-view.auth-locked .pixel-stage{
  background:
    radial-gradient(circle at 18% 16%,rgba(125,118,255,.18),transparent 28%),
    radial-gradient(circle at 80% 22%,rgba(60,99,210,.22),transparent 30%),
    radial-gradient(circle at 58% 82%,rgba(255,255,255,.035),transparent 30%),
    linear-gradient(145deg,#0c1328 0%,#111c3b 46%,#080d1c 100%)!important;
}
body.desktop-view.auth-locked .pixeld-bottom-dock{
  display:flex!important;
  position:fixed!important;
  left:50%!important;right:auto!important;bottom:18px!important;top:auto!important;
  transform:translateX(-50%)!important;
  width:max-content!important;
  min-height:44px!important;
  padding:5px 7px!important;
  border-radius:15px!important;
  background:rgba(7,11,23,.88)!important;
  border:1px solid rgba(182,184,255,.13)!important;
  box-shadow:0 16px 45px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.04)!important;
  backdrop-filter:blur(16px)!important;
  z-index:245!important;
}
body.desktop-view.auth-locked .pixeld-bottom-dock .dock-locked-only{display:flex!important}
body.desktop-view.auth-locked .pixeld-bottom-dock .dock-auth-only{display:none!important}
body.desktop-view.auth-locked .landing-nav nav{display:none!important}
body.desktop-view.auth-locked .landing-nav{
  justify-content:flex-start!important;
  min-height:42px!important;
}
body.desktop-view.auth-locked .landing-nav .locked-marketing-brand{
  background:rgba(9,14,29,.74)!important;
  border-color:rgba(190,191,255,.13)!important;
  box-shadow:none!important;
}

body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:14px!important;
  width:100vw!important;height:100vh!important;
  padding:24px 42px 78px!important;
  overflow:hidden!important;
  color:#fff!important;
}
.landing-hero{
  max-width:920px!important;
  margin:0 auto!important;
  text-align:center!important;
  padding:4px 0 2px!important;
}
.landing-kicker{
  color:#b9bbff!important;
  margin-bottom:9px!important;
}
.landing-hero h1{
  color:#fff!important;
  font-size:clamp(40px,4.7vw,68px)!important;
  line-height:.98!important;
  letter-spacing:-.052em!important;
}
.landing-hero p{
  max-width:760px!important;
  color:#b8c3d9!important;
  font-size:clamp(14px,1.25vw,18px)!important;
  line-height:1.5!important;
  margin-top:13px!important;
}
.landing-benefits{
  max-width:760px!important;
  margin:15px auto 0!important;
  gap:8px!important;
}
.landing-benefits span{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:none!important;
  padding:9px 11px!important;
}
.landing-benefits b{color:#fff!important}
.landing-benefits small{color:#91a1bf!important}

.landing-visual{
  flex:1 1 auto!important;
  min-height:0!important;
  width:min(1320px,100%)!important;
  max-width:1320px!important;
  margin:0 auto!important;
  padding:18px 22px!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 50% 36%,rgba(89,102,210,.12),transparent 34%),
    linear-gradient(145deg,rgba(15,23,49,.86),rgba(8,13,28,.94))!important;
  border:1px solid rgba(188,190,255,.10)!important;
  box-shadow:0 28px 85px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.landing-scene{
  position:relative!important;
  display:block!important;
  width:100%!important;height:100%!important;
}
.scene-desktop{
  position:absolute!important;
  left:50%!important;top:50%!important;
  transform:translate(-50%,-50%) scale(.98)!important;
  width:min(760px,66%)!important;
  height:82%!important;
  min-height:300px!important;
  border-radius:26px!important;
  background:#111a34!important;
  border:1px solid rgba(255,255,255,.09)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.38)!important;
  z-index:4!important;
}
.landing-visual[data-step="3"] .scene-desktop,
.landing-visual[data-step="4"] .scene-desktop,
.landing-visual[data-step="5"] .scene-desktop,
.landing-visual[data-step="6"] .scene-desktop{
  transform:translate(-50%,-50%) scale(1)!important;
}
.scene-device{
  position:absolute!important;
  left:3%!important;top:50%!important;
  transform:translateY(-50%)!important;
  width:150px!important;
  z-index:3!important;
}
.scene-screen{
  min-height:116px!important;
  padding:14px!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.scene-screen b{color:#fff!important}
.scene-screen small{color:#8ea0bf!important}

.scene-compute{
  position:absolute!important;
  right:2%!important;top:50%!important;
  transform:translateY(-50%)!important;
  width:176px!important;
  z-index:3!important;
}
.compute-stack{
  padding:14px!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}
.compute-stack>b{color:#fff!important}
.compute-stack span{
  background:rgba(255,255,255,.045)!important;
  color:#a8b5ce!important;
  border-color:rgba(255,255,255,.05)!important;
}

.scene-flow{
  position:absolute!important;
  top:50%!important;
  height:2px!important;
  background:rgba(255,255,255,.08)!important;
  z-index:2!important;
}
.flow-in{
  left:calc(3% + 145px)!important;
  width:calc(50% - 3% - 145px - 380px)!important;
}
.flow-out{
  right:calc(2% + 170px)!important;
  width:calc(50% - 2% - 170px - 380px)!important;
}
.scene-flow::before{
  background:linear-gradient(90deg,#8f8cff,#d9dcff,#416fd9)!important;
}

.scene-desktop-bar{background:#17223f!important}
.scene-desktop-body{
  background:
    radial-gradient(circle at 58% 42%,rgba(74,103,218,.14),transparent 30%),
    linear-gradient(145deg,#10182e,#0b1022)!important;
}
.scene-window.main-window{
  width:min(520px,80%)!important;
  min-height:138px!important;
  background:linear-gradient(145deg,rgba(36,49,91,.98),rgba(24,34,67,.98))!important;
  border-color:rgba(255,255,255,.08)!important;
}
.scene-status{background:#0b1226!important}

/* Supporting labels, not competing cards. */
.scene-device,
.scene-compute{
  opacity:.58!important;
  transition:opacity .35s ease,transform .35s ease!important;
}
.landing-visual[data-step="1"] .scene-device,
.landing-visual[data-step="2"] .scene-device{opacity:1!important}
.landing-visual[data-step="4"] .scene-compute,
.landing-visual[data-step="5"] .scene-compute,
.landing-visual[data-step="6"] .scene-compute{opacity:1!important}

@media(max-width:1000px){
  body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
    padding:20px 22px 74px!important;
  }
  .scene-desktop{width:min(680px,72%)!important}
  .scene-device{left:1%!important;width:120px!important}
  .scene-compute{right:1%!important;width:145px!important}
  .flow-in,.flow-out{display:none!important}
}
@media(max-width:760px){
  .scene-device,.scene-compute{display:none!important}
  .scene-desktop{width:92%!important;height:82%!important}
  .landing-benefits{grid-template-columns:1fr!important}
}
/* PixelD 5064 — make the product advantage explicit in the hero graphic. */
.scene-screen em{
  display:block!important;
  margin-top:7px!important;
  color:#7888aa!important;
  font-size:8px!important;
  font-style:normal!important;
  line-height:1.35!important;
  text-align:center!important;
}
.scene-window.main-window em{
  display:block!important;
  margin-top:10px!important;
  color:#b9c4dc!important;
  font-size:9px!important;
  font-style:normal!important;
}
.flow-in::after,
.flow-out::after{
  position:absolute;
  left:50%;
  top:-24px;
  transform:translateX(-50%);
  width:max-content;
  max-width:150px;
  text-align:center;
  color:#8291b2;
  font-size:8px;
  font-weight:760;
  letter-spacing:.04em;
  white-space:nowrap;
}
.flow-in::after{content:"REAL-TIME INTERACTION"}
.flow-out::after{content:"EXECUTION + DATA STAY CENTRAL"}

.compute-stack span{
  text-align:center!important;
  padding:0 6px!important;
}
.scene-device::after{
  content:"LOW ENDPOINT COST";
  display:block;
  margin-top:10px;
  text-align:center;
  color:#6f7f9f;
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
}
.scene-compute::after{
  content:"HIGH-PERFORMANCE BACKEND";
  position:absolute;
  left:0;right:0;bottom:-20px;
  text-align:center;
  color:#6f7f9f;
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
}
/* PixelD 5065 — platform illustration + global glowing D */
.pd-d{
  color:#ff4f73!important;
  text-shadow:
    0 0 4px rgba(255,79,115,.95),
    0 0 10px rgba(255,79,115,.70),
    0 0 20px rgba(216,63,97,.42)!important;
  filter:drop-shadow(0 0 5px rgba(255,79,115,.45))!important;
}

/* One unified platform instead of three unrelated boxes. */
.landing-visual{
  perspective:1200px!important;
  background:
    radial-gradient(circle at 50% 8%,rgba(103,119,255,.16),transparent 28%),
    radial-gradient(circle at 50% 64%,rgba(70,93,191,.14),transparent 38%),
    linear-gradient(145deg,rgba(12,19,42,.96),rgba(6,10,23,.98))!important;
}
.landing-visual::after{
  content:"";
  position:absolute;
  left:8%;right:8%;bottom:10%;
  height:54%;
  border-radius:34px;
  background:
    linear-gradient(180deg,rgba(88,108,201,.18),rgba(26,38,81,.32)),
    rgba(16,24,51,.72);
  border:1px solid rgba(174,180,255,.10);
  box-shadow:
    0 34px 90px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.035);
  transform:rotateX(61deg);
  transform-origin:center bottom;
  z-index:0;
}
.landing-scene::before{
  content:"";
  position:absolute;
  left:11%;right:11%;top:48%;
  height:90px;
  background:linear-gradient(90deg,
    transparent,
    rgba(132,145,255,.05) 12%,
    rgba(111,139,255,.20) 46%,
    rgba(255,255,255,.08) 52%,
    rgba(73,111,221,.18) 72%,
    transparent);
  filter:blur(10px);
  z-index:1;
  pointer-events:none;
}

/* Endpoint module: intentionally lighter/smaller than the workspace. */
.scene-device{
  left:5%!important;
  width:158px!important;
  z-index:5!important;
}
.scene-screen{
  min-height:126px!important;
  background:
    radial-gradient(circle at 50% 22%,rgba(154,158,255,.13),transparent 35%),
    linear-gradient(160deg,rgba(26,36,72,.96),rgba(15,23,49,.96))!important;
  border-color:rgba(161,168,255,.14)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.22)!important;
}
.scene-screen i{
  background:linear-gradient(135deg,#c5c3ff,#657ff0)!important;
  box-shadow:0 0 0 7px rgba(148,146,255,.07),0 0 24px rgba(103,119,255,.34)!important;
}
.scene-device::before{
  content:"ACCESS";
  display:block;
  margin-bottom:8px;
  text-align:center;
  color:#9ba8c6;
  font-size:8px;
  font-weight:850;
  letter-spacing:.15em;
}

/* Main PixelD workspace is the hero object. */
.scene-desktop{
  width:min(790px,67%)!important;
  height:84%!important;
  border-radius:28px!important;
  background:linear-gradient(145deg,#131e3d,#0c142a)!important;
  border-color:rgba(172,179,255,.15)!important;
  box-shadow:
    0 42px 110px rgba(0,0,0,.40),
    0 0 0 1px rgba(255,255,255,.025) inset,
    0 0 54px rgba(75,98,219,.09)!important;
}
.scene-desktop::before{
  content:"AIOTOR PIXELD";
  position:absolute;
  left:18px;top:-22px;
  color:#aab6d3;
  font-size:8px;
  font-weight:850;
  letter-spacing:.14em;
}
.scene-desktop-bar{
  background:linear-gradient(180deg,#1a274b,#14203d)!important;
}
.scene-window.main-window{
  min-height:150px!important;
  background:
    radial-gradient(circle at 50% 24%,rgba(111,129,246,.14),transparent 40%),
    linear-gradient(145deg,rgba(39,54,100,.98),rgba(24,35,70,.98))!important;
  border-color:rgba(180,185,255,.15)!important;
  box-shadow:0 20px 54px rgba(0,0,0,.25)!important;
}
.scene-window.main-window b{
  font-size:23px!important;
}
.scene-window.main-window small{
  color:#c0c9dc!important;
}

/* Centralized compute is the backend source of power. */
.scene-compute{
  right:4%!important;
  width:188px!important;
  z-index:5!important;
}
.compute-stack{
  background:
    radial-gradient(circle at 50% 18%,rgba(80,111,226,.13),transparent 36%),
    linear-gradient(160deg,rgba(25,35,70,.96),rgba(14,22,47,.96))!important;
  border-color:rgba(141,157,240,.14)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.22)!important;
}
.compute-stack>b{
  font-size:15px!important;
}
.compute-stack span{
  background:rgba(255,255,255,.045)!important;
  color:#c0cbe0!important;
}
.scene-compute::before{
  content:"CENTRALIZED BACKEND";
  position:absolute;
  left:0;right:0;top:-22px;
  text-align:center;
  color:#9ba8c6;
  font-size:8px;
  font-weight:850;
  letter-spacing:.13em;
}

/* Flow labels are the core advantage. */
.flow-in::after{
  content:"REAL-TIME PIXELS + INPUT"!important;
  color:#a9b5d1!important;
}
.flow-out::after{
  content:"HEAVY EXECUTION STAYS CENTRAL"!important;
  color:#a9b5d1!important;
}
.flow-in,.flow-out{
  z-index:4!important;
}
.flow-in::before,.flow-out::before{
  background:linear-gradient(90deg,#9a97ff,#e5e7ff,#4e79e8)!important;
}
/* PixelD 5066 — Rust-driven rotating application scenes + refined crimson D */
.pd-d{
  color:#e14b63!important;
  text-shadow:0 0 3px rgba(225,75,99,.58),0 0 7px rgba(225,75,99,.24)!important;
  filter:none!important;
}

/* App scene container */
.scene-window.main-window{
  min-height:190px!important;
  padding:14px!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  text-align:left!important;
}
.app-scene-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:10px!important;
}
.app-scene-head b{
  color:#fff!important;
  font-size:16px!important;
  letter-spacing:-.025em!important;
}
.app-scene-head small{
  color:#8fa0be!important;
  font-size:9px!important;
}
[data-pd-app-foot]{
  display:block!important;
  margin-top:9px!important;
  color:#9eabc4!important;
  font-size:8px!important;
  font-style:normal!important;
  letter-spacing:.03em!important;
}
.app-demo{
  position:relative!important;
  flex:1 1 auto!important;
  min-height:116px!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:#0e162b!important;
  border:1px solid rgba(255,255,255,.055)!important;
}
.app-demo-scene{
  position:absolute!important;
  inset:0!important;
  display:none!important;
  padding:10px 11px!important;
  opacity:0!important;
  transform:scale(.985) translateY(3px)!important;
}
.app-demo-scene.active{
  display:block!important;
  opacity:1!important;
  transform:none!important;
  animation:pdAppIn .38s cubic-bezier(.2,.8,.2,1) both!important;
}
@keyframes pdAppIn{
  from{opacity:0;transform:scale(.985) translateY(5px)}
  to{opacity:1;transform:none}
}
.app-demo-scene header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:8px!important;
}
.app-demo-scene header span{
  color:#f6f8ff!important;
  font-size:10px!important;
  font-weight:800!important;
}
.app-demo-scene header em{
  color:#70809f!important;
  font-size:8px!important;
  font-style:normal!important;
}

/* Spreadsheet */
.excel-grid{
  display:grid!important;
  grid-template-columns:repeat(6,1fr)!important;
  grid-template-rows:repeat(2,1fr)!important;
  gap:3px!important;
  height:72px!important;
}
.excel-grid i{
  border-radius:3px!important;
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(255,255,255,.035)!important;
}
.excel-grid i:nth-child(2),
.excel-grid i:nth-child(8){
  background:rgba(73,151,118,.28)!important;
  border-color:rgba(92,184,144,.25)!important;
}
.excel-grid i:nth-child(4),
.excel-grid i:nth-child(10){
  background:rgba(72,109,202,.20)!important;
}

/* ERP */
.erp-kpis{
  display:grid!important;
  grid-template-columns:repeat(3,1fr)!important;
  gap:5px!important;
}
.erp-kpis i{
  min-height:42px!important;
  padding:6px!important;
  border-radius:6px!important;
  background:rgba(255,255,255,.035)!important;
  color:#7d8dac!important;
  font-size:7px!important;
  font-style:normal!important;
}
.erp-kpis b{
  display:block!important;
  margin-top:5px!important;
  color:#fff!important;
  font-size:10px!important;
}
.erp-bars{
  display:flex!important;
  align-items:flex-end!important;
  gap:5px!important;
  height:34px!important;
  margin-top:6px!important;
}
.erp-bars i{
  flex:1!important;
  border-radius:3px 3px 0 0!important;
  background:linear-gradient(180deg,#6d7fee,#334e9f)!important;
}
.erp-bars i:nth-child(1){height:38%!important}
.erp-bars i:nth-child(2){height:62%!important}
.erp-bars i:nth-child(3){height:84%!important}
.erp-bars i:nth-child(4){height:56%!important}

/* Blender */
.blender-view{
  position:relative!important;
  height:82px!important;
  overflow:hidden!important;
  border-radius:8px!important;
  background:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
    #121926!important;
  background-size:14px 14px!important;
  perspective:180px!important;
}
.cube-face{
  position:absolute!important;
  width:34px!important;
  height:34px!important;
  left:50%!important;
  top:50%!important;
  margin:-17px 0 0 -17px!important;
  border:1px solid rgba(255,160,78,.75)!important;
  background:rgba(255,139,60,.10)!important;
}
.cube-face.f1{transform:rotateX(58deg) rotateZ(45deg)!important}
.cube-face.f2{transform:translate(-12px,10px) rotateY(58deg) rotateZ(45deg)!important;opacity:.72!important}
.cube-face.f3{transform:translate(12px,10px) rotateY(-58deg) rotateZ(45deg)!important;opacity:.55!important}
.blender-view .axis{
  position:absolute!important;
  left:50%!important;top:50%!important;
  transform-origin:left center!important;
}
.blender-view .axis.x{width:46px!important;height:1px!important;background:#df5b5b!important}
.blender-view .axis.y{width:42px!important;height:1px!important;background:#65c27b!important;transform:rotate(-54deg)!important}
.blender-view .axis.z{width:1px!important;height:38px!important;background:#5a83df!important}

/* VS Code */
.code-view{
  display:grid!important;
  grid-template-columns:28px 1fr!important;
  gap:7px!important;
  height:78px!important;
}
.code-view aside{
  border-radius:5px!important;
  background:
    linear-gradient(rgba(255,255,255,.04) 8px,transparent 8px) 0 0/100% 14px,
    rgba(255,255,255,.025)!important;
}
.code-view pre{
  margin:0!important;
  padding:8px!important;
  border-radius:5px!important;
  background:#0b1222!important;
}
.code-view pre i{
  display:block!important;
  height:4px!important;
  margin:5px 0!important;
  border-radius:3px!important;
  background:#5971bb!important;
}
.code-view pre i:nth-child(2){width:76%!important;background:#8c77c9!important}
.code-view pre i:nth-child(3){width:58%!important;background:#53a7a1!important}
.code-view pre i:nth-child(4){width:84%!important}
.code-view pre i:nth-child(5){width:66%!important;background:#c7875d!important}
.code-view pre i:nth-child(6){width:44%!important}

/* Jupyter */
.notebook-view{
  display:grid!important;
  grid-template-columns:1.2fr .8fr!important;
  grid-template-rows:1fr 1fr!important;
  gap:5px!important;
  height:80px!important;
}
.notebook-view .cell{
  border-radius:5px!important;
  background:#f7f8fb!important;
  border-left:3px solid #df8a42!important;
}
.notebook-view .c1{grid-column:1!important;grid-row:1!important}
.notebook-view .c2{grid-column:1!important;grid-row:2!important;border-left-color:#5c8fdc!important}
.notebook-view .chart{
  grid-column:2!important;
  grid-row:1/3!important;
  display:flex!important;
  align-items:flex-end!important;
  gap:4px!important;
  padding:8px!important;
  border-radius:5px!important;
  background:#f7f8fb!important;
}
.notebook-view .chart i{
  flex:1!important;
  border-radius:2px 2px 0 0!important;
  background:#5d7cd8!important;
}
.notebook-view .chart i:nth-child(1){height:30%!important}
.notebook-view .chart i:nth-child(2){height:68%!important}
.notebook-view .chart i:nth-child(3){height:45%!important}
.notebook-view .chart i:nth-child(4){height:82%!important}
.notebook-view .chart i:nth-child(5){height:58%!important}

/* Keep app scenes readable at smaller desktop widths */
@media(max-width:1000px){
  .scene-window.main-window{min-height:174px!important}
  .app-demo{min-height:102px!important}
  .app-scene-head small{display:none!important}
}
/* PixelD 5067 — App Fabric family theme + full-canvas workstation apps */

/* AIOTOR App Fabric family theme */
body.desktop-view.auth-locked .pixel-stage,
.linux-boot{
  background:
    radial-gradient(circle at 76% 38%,rgba(72,162,181,.11),transparent 28%),
    radial-gradient(circle at 18% 72%,rgba(34,57,120,.13),transparent 30%),
    radial-gradient(circle at 74% 20%,rgba(111,55,105,.13),transparent 24%),
    linear-gradient(145deg,#06080c 0%,#080d14 58%,#07101a 100%)!important;
}
body.desktop-view.auth-locked .pixel-stage::after,
.linux-boot::after{
  content:"";
  position:absolute;inset:0;
  pointer-events:none;
  opacity:.20;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,#000,transparent 78%);
}

/* Welcome typography */
.landing-hero h1{
  color:#fff!important;
}
.landing-hero h1::first-line{
  color:#fff;
}
.landing-hero h1{
  background:linear-gradient(90deg,#fff 0%,#f2b6ca 48%,#a5c5ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.landing-hero p{
  color:#aeb8c7!important;
}
.landing-kicker{
  color:#f2b6ca!important;
}
.landing-benefits span{
  background:rgba(255,255,255,.025)!important;
  border-color:rgba(255,255,255,.075)!important;
}
.landing-benefits small{color:#8d99aa!important}

/* Main visual follows App Fabric's large product-window treatment */
.landing-visual{
  background:
    radial-gradient(circle at 72% 38%,rgba(72,162,181,.08),transparent 30%),
    rgba(8,10,15,.86)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:0 38px 100px rgba(0,0,0,.38)!important;
  border-radius:23px!important;
}
.scene-desktop{
  width:min(860px,70%)!important;
  height:88%!important;
  background:#080a0f!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:23px!important;
  box-shadow:0 38px 100px rgba(0,0,0,.38)!important;
}
.scene-desktop-bar{
  height:44px!important;
  background:#080a0f!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
}
.scene-desktop-bar em{
  color:#737e8b!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
}
.scene-desktop-body{
  position:relative!important;
  display:block!important;
  height:calc(100% - 98px)!important;
  min-height:0!important;
  padding:0!important;
  background:
    radial-gradient(circle at 70% 38%,rgba(72,162,181,.08),transparent 30%),
    linear-gradient(145deg,#0a0d13,#080b11)!important;
}

/* Full app area — remove the card-inside-card effect */
.scene-window.main-window{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  display:flex!important;
  flex-direction:column!important;
}
.app-scene-head{
  flex:0 0 38px!important;
  margin:0!important;
  padding:0 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  background:rgba(255,255,255,.018)!important;
  border-bottom:1px solid rgba(255,255,255,.06)!important;
}
.app-scene-head b{
  font-size:13px!important;
  color:#f7f9fc!important;
}
.app-scene-head small{
  color:#737e8b!important;
  font-size:8px!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.app-demo{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  border:0!important;
  border-radius:0!important;
  background:#090d14!important;
}
.app-demo-scene{
  padding:14px 16px!important;
}
.app-demo-scene header{
  margin-bottom:12px!important;
}
[data-pd-app-foot]{
  flex:0 0 28px!important;
  margin:0!important;
  padding:8px 14px 0!important;
  border-top:1px solid rgba(255,255,255,.05)!important;
  color:#758196!important;
  font-size:8px!important;
}

/* Make each demo actually use the available app canvas */
.excel-grid{
  height:calc(100% - 30px)!important;
  grid-template-columns:repeat(8,1fr)!important;
  grid-template-rows:repeat(5,1fr)!important;
}
.erp-kpis{
  grid-template-columns:repeat(3,1fr)!important;
}
.erp-kpis i{
  min-height:58px!important;
}
.erp-bars{
  height:calc(100% - 78px)!important;
  min-height:88px!important;
  padding:8px 6px 0!important;
}
.blender-view{
  height:calc(100% - 30px)!important;
  min-height:170px!important;
  background-size:24px 24px!important;
}
.blender-view .cube-face{
  width:58px!important;height:58px!important;
  margin:-29px 0 0 -29px!important;
}
.code-view{
  height:calc(100% - 30px)!important;
  min-height:170px!important;
  grid-template-columns:44px 1fr!important;
}
.code-view pre{
  padding:16px!important;
}
.code-view pre i{
  height:6px!important;
  margin:9px 0!important;
}
.notebook-view{
  height:calc(100% - 30px)!important;
  min-height:170px!important;
  gap:8px!important;
}
.notebook-view .cell,
.notebook-view .chart{
  border-radius:7px!important;
}

/* Side modules are supporting only */
.scene-device,
.scene-compute{
  transform:translateY(-50%) scale(.93)!important;
}
.scene-device{left:3%!important}
.scene-compute{right:3%!important}
.scene-screen,
.compute-stack{
  background:rgba(8,12,20,.72)!important;
  border-color:rgba(255,255,255,.08)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.24)!important;
}

/* Lower dock matches the AIOTOR family */
body.desktop-view.auth-locked .pixeld-bottom-dock{
  background:rgba(8,10,15,.88)!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 16px 45px rgba(0,0,0,.32)!important;
}

/* Boot now uses same family styling */
.linux-boot{
  color:#fff!important;
}
.linux-boot-logo{
  background:rgba(8,10,15,.72)!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.30)!important;
}
.linux-boot-kicker{
  color:#f2b6ca!important;
}
.linux-boot>b{
  background:linear-gradient(90deg,#fff 0%,#f2b6ca 50%,#a5c5ff 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
}
.linux-boot-progress{
  background:rgba(255,255,255,.06)!important;
}
.linux-boot-progress i{
  background:linear-gradient(90deg,#fff,#f2b6ca 48%,#a5c5ff 100%)!important;
}
.linux-boot p{color:#aab5c5!important}
.linux-boot small,.linux-boot-footer{color:#6f7b8d!important}

/* Refined D: visible, not bloated */
.pd-d{
  color:#e45268!important;
  text-shadow:0 0 2px rgba(228,82,104,.50),0 0 6px rgba(228,82,104,.18)!important;
  filter:none!important;
}

@media(max-width:1100px){
  .scene-desktop{width:76%!important}
  .scene-device{width:118px!important}
  .scene-compute{width:145px!important}
}
/* PixelD 5068 — split hero: all graphics left, all copy right */
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
  display:grid!important;
  grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  column-gap:34px!important;
  row-gap:18px!important;
  align-items:stretch!important;
  padding:24px 38px 78px!important;
  overflow:hidden!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-nav{
  grid-column:1 / -1!important;
  grid-row:1!important;
  width:100%!important;
  min-height:42px!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-visual{
  grid-column:1!important;
  grid-row:2!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  align-self:stretch!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-hero{
  grid-column:2!important;
  grid-row:2!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:18px 10px 20px 12px!important;
  align-self:center!important;
  text-align:left!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-hero h1{
  font-size:clamp(40px,4.3vw,66px)!important;
  line-height:.98!important;
  margin:0!important;
  text-align:left!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-hero p{
  max-width:620px!important;
  margin:18px 0 0!important;
  font-size:clamp(14px,1.18vw,18px)!important;
  line-height:1.55!important;
  text-align:left!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-kicker{
  text-align:left!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-benefits{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  width:100%!important;
  max-width:620px!important;
  margin:20px 0 0!important;
}

body.desktop-view.auth-locked.desktop-ready .landing-benefits span{
  display:grid!important;
  grid-template-columns:150px 1fr!important;
  align-items:center!important;
  gap:12px!important;
  padding:12px 14px!important;
  text-align:left!important;
  border-radius:13px!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-benefits b{
  font-size:12px!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-benefits small{
  font-size:10px!important;
  line-height:1.45!important;
}

/* Left panel is now entirely graphical */
body.desktop-view.auth-locked.desktop-ready .landing-scene{
  height:100%!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-desktop{
  width:72%!important;
  height:86%!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-device{
  left:2.5%!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-compute{
  right:2.5%!important;
}

/* Keep supporting labels compact so the workstation remains dominant */
body.desktop-view.auth-locked.desktop-ready .scene-device{
  width:132px!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-compute{
  width:154px!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-screen{
  min-height:112px!important;
}
body.desktop-view.auth-locked.desktop-ready .compute-stack{
  padding:12px!important;
}

/* Bottom menu retained */
body.desktop-view.auth-locked .pixeld-bottom-dock{
  bottom:16px!important;
}

@media(max-width:1050px){
  body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
    grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr)!important;
    column-gap:22px!important;
    padding:20px 22px 74px!important;
  }
  body.desktop-view.auth-locked.desktop-ready .scene-desktop{
    width:76%!important;
  }
  body.desktop-view.auth-locked.desktop-ready .scene-device{
    width:108px!important;
  }
  body.desktop-view.auth-locked.desktop-ready .scene-compute{
    width:130px!important;
  }
}

@media(max-width:780px){
  body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
    display:flex!important;
    flex-direction:column!important;
    overflow:auto!important;
  }
  body.desktop-view.auth-locked.desktop-ready .landing-visual{
    min-height:500px!important;
    order:2!important;
  }
  body.desktop-view.auth-locked.desktop-ready .landing-hero{
    order:1!important;
  }
}
/* PixelD 5069 — full-height split hero, zero text overlap */
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
  position:absolute!important;
  inset:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,56fr) minmax(390px,44fr)!important;
  grid-template-rows:minmax(0,1fr)!important;
  gap:34px!important;
  width:100vw!important;
  height:100vh!important;
  padding:24px 38px 74px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
}

/* Brand floats; it never consumes layout height. */
body.desktop-view.auth-locked.desktop-ready .landing-nav{
  position:absolute!important;
  left:30px!important;
  top:24px!important;
  z-index:20!important;
  width:max-content!important;
  min-height:0!important;
  grid-column:auto!important;
  grid-row:auto!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-nav nav{display:none!important}

/* Graphic owns the complete left column and full available height. */
body.desktop-view.auth-locked.desktop-ready .landing-visual{
  grid-column:1!important;
  grid-row:1!important;
  align-self:stretch!important;
  justify-self:stretch!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  padding:18px!important;
  box-sizing:border-box!important;
}

/* Copy owns only the right column. */
body.desktop-view.auth-locked.desktop-ready .landing-hero{
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
  justify-self:stretch!important;
  width:100%!important;
  max-width:560px!important;
  min-width:0!important;
  margin:0!important;
  padding:0 12px 0 0!important;
  box-sizing:border-box!important;
  text-align:left!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-hero h1{
  max-width:540px!important;
  margin:0!important;
  font-size:clamp(42px,4.15vw,64px)!important;
  line-height:1.01!important;
  letter-spacing:-.05em!important;
  text-wrap:balance!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-hero p{
  max-width:535px!important;
  margin:18px 0 0!important;
  font-size:clamp(14px,1.12vw,17px)!important;
  line-height:1.55!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-benefits{
  width:100%!important;
  max-width:535px!important;
  margin:20px 0 0!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-benefits span{
  grid-template-columns:140px minmax(0,1fr)!important;
  padding:11px 13px!important;
}

/* Workstation fills the graphic vertically and stays dominant. */
body.desktop-view.auth-locked.desktop-ready .landing-scene{
  position:relative!important;
  width:100%!important;
  height:100%!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-desktop{
  left:50%!important;
  top:50%!important;
  width:76%!important;
  height:92%!important;
  min-height:0!important;
  transform:translate(-50%,-50%)!important;
}
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="1"] .scene-desktop,
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="2"] .scene-desktop,
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="3"] .scene-desktop,
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="4"] .scene-desktop,
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="5"] .scene-desktop,
body.desktop-view.auth-locked.desktop-ready .landing-visual[data-step="6"] .scene-desktop{
  transform:translate(-50%,-50%)!important;
}

/* Keep endpoint/backend compact and completely inside graphic column. */
body.desktop-view.auth-locked.desktop-ready .scene-device{
  left:1.2%!important;
  top:50%!important;
  width:108px!important;
  transform:translateY(-50%)!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-compute{
  right:1.2%!important;
  top:50%!important;
  width:124px!important;
  transform:translateY(-50%)!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-screen{
  min-height:104px!important;
  padding:10px!important;
}
body.desktop-view.auth-locked.desktop-ready .compute-stack{
  padding:10px!important;
}
body.desktop-view.auth-locked.desktop-ready .compute-stack span{
  min-height:28px!important;
  padding:0 4px!important;
  font-size:7px!important;
}

/* Remove verbose labels that collide with the workstation. */
body.desktop-view.auth-locked.desktop-ready .scene-flow::after,
body.desktop-view.auth-locked.desktop-ready .scene-device::after,
body.desktop-view.auth-locked.desktop-ready .scene-compute::after,
body.desktop-view.auth-locked.desktop-ready .scene-device::before,
body.desktop-view.auth-locked.desktop-ready .scene-compute::before{
  display:none!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-flow{
  opacity:.65!important;
}

/* Maximize actual application canvas inside workstation. */
body.desktop-view.auth-locked.desktop-ready .scene-desktop-body{
  height:calc(100% - 86px)!important;
}
body.desktop-view.auth-locked.desktop-ready .scene-status{
  height:42px!important;
}
body.desktop-view.auth-locked.desktop-ready .app-scene-head{
  flex-basis:34px!important;
}
body.desktop-view.auth-locked.desktop-ready [data-pd-app-foot]{
  flex-basis:24px!important;
  padding-top:6px!important;
}

/* Lower menu remains an overlay and never steals hero height. */
body.desktop-view.auth-locked .pixeld-bottom-dock{
  bottom:14px!important;
  z-index:250!important;
}

@media(max-width:1050px){
  body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome{
    grid-template-columns:minmax(0,55fr) minmax(330px,45fr)!important;
    gap:20px!important;
    padding:20px 22px 70px!important;
  }
  body.desktop-view.auth-locked.desktop-ready .scene-desktop{width:78%!important}
  body.desktop-view.auth-locked.desktop-ready .scene-device{width:88px!important}
  body.desktop-view.auth-locked.desktop-ready .scene-compute{width:104px!important}
  body.desktop-view.auth-locked.desktop-ready .landing-hero h1{font-size:clamp(38px,4vw,54px)!important}
  body.desktop-view.auth-locked.desktop-ready .landing-benefits span{grid-template-columns:120px minmax(0,1fr)!important}
}
/* PixelD 5070 — enforce graphic left / copy right over older direct-child !important rules */
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-visual{
  grid-column:1!important;
  grid-row:1!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  align-self:stretch!important;
  justify-self:stretch!important;
}
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-hero{
  grid-column:2!important;
  grid-row:1!important;
  width:100%!important;
  max-width:560px!important;
  min-width:0!important;
  margin:0!important;
  padding:0 12px 0 0!important;
  align-self:center!important;
  justify-self:stretch!important;
  text-align:left!important;
}
body.desktop-view.auth-locked.desktop-ready section.locked-marketing.welcome-experience.landing-welcome>.landing-nav{
  position:absolute!important;
  left:30px!important;
  top:24px!important;
  width:max-content!important;
  height:auto!important;
  grid-column:auto!important;
  grid-row:auto!important;
  z-index:20!important;
}