:root{
  color-scheme:dark;
  --bg:#07080c;--panel:#0e1016;--raise:#151821;--hover:#1c2230;
  --line:#2b3142;--line-strong:#65718a;--ink:#e9edf7;--muted:#a5aec2;--dim:#9ba5bc;
  --plan:#bba2ff;--design:#f7a0d3;--code:#6ce3f4;--test:#81e6a1;--ship:#f6d36c;--error:#ff9aab;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s16:64px;
  --t0:12px;--t1:14px;--t2:16px;--t3:20px;--t4:24px;--t5:32px;--t6:48px;
  --r1:8px;--r2:12px;--r3:20px;--pill:999px;
  --shadow:0 16px 48px #0006;--focus:0 0 0 3px var(--panel),0 0 0 5px var(--code);
  --sans:'Geist';--mono:'Geist Mono';--ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0;scrollbar-width:thin;scrollbar-color:#697791 var(--panel)}
*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:var(--panel)}*::-webkit-scrollbar-thumb{background:#697791;border:2px solid var(--panel);border-radius:var(--pill)}
html,body{background:var(--bg);color:var(--ink);font:var(--t1)/1.5 var(--sans);-webkit-font-smoothing:antialiased}
button,input,textarea{font:inherit;color:inherit}button,a,input,textarea,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{border:1px solid transparent;cursor:pointer;background:none;transition:background 200ms var(--ease),color 200ms var(--ease),border-color 200ms var(--ease),transform 150ms var(--ease),box-shadow 200ms var(--ease)}
a{color:var(--code);text-decoration:none;transition:color 200ms var(--ease),background 200ms var(--ease)}
button:hover:not(:disabled){background:var(--hover);border-color:var(--line-strong)}button:active:not(:disabled){transform:translateY(1px);background:#263044}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--code);outline-offset:3px;box-shadow:0 0 0 5px #0e1016}
button:disabled{color:var(--muted);background:#1b1f29;border-color:var(--line);cursor:not-allowed;opacity:1}
a:hover{color:var(--ink)}a:active{color:var(--design)}
[hidden]{display:none!important}.num,time,.timer,.agent em,.rhead small,.report span{font-variant-numeric:tabular-nums}
.app{height:100svh;min-height:640px;display:grid;grid-template-columns:minmax(0,1fr) 520px}
.stage{position:relative;overflow:hidden;min-width:0;background:radial-gradient(70% 60% at 50% 55%,#121626,#0a0c13 55%,var(--bg))}
#c{position:absolute;inset:0;width:100%;height:100%;display:block}
.top{position:absolute;inset:0 0 auto;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:var(--s4) var(--s6);pointer-events:none}
.top>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:var(--s3);min-height:44px;color:var(--ink);border-radius:var(--r1)}.brand svg{width:28px;height:28px}.brand b{font-size:var(--t2);font-weight:600;letter-spacing:-.01em}.home{display:flex;align-items:center;min-height:44px;padding:0 var(--s2);font-size:var(--t0);color:var(--muted);border-radius:var(--r1)}
.caption{position:absolute;left:var(--s6);top:96px;z-index:5;max-width:360px;pointer-events:none;transition:opacity 300ms var(--ease)}
.caption small,.kick,.chooser-label{font:400 var(--t0)/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.caption h1{font:600 clamp(32px,3.4vw,48px)/1.04 var(--sans);letter-spacing:-.04em;margin-top:var(--s3)}
.caption h1 em{font-style:normal;background:linear-gradient(90deg,var(--plan),var(--design),var(--code),var(--test),var(--ship));background-clip:text;-webkit-background-clip:text;color:transparent}
.phase,.phase-labels{position:absolute;left:var(--s6);right:var(--s6);bottom:var(--s6);display:flex;gap:var(--s2);z-index:5;pointer-events:none}.phase div{flex:1;height:4px;background:var(--line);border-radius:var(--pill);overflow:hidden}.phase i{display:block;width:100%;height:100%;background:var(--c);transform:scaleX(0);transform-origin:left;transition:transform 200ms var(--ease)}
.phase-labels{bottom:var(--s10);font:var(--t0)/1 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}.phase-labels span{flex:1;transition:color 200ms var(--ease)}.phase-labels span.on{color:var(--ink)}
.panel{background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column;min-width:0;min-height:0}.pscroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:var(--s6)}
.lead{font:600 var(--t4)/1.2 var(--sans);letter-spacing:-.025em;margin:var(--s2) 0 var(--s3);overflow-wrap:anywhere}.sub{color:var(--muted);font-size:var(--t1);line-height:1.6;max-width:50ch}
.chooser-label{display:flex;justify-content:space-between;gap:var(--s3);margin:var(--s6) 0 var(--s3)}
.briefs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.brief{position:relative;display:flex;align-items:center;min-width:0;min-height:72px;padding:var(--s3);border:1px solid var(--line);border-radius:var(--r2);background:var(--raise);text-align:left}
.brief>span{min-width:0;width:100%}.brief b{font-size:var(--t1);font-weight:600;display:flex;align-items:center;gap:var(--s2);line-height:1.3}.brief small{display:block;color:var(--muted);font-size:var(--t0);line-height:1.4;margin-top:var(--s1)}
.brief em{display:inline-block;font:10px/1 var(--mono);font-style:normal;letter-spacing:.06em;padding:3px 5px;border:1px solid #68567f;border-radius:var(--s1);color:var(--plan)}
.briefs>.brief:last-child:nth-child(odd){grid-column:1/-1}
.brief[aria-checked=true]{background:#10212b;border-color:var(--code);box-shadow:inset 3px 0 var(--code)}.brief.pro{border-color:#59476f}.brief.pro[aria-checked=true]{border-color:var(--code)}
#briefDetail{font-size:var(--t0);color:var(--muted);line-height:1.6;margin-top:var(--s3);min-height:40px;overflow-wrap:anywhere}
label.f{display:block;font-size:var(--t0);color:var(--muted);margin:var(--s4) 0 var(--s2)}.name{width:100%;height:48px;padding:var(--s3);border:1px solid var(--line-strong);border-radius:var(--r1);background:var(--bg);font-size:var(--t2);transition:border-color 200ms var(--ease),background 200ms var(--ease)}.name:hover{border-color:var(--ink)}.name:active{background:var(--raise)}.name:disabled{color:var(--muted);background:var(--raise)}
.name-hint{font-size:var(--t0);color:var(--muted);margin-top:var(--s2)}
.swatches{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s2)}.swatches button{display:block;min-width:0;min-height:72px;border-radius:var(--r1);padding:var(--s1);border-color:var(--line);text-align:left;background:var(--bg)}
.swatches button i{display:flex;align-items:center;justify-content:space-between;height:32px;padding:var(--s1) var(--s2);background:var(--sample);color:var(--sample-ink);border-radius:var(--s1);font:var(--t3)/1 var(--preview-font,var(--sans));font-style:normal}.swatches button i b{width:12px;height:12px;background:var(--sample-accent);border-radius:50%}.swatches button>span{display:block;font-size:var(--t0);line-height:1.4;margin:var(--s2) 0 0;color:var(--muted)}
.swatches button[aria-checked=true]{border-color:var(--code);box-shadow:inset 0 0 0 1px var(--code)}.swatches button[aria-checked=true]>span{color:var(--ink)}
.actionbar{flex:none;padding:var(--s4) var(--s6);border-top:1px solid var(--line);background:var(--panel);position:relative;z-index:3;box-shadow:0 -16px 24px -16px #0008}.go{display:block;width:100%;min-height:48px;padding:var(--s3) var(--s4);font-size:var(--t1);font-weight:600;border-radius:var(--r2);background:var(--ink);color:var(--bg)}.go:hover:not(:disabled),.primary:hover:not(:disabled){background:#fff;color:var(--bg);border-color:var(--ink)}
.studio-state{min-height:24px;margin-bottom:var(--s2);font-size:var(--t0);line-height:1.6;color:var(--muted)}#retryStudio{margin-bottom:var(--s3)}
.honest{font-size:var(--t0);line-height:1.6;color:var(--muted)}.actionbar .honest{margin-top:var(--s3)}.honest a{display:inline-flex;align-items:center;min-height:44px;border-radius:var(--r1)}
.roster{display:grid;gap:var(--s2);margin:var(--s4) 0}.agent{display:grid;grid-template-columns:12px minmax(0,1fr) auto;align-items:center;gap:var(--s3);padding:var(--s3);background:var(--raise);border:1px solid var(--line);border-radius:var(--r2);transition:border-color 250ms var(--ease),background 250ms var(--ease)}
.agent.on{background:#17202b;border-color:var(--c)}.agent i{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px #ffffff08}.agent.on i{box-shadow:0 0 0 4px #ffffff15}.agent>div{min-width:0;line-height:1.4}.agent b{font-size:var(--t1);font-weight:600}.agent span{display:block;font-size:var(--t0);color:var(--muted);overflow-wrap:anywhere}.agent br{display:none}.agent em{font:var(--t0)/1.4 var(--mono);font-style:normal;color:var(--muted)}.agent.done em{color:var(--test)}
.log{list-style:none;font:var(--t0)/1.7 var(--mono);color:var(--muted);padding-top:var(--s3);border-top:1px solid var(--line);max-height:220px;overflow:auto;overscroll-behavior:contain}.log li{padding:var(--s1) 0;overflow-wrap:anywhere;animation:arrive 200ms var(--ease)}.log b{font-weight:500;color:var(--c)}.log time{margin-right:var(--s2);color:var(--dim)}
@keyframes arrive{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.gate{display:grid;gap:var(--s2);margin-top:var(--s4);font-size:var(--t0);line-height:1.5}.gate p{display:flex;align-items:flex-start;gap:var(--s2)}.gate i{color:var(--test);font-style:normal}.gate [data-pass=false] i{color:var(--error)}.gate-wait{color:var(--muted)}
.ghost,.primary{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:var(--s2) var(--s4);border:1px solid var(--line-strong);border-radius:var(--r1);font-size:var(--t1);color:var(--ink)}.ghost[aria-pressed=true]{background:#10212b;border-color:var(--code)}#viewResult{margin-top:var(--s4)}.ctrl{display:flex;align-items:center;gap:var(--s2)}.ctrl button{font-size:var(--t0);padding:var(--s2) var(--s3)}.timer{margin-left:auto;font:var(--t0)/1.5 var(--mono);white-space:nowrap;color:var(--muted)}
.result{position:fixed;inset:0;z-index:40;display:grid;place-items:center;padding:var(--s6);background:#030408df;opacity:0;pointer-events:none;transition:opacity 250ms var(--ease)}.result.on{opacity:1;pointer-events:auto}.modal-open{overflow:hidden}
.rbox{width:min(1160px,100%);height:min(800px,100%);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line-strong);border-radius:var(--r3);background:var(--panel);box-shadow:var(--shadow);transform:translateY(8px);transition:transform 300ms var(--ease)}.result.on .rbox{transform:none}
.rhead{display:flex;align-items:center;gap:var(--s3);padding:var(--s4) var(--s6);border-bottom:1px solid var(--line);flex-wrap:wrap}.rhead h2{font:600 var(--t2)/1.4 var(--sans);letter-spacing:-.02em;max-width:100%;overflow-wrap:anywhere}.rhead small{font:var(--t0)/1.5 var(--mono);color:var(--test)}.tabs{display:flex;gap:var(--s1);margin-left:auto}.tabs button{min-height:44px;padding:var(--s2) var(--s4);font-size:var(--t1);color:var(--muted);border-radius:var(--r1)}.tabs button[aria-selected=true]{background:var(--raise);color:var(--ink);border-color:var(--line)}
.rbody{position:relative;flex:1;min-height:0}.rbody iframe{width:100%;height:100%;border:0;display:block;background:var(--bg)}.preview-state{position:absolute;inset:0;z-index:2;display:grid;place-content:center;justify-items:center;gap:var(--s4);text-align:center;background:var(--bg);padding:var(--s6);color:var(--muted)}.preview-state b{font-size:var(--t3);color:var(--ink);font-weight:500}.preview-state p{font-size:var(--t1);max-width:32ch}.preview-state i{width:32px;height:32px;border:2px solid var(--line);border-top-color:var(--code);border-radius:50%;animation:prepare 450ms var(--ease) infinite}.preview-state.error i{animation:none;border-color:var(--error);border-radius:var(--r1)}@keyframes prepare{to{transform:rotate(360deg)}}
.code{height:100%;padding:var(--s6);overflow:auto;font:var(--t0)/1.7 var(--mono);color:#d1d9ed;tab-size:2;white-space:pre}.report{height:100%;overflow:auto;padding:var(--s6);display:grid;gap:var(--s3);align-content:start}.report>div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:var(--s2) var(--s3);padding:var(--s4);border:1px solid var(--line);border-radius:var(--r2);background:var(--raise);font-size:var(--t1)}.report i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;font-size:var(--t1);font-style:normal;color:var(--test);background:#14301f}.report i.x{color:var(--error);background:#351a25}.report span{grid-column:2;font:var(--t0)/1.6 var(--mono);color:var(--muted);overflow-wrap:anywhere}
.code-line{display:grid;grid-template-columns:40px max-content;min-width:100%;line-height:1.7}.code-line em{position:sticky;left:0;padding-right:12px;font:var(--t0)/1.7 var(--mono);font-style:normal;text-align:right;color:var(--muted);background:var(--panel);user-select:none}.code-line code{font:inherit;color:inherit}.code-line.script{color:#f4afd5}.code-line.markup{color:#9cdef7}.code-fold{display:block;white-space:normal}.code-fold summary{display:flex;align-items:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r1);font-size:var(--t0);color:var(--muted);cursor:pointer;transition:background 200ms var(--ease),border-color 200ms var(--ease)}.code-fold summary:hover{background:var(--raise);border-color:var(--line-strong)}.code-fold summary:active{background:var(--hover)}.code-fold summary::before{content:'+';margin-right:12px;color:var(--code);font-size:var(--t2)}.code-fold[open] summary::before{content:'−'}.code-fold summary::-webkit-details-marker{display:none}.code-fold code{white-space:pre}
.rfoot{display:flex;align-items:center;gap:var(--s2);padding:var(--s4) var(--s6);border-top:1px solid var(--line)}.primary{background:var(--ink);color:var(--bg);border-color:var(--ink);font-weight:600}.rfoot .x{margin-left:auto}.lab{position:fixed;left:-10000px;top:0;width:800px;height:600px;pointer-events:none;border:0}
.workflow{position:relative;padding:var(--s16) max(24px,calc((100vw - 1240px)/2)) var(--s8);border-top:1px solid var(--line);background:var(--bg)}.workflow-intro{display:flex;align-items:end;justify-content:space-between;gap:var(--s8);margin-bottom:var(--s12)}.workflow h2{font:500 clamp(28px,3.2vw,44px)/1.15 var(--sans);letter-spacing:-.035em;margin-top:var(--s3)}.workflow h2 em{font-style:normal;color:var(--muted)}.workflow-intro>p{color:var(--muted);font-size:var(--t1);line-height:1.7}
.handoffs{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s6)}.handoffs li{padding-top:var(--s4);border-top:2px solid var(--role)}.handoffs li>span{font:var(--t0)/1.5 var(--mono);color:var(--role);text-transform:uppercase;letter-spacing:.02em}.workflow h3{font-size:var(--t2);line-height:1.4;font-weight:500;letter-spacing:-.02em;margin:var(--s4) 0 var(--s3)}.handoffs p,.workflow-notes p{color:var(--muted);font-size:var(--t1);line-height:1.7}.handoffs small{display:block;font:var(--t0)/1.6 var(--mono);color:var(--ink);margin-top:var(--s4)}
.workflow-notes{display:grid;grid-template-columns:1fr 1fr;gap:var(--s12);padding-top:var(--s6);margin-top:var(--s12);border-top:1px solid var(--line)}.workflow-notes h3{margin-top:0}.workflow-honest{font-size:var(--t0);line-height:1.8;color:var(--muted);max-width:920px;margin-top:var(--s8);padding-top:var(--s6);border-top:1px solid var(--line)}.workflow-honest span{color:var(--ink)}.back-studio{display:inline-flex;align-items:center;min-height:44px;min-width:44px;border-radius:var(--r1);font-size:var(--t1);margin-top:var(--s4)}
@media(max-width:1100px) and (min-width:901px){.app{grid-template-columns:minmax(0,1fr) 464px}.pscroll{padding:var(--s4)}.actionbar{padding:var(--s4)}}
@media(max-width:900px){
  .app{min-height:640px;grid-template-columns:1fr;grid-template-rows:clamp(272px,38svh,360px) minmax(0,1fr)}.stage{min-height:0}.panel{border-left:0;border-top:1px solid var(--line);border-radius:var(--r3) var(--r3) 0 0;margin-top:-16px;z-index:2;overflow:hidden}.pscroll{padding:var(--s5) var(--s4)}
  .top{padding:var(--s2) var(--s4)}.home{display:none}.caption{left:var(--s4);top:72px;max-width:280px}.caption h1{font-size:28px;margin-top:var(--s2)}.caption small{font-size:var(--t0)}.building .caption{opacity:0}.phase,.phase-labels{left:var(--s4);right:var(--s4)}.phase{bottom:var(--s8)}.phase-labels{bottom:var(--s12)}
  .lead{font-size:var(--t3)}.brief{padding:var(--s3);min-height:80px}.brief b{font-size:var(--t1);gap:var(--s1);flex-wrap:wrap}.swatches{grid-template-columns:repeat(3,minmax(0,1fr))}.swatches button{min-height:76px}.swatches button i{height:36px}.actionbar{padding:var(--s3) var(--s4) max(12px,env(safe-area-inset-bottom))}.actionbar .honest{line-height:1.5}.actionbar .honest a{min-height:44px}.ctrl{gap:var(--s2)}.ctrl button{padding:var(--s2)}
  .roster{gap:var(--s2)}.agent{padding:var(--s2) var(--s3);gap:var(--s2)}.agent em{font-size:var(--t0)}.log{max-height:144px}.gate{font-size:var(--t0)}
  .result{padding:0}.rbox{height:100%;width:100%;border-radius:0;border:0}.rhead{padding:var(--s3) var(--s4);gap:var(--s2)}.rhead h2{font-size:var(--t1)}.rhead small{font-size:var(--t0)}.tabs{width:100%;margin:0}.tabs button{font-size:var(--t1);padding:var(--s2) var(--s3)}.rfoot{padding:var(--s3) var(--s4);display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}.rfoot .primary{grid-column:1/3}.rfoot .x{margin:0}.rfoot button{font-size:var(--t0);padding:var(--s2)}.report,.code{padding:var(--s4)}.report>div{padding:var(--s3)}
  .workflow{padding:var(--s12) var(--s4) var(--s6)}.workflow-intro{display:block;margin-bottom:var(--s8)}.workflow h2{font-size:28px}.workflow-intro>p{margin-top:var(--s4)}.handoffs{grid-template-columns:1fr;gap:var(--s6)}.handoffs li{display:grid;grid-template-columns:104px minmax(0,1fr);gap:0 var(--s3)}.handoffs li>span{grid-row:1/4}.handoffs h3{margin:0 0 var(--s2)}.handoffs small{grid-column:2;margin-top:var(--s3)}.workflow-notes{grid-template-columns:1fr;gap:var(--s6);margin-top:var(--s8)}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.caption::before{content:"";position:absolute;inset:-40px -60px -40px -80px;z-index:-1;background:radial-gradient(closest-side,rgba(5,6,10,.72),rgba(5,6,10,0));pointer-events:none}

/* Orchestra v3: rendered product cards and creation takeaways. */
.app{grid-template-columns:minmax(0,1fr) 560px}.brief.product-card{display:block;padding:0;overflow:hidden;min-height:0;border-radius:12px}.product-card>span{display:block;padding:12px 12px 16px}.product-art{position:relative;aspect-ratio:8/5;overflow:hidden;background:#101723}.product-art img,.product-art video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.product-art video{opacity:0;transition:opacity 240ms var(--ease)}.playing .product-art video{opacity:1}.product-index{position:absolute;top:8px;left:8px;background:#080b14cc;padding:2px 8px;border-radius:4px;font:12px 'Geist Mono';color:#eef3ff}.art-pending .product-art:after{content:'Preview image unavailable';position:absolute;inset:0;display:grid;place-items:center;font:12px 'Geist Mono';color:var(--muted)}.brief[aria-checked=true]{box-shadow:inset 0 0 0 1px var(--code)}.swatches{grid-template-columns:repeat(3,minmax(0,1fr))}.swatches button{min-height:80px}.growth-wrap{margin:16px 0 24px;border:1px solid var(--line);border-radius:12px;overflow:hidden}.growth-wrap>p{padding:8px 12px;background:var(--raise);font:12px 'Geist Mono';color:var(--code)}.growth-wrap iframe{display:block;width:100%;height:300px;border:0}.rbox{width:min(1320px,100%);height:min(860px,100%)}.close-result{order:4;margin-left:auto;min-height:44px}.rhead h2{max-width:40%;overflow-wrap:anywhere}.takeaways{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 24px;border-top:1px solid var(--line)}#exportButtons{display:flex;gap:8px;flex-wrap:wrap}.takeaways button{min-height:44px;padding:8px 16px}.takeaways p{color:var(--muted);font-size:12px;flex-basis:100%}.takeaways input{width:100%;min-width:0;background:var(--bg);border:1px solid var(--line);padding:8px;border-radius:8px;min-height:44px}.report h3{font-size:14px;margin:20px 0 8px}.report .perf-report{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.code{white-space:pre;overflow:auto;font:12px/1.6 'Geist Mono'}.team-comparison{padding-top:32px;margin-top:32px;border-top:1px solid var(--line);max-width:1080px}.team-comparison h3{font-size:28px;letter-spacing:-.03em;margin:8px 0 16px}.team-comparison>p:not(.kick){color:var(--muted);font-size:16px;max-width:72ch}.team-comparison dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin:32px 0 0}.team-comparison dt{font-size:16px;color:var(--ink);margin-bottom:8px}.team-comparison dd{font-size:14px;line-height:1.7;color:var(--muted);margin:0}.rbody:fullscreen,#frame:fullscreen{height:100vh!important;width:100vw!important;background:var(--bg)}
@media(max-width:1100px) and (min-width:901px){.app{grid-template-columns:minmax(0,1fr) 500px}}@media(max-width:900px){.app{grid-template-columns:1fr;grid-template-rows:240px minmax(0,1fr)}.caption{top:64px}.caption h1{font-size:24px}.phase{bottom:24px}.phase-labels{bottom:40px}.product-card>span{padding:8px 8px 12px}.product-card b{font-size:14px}.product-art{aspect-ratio:8/5}.rbox{height:100%;width:100%;border-radius:0}.rhead h2{max-width:calc(100% - 88px)}.close-result{order:0;margin:0}.rhead .tabs{order:5}.takeaways{padding:8px 16px;gap:4px 8px}.takeaways button{font-size:12px;padding:8px 12px}.takeaways p{font-size:12px;line-height:1.4}.rfoot{padding:8px 16px;grid-template-columns:1fr 1fr 1fr}.rfoot .primary{grid-column:auto}.team-comparison dl{grid-template-columns:1fr;gap:24px}.growth-wrap iframe{height:264px}.roster{gap:4px}.agent{padding:4px 8px}.log{max-height:128px}}

.lab-mount{position:relative;height:320px;margin:16px 0 24px;border:1px solid var(--line);border-radius:12px;background:var(--bg);overflow:hidden}.lab-mount>p{position:relative;z-index:2;background:var(--panel);color:var(--test);padding:8px 12px;font:12px 'Geist Mono';height:32px}.lab-mount iframe{pointer-events:none;border:0}

/* phones: keep the real test lab visible while its canvas checks run */
.lab-mount.floating{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));width:168px;height:300px;margin:0;z-index:60;box-shadow:0 18px 40px -12px rgba(0,0,0,.6)}
.lab-mount.floating>p{font-size:10px;height:28px;padding:7px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.preview-state{overflow:auto;pointer-events:none;background:color-mix(in srgb,var(--bg) 94%,transparent)}
.preview-state button{pointer-events:auto}
.preview-state img{display:block;width:min(440px,100%);max-height:32svh;object-fit:contain;border-radius:var(--r2);order:2}
.preview-state button{order:3}
.result[data-preview=fallback] .preview-state{gap:12px;padding:16px;background:var(--bg)}
.result[data-preview=fallback] .preview-state b{font-size:20px}
.result[data-preview=fallback] .preview-state p{max-width:56ch;font-size:14px}
.result.preview-expanded .rbody{position:fixed;inset:0;z-index:5;background:var(--bg)}
.result.preview-expanded .takeaways{position:fixed;right:8px;top:8px;z-index:6;padding:4px;border:0;background:var(--panel);border-radius:8px}
.result.preview-expanded .takeaways>*:not(#fullscreen){display:none}
.stage-fallback{background:radial-gradient(ellipse at 50% 70%,#183448,#07080c 70%)}
.stage-fallback canvas{display:none}
/* phones: one natural scrolling page. The stage sits on top, the chooser flows below it, swipes on the
   3D stage scroll the page, and the start bar stays reachable at the bottom of the screen. */
@media(max-width:900px){
  .app{height:auto;min-height:0;grid-template-rows:clamp(240px,40svh,340px) auto}
  .panel{overflow:visible;margin-top:-16px}
  .pscroll{flex:none;overflow:visible;overscroll-behavior:auto}
  .stage canvas{touch-action:pan-y!important}
  .actionbar{position:sticky;bottom:0;padding-bottom:max(12px,env(safe-area-inset-bottom))}
}

#previewPanel{height:100%;position:relative}
@media(max-width:600px){
 .rhead{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;padding:8px 16px}
 .rhead .close-result{grid-column:1;grid-row:1/3;margin:0}
 .rhead h2{grid-column:2;grid-row:1;max-width:none;min-width:0;font-size:14px;line-height:1.3}
 .rhead small{grid-column:2;grid-row:2}
 .rhead .tabs{grid-column:1/-1;grid-row:3;margin:4px 0 0}
 .takeaways button{padding:8px}
 .takeaways p{line-height:1.3}
}

.takeaways .portability-note{color:var(--ink);border-left:2px solid var(--ship);padding:4px 0 4px 12px}