/* The coding agent and Project Room are separate tools around one repository. */
.workroom-scene{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(0,.74fr) minmax(0,.83fr);align-items:center;gap:20px;height:410px;padding:18px 0 25px;background:radial-gradient(ellipse 52% 48% at 51% 72%,#a7d0d927,transparent 83%)}
.workroom-scene:after{content:"";position:absolute;left:8%;right:4%;bottom:24px;height:82px;border:1px solid #8cb7c138;border-radius:50%;transform:perspective(520px) rotateX(67deg);pointer-events:none}
.workroom-scene .hero-control-device{position:relative;z-index:2;left:auto;top:auto;width:100%;height:305px;margin:13px 0 0;transform:perspective(1100px) rotateY(8deg) rotateZ(-2deg);transform-origin:left center}
.workroom-middle{position:relative;z-index:3;height:335px;margin-top:10px;min-width:0}.workroom-middle:before{content:"";position:absolute;z-index:-1;left:50%;top:160px;bottom:55px;border-left:1px dashed #78a5b2a8}
.workroom-agent-device{position:absolute;top:0;left:0;width:100%;height:178px;overflow:hidden;border:1px solid #9dbbc7;border-radius:12px;background:#f8fbfc;color:#274b5e;box-shadow:8px 15px 0 -7px #bbd2d9,0 23px 40px #154b6130;transform:perspective(800px) rotateY(-7deg) rotateZ(2deg)}
.workroom-agent-top{display:flex;align-items:center;gap:7px;min-height:46px;padding:7px 10px;border-bottom:1px solid #dae6ea;background:#eaf2f5}.workroom-agent-symbol{display:grid;place-items:center;flex:none;width:25px;height:25px;border-radius:6px;background:#d8e8ec;color:#426d80;font-size:13px}
.workroom-agent-top strong,.workroom-agent-top small{display:block;white-space:nowrap}.workroom-agent-top strong{font-size:10px}.workroom-agent-top small{margin-top:2px;color:#7995a2;font-size:7px}.workroom-agent-external{margin-left:auto;color:#7895a1;font-size:6px;font-weight:800;letter-spacing:.08em;white-space:nowrap}
.workroom-agent-prompt{margin:10px 11px 7px;padding:8px;border:1px solid #dce8ec;border-radius:7px;background:#fff;color:#416477}.workroom-agent-prompt small,.workroom-agent-result small{display:block;margin-bottom:3px;color:#86a0ac;font-size:6px;font-weight:800;letter-spacing:.12em}.workroom-agent-prompt span{font-size:9px;font-weight:650}
.workroom-agent-result{display:grid;grid-template-columns:1fr 1fr;gap:4px 6px;margin:0 12px}.workroom-agent-result small{grid-column:1/-1;margin-bottom:0}.workroom-agent-result span{display:block;padding:4px 5px;border-radius:4px;background:#edf5f1;color:#4f7765;font:8px ui-monospace,SFMono-Regular,Menlo,monospace}.workroom-agent-result i{font-style:normal;color:#32966b}
.workroom-person{position:absolute;z-index:1;top:120px;left:-34px;display:flex;align-items:flex-end;width:calc(100% + 35px);height:205px;pointer-events:none}
.workroom-person img{display:block;flex:none;width:188px;height:245px;object-fit:contain;filter:drop-shadow(0 13px 10px #183d4c48)}
.workroom-repo{position:absolute;z-index:2;left:-7px;right:-5px;bottom:0;display:flex;align-items:center;gap:9px;min-height:70px;padding:10px 12px;border:1px solid #7eacba;border-radius:11px;background:linear-gradient(145deg,#fff,#e1f0f2);box-shadow:8px 12px 0 -7px #a5c6cd,0 20px 34px #23566d2e;transform:perspective(800px) rotateY(-5deg) rotateZ(-1deg)}
.workroom-repo-icon{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:8px;background:#cce5e9;color:#2d6a7d;font-size:18px}.workroom-repo strong,.workroom-repo small{display:block;white-space:nowrap}.workroom-repo strong{color:#265469;font-size:10px}.workroom-repo small{margin-top:4px;color:#6e91a0;font-size:8px}.workroom-repo-pulse{position:absolute;top:-6px;right:17px;width:10px;height:10px;border:2px solid #eaf5f2;border-radius:50%;background:#55b38a;box-shadow:0 0 0 4px #6cbd9930}
.workroom-repo:before{content:"";position:absolute;right:100%;top:49%;width:62px;border-top:1px dashed #78a5b2a8;pointer-events:none}
.workroom-scene .hero-project-components{position:relative;z-index:2;left:auto;right:auto;top:auto;bottom:auto;display:flex;flex-direction:column;justify-content:center;gap:11px;height:335px;margin-top:10px;perspective:850px}
.workroom-scene .hero-project-components button,.workroom-scene .hero-project-components button:nth-child(n){position:relative;left:auto;right:auto;top:auto;bottom:auto;width:88%;min-width:0;min-height:69px;padding:8px 9px;grid-template-columns:28px minmax(0,1fr);transform:rotateY(-10deg) rotateZ(2deg)}
.workroom-scene .hero-project-components button:nth-child(even){align-self:flex-end;transform:rotateY(-10deg) rotateZ(-2deg)}.workroom-scene .hero-project-components button:hover,.workroom-scene .hero-project-components button:focus-visible{transform:translateY(-5px) rotateY(-5deg)}
.workroom-scene .hero-project-components i{width:28px;height:28px;font-size:15px}.workroom-scene .hero-project-components b{font-size:10px}.workroom-scene .hero-project-components small{font-size:8px}.workroom-scene .hero-project-components em{font-size:7px;margin-top:2px}
html[data-theme="dark"] .workroom-scene{background:radial-gradient(ellipse 52% 48% at 51% 72%,#2c69833d,transparent 83%)}html[data-theme="dark"] .workroom-scene:after{border-color:#79b1c034}html[data-theme="dark"] .workroom-middle:before{border-color:#7ca6b6a0}
html[data-theme="dark"] .workroom-agent-device{background:#1c3445;border-color:#557989;color:#e0eef2;box-shadow:8px 15px 0 -7px #16303f,0 23px 40px #061927a1}html[data-theme="dark"] .workroom-agent-top{background:#28495b;border-color:#3b5e6e}html[data-theme="dark"] .workroom-agent-symbol{background:#355d6e;color:#d7eef2}html[data-theme="dark"] .workroom-agent-top small,html[data-theme="dark"] .workroom-agent-external{color:#a7c3ce}
html[data-theme="dark"] .workroom-agent-prompt{background:#203b4b;border-color:#456273;color:#e2eef2}html[data-theme="dark"] .workroom-agent-prompt small,html[data-theme="dark"] .workroom-agent-result small{color:#a6c0ca}html[data-theme="dark"] .workroom-agent-result span{background:#244a40;color:#c2e7d3}
html[data-theme="dark"] .workroom-person img{filter:drop-shadow(0 13px 12px #041b2999)}
html[data-theme="dark"] .workroom-repo{background:linear-gradient(145deg,#2e5868,#234655);border-color:#699aa8;box-shadow:8px 12px 0 -7px #1d3b48,0 20px 34px #041b2980}html[data-theme="dark"] .workroom-repo-icon{background:#3c7180;color:#e4f4f5}html[data-theme="dark"] .workroom-repo strong{color:#edf7f6}html[data-theme="dark"] .workroom-repo small{color:#b4d0d8}
@media(max-width:930px){.workroom-scene{grid-template-columns:minmax(0,1.24fr) minmax(0,.74fr) minmax(0,.78fr);gap:13px}.workroom-agent-external{display:none}.workroom-person{top:119px;left:-23px}.workroom-person img{width:171px;height:224px}.workroom-repo{left:-4px;right:-4px}.workroom-repo small{white-space:normal}}
@media(max-width:700px){.workroom-scene{display:flex;flex-direction:column;align-items:stretch;height:auto;gap:22px;padding:26px 4px 10px}.workroom-middle{order:1;height:310px;width:min(100%,410px);margin:0 auto}.workroom-agent-device{height:165px}.workroom-person{top:105px;left:2px}.workroom-person img{width:188px;height:245px}.workroom-repo{left:4px;right:4px}.workroom-scene .hero-control-device{order:2;width:min(100%,500px);height:280px;margin:0 auto;transform:rotate(-2deg)}.workroom-scene .hero-project-components{order:3;display:grid;grid-template-columns:1fr 1fr;gap:12px;height:auto;margin:0}.workroom-scene .hero-project-components button,.workroom-scene .hero-project-components button:nth-child(n){width:100%;min-height:76px;transform:none}.workroom-scene .hero-project-components button:hover,.workroom-scene .hero-project-components button:focus-visible{transform:translateY(-4px)}}
@media(max-width:700px){.workroom-repo:before{display:none}}
@media(max-width:430px){.workroom-middle{height:296px}.workroom-agent-device{height:158px}.workroom-person{top:102px}.workroom-person img{width:171px;height:224px}.workroom-scene .hero-control-device{height:258px}.workroom-scene .hero-project-components{gap:9px}.workroom-scene .hero-project-components button,.workroom-scene .hero-project-components button:nth-child(n){min-height:74px}.workroom-scene .hero-project-components b{font-size:9px}.workroom-scene .hero-project-components small{font-size:8px}}
@media(prefers-reduced-motion:reduce){.workroom-repo-pulse{box-shadow:none}}

/* A small, readable version of the real Overview, rather than a service-only screen. */
.workroom-scene .hero-control-inner{grid-template-columns:36px minmax(0,1fr)}
.workroom-scene .hero-control-rail{gap:7px;padding:11px 0;font-size:13px}
.workroom-scene .hero-control-rail span{width:23px;height:23px}
.workroom-scene .hero-control-main{min-width:0;padding:9px 12px 8px}
.workroom-scene .hero-control-main>small{display:block;font-size:6px;letter-spacing:.13em}
.workroom-scene .hero-control-main h3{margin:3px 0 7px;font-size:15px;line-height:1.1}
.hero-control-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-bottom:6px}
.hero-control-stats>div{min-width:0;min-height:49px;padding:6px 7px;border:1px solid #dce8eb;border-radius:7px;background:#fff}
.hero-control-stats small,.hero-control-stats strong,.hero-control-stats span{display:block;white-space:nowrap}
.hero-control-stats small{color:#7896a4;font-size:7px}
.hero-control-stats strong{margin-top:2px;color:#24485a;font-size:15px;line-height:1;font-weight:800}
.hero-control-stats strong i{color:#7896a4;font-size:8px;font-style:normal}
.hero-control-stats span{margin-top:2px;color:#7896a4;font-size:6px}
.hero-control-panels{display:grid;grid-template-rows:70px 64px;gap:6px}
.hero-control-services,.hero-control-performance{min-width:0;overflow:hidden;border:1px solid #dce8eb;border-radius:7px;background:#fff}
.hero-control-panel-head{display:flex;justify-content:space-between;gap:6px;padding:5px 7px 4px;border-bottom:1px solid #e4ecee;color:#31576a;font-size:8px;font-weight:800;white-space:nowrap}
.hero-control-panel-head span{color:#8ca3ad;font-size:6px;font-weight:650}
.workroom-scene .hero-control-row{height:16px;gap:5px;padding:0 7px;border:0;color:#315367}
.workroom-scene .hero-control-row+.hero-control-row{border-top:1px solid #eff3f4}
.workroom-scene .hero-control-row>span{width:13px;height:13px;border-radius:3px;font-size:8px}
.workroom-scene .hero-control-row b{font-size:7px}
.workroom-scene .hero-control-row em{padding:1px 4px;font-size:6px}
.hero-control-performance svg{display:block;width:calc(100% - 16px);height:27px;margin:2px 8px 0}
.hero-control-chart-fill{fill:#90b7ca22}
.hero-control-chart-line{fill:none;stroke:#5f8ca7;stroke-width:2;stroke-linecap:round}
.hero-control-perf-values{display:flex;gap:16px;padding:0 8px;color:#88a0aa;font-size:6px}
.hero-control-perf-values b{margin-left:3px;color:#365d70;font-size:7px}
html[data-theme="dark"] .hero-control-stats>div,html[data-theme="dark"] .hero-control-services,html[data-theme="dark"] .hero-control-performance{border-color:#3c5a6b;background:#244354}
html[data-theme="dark"] .hero-control-stats small,html[data-theme="dark"] .hero-control-stats span,html[data-theme="dark"] .hero-control-panel-head span,html[data-theme="dark"] .hero-control-perf-values{color:#a6c1cc}
html[data-theme="dark"] .hero-control-stats strong,html[data-theme="dark"] .hero-control-panel-head,html[data-theme="dark"] .hero-control-perf-values b{color:#e5f1f4}
html[data-theme="dark"] .hero-control-panel-head,html[data-theme="dark"] .workroom-scene .hero-control-row+.hero-control-row{border-color:#3b5b6d}
html[data-theme="dark"] .hero-control-chart-fill{fill:#87c5df22}
html[data-theme="dark"] .hero-control-chart-line{stroke:#8cc4d6}
@media(max-width:430px){.workroom-scene .hero-control-main{padding:6px 8px}.workroom-scene .hero-control-main h3{font-size:13px;margin-bottom:5px}.hero-control-stats>div{min-height:43px;padding:4px}.hero-control-stats strong{font-size:13px}.hero-control-panels{grid-template-rows:66px 59px;gap:5px}.hero-control-performance svg{height:24px}.hero-control-panel-head{font-size:7px}}
