:root{color-scheme:dark;--c:#9decdc;--dim:#79a9b9;--frame:rgba(132,193,195,.22);--panel:rgba(6,20,28,.86);font-family:'Segoe UI',Inter,Arial,sans-serif}
*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#020b14;color:#d9f7f2}canvas{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}body::before{content:'';pointer-events:none;position:fixed;inset:0;z-index:1;background:radial-gradient(ellipse 70% 80% at 53% 45%,transparent 30%,rgba(1,9,16,.23) 100%),linear-gradient(90deg,rgba(1,8,14,.38),transparent 35%,transparent 67%,rgba(1,8,14,.38))}#app{position:fixed;inset:0;z-index:2;pointer-events:none}.topbar,.panel,.bottom-bar{pointer-events:auto}.topbar{height:76px;padding:0 33px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--frame);background:linear-gradient(180deg,rgba(3,15,23,.95),rgba(3,15,23,.64));letter-spacing:.1em}.brand{display:flex;align-items:center;gap:13px}.logo{font-size:34px;color:var(--c);font-weight:100}.brand b{display:block;font-size:17px;letter-spacing:.33em;font-weight:700}.brand small{display:block;margin-top:5px;color:#79acac;font-size:9px;letter-spacing:.23em}.top-center{display:flex;gap:18px;align-items:center;color:#a7c8c6;font-size:10px}.top-rule{height:17px;width:1px;background:#43616b}.top-right{display:flex;align-items:center;gap:12px;font-size:9px;font-weight:700;color:#abdbd2}.engine{color:#84baba;border:1px solid #426a72;padding:7px 10px;font-size:8px}.live-dot,.status-indicator{width:7px;height:7px;background:#83ffae;border-radius:50%;box-shadow:0 0 10px #43f8bd}.panel{position:absolute;top:95px;bottom:76px;width:305px;background:linear-gradient(135deg,rgba(5,22,30,.94),rgba(5,18,26,.82));border:1px solid var(--frame);backdrop-filter:blur(20px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#38616b transparent;padding:24px}.left-panel{left:22px}.right-panel{right:22px;width:283px}.panel-eyebrow,.field-title,.right-title span:first-child{font-size:10px;color:#8ab9bb;letter-spacing:.19em;font-weight:700}.panel-eyebrow{display:flex;justify-content:space-between}.index{color:#3e7d7e}.left-panel h1{font-size:32px;font-weight:750;line-height:1.12;letter-spacing:.025em;margin:22px 0 13px}.left-panel h1 em{font-style:normal;color:#83ded5}.intro{font-size:11px;line-height:1.8;color:#9bbfc0;max-width:250px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:19px 10px;margin:28px 0 24px}.metric-grid>div{border-left:2px solid #2a6a73;padding-left:11px}.metric-grid span{display:block;font-size:9px;letter-spacing:.13em;color:#72a4a8}.metric-grid strong{display:block;font-size:22px;color:#e3fff7;font-weight:650;margin-top:6px}.metric-grid small{font-size:9px;color:#85caca;letter-spacing:.07em}.line{height:1px;background:var(--frame);margin:21px 0}.field-title{display:flex;justify-content:space-between;letter-spacing:.08em}.field-title span{color:#567f83;font-size:9px}.sector-list{display:grid;gap:3px;margin:17px 0 17px}.sector{border:1px solid transparent;background:transparent;color:#a5c5cb;display:flex;gap:11px;align-items:center;text-align:left;padding:10px 7px;width:100%;cursor:pointer;transition:all .2s;font-family:inherit}.sector:hover{background:rgba(105,201,196,.08)}.sector.active{border-color:#3b8486;background:rgba(27,104,111,.26);color:#e9fff9}.num{font-size:10px;font-variant-numeric:tabular-nums;color:#60a39d;min-width:18px}.sector .name{flex:1;font-size:11px;font-weight:700;letter-spacing:.04em}.sector .arrow{font-size:12px;color:#6ebbb5}.primary-action,.ghost-action{width:100%;border:1px solid #83e0d6;background:#a4f4e4;color:#062d30;padding:14px 10px;font-size:10px;font-weight:800;letter-spacing:.10em;cursor:pointer;font-family:inherit}.primary-action span{float:right}.primary-action:hover{background:#fff}.right-title{display:flex;align-items:center;gap:12px}.circle-icon{font-size:32px;color:#75f9e9}.right-title>div{display:flex;flex-direction:column;gap:7px}.right-title b{font-size:13px;letter-spacing:.05em}.status-line{display:flex;align-items:center;gap:10px;color:#9bdcbf;font-size:9px;letter-spacing:.07em;margin:22px 0 30px}.pulse{margin-left:auto;color:#5af8c5;font-size:8px}.energy{background:rgba(20,67,73,.23);border:1px solid #24525b;padding:18px 14px}.energy small{font-size:9px;letter-spacing:.11em;color:#9ac6c3}.energy>div:nth-child(2){display:flex;align-items:baseline;gap:10px;margin-top:9px}.energy strong{font-size:54px;line-height:1;color:#e6fff7;font-weight:650;letter-spacing:-.07em}.energy span{font-size:9px;color:#88c7c7;font-weight:700}.bar{height:5px;margin:19px 0 9px;background:#1d3843}.bar i{display:block;background:linear-gradient(90deg,#337c91,#a2ffde);height:100%;width:94%;box-shadow:0 0 10px #60dac5}.labels{display:flex;justify-content:space-between}.labels span{font-size:8px;color:#68999c}.mini-rows{margin-top:20px}.mini-rows>div{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #233e45}.mini-rows span{font-size:9px;letter-spacing:.08em;color:#8aa8ae}.mini-rows b{font-size:11px;letter-spacing:.06em;color:#defef4}.range-line{display:flex;justify-content:space-between;margin-top:23px;font-size:9px;letter-spacing:.08em;color:#96c6c8}.range-line output{color:#a3f1dd;font-weight:700}input[type=range]{width:100%;height:3px;margin:13px 0 5px;accent-color:#86f2df;cursor:pointer}.toggle-row{display:flex;gap:10px;align-items:center;margin-top:22px;font-size:9px;color:#a7d6cf;letter-spacing:.07em}.toggle-hint{margin-left:auto;color:#89fae0}.switch{position:relative;width:28px;height:16px}.switch input{opacity:0}.switch span{position:absolute;inset:0;border-radius:12px;background:#19444d;border:1px solid #4c9495}.switch span:after{content:'';position:absolute;background:#a3f7e1;right:2px;top:2px;border-radius:50%;width:10px;height:10px;transition:transform .2s}.switch input:not(:checked)+span:after{transform:translateX(-12px)}.ghost-action{background:rgba(31,89,97,.13);color:#a4ece0;border-color:#376c73;margin-top:20px;font-size:9px}.bottom-bar{position:absolute;left:0;right:0;bottom:0;height:56px;background:rgba(3,17,25,.95);border-top:1px solid var(--frame);display:flex;align-items:center;justify-content:space-between;padding:0 33px;font-size:10px;color:#8db3b7;letter-spacing:.05em}.bottom-left,.bottom-center,.bottom-right{display:flex;gap:14px;align-items:center}.bottom-left b{color:#e9fdf8;font-size:10px}.triangle{color:#a3eee5}.separator{color:#406779}.bottom-center{gap:13px}.bottom-center span{white-space:nowrap;font-size:9px}.bottom-center kbd{font-size:8px;color:#b1efe1;padding:4px 5px;border:1px solid #396875;border-radius:2px;margin-right:4px}.bottom-right{font-size:9px}.fps{display:flex;align-items:center;gap:4px}.fps i{height:6px;width:6px;background:#69d7a7;border-radius:50%}.fps b{color:#c8fff0}.toast{position:absolute;bottom:78px;left:50%;transform:translate(-50%,10px);background:rgba(8,33,39,.94);border:1px solid #397b79;color:#bffff0;padding:12px 18px;font-size:11px;letter-spacing:.05em;opacity:0;transition:all .22s;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,0)}.veil{position:fixed;z-index:20;inset:0;background:#020c16;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;transition:opacity .7s}.veil.hidden{opacity:0;pointer-events:none}.loader-ring{border:2px solid #18383c;border-top:2px solid #9df9df;border-radius:50%;width:45px;height:45px;animation:spin .9s linear infinite;margin-bottom:20px}@keyframes spin{to{transform:rotate(360deg)}}.loadtitle{font-size:25px;letter-spacing:.24em;font-weight:800}.loadtitle span{color:#7ac8c6}.loadsub{font-size:10px;letter-spacing:.22em;color:#609da2}@media(max-width:1100px){.top-center,.bottom-center{display:none}.panel{width:250px;padding:17px}.right-panel{width:244px}.left-panel h1{font-size:27px}.energy strong{font-size:44px}}@media(max-width:700px){.topbar{padding:0 14px;height:58px}.top-right{font-size:0}.brand b{font-size:13px}.brand small{font-size:7px}.panel{top:70px;bottom:auto;max-height:42vh}.left-panel{left:8px;width:190px}.right-panel{right:8px;width:170px}.intro,.metric-grid,.sector-list,.field-title{display:none}.left-panel h1{font-size:22px}.right-title b{font-size:10px}.energy strong{font-size:34px}.energy{padding:9px}.mini-rows,.range-line,input[type=range],.toggle-row,.ghost-action,.panel-eyebrow{display:none}.bottom-bar{padding:0 12px}.bottom-right{display:none}}
