:root{color-scheme:dark;--bg:#080e12;--panel:#0d151a;--line:#243037;--muted:#84999f;--text:#e1ebeb;--accent:#95e6cb}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Microsoft YaHei",system-ui,sans-serif;font-size:14px}button,input{font:inherit}button{cursor:pointer;color:inherit;background:none;border:1px solid var(--line);border-radius:6px;padding:10px 15px;transition:.18s}button:hover{background:#233530;border-color:#79c7af}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}header{height:86px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 32px;gap:50px}.brand{display:flex;gap:13px;align-items:center;color:inherit;text-decoration:none}.mark{font-size:38px;color:var(--accent)}.brand strong{font-size:23px;font-weight:550;letter-spacing:4px}.brand small{font-size:12px;letter-spacing:3px;margin-left:12px;color:var(--muted)}.header-note{color:var(--muted);font-size:14px}header>button{margin-left:auto;border:0;color:#b4c5c8}main{display:grid;grid-template-columns:280px minmax(300px,1fr) 262px;min-height:calc(100dvh - 166px)}aside{padding:32px 25px;background:linear-gradient(145deg,#0d151a,#0a1115)}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line)}.eyebrow{font-size:12px;letter-spacing:1.6px;color:var(--accent)}h1{font-size:25px;font-weight:500;letter-spacing:1px;margin:20px 0 14px}h3{font-size:20px;font-weight:500;margin:16px 0 27px}.intro{line-height:1.9;color:var(--muted);font-size:14px}.divider{height:1px;background:var(--line);margin:25px 0}.section-title{display:flex;justify-content:space-between;margin-bottom:22px}.section-title>span{color:var(--muted);font-size:12px}label{display:block;color:#a4b5ba;margin:22px 0}output{float:right;color:#dbefea;font-family:monospace}input[type=range]{display:block;width:100%;margin-top:15px;accent-color:var(--accent);height:4px;cursor:pointer}input[type=number]{width:100%;background:#111f25;border:1px solid #304047;border-radius:5px;color:#d9e8e5;padding:10px;margin-top:10px}.micro{font-size:12px;line-height:1.7;color:var(--muted)}.primary{width:100%;background:var(--accent);color:#102b23;border:0;font-weight:600;display:flex;justify-content:space-between;margin-top:20px}.primary:hover{background:#bbffe6}.quiet{border:0;width:100%;color:var(--muted);margin-top:7px}.local-tag{text-align:center;margin-top:22px;color:#6e878e;font-size:12px}#viewport{position:relative;overflow:hidden;min-height:660px;background:radial-gradient(ellipse at 55% 40%,#13232b 0%,#080e14 62%)}#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%;touch-action:none}.view-top{position:absolute;z-index:2;top:26px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;gap:10px}.segmented{display:flex;background:#111c22d9;border:1px solid #2a373e;border-radius:7px;padding:4px}.segmented button{border:0;padding:8px 12px;font-size:13px}.selected{background:#253c38!important;color:#b4f9df!important}.live{font-size:12px;color:var(--accent)}.planet-label{position:absolute;pointer-events:none;bottom:118px;left:35px}.planet-label>span{font-size:12px;letter-spacing:3px;color:#87b2b7}.planet-label h2{font-size:36px;font-weight:400;letter-spacing:5px;margin:12px 0}.planet-label p{font-size:12px;color:var(--muted)}.zoom-tools{position:absolute;right:23px;bottom:128px;display:flex;flex-direction:column;background:#101b21cc;border:1px solid var(--line);border-radius:7px}.zoom-tools button{border:0;font-size:22px;padding:9px 12px}.enter{position:absolute;bottom:62px;left:35px;right:35px;text-align:left;display:flex;justify-content:space-between;background:#182b2ab8;border:1px solid #4a7367;color:#b9efdc}.view-hint{position:absolute;bottom:24px;left:0;width:100%;text-align:center;font-size:12px;color:#768d98}.stat>span,.stat-row{color:var(--muted)}.stat strong{display:block;font-size:36px;font-weight:400;letter-spacing:1px;font-variant-numeric:tabular-nums;margin:12px 0 27px}.stat small{font-size:12px;color:var(--muted);letter-spacing:1px}.bar{height:3px;background:#233138;margin-top:-10px;margin-bottom:26px}.bar i{display:block;height:100%;background:var(--accent);width:0}.stat-row{display:flex;justify-content:space-between;margin:19px 0;font-size:13px}.stat-row b{color:#c3d4d4;font-weight:400;font-family:monospace}.chart-title{margin-top:30px;font-size:13px}.chart-title span{display:block;color:#6e858c;font-size:12px;margin-top:8px}#chart{width:100%;height:85px;margin-top:15px}.layers{display:flex;flex-direction:column;gap:7px}.layers button{text-align:left;border-color:transparent;font-size:13px}.dot{display:inline-block;height:7px;width:7px;border-radius:50%;margin-right:9px}.teal{background:#93e9c8}.gold{background:#e8bc72}.purple{background:#b4a1ee}.reading{padding:16px;background:#142126;border-left:2px solid #4e7d73;margin-top:25px}.reading>span{font-size:12px;color:var(--accent)}.reading p{font-size:13px;line-height:1.8;color:#acbfc0}.reading small{font-size:12px;color:#748e94}footer{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 30px;border-top:1px solid var(--line);background:#0d161b}.timeline-label{color:#97adaf;font-size:13px}.playback{display:flex;align-items:center;gap:17px}.playback>span{color:var(--muted);font-size:13px}.playback>button{color:var(--accent)}.speeds{display:flex;gap:3px}.speeds button{border:0;padding:8px 12px}#saveStatus{font-size:12px;color:#748b92}dialog{max-width:650px;width:calc(100% - 30px);max-height:85dvh;overflow:auto;background:#101c23;color:var(--text);border:1px solid #415b63;border-radius:12px;padding:32px;line-height:1.9}dialog::backdrop{background:#020608bb;backdrop-filter:blur(8px)}dialog p{color:#acbec3}dialog h2{font-weight:400}.close{float:right;border:0}#error{position:absolute;inset:100px 25px;background:#10222a;padding:25px;line-height:1.8;z-index:5}@media(min-width:1600px){main{grid-template-columns:320px 1fr 300px}aside{padding:40px 32px}h1{font-size:28px}}@media(max-width:1100px){main{grid-template-columns:245px 1fr}.right{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.right .eyebrow,.right h3,.right .divider,.right .chart-title,.right .section-title{display:none}.right .reading{margin:0}.right #chart{align-self:center}.right .stat-row{align-self:center}footer{flex-wrap:wrap}}@media(max-width:650px){header{height:70px;padding:0 18px}.header-note{display:none}.brand small{font-size:10px;margin-left:3px}header button{padding:6px;font-size:12px}main{display:flex;flex-direction:column}#viewport{order:-1;height:65dvh;min-height:490px}.left{padding:25px;border-right:0;display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.left .eyebrow,.left h1,.left .intro,.left .section-title,.left .micro,.left .local-tag{grid-column:1/-1}.left .divider{display:none}h1{margin:14px 0 0}.intro{margin-bottom:4px}.left .section-title{margin:20px 0 0}.right{display:grid;grid-template-columns:1fr 1fr;padding:25px}.right .reading{grid-column:1/-1}.planet-label h2{font-size:29px}.view-top{left:16px;right:16px}.planet-label{left:24px}.enter{left:24px;right:24px}.playback{gap:10px}.playback>span{display:none}footer{padding:16px;justify-content:center}.timeline-label{display:none}#saveStatus{width:100%;text-align:center}}

[hidden]{display:none!important}.field-tools{position:absolute;z-index:2;top:88px;left:24px;display:flex;gap:4px;padding:4px;border:1px solid #34494b;background:#102025dd;border-radius:7px}.field-tools button{font-size:12px;padding:7px 10px;border:0}.probe{position:absolute;z-index:2;top:138px;left:24px;right:24px;background:#10242ad9;border:1px solid #3c5d61;padding:10px 12px;font-size:12px;color:#b6d6d1;line-height:1.6}.legend{position:absolute;right:24px;bottom:94px;color:#90a9ac;font-size:12px;display:flex;align-items:center;gap:8px}.legend span{width:70px;height:4px;background:linear-gradient(90deg,#112a30,#91e6bd)}#rate{display:block;font-size:12px;margin-top:5px;color:#6e8d94}.stat strong{font-size:33px;margin-bottom:22px}.stat-row{margin:15px 0}.right .divider{margin:22px 0}.right h3{margin-bottom:22px}.right .reading{margin-top:20px}.right .chart-title{margin-top:24px}#info h3{margin-bottom:12px}#info .primary{justify-content:center}@media(max-width:650px){.field-tools{left:16px}.probe{left:16px;right:16px;top:135px}.legend{bottom:107px}.right .stat-row{margin:4px 0}}

.sand{background:#e3c79b}dialog{font-size:16px}.layers button,.segmented button{font-size:14px}.reading p{font-size:14px}.field-tools button{font-size:14px}.right{padding-top:28px}.right .layers{gap:2px}.right .reading{padding:12px}.right .reading p{margin:10px 0}

/* Keep the observatory inside the viewport; panels own their overflow. */
@media (min-width:651px) {
  html { height:100%; overflow:hidden; }
  body {
    height:100vh;
    height:100dvh;
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    overflow:hidden;
  }
  main {
    min-height:0;
    min-width:0;
    grid-template-rows:minmax(0,1fr);
    overflow:hidden;
  }
  main > * { min-width:0; min-height:0; }
  #viewport { min-height:0; }
  .left, .right {
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior-y:contain;
    scrollbar-gutter:stable;
    scrollbar-width:thin;
    scrollbar-color:#41625f transparent;
  }
  .left::-webkit-scrollbar, .right::-webkit-scrollbar { width:7px; }
  .left::-webkit-scrollbar-thumb, .right::-webkit-scrollbar-thumb {
    background:#41625f;
    border-radius:8px;
  }
  .left:focus-visible, .right:focus-visible {
    outline:2px solid var(--accent);
    outline-offset:-3px;
  }
}
@media (min-width:651px) and (max-width:1100px) {
  main { grid-template-rows:minmax(0,2fr) minmax(0,1fr); }
  .right { align-content:start; grid-auto-rows:max-content; }
}

.model-nav{display:flex;gap:5px;margin:19px 0 0}.model-nav a{padding:9px 10px;border:1px solid #34514e;border-radius:5px;color:#9fbab5;text-decoration:none;font-size:13px}.particle-mode .particle-link,.field-mode .field-link{background:#29473e;color:#c6f5e2}.particle-key{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0;font-size:12px}.selection{white-space:pre-line;font-size:13px;line-height:1.8;color:#bdded4;padding:12px;background:#12282b;border-left:2px solid #709d8e;margin-top:12px}.isolate-label{font-size:13px;margin:8px 0;color:#b0c8c1;display:flex;gap:8px;align-items:center}.particle-mode .right .quiet{margin-top:0;padding:8px}.particle-mode .planet-label h2{font-size:27px;letter-spacing:2px}.particle-mode .planet-label{pointer-events:none}.particle-mode .model-nav{grid-column:1/-1}@media(max-width:650px){.model-nav{grid-column:1/-1}.particle-mode .planet-label h2{font-size:22px}.particle-mode .right .selection,.particle-mode .right .isolate-label,.particle-mode .right .particle-key{grid-column:1/-1}header{gap:12px}}
/* Speed controls keep the target distinct from achieved throughput. */
footer{flex-wrap:wrap;gap:8px 18px;padding:10px 22px}.playback{flex-wrap:wrap;gap:9px}.speeds{flex-wrap:wrap}.speeds button{padding:7px 9px}.custom-speed{display:flex;align-items:center;gap:7px}.custom-speed label{margin:0;font-size:12px;color:var(--muted)}.custom-speed input{width:82px;margin:0;padding:6px 8px}.custom-speed button{padding:6px 10px;font-size:13px}.speed-report{display:flex;flex-wrap:wrap;gap:5px 12px;font-size:12px;color:#9fc3b9}.speed-report small{flex-basis:100%;font-size:12px;color:#cbb994}#rate{display:none}#saveStatus{margin-left:auto}.playback>span{font-size:12px}.timeline-label{font-size:12px}@media(max-width:1100px){footer{justify-content:center}.timeline-label{display:none}.speed-report{justify-content:center}#saveStatus{margin-left:0}}@media(max-width:650px){.playback{justify-content:center}.custom-speed label{font-size:12px}}
.scale-switch{position:absolute;z-index:2;top:84px;left:24px;display:flex;gap:4px;background:#102025e8;border:1px solid #34524c;padding:4px;border-radius:6px}.scale-switch button{border:0;padding:7px 11px;font-size:13px}.particle-mode .field-tools{top:132px}.particle-mode .probe{top:181px}.env-layers{display:flex;flex-wrap:wrap;gap:5px;margin-top:14px}.env-layers button{font-size:12px;padding:7px 8px}.assembly-title{font-size:14px;color:#c8ded6;margin-top:22px}.assembly-title small{display:block;font-size:12px;color:var(--muted);margin-top:5px}.assembly-list{display:flex;flex-direction:column;gap:4px;margin-top:12px;color:var(--muted);font-size:13px}.assembly-list button{text-align:left;font-size:12px;padding:8px;background:#14262a;border-color:#2a4143}.particle-mode .right .assembly-list button:hover{border-color:var(--accent)}@media(max-width:650px){.scale-switch{left:16px}.assembly-list,.assembly-title,.env-layers{grid-column:1/-1}}
.world-settings{margin-top:22px;border-top:1px solid var(--line);padding-top:8px}.world-settings label{margin:14px 0;font-size:13px}.world-settings input,.world-settings select{width:100%;background:#13242a;color:#d3e6df;border:1px solid #35504e;border-radius:5px;padding:8px;margin-top:7px}.world-budget{font-size:12px;color:#a3c8b9;line-height:1.8}.world-path{position:absolute;z-index:3;top:78px;left:24px;right:24px;display:flex;gap:5px;flex-wrap:wrap}.world-path button{font-size:12px;background:#152a2de8;padding:6px 9px;border-color:#3c5855}.particle-mode .scale-switch{top:124px}.particle-mode .field-tools{top:171px}.particle-mode .probe{top:216px}.region-choices{display:flex;gap:5px;flex-direction:column;margin:10px 0}.region-choices button{font-size:12px;text-align:left;padding:9px;background:#122529}.world-note{font-size:12px;line-height:1.8;color:#96b4b0;padding:12px;background:#10272a;border-left:2px solid #6eaa95;margin:12px 0}.region-overlay{position:absolute;right:22px;top:220px;z-index:3;max-width:220px;font-size:12px;line-height:1.7;color:#c0d5ca;pointer-events:none}.macro-children{position:absolute;left:24px;right:24px;bottom:58px;z-index:3;display:flex;gap:6px;flex-wrap:wrap}.macro-children button{background:#172c2de8;border-color:#53746b;font-size:12px;padding:8px 11px}.particle-mode.macro-view .planet-label{bottom:143px}.particle-mode.macro-view #enter{display:none}.particle-mode.macro-view .field-tools,.particle-mode.macro-view .scale-switch{display:none!important}.particle-mode #viewDesc{max-width:calc(100% - 30px);line-height:1.6}.field-mode #globeBtn,.field-mode #enter{display:none}@media(max-width:650px){.world-path{left:16px;right:16px}.world-settings,.world-budget{grid-column:1/-1}.world-note,.region-choices{grid-column:1/-1}.region-overlay{top:220px;font-size:11px;max-width:130px}.macro-children{left:16px;right:16px}.world-path button{padding:5px 7px}.particle-mode .planet-label h2{font-size:20px}}
