.data-screen,.screen-state{--ink:#020a13;--panel:#041322e8;--panel-solid:#06172a;--line:#227ec46b;--cyan:#4bddff;--blue:#4086ff;--amber:#ffc95f;--mint:#80e1b2;--text:#e9f4ff;--muted:#91a9bf;--danger:#ff6b7a;--font-data:"DIN Alternate", "Avenir Next Condensed", "Roboto Condensed", sans-serif;--font-body:"Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}.data-screen button,.data-screen input,.data-screen select{font:inherit}.data-screen button{cursor:pointer}.data-screen button:focus-visible,.data-screen input:focus-visible,.data-screen select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.data-screen{height:100vh;min-height:720px;color:var(--text);font-family:var(--font-body);background:linear-gradient(138.511deg,#000927 5.0875%,#015f99 25.005%,#010a1b 43.875%,#001a32 58.552%,#000b21 76.024%);grid-template-rows:120px 125px minmax(0,1fr);gap:5px;padding:0 42px 49px 38px;display:grid;position:relative;overflow:hidden}.ambient{pointer-events:none;filter:blur(100px);opacity:.05;border-radius:50%;animation:10s ease-in-out infinite alternate breathe;position:absolute}.ambient-one{background:#145dff;width:420px;height:280px;top:16%;right:6%}.ambient-two{background:#04bde6;width:300px;height:260px;animation-delay:-4s;bottom:0;left:-140px}@keyframes breathe{to{opacity:.3;transform:translate(30px,-16px)scale(1.12)}}.screen-header{z-index:2;border-bottom:1px solid #2f83c44d;justify-content:space-between;align-items:flex-end;min-height:0;padding:0 0 3px 3px;display:flex;position:relative}.brand-lockup{align-items:center;gap:18px;min-width:0;max-width:900px;display:flex}.brand-mark{flex:none;width:87px;height:82px;display:block}.brand-lockup p,.brand-lockup h1{margin:0}.brand-lockup p{color:#7a8297;letter-spacing:0;font-size:15px;font-weight:500}.brand-lockup h1{color:#fff;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;max-width:10.8em;text-shadow:none;margin-top:8px;font-size:30px;font-weight:600;line-height:1;overflow:hidden}.screen-meta{color:#7a8297;min-width:440px;font:12px var(--font-data);justify-content:flex-end;align-items:center;gap:12px;margin-bottom:20px;display:flex}.screen-meta button{color:#aebed0;background:#001330c2;border:1px solid #042e55;border-radius:5px;place-items:center;width:36px;height:30px;display:grid}.screen-meta button svg{width:52%;height:52%}.screen-meta button:hover{color:var(--cyan);border-color:#4bd8ff73}.live-chip{color:#2bb98c;background:#021718;border:1px solid #35626c;border-radius:5px;align-items:center;gap:7px;min-width:137px;height:30px;padding:0 10px;display:flex}.live-chip img{width:17px;height:14px}.metric-rail{z-index:2;min-height:0;box-shadow:none;background:linear-gradient(95.287deg,#000f2d 1.2919%,#01274f 24.959%,#000d24 54.565%,#021c45 75.077%,#000d27 97.816%);border:1px solid #01274f;border-radius:5px;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.3fr) minmax(0,1.25fr) minmax(0,1.1fr) minmax(0,.75fr) minmax(0,.8fr);display:grid;position:relative;overflow:visible}.metric-rail:before{content:none}.metric-rail:after{content:"";z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.75;background:url(/assets/screen/kpi-energy-arc.png) 50%/95% 100% no-repeat;height:87px;position:absolute;top:80px;left:0;right:0}.metric-cell{z-index:2;text-align:left;background:0 0;border-right:1px solid #1f76ba45;min-width:0;padding:12px;position:relative;overflow:hidden}.metric-cell:last-child{border-right:0}.metric-index{color:#007ebc;font:600 12px var(--font-data);position:absolute;top:19px;left:41px;transform:translate(-29px)}.metric-cell p{color:#7a8297;white-space:nowrap;margin:0 0 20px;font-size:12px}.metric-cell strong{color:#f5f5f5;max-width:100%;font:500 27px/1.04 var(--font-data);letter-spacing:0;text-overflow:ellipsis;white-space:nowrap;text-shadow:none;display:block;overflow:hidden}.metric-cell strong .metric-group-separator{color:#dcecff;font-family:var(--font-body);letter-spacing:0;margin:0 .06em;font-weight:600;display:inline-block;position:relative;top:.04em}.screen-grid{z-index:2;grid-template-rows:minmax(0,339fr) 5px minmax(0,113fr) 8px minmax(0,311fr);grid-template-columns:minmax(0,1269fr) minmax(400px,561fr);column-gap:5px;min-height:0;margin-right:5px;display:grid;position:relative}.panel{min-width:0;min-height:0;box-shadow:none;background:linear-gradient(154deg,#031b3bf2,#010d1df5 58%,#001227f0);border:1px solid #0164a2;border-radius:5px;flex-direction:column;padding:25px 18px 12px;display:flex;position:relative;overflow:hidden}.panel:before,.panel:after{content:none}.trend-panel{grid-area:1/1/4}.channel-panel{grid-area:1/2}.hourly-panel{grid-area:5/1}.feed-panel{grid-area:3/2/6;padding-top:10px}.panel-heading{border-bottom:1px solid #5a9acf38;flex:none;justify-content:space-between;align-items:flex-start;margin-bottom:5px;padding:0 0 10px 13px;display:flex;position:relative}.panel-heading:before{content:"";background:#277bff;border-radius:1px;width:3px;height:21px;position:absolute;top:7px;left:1px;box-shadow:0 0 8px #277bffbf}.panel-heading:after{content:none}.panel-heading p,.panel-heading h2{margin:0}.panel-heading p{color:#22a7ff;font:700 11px var(--font-data);letter-spacing:.15em;text-shadow:none}.panel-heading h2{text-shadow:none;margin-top:2px;font-size:18px;font-weight:600;line-height:1.05}.panel-heading>span{color:#7a8297;font:12px var(--font-data);align-items:center;gap:6px;display:flex}.chart-fill,.data-chart{min-width:0;min-height:0}.chart-fill{flex:auto}.trend-summary{border-bottom:1px solid #488fc538;flex:0 0 55px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:4px;padding:6px 0 7px;display:grid}.trend-summary>div{border-right:1px solid #78b1dc21;min-width:0;padding:0 clamp(8px,.7vw,15px)}.trend-summary>div:first-child{padding-left:0}.trend-summary>div:last-child{border-right:0}.trend-summary span{color:#7a8297;font-size:12px;display:block}.trend-summary strong{color:#f5f5f5;max-width:100%;font:600 16px var(--font-data);text-overflow:ellipsis;white-space:nowrap;margin-top:4px;display:inline-block;overflow:hidden}.trend-summary small{color:var(--cyan);font:clamp(11px, .34vw, 12px) var(--font-data);margin-left:7px}.trend-body{flex:auto;grid-template-columns:minmax(0,2.32fr) minmax(340px,1fr);gap:10px;min-height:0;display:grid}.trend-body .chart-fill{border-right:1px solid #78b1dc21}.quality-board{grid-template-columns:repeat(2,minmax(0,1fr));align-content:stretch;gap:5px;min-height:0;display:grid}.quality-title{grid-column:span 2;align-items:center;background:0 0!important;border:0!important;flex-direction:row!important;justify-content:space-between!important;padding:0 2px!important;display:flex!important}.quality-title span{font:clamp(10px, .36vw, 13px) var(--font-data);letter-spacing:.18em;color:var(--cyan)!important}.quality-title strong{color:#a8bdce!important;font:600 clamp(11px, .4vw, 14px) var(--font-body)!important;margin:0!important}.quality-board>div{min-width:0;box-shadow:none;background:#071f3b;border:1px solid #0164a2;border-radius:5px;flex-direction:column;justify-content:center;padding:7px 10px;display:flex}.quality-board>div:nth-child(3n){border-left-color:#ffca6a9e}.quality-board>div:nth-child(4n){border-left-color:#5278ffad}.quality-board>div>span{color:#879fb4;font-size:clamp(11px,.38vw,14px)}.quality-board>div>strong{color:#f0f8ff;max-width:100%;font:650 clamp(15px, .64vw, 23px) var(--font-data);text-overflow:ellipsis;white-space:nowrap;margin-top:4px;overflow:hidden}.quality-board>div>small{color:#6f8ca4;font:clamp(11px, .34vw, 12px) var(--font-data);text-overflow:ellipsis;white-space:nowrap;margin-top:4px;overflow:hidden}.channel-content{flex:auto;grid-template-columns:minmax(0,1fr) minmax(220px,1fr);gap:10px;min-height:0;padding:10px 13px 10px 8px;display:grid}.channel-panel{padding:25px 18px 12px}.channel-chart{min-height:0}.channel-breakdown{grid-template-columns:1fr;align-content:center;gap:0;display:grid}.channel-breakdown>div{background:#071f3b;border:0;border-bottom:1px solid #2470ab59;border-radius:0;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;min-height:66px;padding:8px 18px;display:grid}.channel-breakdown>div:first-child{border-radius:4px 4px 0 0}.channel-breakdown>div:last-child{border-bottom:0;border-radius:0 0 4px 4px}.channel-breakdown span{color:#a7bbcc;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(11px,.39vw,14px);overflow:hidden}.channel-breakdown strong{color:#f0f8ff;font:650 clamp(13px, .52vw, 18px) var(--font-data)}.channel-breakdown small{color:#7892a8;font:clamp(11px, .34vw, 12px) var(--font-data);grid-column:2/4}.channel-color{background:var(--cyan);border-radius:50%;width:7px;height:7px;box-shadow:0 0 10px}.channel-color-0{color:#22a7ff;background:#22a7ff}.channel-color-1{color:#4d5fff;background:#4d5fff}.channel-color-2{color:#ffc153;background:#ffc153}.channel-color-3{color:#24c5bb;background:#24c5bb}.hourly-content{flex:auto;grid-template-columns:minmax(0,1fr) 308px;gap:16px;min-height:0;display:grid}.hourly-stats{grid-template-columns:repeat(2,minmax(0,1fr));align-content:stretch;gap:clamp(6px,.38vw,12px);display:grid}.hourly-stats>div{min-width:0;box-shadow:none;background:#071f3b;border:0;border-radius:5px;grid-template-columns:auto 1fr;align-content:center;padding:11px 20px;display:grid}.hourly-stats svg{color:#3aa8ff;filter:drop-shadow(0 0 6px #3aa8ff7a);grid-row:1;width:20px;height:20px;margin-bottom:6px}.hourly-stats>div:nth-child(2) svg{color:#20e1e7}.hourly-stats span{color:#849db2;font-size:clamp(11px,.39vw,14px)}.hourly-stats span,.hourly-stats strong{grid-column:1/-1}.hourly-stats strong{color:#f0f8ff;font:650 clamp(18px, 1vw, 22px) var(--font-data);margin-top:5px}.transaction-feed{overscroll-behavior:contain;scrollbar-width:none;flex-direction:column;flex:auto;gap:7px;min-height:0;padding:4px 0 3px;display:flex;overflow:hidden auto}.transaction-feed::-webkit-scrollbar{display:none}.transaction-feed-row{color:#7a8297;background:#071f3b;border:1px solid #2470ab59;border-radius:2px;flex:0 0 31px;grid-template-columns:8px minmax(94px,1.25fr) minmax(62px,.72fr) minmax(72px,.86fr) minmax(58px,.55fr);align-items:center;gap:8px;min-width:0;min-height:31px;padding:0 12px 0 27px;font-size:12px;display:grid}.transaction-feed time{display:none}.transaction-feed code,.transaction-feed .payment-method,.transaction-feed .channel-provider{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.transaction-feed code{color:#c0d3e2;font-family:var(--font-data)}.transaction-feed .payment-method{color:#879fb4}.transaction-feed .channel-provider{color:#3bd6dd}.transaction-feed strong{color:#e4f5ff;font-family:var(--font-data);justify-self:end}.status-dot{background:#65ffc1;border-radius:50%;width:clamp(5px,.24vw,8px);height:clamp(5px,.24vw,8px);box-shadow:0 0 10px #65ffc1}.screen-footer{display:none}.motion-paused *,.motion-paused :before,.motion-paused :after{animation-play-state:paused!important}.screen-state{text-align:center;min-height:100vh;color:var(--text);font-family:var(--font-body);background:#07111f;place-content:center;gap:14px;display:grid}.screen-state p{color:var(--muted)}.loading-orbit{border:1px solid #4bd8ff40;border-top-color:var(--cyan);border-radius:50%;width:44px;height:44px;margin:auto;animation:1.2s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:1400px){.data-screen{grid-template-rows:auto auto auto;gap:12px;height:auto;min-height:100vh;padding:18px;overflow:auto}.metric-rail{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-cell:nth-child(4n){border-right:0}.metric-cell:nth-child(-n+4){border-bottom:1px solid var(--line)}.screen-grid{grid-template-rows:auto;grid-template-columns:1fr 1fr}.trend-panel,.hourly-panel{grid-area:auto/span 2;min-height:390px}.channel-panel,.feed-panel{grid-area:auto;min-height:330px}.trend-body{grid-template-columns:minmax(0,2fr) minmax(240px,1fr)}.channel-content{grid-template-columns:minmax(180px,1fr) minmax(160px,.8fr)}}@media (max-width:760px){.screen-header{align-items:flex-start;gap:14px;height:auto;padding:12px 0}.brand-lockup{margin-left:0;transform:none}.brand-mark{width:64px;height:60px}.brand-lockup h1{font-size:24px}.screen-meta time,.live-chip{display:none}.metric-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-cell:nth-child(2n){border-right:0}.metric-cell:nth-child(-n+6){border-bottom:1px solid var(--line)}.screen-grid{display:block}.panel{min-height:360px;margin-bottom:12px}.trend-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.trend-summary>div{border-bottom:1px solid #78b1dc21;padding:8px}.trend-body{grid-template-columns:1fr}.trend-body .chart-fill{border-bottom:1px solid #78b1dc21;border-right:0;min-height:260px}.quality-board{min-height:260px}.channel-content{grid-template-columns:1fr}.channel-chart{min-height:240px}.hourly-content{grid-template-columns:1fr}.hourly-stats{min-height:150px}.screen-footer{gap:12px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
