:root{color:#17202a;font-synthesis:none;text-rendering:optimizelegibility;background:#eef3f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}button,input,textarea{font:inherit}a{color:inherit}.shell{min-height:100svh;padding:16px}.topbar{justify-content:space-between;align-items:center;gap:16px;max-width:1180px;margin:0 auto 16px;display:flex}.brand{color:#17202a;font-weight:800;text-decoration:none}.nav-actions{align-items:center;gap:8px;display:flex}.action-link,.secondary-link{color:#17202a;background:#fff;border:1px solid #1c2d3a;border-radius:6px;justify-content:center;align-items:center;min-height:40px;padding:0 14px;font-weight:800;text-decoration:none;display:inline-flex}.action-link[aria-current=page],.secondary-link{color:#fff;background:#17202a}.workspace{gap:16px;max-width:1180px;margin:0 auto;display:grid}.control-panel{flex-direction:column;gap:20px;min-width:0;padding:6px 0 0;display:flex}.eyebrow{color:#42606c;letter-spacing:0;text-transform:uppercase;margin:0;font-size:.78rem;font-weight:800}h1{letter-spacing:0;margin:-6px 0 0;font-size:2.55rem;line-height:1}.route-stack{gap:16px;display:grid}.status-row{color:#31404c;border-block:1px solid #c7d2dc;justify-content:space-between;align-items:center;gap:14px;min-height:44px;padding:10px 0;display:flex}.status-row span{overflow-wrap:anywhere}.status-row strong{color:#17202a;flex:none}.prompt-box,.code-entry label{color:#31404c;gap:8px;font-weight:800;display:grid}.prompt-box textarea,.code-entry input{color:#17202a;background:#fff;border:1px solid #9fb0be;border-radius:8px;width:100%;padding:14px;line-height:1.4}.prompt-box textarea{resize:vertical;min-height:132px}.code-entry{gap:12px;display:grid}.code-entry button,.primary-button,.secondary-button{color:#fff;background:#17202a;border:1px solid #17202a;border-radius:6px;min-height:48px;font-weight:800}.primary-button:disabled,.secondary-button:disabled,.code-entry button:disabled{color:#17202a;background:#9fb0be;border-color:#9fb0be}.secondary-button{color:#17202a;background:#fff;min-width:92px}.prompt-actions{grid-template-columns:auto minmax(0,1fr);gap:8px;display:grid}.prompt-actions[data-has-voice=false]{grid-template-columns:1fr}.form-error{color:#9a1f1f;margin:0;font-weight:800}.form-success{color:#1d6f48;margin:0;font-weight:800}.progress-message{color:#31404c;margin:0;font-weight:800}.share-panel{border-block:1px solid #c7d2dc;gap:8px;padding:10px 0;display:grid}.share-panel div{grid-template-columns:minmax(96px,auto) minmax(0,1fr);align-items:baseline;gap:12px;display:grid}.share-panel span{color:#566775;text-transform:uppercase;font-size:.74rem;font-weight:800}.share-panel strong,.share-panel a{overflow-wrap:anywhere;min-width:0;font-weight:800}.workflow{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.workflow li{color:#30414f;border:1px solid #a9b8c7;border-radius:6px;place-items:center;min-height:38px;font-weight:800;display:grid}.agent-progress{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.agent-progress li{color:#30414f;text-align:center;border:1px solid #a9b8c7;border-radius:6px;grid-template-rows:auto auto;justify-items:center;gap:5px;min-width:0;min-height:54px;padding:7px 4px;font-size:.72rem;font-weight:800;display:grid}.agent-progress span{color:#17202a;background:#e2e8ee;border-radius:999px;place-items:center;width:22px;height:22px;display:grid}.agent-progress strong{overflow-wrap:anywhere;max-width:100%}.agent-progress li[data-state=active]{color:#173f60;background:#e7f1fb;border-color:#245e8f}.agent-progress li[data-state=complete]{color:#155238;background:#e7f4ed;border-color:#1d6f48}.agent-progress li[data-state=failed]{color:#7a1919;background:#faeeee;border-color:#9a1f1f}.project-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.project-list li{border-bottom:1px solid #c7d2dc;justify-content:space-between;align-items:center;gap:12px;min-height:44px;display:flex}.project-list a{font-weight:800}.viewport-panel{gap:12px;display:grid}.viewport{background:#8ed2ff;border:1px solid #b8c7d6;border-radius:8px;min-height:46vh;position:relative;overflow:hidden}.runtime-canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.runtime-join-gate{color:#17202a;background:linear-gradient(135deg,#8ed2ffd1,#5f8f4a47),#8ed2ff;place-items:center;padding:24px;display:grid}.runtime-join-gate div{text-align:center;gap:8px;display:grid}.runtime-join-gate span{color:#31404c;text-transform:uppercase;font-size:.82rem;font-weight:800}.runtime-join-gate strong{font-size:1.35rem;line-height:1.1}.runtime-touch-controls{z-index:2;pointer-events:none;display:none;position:absolute;inset:0}.touch-joystick,.touch-jump-button{pointer-events:auto;touch-action:none;user-select:none;position:absolute;bottom:18px}.touch-joystick{background:#f5f7f985;border:1px solid #17202a52;border-radius:999px;width:112px;height:112px;left:18px;box-shadow:inset 0 0 0 1px #ffffff73}.touch-joystick-knob{background:#ffffffe0;border:1px solid #17202a57;border-radius:999px;width:46px;height:46px;margin:-23px 0 0 -23px;position:absolute;top:50%;left:50%;box-shadow:0 6px 16px #17202a2e}.touch-jump-button{color:#17202a;width:78px;height:78px;font:inherit;text-transform:uppercase;background:#ffffffe0;border:1px solid #17202a57;border-radius:999px;place-items:center;font-size:.72rem;font-weight:900;display:grid;right:18px;box-shadow:0 8px 18px #17202a2e}.runtime-failure{z-index:4;color:#f5f7f9;text-align:center;background:#23303d;place-items:center;padding:24px;font-weight:700;display:grid;position:absolute;inset:0}.runtime-notice{z-index:5;color:#23303d;pointer-events:none;background:#f5f7f9f0;border:1px solid #23303d2e;border-radius:8px;max-width:min(320px,100% - 24px);padding:10px 12px;font-size:.82rem;font-weight:700;position:absolute;bottom:66px;right:12px;box-shadow:0 8px 20px #17202a2e}.preview-hud{z-index:1;color:#17202a;background:#ffffffd1;border:1px solid #17202a38;border-radius:6px;justify-content:space-between;align-items:center;gap:12px;min-height:42px;padding:10px 12px;font-size:.86rem;font-weight:800;display:flex;position:absolute;bottom:12px;left:12px;right:12px}.preview-hud span{overflow-wrap:anywhere;min-width:0}.runtime-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0;display:grid}.runtime-stats div{border-bottom:1px solid #c7d2dc;min-width:0;padding:8px 0}.runtime-stats dt{color:#566775;text-transform:uppercase;font-size:.74rem;font-weight:800}.runtime-stats dd{overflow-wrap:anywhere;margin:4px 0 0;font-weight:800}@media (width>=760px){.shell{padding:24px}.topbar{margin-bottom:24px}.workspace{grid-template-columns:minmax(320px,420px) minmax(0,1fr);align-items:stretch;min-height:calc(100vh - 96px)}.control-panel{padding-top:18px}h1{font-size:3.25rem}.viewport{height:100%;min-height:580px}}@media (hover:none),(width<=760px){.runtime-touch-controls{display:block}.preview-hud{top:12px;bottom:auto}}@media (width>=560px) and (height<=520px){:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]){grid-template-rows:auto minmax(0,1fr);gap:8px;height:100svh;min-height:0;padding:8px 12px;display:grid;overflow:hidden}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .topbar{width:100%;max-width:none;margin-bottom:0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .action-link{min-height:36px;padding-inline:12px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .workspace{grid-template-columns:minmax(212px,35vw) minmax(0,1fr);align-items:stretch;gap:10px;width:100%;max-width:none;height:100%;min-height:0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .control-panel{-webkit-overflow-scrolling:touch;gap:8px;min-height:0;padding-top:0;overflow:auto}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .eyebrow{font-size:.68rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) h1{margin-top:0;font-size:1.48rem;line-height:1.05}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .route-stack{gap:8px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .status-row{min-height:34px;padding:6px 0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .prompt-box,:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .code-entry label{gap:5px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .prompt-box textarea{resize:none;height:84px;min-height:84px;max-height:84px;padding:10px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .code-entry{gap:8px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .code-entry input{padding:10px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .code-entry button,:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .primary-button,:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .secondary-button{min-height:40px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .share-panel{gap:4px;padding:6px 0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .share-panel div{grid-template-columns:minmax(76px,auto) minmax(0,1fr);gap:8px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .share-panel span{font-size:.66rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .agent-progress{gap:4px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .agent-progress li{gap:3px;min-height:34px;padding:4px 2px;font-size:.62rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .agent-progress span{width:16px;height:16px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .progress-message,:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .form-error,:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .form-success{font-size:.82rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .viewport-panel{grid-template-rows:minmax(0,1fr) auto;gap:8px;min-height:0;overflow:hidden}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .viewport{border-radius:6px;height:auto;min-height:0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .runtime-join-gate{padding:12px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .preview-hud{min-height:34px;padding:6px 8px;font-size:.76rem;inset:8px 8px auto}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .runtime-stats{gap:6px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .runtime-stats div{padding:4px 0}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .runtime-stats dt{font-size:.64rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .runtime-stats dd{margin-top:2px;font-size:.82rem}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .touch-joystick{width:88px;height:88px;bottom:12px;left:12px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .touch-joystick-knob{width:36px;height:36px;margin:-18px 0 0 -18px}:is(.shell[data-route=create],.shell[data-route=play],.shell[data-route=game]) .touch-jump-button{width:64px;height:64px;font-size:.66rem;bottom:12px;right:12px}}@media (width<=420px){.shell{padding:12px}.topbar{flex-direction:column;align-items:flex-start}.nav-actions{width:100%}.action-link{flex:1 1 0;padding-inline:8px}h1{font-size:2.22rem}.runtime-stats{grid-template-columns:1fr}}
