:root{color-scheme:dark;--bg:#070c15;--panel:rgba(12,21,34,.8);--ink:#dbe7f1;--muted:#8b9fb5;--line:#253245;--aqua:#7ce5e9;font-family:"Noto Sans CJK SC","Microsoft YaHei",sans-serif;font-size:13px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink)}header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid var(--line);gap:20px}.brand{color:var(--ink);text-decoration:none;font-size:23px;display:flex;align-items:center;gap:12px;white-space:nowrap}.brand strong{font-weight:500;letter-spacing:-.5px}.brand span{font-size:12px;color:var(--muted);padding-left:12px;border-left:1px solid var(--line)}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:transparent;border:1px solid var(--line);border-radius:5px;padding:8px 12px}button:hover{border-color:#7893a7;color:white}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--aqua);outline-offset:3px}.mode{display:flex;background:#101d2b;border:1px solid var(--line);border-radius:7px;padding:3px}.mode button{border:0;min-width:105px}.mode .selected{background:#243d4b;color:#c3f7f6}#connection{color:var(--muted);font-size:12px;max-width:240px}main{height:calc(100dvh - 80px);min-height:650px;display:grid;grid-template-columns:232px minmax(320px,1fr) 302px}.panel{padding:24px 20px;background:var(--panel);overflow-y:auto;scrollbar-width:thin}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 20px}h2{font-size:16px;font-weight:500;margin:0}.section-head span{font-size:10px;color:var(--muted)}h3{font-size:12px;font-weight:500;color:#d7e3ee;margin:22px 0 12px}label{display:block;font-size:11px;color:var(--muted);margin-bottom:8px}input,select{width:100%;border:1px solid var(--line);border-radius:4px;background:#101c2a;padding:9px;min-width:0}nav{margin-top:24px;display:grid;gap:5px}nav button{text-align:left;display:flex;align-items:center;gap:10px;border-color:transparent;padding:9px 5px}nav button.off{opacity:.32}nav small{margin-left:auto;color:var(--muted)}.swatch,.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px currentColor}.swatch{width:7px;height:7px}.agent{display:flex;align-items:center;gap:8px;margin:10px 0;color:var(--muted);font-size:12px}.key{margin-top:28px;display:grid;grid-template-columns:32px 1fr 28px;gap:12px 7px;align-items:center;font-size:10px;color:var(--muted)}.key strong{font-weight:400;font-size:9px}.line{border-top:2px solid #85b9c9}.dataflow{border-top:1px dashed #85b9c9}.temporal{border-top:1px dotted #526c7b}.subtle{color:var(--muted);font-size:11px;line-height:1.9;overflow-wrap:anywhere}.legacy{display:block;margin-top:24px;color:var(--muted);font-size:10px}#stage{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 48%,#112136 0%,#09111f 48%,#070c15 80%)}#brain{width:100%;height:100%;display:block;touch-action:none;outline:none}.scene-title{position:absolute;left:32px;top:30px;pointer-events:none}.scene-title span{font-size:10px;color:var(--aqua);background:#152c35;border:1px solid #2f4a54;border-radius:3px;padding:4px 8px}.scene-title h1{font-family:"Noto Serif CJK SC","Songti SC",serif;font-weight:400;font-size:29px;letter-spacing:2px;margin:20px 0 10px}.scene-title p{color:var(--muted);font-size:11px}.scene-bottom{position:absolute;bottom:24px;left:25px;right:25px;display:flex;gap:15px;justify-content:space-between;align-items:center;font-size:10px;color:var(--muted)}.scene-bottom>div{display:flex;gap:10px;align-items:center}.scene-bottom button{padding:6px 8px;font-size:10px;background:#0d1a28b0}#labels{position:absolute;inset:0;pointer-events:none}.lobe-label{position:absolute;font-size:10px;white-space:nowrap;opacity:.85;letter-spacing:2px}.lobe-label:before{content:'';display:inline-block;width:15px;border-top:1px solid currentColor;margin-right:8px;vertical-align:middle}#feed{display:flex;flex-direction:column;gap:0}.event{border-left:1px solid var(--line);padding:0 0 16px 12px;position:relative}.event:before{content:'';width:5px;height:5px;position:absolute;left:-3px;top:5px;border-radius:50%;background:var(--signal)}.event time{font-size:10px;color:var(--muted)}.event p{font-size:11px;overflow-wrap:anywhere;margin:7px 0 0;color:#bfd0de}.event .badge{color:var(--signal);margin-right:5px}.event small{font-size:9px;color:var(--muted)}#results{max-height:150px;overflow:auto}#results button{width:100%;text-align:left;border:0;font-size:10px;overflow-wrap:anywhere;padding:8px 0}#inspector{border-top:1px solid var(--line);margin-top:20px}#metrics{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px;margin:20px 0}#metrics strong{font-size:23px;font-weight:400;display:block;margin-bottom:5px}#metrics span{color:var(--muted);font-size:10px}#matrix{width:100%;height:auto}#stat-detail{font-size:11px;line-height:1.9;color:#adc0d0}#stat-detail p{border-bottom:1px solid #203043;padding:8px 0}#export{font-size:10px;padding:6px}.anomaly{color:#f6acb8}#scrubber{position:absolute;left:24px;right:24px;bottom:74px;background:#0e1b2be8;border:1px solid #2a4158;border-radius:8px;padding:14px;display:flex;align-items:center;gap:12px}#scrubber[hidden],[hidden]{display:none!important}#time{padding:0;accent-color:var(--aqua);flex:1}#time-label{font-size:10px;white-space:nowrap}#speed{width:65px}#play{font-size:11px;white-space:nowrap}#empty{position:absolute;top:50%;left:20px;right:20px;text-align:center;color:var(--muted)}@media(max-width:1100px){main{grid-template-columns:190px minmax(300px,1fr) 260px}.panel{padding:20px 14px}.brand span{display:none}.scene-title{left:22px}.scene-title h1{font-size:24px}.scene-bottom{left:16px;right:16px;flex-wrap:wrap}.scene-bottom #quality{display:none}}@media(max-width:780px){header{height:68px;padding:0 14px;gap:8px}.brand{font-size:18px}.mode button{min-width:70px;padding:8px 6px;font-size:11px}#connection{display:none}main{height:auto;min-height:0;display:grid;grid-template-columns:1fr}.left{order:2;border-right:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.left>*{margin:0}.left nav{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.left .key,.left .subtle,.left .section-head{grid-column:1/-1}#stage{height:68dvh;min-height:440px;order:1}.right{order:3;border-left:0;border-top:1px solid var(--line)}.scene-title h1{font-size:24px}.scene-title{top:24px}#feed{display:grid;grid-template-columns:1fr 1fr;gap:16px}#matrix{max-width:340px}#scrubber{left:12px;right:12px;padding:10px;gap:8px}#time-label{max-width:60px;overflow:hidden}}

/* Reserve a readable canvas between the panels, including square viewports. */
@media(min-width:781px) and (max-width:1000px){main{grid-template-columns:170px minmax(0,1fr) 220px}.panel{padding:18px 12px}.scene-title{left:18px}.scene-title h1{font-size:21px}}
.lobe-label{padding:3px 5px;background:#070c1599;border-radius:3px;line-height:18px;text-shadow:0 1px 4px #000}.scene-title{z-index:1}#activity-state{display:block;max-width:240px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
@media(max-width:780px){#activity-state{max-width:180px}.scene-bottom{gap:8px}}