:root{
  color-scheme:dark;
  --bg:#07090c;--bg2:#0b0e12;--panel:#0d1116;--panel2:#12171e;--panel3:#171d25;
  --line:#232a33;--line2:#343e4a;--text:#f5f7f9;--muted:#919ba7;--dim:#626d79;
  --acid:#d9ff66;--acid2:#b8e650;--cyan:#7be7ff;--amber:#ffc96b;--red:#ff7e86;
  --top:76px;--rail:72px;--inspector:322px;--radius:18px;--shadow:0 30px 90px rgba(0,0,0,.52);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;background:var(--bg);color:var(--text)}
body{overflow:hidden}button,input,select{font:inherit}button{color:inherit}.hidden{display:none!important}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--acid);outline-offset:2px}

.shell{height:100dvh;display:grid;grid-template-columns:var(--rail) minmax(0,1fr) var(--inspector);grid-template-rows:var(--top) minmax(0,1fr);background:
  radial-gradient(circle at 28% -12%,rgba(217,255,102,.08),transparent 30%),
  radial-gradient(circle at 86% 42%,rgba(123,231,255,.045),transparent 26%),var(--bg)}
.topbar{grid-column:1/-1;display:grid;grid-template-columns:245px minmax(320px,760px) 1fr;gap:20px;align-items:center;padding:13px 18px 13px 20px;border-bottom:1px solid var(--line);background:rgba(7,9,12,.82);backdrop-filter:blur(26px);z-index:40}
.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-orbit{width:39px;height:39px;border:1px solid #39434f;border-radius:13px;position:relative;display:grid;place-items:center;background:linear-gradient(145deg,#161c23,#090c10);box-shadow:inset 0 1px rgba(255,255,255,.06)}
.brand-orbit:before{content:"";width:17px;height:17px;border:2px solid var(--acid);border-radius:50%;box-shadow:0 0 24px rgba(217,255,102,.22)}.brand-orbit:after{content:"";position:absolute;width:4px;height:4px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px var(--cyan);animation:brandOrbit 5s linear infinite}@keyframes brandOrbit{to{transform:rotate(360deg) translateX(16px) rotate(-360deg)}}
.brand-copy strong{display:block;font-size:13px;letter-spacing:.01em}.brand-copy span{font-size:9px;color:var(--muted);letter-spacing:.15em;text-transform:uppercase}
.url-box{height:48px;display:grid;grid-template-columns:40px 1fr auto;align-items:center;border:1px solid var(--line2);border-radius:15px;background:#10151b;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.18);transition:.2s}.url-box:focus-within{border-color:#5b6774;box-shadow:0 0 0 3px rgba(217,255,102,.06)}.url-box .lock{display:grid;place-items:center;color:var(--dim);font-size:14px}.url-box input{width:100%;height:100%;border:0;background:transparent;color:var(--text);outline:0;padding:0 8px;font-size:12px}.url-box input::placeholder{color:#58626d}
.primary{height:35px;margin-right:6px;border:0;border-radius:10px;background:var(--acid);color:#11150d;font-weight:800;font-size:11px;padding:0 17px;cursor:pointer;transition:.18s}.primary:hover{background:#e6ff87;transform:translateY(-1px)}.primary:active{transform:translateY(0)}
.top-actions{display:flex;justify-content:flex-end;align-items:center;gap:8px}.ghost,.icon{border:1px solid var(--line);background:#0f141a;cursor:pointer;transition:.18s}.ghost{height:37px;border-radius:11px;padding:0 12px;font-size:10px;color:#d0d6dd}.icon{width:37px;height:37px;border-radius:11px;display:grid;place-items:center}.ghost:hover,.icon:hover{background:#171d24;border-color:#3a4551}

.rail{grid-column:1;grid-row:2;border-right:1px solid var(--line);background:rgba(8,11,14,.77);padding:13px 10px;display:flex;flex-direction:column;gap:7px;align-items:center;z-index:20}.rail-btn{width:50px;min-height:51px;border:1px solid transparent;background:transparent;border-radius:14px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--dim);transition:.18s}.rail-btn .glyph{font-size:18px;line-height:1}.rail-btn small{font-size:7px;letter-spacing:.055em;font-weight:800}.rail-btn:hover{color:#cbd2da;background:#12171d}.rail-btn.active{color:var(--acid);background:rgba(217,255,102,.055);border-color:#34402a;box-shadow:inset 0 0 22px rgba(217,255,102,.025)}.rail-space{flex:1}
.canvas-zone{grid-column:2;grid-row:2;position:relative;min-width:0;overflow:hidden}.toolbar{position:absolute;z-index:16;top:14px;left:17px;right:17px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.tool-group{pointer-events:auto;display:flex;gap:5px;padding:5px;border:1px solid var(--line);border-radius:13px;background:rgba(10,13,17,.76);backdrop-filter:blur(20px);box-shadow:0 12px 30px rgba(0,0,0,.17)}.tool{height:31px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:9px;padding:0 10px;cursor:pointer}.tool:hover{background:#171d24;color:#e3e7eb}.tool.on{background:var(--acid);color:#11140d;font-weight:800}.zoom{min-width:46px;text-align:center;font-variant-numeric:tabular-nums}
.canvas{height:100%;overflow:auto;padding:72px 30px 60px;background-image:linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);background-size:36px 36px;scrollbar-color:#333a43 transparent;scrollbar-width:thin}
.workspace{min-height:100%;position:relative}.empty{min-height:calc(100vh - 210px);display:grid;place-items:center;text-align:center}.empty-card{max-width:600px;padding:42px}.hero-orbit{width:105px;height:105px;border:1px solid #2b343e;border-radius:50%;margin:0 auto 27px;position:relative;display:grid;place-items:center}.hero-orbit:before{content:"";width:48px;height:68px;border:1px solid #4a5663;border-radius:13px;box-shadow:0 0 30px rgba(217,255,102,.04)}.hero-orbit:after{content:"";position:absolute;width:8px;height:8px;background:var(--acid);border-radius:50%;box-shadow:0 0 18px var(--acid);animation:heroOrbit 6s linear infinite}@keyframes heroOrbit{to{transform:rotate(360deg) translateX(50px) rotate(-360deg)}}.empty h1{margin:0;font-size:clamp(31px,4.2vw,58px);letter-spacing:-.052em;font-weight:780}.empty h1 em{font-style:normal;color:var(--acid)}.empty p{max-width:500px;margin:14px auto 22px;color:var(--muted);font-size:12px;line-height:1.72}.empty .hint{color:var(--dim);font-size:9px;letter-spacing:.04em}

.device-wall{display:flex;flex-wrap:wrap;gap:38px;align-items:flex-start;justify-content:center;max-width:1820px;margin:0 auto;transform-origin:top center}.device-card{position:relative;animation:materialize .42s cubic-bezier(.2,.85,.2,1) both;transition:transform .34s cubic-bezier(.2,.8,.2,1),filter .25s,opacity .25s;view-transition-name:var(--vt-name)}@keyframes materialize{from{opacity:0;transform:translateY(18px) scale(.975);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}.device-card:hover{transform:translateY(-3px)}
.device-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 3px 9px;font-size:9px;color:var(--muted)}.device-meta strong{display:block;color:#dfe4ea;font-size:10px;font-weight:700;margin-bottom:2px}.status{display:inline-flex;align-items:center;gap:5px;font-variant-numeric:tabular-nums}.dot{width:6px;height:6px;border-radius:50%;background:#69737f}.dot.ok{background:#8dd66d;box-shadow:0 0 10px rgba(141,214,109,.26)}.device-actions{display:flex;gap:5px}.mini{height:25px;min-width:25px;padding:0 7px;border:1px solid var(--line);border-radius:8px;background:#10151b;color:var(--muted);font-size:9px;cursor:pointer}.mini:hover,.mini.on{border-color:#4a5738;color:var(--acid);background:rgba(217,255,102,.035)}
.device-rig{position:relative;filter:drop-shadow(0 28px 38px rgba(0,0,0,.35))}.device-shell{position:relative;background:linear-gradient(145deg,#1a2027,#06080a 72%);border:1px solid #3a444f;overflow:visible;box-shadow:inset 0 1px rgba(255,255,255,.08),inset 0 -1px rgba(0,0,0,.8)}.screen{position:relative;overflow:hidden;background:#f6f6f6}.screen iframe{display:block;border:0;background:white;transform-origin:top left}.screen::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.device-shell.phone{padding:8px;border-radius:31px}.device-shell.phone .screen{border-radius:23px}.device-shell.tablet{padding:9px;border-radius:23px}.device-shell.tablet .screen{border-radius:15px}.device-shell.desktop{padding:7px 7px 10px;border-radius:13px}.device-shell.desktop .screen{border-radius:7px}
.hardware{pointer-events:none}.dynamic-island{position:absolute;z-index:8;top:14px;left:50%;transform:translateX(-50%);width:54px;height:16px;border-radius:999px;background:#030405;border:1px solid #0c0f12;box-shadow:0 1px 2px rgba(255,255,255,.05)}.camera-dot{position:absolute;z-index:8;top:14px;left:50%;width:7px;height:7px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle at 40% 35%,#2d5770,#071017 45%,#020304 70%);box-shadow:0 0 0 1px #151b21}.side-button{position:absolute;background:#252d35;border:1px solid #49545f}.side-button.left-a{left:-3px;top:72px;width:3px;height:31px;border-radius:3px 0 0 3px}.side-button.left-b{left:-3px;top:111px;width:3px;height:51px;border-radius:3px 0 0 3px}.side-button.right{right:-3px;top:92px;width:3px;height:70px;border-radius:0 3px 3px 0}.tablet .camera-dot{top:4px;width:5px;height:5px}.desktop-chin{height:8px;position:absolute;left:18%;right:18%;bottom:-9px;background:linear-gradient(#252c34,#11151a);clip-path:polygon(6% 0,94% 0,100% 100%,0 100%);opacity:.95}.desktop-foot{position:absolute;width:38%;height:7px;left:31%;bottom:-15px;border-radius:999px;background:#242b32;border:1px solid #39434d}
.grid-overlay,.safe-overlay,.ruler-overlay{display:none;position:absolute;inset:0;z-index:6;pointer-events:none}.show-grid .grid-overlay{display:block;background-image:linear-gradient(rgba(217,255,102,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(217,255,102,.13) 1px,transparent 1px);background-size:8.333% 8.333%}.show-safe .safe-overlay{display:block;inset:5%;border:1px dashed rgba(255,201,107,.78);box-shadow:0 0 0 999px rgba(255,193,75,.025)}.show-ruler .ruler-overlay{display:block;border-top:13px solid rgba(9,12,15,.75);border-left:13px solid rgba(9,12,15,.75);background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(255,255,255,.18) 9px 10px) top/100% 4px no-repeat,repeating-linear-gradient(0deg,transparent 0 9px,rgba(255,255,255,.18) 9px 10px) left/4px 100% no-repeat}.viewport-tag{position:absolute;z-index:8;bottom:7px;left:50%;transform:translateX(-50%);padding:4px 7px;border-radius:999px;background:rgba(4,6,8,.68);backdrop-filter:blur(10px);color:#cbd2d9;font-size:7px;opacity:0;transition:.2s}.device-card:hover .viewport-tag{opacity:1}

.focus-layout{display:grid;grid-template-columns:minmax(0,1fr) 134px;gap:25px;min-height:calc(100vh - 180px)}.focus-main{display:flex;justify-content:center;align-items:flex-start;padding-top:8px}.focus-strip{display:flex;flex-direction:column;gap:9px}.focus-thumb{border:1px solid var(--line);border-radius:12px;background:#0f141a;color:var(--muted);padding:9px;text-align:left;font-size:8px;cursor:pointer}.focus-thumb strong{display:block;color:#d5dbe1;font-size:9px;margin-bottom:3px}.focus-thumb.active{border-color:#526139;background:rgba(217,255,102,.045);color:var(--acid)}
.compare-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;justify-items:center;align-items:start}.compare-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.compare-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}

.breakpoint-stage{min-height:650px;display:flex;flex-direction:column;align-items:center;gap:17px}.bp-top{display:flex;align-items:center;gap:10px}.bp-readout{padding:8px 13px;border:1px solid var(--line);border-radius:999px;background:#10151b;color:#d9dfe5;font-size:11px}.bp-readout strong{color:var(--acid)}.scan-btn{height:34px;border:1px solid #3a4430;border-radius:10px;background:rgba(217,255,102,.055);color:var(--acid);font-size:9px;padding:0 11px;cursor:pointer}.scan-btn:disabled{opacity:.35;cursor:not-allowed}.bp-track-wrap{width:min(880px,88%);position:relative;padding:14px 0 24px}.bp-slider{width:100%;accent-color:var(--acid)}.bp-markers{position:absolute;left:5px;right:5px;top:37px;height:24px;pointer-events:none}.bp-marker{position:absolute;transform:translateX(-50%);width:1px;height:8px;background:#66717c}.bp-marker:after{content:attr(data-label);position:absolute;top:10px;left:50%;transform:translateX(-50%);font-size:7px;color:#5d6874;white-space:nowrap}.bp-marker.warn{height:14px;width:3px;background:var(--red);box-shadow:0 0 12px rgba(255,126,134,.42)}.bp-marker.warn:after{color:#ffadb2;font-weight:800}.bp-marker.good{background:#79c96b}.bp-frame{max-width:100%;transition:width .14s ease}.bp-diagnostics{width:min(880px,88%);display:flex;gap:8px;flex-wrap:wrap}.diag-chip{border:1px solid var(--line);border-radius:999px;background:#0f141a;color:var(--muted);font-size:8px;padding:6px 9px}.diag-chip.bad{color:#ffabb1;border-color:#4a3035;background:#160d10}.diag-chip.good{color:#9edf8e;border-color:#294027;background:#0d150c}

.galaxy{position:relative;min-height:760px;max-width:1450px;margin:0 auto;perspective:1300px;overflow:visible}.galaxy::before{content:"";position:absolute;left:50%;top:43%;width:520px;height:520px;border:1px solid rgba(217,255,102,.08);border-radius:50%;transform:translate(-50%,-50%) rotateX(68deg);box-shadow:0 0 100px rgba(217,255,102,.025)}.galaxy .device-card{position:absolute;left:50%;top:42%;transform-origin:center}.galaxy .device-card:nth-child(1){transform:translate(-50%,-50%) translateX(-390px) translateY(-80px) scale(.82) rotateY(15deg)}.galaxy .device-card:nth-child(2){transform:translate(-50%,-50%) translateX(-205px) translateY(200px) scale(.75) rotateY(9deg)}.galaxy .device-card:nth-child(3){transform:translate(-50%,-50%) translateX(205px) translateY(205px) scale(.74) rotateY(-9deg)}.galaxy .device-card:nth-child(4){transform:translate(-50%,-50%) translateX(390px) translateY(-75px) scale(.78) rotateY(-15deg)}.galaxy .device-card:nth-child(5){transform:translate(-50%,-50%) translateY(-220px) scale(.64)}.galaxy .device-card:nth-child(6){transform:translate(-50%,-50%) translateY(40px) scale(.83)}.galaxy .device-card.g-focus{transform:translate(-50%,-50%) translateY(10px) scale(1.14)!important;z-index:12!important;filter:drop-shadow(0 40px 70px rgba(0,0,0,.55))}.galaxy .device-card:not(.g-focus){opacity:.62;filter:saturate(.72)}

.showcase{min-height:calc(100vh - 178px);border-radius:27px;border:1px solid rgba(255,255,255,.075);padding:clamp(28px,4vw,60px);overflow:hidden;position:relative;isolation:isolate}.showcase:before{content:"";position:absolute;inset:-30%;z-index:-2;background:radial-gradient(circle at 25% 30%,rgba(217,255,102,.13),transparent 30%),radial-gradient(circle at 76% 67%,rgba(123,231,255,.1),transparent 26%)}.showcase.dark{background:#080b0f}.showcase.light{background:#f0f1ec;color:#13171b}.showcase.warm{background:linear-gradient(145deg,#17100c,#0d0b0a);color:#fff4e8}.showcase.aurora{background:linear-gradient(145deg,#071013,#090b10)}.showcase.aurora:before{background:radial-gradient(circle at 20% 20%,rgba(73,255,188,.19),transparent 28%),radial-gradient(circle at 78% 60%,rgba(82,139,255,.18),transparent 31%),radial-gradient(circle at 54% 110%,rgba(217,255,102,.1),transparent 25%)}.showcase-kicker{font-size:8px;text-transform:uppercase;letter-spacing:.22em;color:var(--acid);font-weight:800}.showcase h1{margin:9px 0 7px;font-size:clamp(33px,4.6vw,68px);line-height:.98;letter-spacing:-.055em;max-width:900px}.showcase-sub{font-size:11px;color:var(--muted);max-width:600px;line-height:1.65}.showcase.light .showcase-sub{color:#62686e}.showcase-devices{min-height:430px;margin-top:35px;display:flex;justify-content:center;align-items:flex-end;gap:18px;perspective:1200px}.showcase-devices .device-card{transform-origin:bottom center}.showcase-devices .device-card:nth-child(1){transform:rotateY(10deg) rotateZ(-1.4deg) translateY(20px)}.showcase-devices .device-card:nth-child(2){z-index:3;transform:translateY(-8px) scale(1.04)}.showcase-devices .device-card:nth-child(3){transform:rotateY(-10deg) rotateZ(1.4deg) translateY(20px)}.showcase-footer{position:absolute;left:clamp(28px,4vw,60px);right:clamp(28px,4vw,60px);bottom:22px;display:flex;justify-content:space-between;font-size:8px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}.showcase.light .showcase-footer{color:#777e85}
body.showcase-full .topbar,body.showcase-full .rail,body.showcase-full .inspector,body.showcase-full .toolbar{display:none}.shell:has(body.showcase-full){grid-template-columns:1fr}.showcase-full .shell{display:block}.showcase-full .canvas-zone{height:100dvh}.showcase-full .canvas{padding:18px}.showcase-full .showcase{min-height:calc(100dvh - 36px)}

.inspector{grid-column:3;grid-row:2;border-left:1px solid var(--line);background:#0a0e12;overflow:auto;padding:18px 16px 28px;scrollbar-color:#333a43 transparent;scrollbar-width:thin}.inspector-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.inspector h2{font-size:11px;margin:0}.mode-badge{font-size:7px;letter-spacing:.11em;text-transform:uppercase;padding:5px 7px;border-radius:999px;border:1px solid #3a452f;background:rgba(217,255,102,.045);color:var(--acid)}.panel-section{padding:15px 0;border-top:1px solid var(--line)}.panel-section:first-of-type{border-top:0}.panel-label{font-size:8px;text-transform:uppercase;letter-spacing:.14em;color:var(--dim);margin-bottom:9px}.metric,.toggle-row{min-height:32px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;color:#cbd1d8}.metric span:last-child{font-variant-numeric:tabular-nums;color:var(--muted);text-align:right;max-width:175px;overflow:hidden;text-overflow:ellipsis}.same{color:#94db81!important}.cross{color:#e9bb69!important}.toggle{width:34px;height:19px;border:1px solid #333d48;border-radius:999px;background:#151a20;position:relative;cursor:pointer}.toggle:after{content:"";position:absolute;left:2px;top:2px;width:13px;height:13px;border-radius:50%;background:#6d7884;transition:.17s}.toggle.on{background:rgba(217,255,102,.09);border-color:#485936}.toggle.on:after{transform:translateX(15px);background:var(--acid)}.notice{padding:10px 11px;border:1px solid var(--line);border-radius:11px;background:#10151b;color:var(--muted);font-size:9px;line-height:1.55}.notice strong{color:#e0e5e9}.notice.warn{border-color:#493c2b;background:#15120e;color:#c9b794}.issue{padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#10151b;margin-bottom:7px}.issue strong{font-size:9px;color:#e2e6e9}.issue p{margin:4px 0 0;color:var(--muted);font-size:8px;line-height:1.45}.issue.bad{border-color:#4b3035}.issue.bad strong{color:#ffadb3}.issue.good{border-color:#2b4128}.issue.good strong{color:#9ce58e}.field{display:flex;flex-direction:column;gap:5px;margin-bottom:9px}.field label{font-size:8px;color:var(--dim)}.input,.select{width:100%;height:35px;border:1px solid var(--line);border-radius:10px;background:#11161c;color:#e4e8ec;padding:0 10px;outline:0;font-size:10px}.input:focus,.select:focus{border-color:#4e5a66}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.wide{width:100%;height:36px;border-radius:10px;font-size:9px;cursor:pointer}.wide.primary2{border:0;background:var(--acid);color:#10140c;font-weight:800}.wide.secondary{border:1px solid var(--line);background:#11161c;color:#d6dce1}.wide.secondary:hover{border-color:#3c4752}.stack{display:grid;gap:7px}

.modal-backdrop{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:rgba(0,0,0,.64);backdrop-filter:blur(10px);padding:18px}.modal{width:min(680px,96vw);max-height:88vh;overflow:auto;border:1px solid #343f4a;border-radius:22px;background:#0d1218;box-shadow:0 40px 120px rgba(0,0,0,.65)}.modal-head{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.modal-head h3{font-size:12px;margin:0}.modal-body{padding:18px}.capture-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.capture-card{min-height:155px;border:1px solid var(--line);border-radius:15px;background:#11171d;padding:14px;display:flex;flex-direction:column;justify-content:space-between}.capture-card .big{font-size:24px}.capture-card h4{font-size:10px;margin:10px 0 5px}.capture-card p{font-size:8px;color:var(--muted);line-height:1.5;margin:0}.capture-card button{margin-top:13px}.toast{position:fixed;left:50%;bottom:24px;z-index:110;transform:translate(-50%,18px);opacity:0;pointer-events:none;padding:9px 13px;border-radius:999px;background:#171d23;border:1px solid #35404b;color:#e6eaed;font-size:9px;box-shadow:0 12px 35px rgba(0,0,0,.4);transition:.22s}.toast.show{opacity:1;transform:translate(-50%,0)}
#qaProbe{position:fixed;left:-10000px;top:-10000px;width:320px;height:900px;border:0;visibility:hidden}

::view-transition-old(root){animation:vtOld .18s ease both}::view-transition-new(root){animation:vtNew .3s cubic-bezier(.2,.8,.2,1) both}@keyframes vtOld{to{opacity:0;filter:blur(4px);transform:scale(.992)}}@keyframes vtNew{from{opacity:0;filter:blur(5px);transform:scale(1.008)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}
@media(max-width:1160px){:root{--inspector:270px}.topbar{grid-template-columns:215px minmax(260px,1fr) auto}.ghost.hide-mid{display:none}.compare-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){:root{--rail:58px}.shell{grid-template-columns:var(--rail) minmax(0,1fr);grid-template-rows:70px minmax(0,1fr)}.topbar{grid-template-columns:auto 1fr auto;padding:10px;gap:10px}.brand-copy{display:none}.brand-orbit{width:34px;height:34px}.top-actions .ghost{display:none}.inspector{position:fixed;z-index:60;right:0;top:70px;bottom:0;width:min(320px,88vw);transform:translateX(100%);transition:.22s;box-shadow:-25px 0 60px rgba(0,0,0,.5)}body.inspector-open .inspector{transform:translateX(0)}.rail{grid-row:2}.canvas-zone{grid-column:2;grid-row:2}.canvas{padding:70px 18px 50px}.capture-grid{grid-template-columns:1fr}.focus-layout{grid-template-columns:1fr}.focus-strip{flex-direction:row;overflow:auto}.compare-grid,.compare-grid.three,.compare-grid.four{grid-template-columns:1fr}.showcase-devices{transform:scale(.8);transform-origin:center bottom}.rail-btn{width:43px}}
@media print{body{overflow:visible!important;background:white!important}.topbar,.rail,.inspector,.toolbar,.toast,.modal-backdrop{display:none!important}.shell{display:block!important;height:auto!important;background:white!important}.canvas-zone,.canvas{display:block!important;height:auto!important;overflow:visible!important;padding:0!important;background:none!important}.workspace{min-height:0!important}.showcase{min-height:100vh!important;border:0!important;border-radius:0!important;break-inside:avoid}.device-meta,.device-actions{display:none!important}}