:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f0eee8;background:#0b0c0b;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#0b0c0b}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{color:inherit}.shell{max-width:1500px;margin:auto;padding:0 48px}.site-header{height:82px;display:flex;align-items:center;gap:22px;border-bottom:1px solid #353831}.brand{display:flex;align-items:center}.brand img{display:block;width:174px;height:auto;max-height:28px}.header-divider{height:25px;width:1px;background:#52554d}.header-label,.header-link,footer,.column-heading span,.scene-card-meta,.panel-note{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;letter-spacing:.04em}.header-label{font-size:12px;color:#b7b9af}.header-link{margin-left:auto;font-size:12px;text-decoration:none;color:#d5c48e}.header-link:hover,footer a:hover{text-decoration:underline}.intro{padding:58px 0 56px;border-bottom:1px solid #353831}.intro h1{font-size:clamp(52px,6vw,86px);line-height:1;letter-spacing:-.065em;font-weight:640;margin:0 0 25px}.title-period{color:#d9c58b}.intro p{max-width:780px;color:#b7b9b0;font-size:17px;line-height:1.65;margin:0}.workspace{display:grid;grid-template-columns:minmax(380px,.95fr) minmax(0,1.55fr);gap:36px;padding-top:30px;align-items:start}.column-heading{min-height:44px;display:flex;justify-content:space-between;align-items:baseline;gap:12px}.column-heading h2{font-size:14px;font-weight:650;margin:0}.column-heading span{font-size:10px;color:#878c80;text-transform:uppercase}.panel{background:#141714;border:1px solid #3a3e36;padding:24px}.scene-examples p{font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.09em;color:#b9bdb0;margin:0 0 12px}.scene-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.scene-card{min-height:93px;padding:12px;text-align:left;display:flex;flex-direction:column;justify-content:space-between;gap:10px;border:1px solid #52574c;background:#20241e;color:#eeede5;min-width:0}.scene-card:hover,.scene-card.active{border-color:#d7c58d;background:#292d24}.scene-card-name{font-size:12px;line-height:1.25;font-weight:600}.scene-card-meta{font-size:9px;line-height:1.35;color:#a6aa9d}.editor-tabs{display:flex;padding:3px;margin:24px 0 20px;border:1px solid #3d4239;background:#101210}.editor-tabs button{flex:1;border:0;background:transparent;color:#93998b;padding:9px;font-size:12px}.editor-tabs button[aria-selected=true]{background:#32382e;color:#f3f0e6}.field{margin-top:15px}.field:first-child{margin-top:0}.field label{display:block;font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.08em;color:#bdc2b4;margin-bottom:8px}.optional{font-weight:400;text-transform:none;letter-spacing:0;color:#858c7f}.field textarea,.field input{display:block;width:100%;padding:11px 12px;background:#0c0f0c;border:1px solid #4b5046;color:#f1f0e8;font-size:12px;line-height:1.55}.field textarea{resize:vertical;min-height:105px}.field input{min-height:40px}input::placeholder,textarea::placeholder{color:#777e71}textarea:focus,input:focus,select:focus,button:focus-visible,summary:focus-visible{outline:2px solid #d6c58d;outline-offset:2px}.reference-section,.prompt-preview{border-top:1px solid #3a3f36;margin-top:22px;padding-top:14px}.reference-section summary,.prompt-preview summary{cursor:pointer;font-size:11px;color:#c6cbbb}.reference-section summary{display:flex;justify-content:space-between}.reference-section summary span{font-family:ui-monospace,monospace;color:#818b7b}.reference-body p{color:#90998b;font-size:11px;line-height:1.5}.reference-item{border:1px solid #3e443b;background:#101310;padding:10px;margin:10px 0}.reference-item-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;color:#b8bfb0}.reference-item-head span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reference-item-head button{background:none;border:0;color:#e3b6ad;font-size:15px}.reference-item-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.reference-item input,.reference-item select{min-width:0;width:100%;border:1px solid #4b5046;background:#0b0e0b;color:#eee;padding:8px;font-size:11px}.reference-item .wide{grid-column:1/-1}.upload-button{position:relative;display:block;text-align:center;border:1px dashed #636b5e;padding:11px;color:#cdd1c5;font-size:11px;cursor:pointer;margin-top:10px}.upload-button:hover{border-color:#d6c58d}.upload-button input{position:absolute;width:1px;height:1px;opacity:0}.field-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:22px}.field-row label{font-size:11px;font-weight:650;color:#c3c7bd}.field-row select{min-width:150px;background:#20251e;border:1px solid #4b5046;color:#f0f0e9;padding:9px;font-size:11px}.prompt-preview pre{white-space:pre-wrap;word-break:break-word;font-size:10px;line-height:1.5;color:#9ba498;margin-bottom:0}.primary-button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;background:#d6c58e;color:#171a13;margin-top:22px;padding:15px 17px;font-size:13px;font-weight:700}.primary-button:hover:enabled{background:#ebdcae}.panel-note{color:#8b9386;font-size:9px;line-height:1.5;margin:13px 0 0}.stage{aspect-ratio:16/10;position:relative;background:#151916;border:1px solid #3d423b;overflow:hidden;display:grid;place-items:center}.stage video{width:100%;height:100%;object-fit:contain;background:#080a09}.stage video:not([src]){visibility:hidden}.stage audio{display:none}#stage-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:#151916;color:#979f91}#stage-empty[hidden]{display:none}#stage-empty img{width:156px;max-height:24px;object-fit:contain;margin-bottom:22px;opacity:.38}#stage-empty strong{font-size:19px;letter-spacing:-.03em;color:#e0e3d9}#stage-empty span{font-size:12px;max-width:310px;line-height:1.5}.stage-toolbar{min-height:51px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #343a32}.status{font-size:12px;color:#c3c8bc;display:flex;align-items:center;gap:10px}#status-dot{width:7px;height:7px;border-radius:50%;background:#777c71}#status-dot.ready{background:#a9d99d}.text-button{border:0;background:none;color:#d5c58e;font-size:11px;padding:8px 0}#detail{min-height:36px;margin:14px 0;color:#aeb7a7;font-size:12px;line-height:1.5}#detail.error{color:#f1a9a0}.connect-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #3e4439;background:#141814;padding:18px}.connect-panel h3{font-size:13px;margin:0 0 5px}.connect-panel p{font-size:11px;line-height:1.5;color:#9da79a;margin:0}.connection-actions{display:flex;gap:8px;flex-shrink:0}.connection-actions button{border:1px solid #c3b687;background:#d6c58e;color:#151711;padding:9px 13px;font-size:11px;font-weight:700}.connection-actions button+button{border-color:#61675b;background:transparent;color:#ccd2c6}footer{display:flex;align-items:center;gap:20px;justify-content:space-between;min-height:98px;border-top:1px solid #333832;margin-top:52px;color:#828c7d;font-size:10px}footer a{text-decoration:none;color:#d2c396}.footer-divider{color:#bfb489;margin:0 6px}@media(max-width:1050px){.shell{padding:0 28px}.workspace{gap:20px;grid-template-columns:minmax(330px,1fr) minmax(0,1.2fr)}.column-heading span{display:none}}@media(max-width:800px){.shell{padding:0 18px}.site-header{height:68px}.brand img{width:145px}.header-divider,.header-label{display:none}.intro{padding:43px 0 38px}.intro p{font-size:15px}.workspace{grid-template-columns:1fr}.stage-column{margin-top:10px}.stage{aspect-ratio:16/10}footer{flex-wrap:wrap;padding:22px 0;gap:12px;margin-top:35px}footer>span:nth-child(2){display:none}}@media(max-width:450px){.intro h1{font-size:48px}.intro p{font-size:14px}.panel{padding:16px}.scene-buttons{gap:5px}.scene-card{padding:8px}.scene-card-name{font-size:10px}.scene-card-meta{font-size:8px}.connect-panel{display:block}.connection-actions{margin-top:14px}.header-link{font-size:10px}}
:root{--reactor-accent:#d6c58e}
#stage-empty .stage-connect{border:1px solid var(--reactor-accent);background:var(--reactor-accent);color:#171a13;padding:10px 15px;margin-top:18px;font-size:12px;font-weight:700}
#stage-empty .stage-connect:hover:enabled{background:#ebdcae}
.toolbar-actions{display:flex;align-items:center;gap:18px}

/* Reactor Guidelines / Master File: Interstellar, Dune, Whiteout, Aeonik, Plex Mono. */
@font-face{font-family:Aeonik;src:url("https://docs.reactor.inc/fonts/aeonik/aeonik-regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Aeonik;src:url("https://docs.reactor.inc/fonts/aeonik/aeonik-medium.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:Aeonik;src:url("https://docs.reactor.inc/fonts/aeonik/aeonik-bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("https://docs.reactor.inc/fonts/ibm-plex-mono/IBMPlexMono-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
:root{--interstellar:#000;--dune:#c7c099;--whiteout:#fff;--secondary:#555240;--line:#d9d6c4;--mono:"IBM Plex Mono",ui-monospace,monospace;--reactor-accent:var(--dune);font-family:Aeonik,Arial,sans-serif;color:var(--interstellar);background:var(--whiteout)}
body{background:var(--whiteout)}
.shell{max-width:1600px;padding:0 56px}
.site-header{border-bottom-color:var(--interstellar)}
.brand img{max-height:22px;filter:invert(1)}
.header-divider{background:var(--interstellar)}
.header-label,.header-link,footer,.column-heading span,.scene-card-meta,.panel-note{font-family:var(--mono);letter-spacing:.02em}
.header-label{color:var(--secondary);font-size:11px}
.header-link{color:var(--interstellar);border-bottom:1px solid var(--interstellar);padding-bottom:5px}
.header-link:hover,footer a:hover{color:var(--secondary);text-decoration:none}
.intro{padding:72px 0 66px;border-bottom-color:var(--interstellar)}
.intro h1{font-size:clamp(58px,7vw,108px);line-height:.94;letter-spacing:-.055em;font-weight:700;margin-bottom:32px}
.title-period{color:var(--dune)}
.intro p{color:var(--interstellar);font-size:19px;line-height:1.48}
.workspace{grid-template-columns:minmax(390px,.88fr) minmax(0,1.52fr);gap:40px;padding-top:34px}
.column-heading h2{font-size:18px;font-weight:700}
.column-heading span{color:var(--secondary)}
.panel{background:var(--whiteout);border-color:var(--interstellar)}
.scene-examples p,.field label,.field-row label{font-family:var(--mono);font-size:10px;letter-spacing:.01em;text-transform:none;font-weight:400;color:var(--interstellar)}
.scene-card{min-height:96px;border-color:var(--line);background:var(--whiteout);color:var(--interstellar)}
.scene-card:hover{border-color:var(--interstellar);background:var(--whiteout)}
.scene-card.active,.scene-card.active:hover{border-color:var(--interstellar);background:var(--dune)}
.scene-card-name{font-size:13px;font-weight:700}
.scene-card-meta{color:var(--secondary)}
.editor-tabs{padding:0;border-color:var(--interstellar);background:var(--whiteout)}
.editor-tabs button{min-height:39px;background:var(--whiteout);color:var(--interstellar)}
.editor-tabs button+button{border-left:1px solid var(--interstellar)}
.editor-tabs button[aria-selected=true]{background:var(--interstellar);color:var(--whiteout)}
.field{margin-top:16px}
.field label{margin-bottom:8px}
.optional{color:var(--secondary);font-family:Aeonik,Arial,sans-serif}
.field textarea,.field input{background:var(--whiteout);border-color:#9d9b8d;color:var(--interstellar);font-size:13px;line-height:1.48;border-radius:0}
.field textarea{min-height:110px}
.field input{min-height:42px}
input::placeholder,textarea::placeholder{color:#777568}
textarea:focus,input:focus,select:focus,button:focus-visible,summary:focus-visible{outline-color:var(--dune)}
.reference-section,.prompt-preview{border-top-color:var(--line)}
.reference-section summary,.prompt-preview summary{color:var(--interstellar);font-size:12px;font-weight:500}
.reference-section summary span,.reference-body p{color:var(--secondary)}
.reference-section summary span,.prompt-preview pre{font-family:var(--mono)}
.reference-item{border-color:var(--line);background:#f7f6f1}
.reference-item-head{color:var(--interstellar)}
.reference-item-head button{color:var(--interstellar)}
.reference-item input,.reference-item select{border-color:#9d9b8d;background:var(--whiteout);color:var(--interstellar);border-radius:0}
.upload-button{border-color:var(--secondary);color:var(--interstellar)}
.upload-button:hover{border-color:var(--interstellar);background:var(--dune)}
.field-row label{color:var(--interstellar)}
.field-row select{background:var(--whiteout);border-color:var(--interstellar);color:var(--interstellar);border-radius:0}
.prompt-preview pre{color:var(--secondary)}
.primary-button{border:1px solid var(--interstellar);background:var(--interstellar);color:var(--whiteout)}
.primary-button:hover:enabled{background:var(--secondary)}
.panel-note{color:var(--secondary)}
.stage{background:var(--interstellar);border-color:var(--interstellar)}
.stage video{background:var(--interstellar)}
#stage-empty{background:var(--interstellar);color:var(--whiteout)}
#stage-empty img{opacity:.55}
#stage-empty strong{font-size:22px;font-weight:700;color:var(--whiteout)}
#stage-empty span{font-size:13px}
#stage-empty .stage-connect{border-color:var(--dune);background:var(--dune);color:var(--interstellar);padding:11px 17px}
#stage-empty .stage-connect:hover:enabled{background:var(--whiteout);border-color:var(--whiteout)}
.stage-toolbar{border-bottom-color:var(--interstellar)}
.status{color:var(--interstellar)}
#status-dot{background:var(--secondary)}
#status-dot.ready{background:var(--dune);box-shadow:0 0 0 1px var(--interstellar)}
.text-button{color:var(--interstellar)}
.text-button:hover:enabled{text-decoration:underline}
#detail{color:var(--secondary)}
#detail.error{color:#8e3329}
footer{border-top-color:var(--interstellar);color:var(--secondary)}
footer a{color:var(--interstellar)}
.footer-divider{color:var(--secondary)}
@media(max-width:1050px){.shell{padding:0 28px}.workspace{gap:20px;grid-template-columns:minmax(330px,1fr) minmax(0,1.2fr)}}
@media(max-width:800px){.shell{padding:0 18px}.intro{padding:50px 0 42px}.intro p{font-size:16px}.workspace{grid-template-columns:1fr}}
@media(max-width:450px){.intro h1{font-size:52px}.intro p{font-size:15px}.scene-card-name{font-size:11px}}

/* A single compose-and-generate flow. */
.site-header{border-bottom:0}
.intro{border-bottom:0;padding:64px 0 52px}
.workspace{padding-top:0}
.scene-card,.scene-card:hover,.scene-card.active,.scene-card.active:hover{display:block;min-height:0;padding:0;border:2px solid transparent;background:var(--interstellar);color:var(--whiteout)}
.scene-card:hover{border-color:var(--secondary)}
.scene-card.active,.scene-card.active:hover{border-color:var(--dune)}
.scene-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.scene-card-name{display:flex;align-items:center;min-height:40px;padding:7px 9px;font-size:12px;line-height:1.15;font-weight:500}
.reference-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.reference-heading h2{margin:0;font:400 11px var(--mono)}
.reference-heading span{color:var(--secondary);font:400 11px var(--mono)}
.reference-body p{margin:10px 0 0}
.stage{aspect-ratio:16/9}
.stage video:not([src]){visibility:visible}
#stage-empty{gap:22px}
#stage-empty img{width:64px;max-height:none;height:auto;margin:0;opacity:1}
#stage-empty span{font-size:14px;max-width:270px}
.stage-toolbar{min-height:42px;border-bottom:0}
#detail{margin:5px 0 0}
footer{justify-content:flex-end;min-height:64px;border-top:0;margin-top:30px}
@media(max-width:800px){.intro{padding:40px 0 36px}.stage{aspect-ratio:16/9}}
@media(max-width:450px){.intro h1{font-size:clamp(42px,12vw,52px)}.scene-card-name{font-size:10px;padding:6px;min-height:36px}}
@media(max-width:800px){.stage-column{order:-1;margin-top:0}}
.field-help{margin:7px 0 0;color:var(--secondary);font-size:11px;line-height:1.45}
