:root { color-scheme: dark; --bg:#0b0e12; --surface:#10151b; --surface-2:#151b23; --line:#252d37; --text:#edf1f6; --muted:#8f9baa; --acid:#d8f26b; --blue:#73d3ff; --violet:#bd9bff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--bg); color:var(--text); } a { color:inherit; text-decoration:none; } button,input { font:inherit; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:248px minmax(0,1fr); background:radial-gradient(circle at 79% 2%,rgba(115,211,255,.055),transparent 24%),var(--bg); }
.sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:24px 14px 16px; border-right:1px solid var(--line); background:#0d1116; }
.brand { display:flex; align-items:center; gap:10px; margin:0 10px 34px; letter-spacing:.1em; }.brand-mark { display:grid; place-items:center; width:27px; height:27px; border:1px solid var(--acid); color:var(--acid); font-family:Georgia,serif; font-size:1.12rem; }.brand b,.brand small { display:block; }.brand b { font-size:.8rem; }.brand small { margin-top:1px; color:var(--acid); font-size:.55rem; letter-spacing:.22em; }
.primary-nav { display:flex; flex-direction:column; gap:2px; }.primary-nav p { margin:5px 11px 7px; color:#687585; font-size:.59rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.primary-nav p:not(:first-of-type) { margin-top:21px; }.primary-nav a { display:flex; align-items:center; gap:11px; padding:9px 11px; border-radius:5px; color:#a8b3c0; font-size:.79rem; }.primary-nav a span { width:15px; text-align:center; color:#728091; font-size:.95rem; }.primary-nav a:hover { background:var(--surface); color:var(--text); }.primary-nav a.active { background:rgba(216,242,107,.1); color:var(--acid); }.primary-nav a.active span { color:var(--acid); }
.sidebar-footer { margin-top:auto; padding:13px 10px 3px; border-top:1px solid var(--line); color:var(--muted); font-size:.66rem; }.sidebar-footer div { display:flex; align-items:center; gap:7px; }.sidebar-footer i { width:6px; height:6px; border-radius:50%; background:var(--acid); box-shadow:0 0 9px rgba(216,242,107,.75); }.sidebar-footer small { display:block; margin:8px 0 0 13px; color:#657180; font-size:.58rem; }
.lab-actions { display:flex; align-items:center; gap:10px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 11px; border:1px solid rgba(216,242,107,.38); border-radius:5px; background:rgba(216,242,107,.08); color:var(--acid); font-size:.67rem; }.button span { font-size:.9rem; }.muted-button { border-color:#303a46; background:var(--surface); color:#b6c1cd; }.lab-health-grid { display:grid; grid-template-columns:1.25fr repeat(3,1fr); gap:12px; margin:42px 0 60px; }.lab-heading { align-items:center; }.test-game-card { display:grid; grid-template-columns:minmax(220px,.45fr) 1fr; overflow:hidden; border:1px solid var(--line); border-radius:7px; background:linear-gradient(145deg,rgba(21,27,35,.96),rgba(14,18,24,.96)); }.test-game-preview { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:270px; border-right:1px solid var(--line); background:radial-gradient(circle at 50% 45%,rgba(216,242,107,.11),transparent 22%),linear-gradient(145deg,#172019,#0f1516); }.test-game-preview span { display:grid; place-items:center; width:64px; height:64px; border:1px solid rgba(216,242,107,.55); border-radius:50%; color:var(--acid); font-size:1.8rem; }.test-game-preview p { margin:14px 0 0; color:#aeb8a5; font-size:.73rem; }.test-game-content { padding:24px; }.test-game-content h3 { margin:18px 0 8px; font-size:1.2rem; letter-spacing:-.025em; }.test-game-content > p { max-width:680px; margin:0; color:var(--muted); font-size:.76rem; line-height:1.55; }.test-game-meta { display:flex; flex-wrap:wrap; gap:10px 25px; margin:22px 0; padding:14px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:#6f7d8e; font-size:.62rem; }.test-game-meta b { margin-left:4px; color:#bbc5d0; font-weight:500; }.capability-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.capability-grid article { min-height:170px; padding:17px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.capability-grid article > span { color:#718095; font-size:.6rem; font-weight:700; letter-spacing:.09em; }.capability-grid h3 { margin:21px 0 7px; font-size:.88rem; }.capability-grid p { min-height:39px; margin:0; color:var(--muted); font-size:.66rem; line-height:1.45; }.capability-grid small { display:block; margin-top:12px; color:#768495; font-size:.58rem; }.lab-lower-grid { display:grid; grid-template-columns:1.35fr .9fr; gap:12px; margin-top:48px; }.versions-panel,.qa-panel { min-height:286px; }.version-empty { display:flex; align-items:center; gap:15px; padding:27px 8px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.version-empty > span { display:grid; place-items:center; width:36px; height:36px; border:1px dashed #4d5a68; color:#718093; }.version-empty b { font-size:.76rem; }.version-empty p { max-width:440px; margin:5px 0 0; color:var(--muted); font-size:.69rem; line-height:1.45; }.qa-panel h2 { margin:0; font-size:1.12rem; letter-spacing:-.025em; }.qa-score { display:flex; align-items:baseline; gap:9px; margin:17px 0 12px; }.qa-score strong { color:var(--acid); font-size:2rem; font-weight:560; }.qa-score span { color:#778494; font-size:.64rem; }.qa-panel ul { margin:0; padding:0; list-style:none; }.qa-panel li { display:flex; gap:11px; padding:10px 0; border-top:1px solid var(--line); }.qa-panel li > span { color:#718093; font-family:Georgia,serif; font-size:.78rem; }.qa-panel b,.qa-panel small { display:block; }.qa-panel b { font-size:.69rem; }.qa-panel small { margin-top:2px; color:var(--muted); font-size:.62rem; }.lab-activity { margin-top:48px; }
main { min-width:0; }
.content { width:min(1260px,100%); padding:52px 44px 70px; }.page-heading { display:flex; justify-content:space-between; gap:30px; align-items:end; }.eyebrow { margin:0 0 9px; color:#718095; font-size:.61rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }.page-heading h1 { margin:0; font-size:2.25rem; letter-spacing:-.055em; }.page-heading p:last-child { max-width:620px; margin:10px 0 0; color:var(--muted); font-size:.86rem; }.period { display:flex; padding:3px; border:1px solid var(--line); border-radius:5px; background:var(--surface); }.period span { padding:6px 9px; border-radius:3px; color:#718091; font-size:.61rem; }.period span.active { background:#253020; color:var(--acid); }
.summary-grid { display:grid; grid-template-columns:1.25fr repeat(3,1fr); gap:12px; margin:42px 0 60px; }.summary-card { min-height:198px; padding:18px; border:1px solid var(--line); border-radius:7px; background:linear-gradient(145deg,rgba(22,29,37,.9),rgba(14,18,24,.9)); }.summary-card.focus { border-color:rgba(216,242,107,.38); background:linear-gradient(145deg,rgba(42,55,36,.7),rgba(17,23,25,.94)); }.card-top { display:flex; justify-content:space-between; align-items:center; color:#778495; font-size:.57rem; font-weight:700; letter-spacing:.11em; }.focus .card-top { color:var(--acid); }.card-top i { color:#627183; font-style:normal; font-size:.95rem; }.summary-card strong { display:block; margin:23px 0 7px; font-size:2rem; font-weight:560; letter-spacing:-.06em; }.summary-card p { min-height:55px; margin:0; color:var(--muted); font-size:.71rem; line-height:1.48; }.summary-card a { display:inline-block; margin-top:10px; color:var(--acid); font-size:.68rem; }.summary-card small { display:block; margin-top:10px; color:#728091; font-size:.63rem; }
.section-block { margin-top:12px; }.section-title { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:18px; }.section-title h2 { margin:0; font-size:1.15rem; letter-spacing:-.025em; }.section-title > span { color:#6d7a89; font-size:.6rem; letter-spacing:.1em; }.section-title > a { color:var(--blue); font-size:.69rem; }.area-icon { color:#ced8e5; font-size:1.35rem; }.area-icon.lime { color:var(--acid); }.area-icon.blue { color:var(--blue); }.area-icon.violet { color:var(--violet); }.block-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.block-card { min-height:340px; padding:19px; border:1px solid var(--line); border-radius:7px; background:linear-gradient(145deg,rgba(21,27,35,.96),rgba(14,18,24,.96)); }.block-card header { display:grid; grid-template-columns:32px 1fr auto; align-items:center; gap:10px; padding-bottom:17px; border-bottom:1px solid var(--line); }.block-card header h3,.block-card header p { margin:0; }.block-card header h3 { font-size:1.02rem; }.block-card header p { margin-top:2px; color:#738093; font-size:.61rem; }.state { display:flex; align-items:center; gap:6px; padding:4px 6px; border:1px solid #303a46; border-radius:10px; color:#798696; font-size:.55rem; }.state i { width:5px; height:5px; border-radius:50%; background:#5d6977; }.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); margin-top:18px; }.metric-grid div { min-width:0; padding:3px 11px; border-right:1px solid var(--line); }.metric-grid div:first-child { padding-left:0; }.metric-grid div:last-child { border-right:0; }.metric-grid strong,.metric-grid span { display:block; }.metric-grid strong { font-size:1.25rem; font-weight:560; }.metric-grid span { margin-top:5px; color:#748191; font-size:.56rem; line-height:1.3; }.latest { min-height:71px; margin-top:22px; padding:12px; border:1px dashed #303a46; background:rgba(9,12,16,.28); }.latest span { color:#667383; font-size:.53rem; font-weight:700; letter-spacing:.1em; }.latest p { margin:6px 0 0; color:#8d99a8; font-size:.66rem; }.block-card footer { display:flex; justify-content:space-between; gap:15px; margin-top:18px; color:#707d8d; font-size:.59rem; }.block-card footer a { color:var(--acid); }.forge-block footer a { color:var(--blue); }.signal-block footer a { color:var(--violet); }
.lower-grid { display:grid; grid-template-columns:1.35fr .9fr; gap:12px; margin-top:48px; }.panel { min-height:260px; padding:21px; border:1px solid var(--line); border-radius:7px; background:var(--surface); }.empty-state { display:flex; align-items:center; gap:15px; padding:23px 8px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.empty-state > span { display:grid; place-items:center; flex:none; width:35px; height:35px; border:1px dashed #4d5a68; color:#718093; }.empty-state b { font-size:.76rem; }.empty-state p { max-width:420px; margin:5px 0 0; color:var(--muted); font-size:.69rem; line-height:1.45; }.boundary-panel h2 { margin:0 0 20px; font-size:1.12rem; letter-spacing:-.025em; }.boundary-panel ul { margin:0; padding:0; list-style:none; }.boundary-panel li { display:flex; gap:11px; padding:11px 0; border-top:1px solid var(--line); }.boundary-panel li > span { color:var(--acid); font-family:Georgia,serif; font-size:.78rem; }.boundary-panel b,.boundary-panel small { display:block; }.boundary-panel b { font-size:.71rem; }.boundary-panel small { margin-top:2px; color:var(--muted); font-size:.64rem; }
.heading-tools { display:flex; align-items:center; gap:10px; }.demo-badge { padding:5px 7px; border:1px solid rgba(115,211,255,.3); border-radius:10px; color:var(--blue); font-size:.55rem; }.state.ready { border-color:rgba(216,242,107,.25); color:#bcd664; }.state.ready i { background:var(--acid); box-shadow:0 0 7px rgba(216,242,107,.55); }.state.warning { border-color:rgba(255,194,102,.26); color:#f0bd72; }.state.warning i { background:#ffbd61; }.state.planned { border-color:rgba(189,155,255,.25); color:#c9adff; }.state.planned i { background:var(--violet); }.activity-list { margin:0; padding:0; list-style:none; }.activity-list li { display:grid; grid-template-columns:36px 25px 1fr; gap:10px; align-items:start; padding:12px 0; border-top:1px solid var(--line); }.activity-list time { padding-top:2px; color:#718093; font-size:.59rem; }.activity-list .area-icon { font-size:1rem; }.activity-list b { font-size:.7rem; }.activity-list p { margin:3px 0 0; color:var(--muted); font-size:.64rem; }.boundary-panel li:nth-child(-n+2) > span { color:#ffbd61; }
.capability-grid small.cap-ready { color:#bcd664; }.capability-grid small.cap-warning { color:#f0bd72; }.capability-grid small.cap-progress { color:var(--blue); }.version-list { border-top:1px solid var(--line); }.version-list > div { display:grid; grid-template-columns:70px 1fr 1.35fr 58px; align-items:center; gap:12px; min-height:51px; border-bottom:1px solid var(--line); }.version-list b { font-size:.73rem; }.version-list small,.version-list time { color:var(--muted); font-size:.61rem; }.version-list time { text-align:right; }.version-state { width:max-content; padding:3px 6px; border-radius:9px; font-size:.55rem; }.version-state.stable { background:rgba(216,242,107,.1); color:var(--acid); }.version-state.candidate { background:rgba(255,189,97,.1); color:#f0bd72; }.version-state.development { background:rgba(115,211,255,.1); color:var(--blue); }.qa-panel li:first-of-type > span,.qa-panel li:nth-of-type(2) > span { color:var(--acid); }.qa-panel li:last-of-type > span { color:#ffbd61; }.lab-activity-list { border-bottom:1px solid var(--line); }
.forge-focus { border-color:rgba(115,211,255,.4); background:linear-gradient(145deg,rgba(23,48,59,.65),rgba(17,23,27,.94)); }.forge-focus .card-top,.forge-focus a { color:var(--blue); }.forge-build-preview { background:radial-gradient(circle at 50% 45%,rgba(115,211,255,.11),transparent 22%),linear-gradient(145deg,#101c22,#0f1516); }.forge-build-preview span { border-color:rgba(115,211,255,.6); color:var(--blue); }
.lab-workspace-nav { display:flex; gap:4px; margin:28px 0 36px; padding-bottom:12px; border-bottom:1px solid var(--line); overflow:auto; }.lab-workspace-nav a { flex:none; padding:7px 11px; border-radius:4px; color:#7f8b9a; font-size:.67rem; }.lab-workspace-nav a:hover { color:var(--text); background:var(--surface); }.lab-workspace-nav a.active { color:var(--acid); background:rgba(216,242,107,.09); }.lab-page-main { margin-top:0; }
@media(max-width:1050px){ .summary-grid,.lab-health-grid{grid-template-columns:repeat(2,1fr)}.summary-card.focus{grid-column:auto}.block-grid{grid-template-columns:1fr}.lower-grid,.lab-lower-grid{grid-template-columns:1fr}.capability-grid{grid-template-columns:repeat(2,1fr)}.content{padding:42px 30px 60px} }
@media(max-width:720px){ .app-shell{display:block}.sidebar{position:relative;height:auto;padding:15px;border-right:0;border-bottom:1px solid var(--line)}.brand{margin:0 5px 16px}.primary-nav{flex-direction:row;overflow:auto;padding-bottom:3px}.primary-nav p,.primary-nav a:not(.active):nth-of-type(n+6){display:none}.primary-nav a{white-space:nowrap}.sidebar-footer{display:none}.content{padding:34px 18px 52px}.page-heading{align-items:start;flex-direction:column}.summary-grid,.lab-health-grid{grid-template-columns:1fr}.lower-grid,.lab-lower-grid{margin-top:32px}.section-title{margin-top:0}.summary-card{min-height:170px}.summary-card p{min-height:0}.metric-grid{grid-template-columns:repeat(2,1fr);gap:14px 0}.metric-grid div:nth-child(2){border-right:0}.metric-grid div:nth-child(3){padding-left:0}.block-card{min-height:auto}.block-card footer{align-items:flex-start;flex-direction:column}.period{align-self:flex-start}.lab-actions{align-items:flex-start;flex-direction:column}.lab-workspace-nav{margin-top:22px}.lab-workspace-nav a{flex:none}.test-game-card{grid-template-columns:1fr}.test-game-preview{min-height:170px;border-right:0;border-bottom:1px solid var(--line)}.capability-grid{grid-template-columns:1fr}.version-list > div{grid-template-columns:58px 1fr}.version-list small{grid-column:2}.version-list time{display:none} }