:root{color-scheme:dark;--bg:#07121a;--panel:#0b1923;--border:#203644;--soft:#8da2af;--cyan:#72ddcb;--amber:#d9a16d;--white:#e8f0f0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-synthesis:none}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--white)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}
.app{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#0c1c27 0%,#07131c 60%,#050d15)}
.topbar{height:76px;flex-shrink:0;border-bottom:1px solid #1e3540;display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:#091720}.brand{display:flex;align-items:center;gap:13px}.brand img{height:42px;width:42px}.eyebrow,.section-tag,.tiny-heading{font-size:9px;letter-spacing:.20em;font-weight:750;color:#7eabb0}.eyebrow .sep{color:#46616f;padding:0 6px}.brand-name{font-size:20px;letter-spacing:.085em;font-weight:760;margin-top:3px}.brand-name span{color:#80b6b7;font-size:16px;font-weight:400}.top-right{display:flex;align-items:center;gap:12px;font-size:10px;font-weight:750;letter-spacing:.09em;color:#bed3d2}.live-dot,.rec-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7fe9bc;box-shadow:0 0 14px #70f8bc}.version{margin-left:20px;color:#728a98;border-left:1px solid #29414c;padding-left:23px}.version span{color:#466876;padding:0 7px}
.workspace{display:grid;grid-template-columns:313px minmax(0,1fr);flex:1;min-height:0}.sidebar{border-right:1px solid #1e3441;background:#0b1a24;display:flex;flex-direction:column;padding:26px 23px 22px;gap:0}.side-intro h1{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.035em;font-weight:400;line-height:1.08;font-size:34px;margin:13px 0 12px}.side-intro h1 em{font-style:normal;color:#86d4c6}.side-intro p{font-size:12px;line-height:1.7;color:#8fa4af;max-width:255px;margin:0 0 18px}.panel-title{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:750;letter-spacing:.11em;color:#a9c1c7;margin:15px 0 13px}.panel-title span:last-child{color:#56727c;font-size:9px;letter-spacing:0}.panel-rule{height:1px;background:#29414e;flex:1}.control{margin:0 0 18px}.control-head{display:flex;align-items:baseline;justify-content:space-between;gap:6px}.control label{font-size:12px;color:#c2d1d5}.control output{font-size:12px;color:#84ddce;font-weight:650;font-variant-numeric:tabular-nums}.control input[type=range]{width:100%;height:4px;appearance:none;-webkit-appearance:none;accent-color:var(--cyan);margin:17px 0 5px;border-radius:50px;background:linear-gradient(to right,#50bdae var(--progress,50%),#233945 var(--progress,50%))}.control input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#b9efdf;border:3px solid #0c2831;border-radius:50%;box-shadow:0 0 0 1px #65cbbc,0 0 9px #80d4c959}.control input[type=range]::-moz-range-thumb{width:9px;height:9px;background:#b9efdf;border:2px solid #0c2831;border-radius:50%}.scale{display:flex;justify-content:space-between;font-size:9px;color:#5e7d88;letter-spacing:.06em}.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.preset{background:#102631;color:#a9c1c8;border:1px solid #2a424e;border-radius:4px;padding:10px 7px;text-align:left;min-height:52px;font-size:9px;font-weight:750;letter-spacing:.055em;transition:background .2s,border-color .2s}.preset-index{display:block;font-size:9px;font-weight:450;color:#6b8a96;margin-bottom:5px}.preset.selected,.preset:hover{background:#1d3b40;border-color:#5caf9e;color:#c3f1e5}.side-options{border-top:1px solid #1d3642;margin-top:22px;padding-top:17px}.check-line{display:flex;align-items:center;gap:10px;font-size:12px;color:#b6c8cc;cursor:pointer;margin:0 0 22px}.check-line input{position:absolute;opacity:0}.switch{width:31px;height:18px;border-radius:12px;background:#283d49;position:relative;border:1px solid #45606c;flex-shrink:0}.switch:before{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;background:#8097a2;border-radius:50%;transition:transform .2s}.check-line input:checked+.switch{background:#267769}.check-line input:checked+.switch:before{transform:translateX(13px);background:#bbffec}.tiny{margin:0}.sidebar-bottom{margin-top:auto;padding-top:23px}.sidebar-bottom p{font-size:11px;line-height:1.65;color:#7c939e}.sidebar-bottom a{font-size:10px;color:#83dec8;font-weight:750;letter-spacing:.09em;display:inline-block;margin-top:6px}.sidebar-bottom a span{margin-left:6px}
.main{min-width:0;padding:23px 29px 24px;display:flex;flex-direction:column;gap:17px;overflow:hidden}.view-header{display:flex;justify-content:space-between;align-items:center;gap:10px}.view-header h2{font-weight:600;font-size:18px;letter-spacing:-.02em;margin:7px 0 0}.view-header h2 span{font-size:12px;font-weight:400;color:#708f99;margin-left:6px}.view-header-end{display:flex;gap:9px}.chip{border:1px solid #284650;background:#102634;border-radius:3px;color:#86babb;font-size:9px;font-weight:750;padding:8px 11px;letter-spacing:.09em;white-space:nowrap}
.scene-wrap{width:100%;position:relative;min-height:320px;height:clamp(340px,46vh,620px);border:1px solid #2a4e59;background:radial-gradient(circle at 49% 42%,#164050,#091a28 55%,#06101a 100%);border-radius:5px;overflow:hidden}.scene-wrap:before,.scene-wrap:after{position:absolute;z-index:1;content:"";width:19px;height:19px;pointer-events:none;border-color:#4baca7;border-style:solid}.scene-wrap:before{top:9px;left:9px;border-width:1px 0 0 1px}.scene-wrap:after{right:9px;bottom:9px;border-width:0 1px 1px 0}.scene-wrap canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}.scene-wrap canvas:active{cursor:grabbing}.scene-vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 120px #02080d55;z-index:1}.scene-top-left,.scene-top-right,.scene-bottom-left{position:absolute;z-index:2;font-size:10px;color:#9abcd0;font-weight:650;letter-spacing:.08em}.scene-top-left{top:22px;left:23px;display:flex;gap:11px;align-items:center}.viewpoint{color:#c5e5e3}.divider-v{height:13px;width:1px;background:#4a7380}.scene-top-right{top:22px;right:24px;display:flex;align-items:center;gap:10px;color:#8ecdb9}.rec-dot{height:6px;width:6px}.scene-bottom-left{bottom:21px;left:22px;color:#82a9b6;font-size:9px}.scene-bottom-left .dot{display:inline-block;width:5px;height:5px;background:#5db2ba;border-radius:50%;margin-right:9px}.scene-notes{position:absolute;z-index:2;display:flex;gap:10px;align-items:center;font-size:9px;letter-spacing:.10em;color:#bed6da;line-height:1.65;opacity:.8;pointer-events:none}.scene-notes b{color:#739cab;font-size:8px;font-weight:500}.left-note{left:8%;top:42%}.right-note{right:10%;top:46%}.feature-line{width:24px;height:1px;background:#83bcae;opacity:.65}.view-controls{position:absolute;z-index:2;right:21px;bottom:17px;display:flex;gap:7px}.action,.iconbtn{border:1px solid #4b7479;background:#183943;color:#b5dddd;height:34px;padding:0 14px;font-size:12px;font-weight:720;border-radius:3px;display:flex;align-items:center;gap:10px;letter-spacing:.08em}.primary{background:#60c4ab;border-color:#60c4ab;color:#073136}.secondary{background:#15303cbd;color:#c1d9d9}.iconbtn{font-size:19px;padding:0 11px}
.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.stat{padding:15px 17px;border:1px solid #243d4b;background:linear-gradient(120deg,#102734,#0e202c);border-radius:3px;min-width:0}.stat-label{font-size:9px;letter-spacing:.11em;color:#97b5c0;font-weight:700;display:flex;justify-content:space-between}.stat-label span{color:#668c97;font-size:13px}.stat-value{font-size:26px;letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:#e4f0ee;font-weight:500;margin:12px 0 4px;white-space:nowrap}.stat-value small{color:#8acabb;font-size:12px;font-weight:400;letter-spacing:0}.stat-sub{font-size:10px;color:#6b8e9e}
.analysis{background:#0d202b;border:1px solid #253d49;border-radius:3px;padding:17px 19px 13px;flex:1;min-height:187px;display:flex;flex-direction:column}.analysis-top{display:flex;justify-content:space-between;align-items:center}.analysis h3{font-size:14px;font-weight:550;letter-spacing:-.015em;margin:5px 0 0}.analysis h3 span{color:#829fa9;font-size:11px;font-weight:400}.export{border:1px solid #33525f;color:#94d1c9;background:#17323c;font-size:10px;font-weight:700;letter-spacing:.055em;padding:10px 13px;border-radius:3px}.export:hover{border-color:#6ecfbb}.chart-wrap{min-height:104px;flex:1;position:relative;margin-top:10px}.chart-wrap canvas{width:100%;height:100%;display:block}.chart-legend{position:absolute;right:7px;top:4px;display:flex;gap:18px;font-size:9px;letter-spacing:.04em;color:#8facb8}.chart-legend span{white-space:nowrap}.chart-legend i{display:inline-block;width:15px;height:2px;vertical-align:middle;margin-right:6px}.legend-left{background:#77d8cb}.legend-right{background:#d2a57b}.chart-bottom{display:flex;justify-content:space-between;gap:5px;font-size:9px;color:#648390;letter-spacing:.055em;margin-top:9px}.footer{display:flex;justify-content:space-between;border-top:1px solid #203844;background:#07141d;font-size:9px;letter-spacing:.11em;color:#5e818f;min-height:31px;align-items:center;padding:0 31px}.footer b{color:#8facb3}.footer #status{color:#73bfb2}
@media(max-width:1050px){.workspace{grid-template-columns:272px minmax(0,1fr)}.sidebar{padding:20px 17px}.main{padding:20px 17px}.stat{padding:12px}.stat-value{font-size:21px}.scene-notes{display:none}.view-header h2 span{display:none}}@media(max-width:780px){.workspace{display:flex;flex-direction:column}.sidebar{order:2;border-right:0;border-top:1px solid #243d4b}.main{order:1;overflow:visible}.scene-wrap{height:420px}.side-intro h1 br{display:none}.sidebar-bottom{margin-top:0}.stats-row{grid-template-columns:repeat(2,1fr)}.topbar{padding:0 15px;height:66px}.version{display:none}.main{padding:16px}.footer span:nth-child(2){display:none}.scene-bottom-left{max-width:55%}}@media(max-width:490px){.live-label,.view-header-end .chip:last-child,.scene-top-right{display:none}.brand-name{font-size:16px}.brand img{width:34px;height:34px}.scene-wrap{height:330px;min-height:300px}.view-header h2{font-size:15px}.main{gap:11px}.stat{padding:11px}.stat-label{font-size:8px}.stat-value{font-size:20px}.chart-legend{top:2px;font-size:8px;gap:6px}.analysis{padding:12px;min-height:190px}.chart-bottom span:nth-child(2){display:none}.action{padding:0 10px}.action span{font-size:9px}.scene-bottom-left{max-width:48%;font-size:8px}.scene-top-left{left:13px;top:13px}}