*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#020d1f;
  --panel:rgba(2,22,52,.88);
  --card:rgba(4,30,70,.80);
  --bdr:rgba(0,162,255,.38);
  --bdr2:rgba(0,200,255,.7);
  --c1:#00c8ff;
  --c2:#4de8ff;
  --c3:#0a6fa8;
  --gold:#f5c842;
  --green:#00e5a0;
  --orange:#ff8c00;
  --red:#ff3b5c;
  --yellow:#ffe066;
  --tb:#e8f4ff;
  --tm:#8ab8d8;
  --td:#4a7a9b;
}
html,body{
  width:100%;height:100%;overflow:hidden;
  background:var(--bg);
  font-family:'Microsoft YaHei','PingFang SC',sans-serif;
  color:var(--tb);
}
body{display:flex;align-items:center;justify-content:center;}

.screen-viewport{
  width:100vw;height:100vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.screen-wrap{
  width:1920px;height:1080px;
  flex-shrink:0;
  min-width:1920px;
  min-height:1080px;
  transform-origin:center center;
  position:relative;
  background:var(--bg);
  overflow:hidden;
}
.screen-wrap::before{
  content:'';position:absolute;inset:0;
  background-image:linear-gradient(rgba(0,162,255,.03) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(0,162,255,.03) 1px,transparent 1px);
  background-size:60px 60px;pointer-events:none;z-index:0;
}
.screen-wrap::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 110% 55% at 50% 0%,rgba(0,70,190,.22) 0%,transparent 65%);
  pointer-events:none;z-index:0;
}

.screen-loading,.screen-error{
  position:fixed;z-index:9999;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:18px;letter-spacing:2px;
}
.screen-loading{background:rgba(2,13,31,.92);color:var(--c2);}
.screen-error{display:none;background:rgba(2,13,31,.95);color:var(--red);padding:24px;text-align:center;}

#hd{
  position:relative;z-index:10;
  width:100%;height:60px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 24px;
  background:linear-gradient(180deg,rgba(0,50,120,.95) 0%,rgba(2,16,48,.92) 100%);
  border-bottom:1px solid var(--bdr);
}
#hd::after{
  content:'';position:absolute;bottom:-2px;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--c1) 30%,var(--c2) 50%,var(--c1) 70%,transparent);
  animation:gp 3s ease-in-out infinite;
}
@keyframes gp{0%,100%{opacity:.5}50%{opacity:1}}

.hl{display:flex;align-items:center;gap:18px;width:380px;}
.hr{display:flex;align-items:center;gap:14px;width:380px;justify-content:flex-end;}
#clock{font-size:24px;font-weight:700;color:var(--c2);letter-spacing:2px;font-variant-numeric:tabular-nums;}
#dstr{font-size:11px;color:var(--tm);margin-top:2px;}
.hm{font-size:11px;color:var(--tm);line-height:1.9;}
.hm em{color:var(--c2);font-style:normal;}
#hd h1{
  flex:1;text-align:center;
  font-size:26px;font-weight:700;letter-spacing:8px;
  background:linear-gradient(90deg,#7ecfff,#fff 40%,#7ecfff);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 12px rgba(0,200,255,.55));
}
.sdot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 7px var(--green);animation:bk 1.5s ease-in-out infinite;}
@keyframes bk{0%,100%{opacity:1}50%{opacity:.2}}
.ltag{
  display:inline-flex;align-items:center;gap:4px;
  font-size:10px;color:var(--green);
  background:rgba(0,229,160,.1);border:1px solid rgba(0,229,160,.35);
  border-radius:10px;padding:2px 9px;
}
.ltag::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--green);animation:bk 1.5s infinite;}
.ltag-action{
  cursor:pointer;margin-left:6px;
  color:var(--c1);border-color:rgba(0,200,255,.35);background:rgba(0,200,255,.08);
  text-decoration:none;user-select:none;
  position:relative;z-index:20;
  font:inherit;font-size:10px;line-height:1.4;
}
button.ltag-action{
  appearance:none;-webkit-appearance:none;
  font-family:inherit;outline:none;
}
.ltag-action::before{display:none;}
.ltag-action:hover{background:rgba(0,200,255,.16);border-color:rgba(0,200,255,.55);}

/* 浏览器全屏或 CSS 兜底全屏 */
html.screen-fs,
html.screen-fs body{
  width:100%!important;height:100%!important;overflow:hidden!important;margin:0;padding:0;
}
html.screen-fs body{
  display:flex;align-items:center;justify-content:center;
}
html.screen-fs .screen-viewport{
  position:fixed;inset:0;z-index:99990;
  width:100vw;height:100vh;height:100dvh;
  background:var(--bg);
}
html:fullscreen,
html:-webkit-full-screen,
html:-ms-fullscreen{
  background:var(--bg);
}
html:fullscreen body,
html:-webkit-full-screen body,
html:-ms-fullscreen body{
  display:flex;align-items:center;justify-content:center;
}

#main{
  position:relative;z-index:1;
  display:grid;
  grid-template-rows:82px minmax(0,1fr) 176px;
  gap:8px;
  padding:8px 12px 10px;
  height:calc(1080px - 60px);
  min-height:0;
}
#cl,#cm,#cr{min-height:0;min-width:0;height:100%;}

.pn{
  background:var(--panel);
  border:1px solid var(--bdr);
  border-radius:5px;
  position:relative;overflow:hidden;
}
.pn::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--c1),transparent);
  opacity:.75;
}
.pt{
  display:flex;align-items:center;gap:7px;
  padding:8px 13px 6px;
  font-size:12px;font-weight:600;letter-spacing:2px;color:var(--c2);
  border-bottom:1px solid rgba(0,162,255,.16);
  flex-shrink:0;
}
.pt::before{
  content:'';width:3px;height:13px;border-radius:2px;
  background:linear-gradient(180deg,var(--c1),var(--c3));
  box-shadow:0 0 7px var(--c1);flex-shrink:0;
}
.ptr{margin-left:auto;font-size:10px;color:var(--td);font-weight:400;letter-spacing:0;}

#cl{display:flex;flex-direction:column;gap:9px;}
#mp{flex:0 0 620px;height:620px;max-height:620px;display:flex;flex-direction:column;min-width:0;}
#mc{flex:1;min-height:0;min-width:0;width:100%;overflow:hidden;}
#rp{flex:1;min-height:210px;display:flex;flex-direction:column;}
#rb{flex:1;padding:5px 11px;overflow:hidden;}
.ri{display:flex;align-items:center;gap:6px;padding:3.5px 0;border-bottom:1px solid rgba(0,162,255,.1);}
.ri:last-child{border-bottom:none;}
.rno{width:17px;height:17px;border-radius:3px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}
.r1{background:#c8960c;color:#fff;}.r2{background:#6e7f8a;color:#fff;}.r3{background:#7a4a2a;color:#fff;}.rx{background:rgba(0,100,180,.35);color:var(--tm);}
.rn{flex:1;font-size:11px;}
.rbw{width:82px;height:5px;background:rgba(0,100,180,.22);border-radius:3px;}
.rbb{height:100%;border-radius:3px;transition:width 1.2s ease;}
.rv{font-size:11px;font-weight:700;width:40px;text-align:right;}
.rg{font-size:10px;width:20px;text-align:center;border-radius:2px;padding:1px 2px;}

#cm{display:flex;flex-direction:column;gap:9px;}
#kr{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;min-height:0;}
.kc{padding:8px 12px;}
.kv{font-size:26px;}
.kc{
  background:var(--card);border:1px solid var(--bdr);border-radius:5px;
  padding:11px 14px;display:flex;flex-direction:column;justify-content:space-between;
  position:relative;overflow:hidden;
}
.kc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--kc,var(--c1));opacity:.7;}
.kc::before{content:'';position:absolute;top:-15px;right:-15px;width:55px;height:55px;border-radius:50%;background:var(--kc,var(--c1));opacity:.05;}
.kl{font-size:11px;color:var(--tm);letter-spacing:1px;}
.kv{font-size:28px;font-weight:900;color:var(--kc,var(--c2));line-height:1;font-variant-numeric:tabular-nums;}
.ku{font-size:12px;font-weight:400;margin-left:2px;}
.ks{font-size:10px;color:var(--td);}
.up{color:var(--green)}.dn{color:var(--red)}

#tp{height:222px;display:flex;flex-direction:column;flex-shrink:0;min-width:0;}
#mbwrap{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column;gap:9px;}
#mb{
  flex:0 0 400px;
  height:400px;
  max-height:400px;
  min-height:0;
  min-width:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
#typ,#inp{display:flex;flex-direction:column;min-height:0;min-width:0;overflow:hidden;}
#tyc,#inc,#tc,#mc,#gc,#pc{
  flex:1;
  min-height:0;
  min-width:0;
  width:100%;
  overflow:hidden;
}
#gp{flex:1;min-height:130px;min-width:0;display:flex;flex-direction:column;}

#cr{display:flex;flex-direction:column;gap:9px;height:100%;min-height:0;overflow:hidden;}
#ap{flex:0 0 218px;height:218px;display:flex;flex-direction:column;flex-shrink:0;}
.as{display:flex;gap:7px;padding:7px 11px 5px;flex-shrink:0;}
.ab{flex:1;border-radius:4px;padding:6px 7px;text-align:center;border:1px solid;}
.ab-r{background:rgba(255,59,92,.1);border-color:rgba(255,59,92,.45);}
.ab-o{background:rgba(255,140,0,.1);border-color:rgba(255,140,0,.45);}
.ab-y{background:rgba(255,224,102,.1);border-color:rgba(255,224,102,.45);}
.abn{font-size:26px;font-weight:900;line-height:1;}
.ab-r .abn{color:var(--red)}.ab-o .abn{color:var(--orange)}.ab-y .abn{color:var(--yellow)}
.abl{font-size:10px;color:var(--tm);margin-top:2px;}
.al{flex:1;overflow:hidden;padding:0 11px;}
.ai{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px solid rgba(0,162,255,.1);}
.ai:last-child{border-bottom:none;}
.ad{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.ad-r{background:var(--red);box-shadow:0 0 5px var(--red);}
.ad-o{background:var(--orange);box-shadow:0 0 5px var(--orange);}
.ad-y{background:var(--yellow);box-shadow:0 0 5px var(--yellow);}
.at{flex:1;font-size:11px;}
.atm{font-size:10px;color:var(--td);white-space:nowrap;}

#bp{
  flex:0 0 268px;
  height:268px;
  min-height:268px;
  display:flex;
  flex-direction:column;
  flex-shrink:0;
}
#bp .bbs{
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:space-evenly;
  padding:6px 11px 14px;
  box-sizing:border-box;
}
.bg{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:6px 11px 4px;flex-shrink:0;}
.bi{background:rgba(0,40,100,.45);border:1px solid rgba(0,162,255,.2);border-radius:4px;padding:7px 9px;}
.bv{font-size:21px;font-weight:800;line-height:1;}
.bl{font-size:10px;color:var(--tm);margin-top:3px;}
.bbs{padding:0 11px 10px;flex-shrink:0;}
#bp .bbs .bbr{
  display:grid;
  grid-template-columns:78px 220px 30px;
  align-items:center;gap:5px;
}
#bp .bbs .bbl{
  font-size:10px;color:var(--tm);
  width:78px;min-width:78px;max-width:78px;
  flex:none;box-sizing:border-box;
  text-align:justify;text-align-last:justify;
  line-height:1.2;overflow:hidden;
}
#bp .bbs .bbw{
  width:220px;min-width:220px;max-width:220px;
  height:6px;background:rgba(0,100,180,.2);border-radius:3px;
}
#bp .bbs .bbv{
  font-size:10px;color:var(--c1);width:30px;
  justify-self:end;text-align:right;
}

.bbb{height:100%;border-radius:3px;transition:width 1.5s ease;}

#pp{flex:1 1 0;min-height:150px;display:flex;flex-direction:column;overflow:hidden;}
#pc{flex:1;min-height:0;}
#qp{flex:0 0 192px;height:192px;display:flex;flex-direction:column;flex-shrink:0;}
#qp .af{
  display:flex;
  align-items:center;
  margin-top:12px;
  padding:9px 11px 5px;
  flex-shrink:0;
}
#qp .asts{
  display:flex;
  padding:0 11px 6px;
}
#qp .as2{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  min-width:0;
}
#qp .ast{
  flex:1;
  text-align:center;
  min-width:0;
}
#qp .al2{
  font-size:10px;color:var(--tm);text-align:center;line-height:1.4;
  min-height:28px;
  display:flex;align-items:center;justify-content:center;
}
.ac{
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:800;border:2px solid;
}
.ac-d{border-color:var(--green);color:var(--green);background:rgba(0,229,160,.1);}
.ac-p{border-color:var(--yellow);color:var(--yellow);background:rgba(255,224,102,.1);}
.ac-w{border-color:var(--td);color:var(--td);background:rgba(74,122,155,.1);}
.al2{font-size:10px;color:var(--tm);text-align:center;line-height:1.4;}
.astv{font-size:17px;font-weight:800;color:var(--c1);}
.astl{font-size:10px;color:var(--td);}

.dash-mid{min-height:0;display:grid;grid-template-columns:500px minmax(0,1fr) 390px;gap:8px;}
.dash-col{min-width:0;min-height:0;display:flex;flex-direction:column;gap:8px;}
.dash-col .pn{min-height:0;display:flex;flex-direction:column;}
.dash-col .grow{flex:1;}
.map-panel{flex:1;}
.map-caption{flex:0 0 auto;margin:6px 10px 0;padding:6px 8px;min-height:58px;background:rgba(0,40,100,.5);border:1px solid rgba(0,162,255,.3);border-radius:4px;color:#c4e6ff;font-size:11px;line-height:1.45;}
.map-caption b{color:#4de8ff;}
.off-panel{flex:0 0 128px;}
.split{flex:0 0 188px;display:grid;grid-template-columns:1fr 1fr;gap:8px;min-height:0;}
.split.short{flex-basis:168px;}
.chart{flex:1;min-height:0;min-width:0;}
.offmap{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:6px 8px 8px;min-height:0;}
.off-card{background:rgba(0,40,100,.45);border:1px solid rgba(0,162,255,.25);border-radius:4px;padding:6px 8px;overflow:hidden;}
.off-card b{display:block;color:var(--c2);font-size:12px;margin-bottom:2px;}
.off-card span{display:block;color:var(--tm);font-size:10px;line-height:1.45;}
.area-table-wrap{flex:1;min-height:0;overflow:hidden;padding:0 8px 8px;}
.area-table{width:100%;border-collapse:collapse;font-size:12px;}
.area-table th,.area-table td{padding:4px 4px;text-align:right;border-bottom:1px solid rgba(0,162,255,.12);white-space:nowrap;}
.area-table th:first-child,.area-table td:first-child{text-align:left;color:var(--tb);}
.area-table th{color:var(--td);font-weight:500;position:sticky;top:0;background:#041632;}
.seat-list{flex:1;display:flex;flex-direction:column;justify-content:space-evenly;padding:4px 10px 8px;}
.seat-row{display:grid;grid-template-columns:72px 1fr 42px;align-items:center;gap:6px;font-size:11px;color:var(--tm);}
.seat-row i{height:6px;border-radius:3px;background:rgba(0,100,180,.25);display:block;}
.seat-row b{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#00c8ff,#00e5a0);}
.seat-row em{font-style:normal;color:var(--c2);text-align:right;}
.person-detail{flex:0 0 auto;padding:0 10px 8px;color:var(--tm);font-size:11px;line-height:1.45;}
.grant-panel{flex:0 0 196px;}
.grant-line{flex:0 0 auto;padding:0 10px 8px;color:var(--tm);font-size:11px;line-height:1.5;}
.dash-bot{min-height:0;display:grid;grid-template-columns:1.45fr 1fr;gap:8px;}
.dash-bot .pn{min-height:0;display:flex;flex-direction:column;}
.base-focus{flex:0 0 auto;padding:2px 10px 0;color:#4de8ff;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.base-scroll{flex:1;min-height:0;overflow:hidden;padding:0 8px 6px;}
.base-table tr.on td{background:rgba(0,200,255,.16);}
.base-table{width:100%;table-layout:fixed;border-collapse:collapse;font-size:12px;}
.base-table th,.base-table td{padding:5px 6px;text-align:right;border-bottom:1px solid rgba(0,162,255,.12);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.base-table th:nth-child(1),.base-table td:nth-child(1),
.base-table th:nth-child(2),.base-table td:nth-child(2),
.base-table th:nth-child(3),.base-table td:nth-child(3),
.base-table th:nth-child(10),.base-table td:nth-child(10){text-align:left;}
.base-table th{color:var(--td);font-weight:500;}
.base-table td{color:var(--tb);}
.base-table .c-area{width:72px;}
.base-table .c-level{width:78px;}
.base-table .c-seat{width:72px;}
.base-table .c-num{width:48px;}
.base-table .c-act{width:78px;}
.base-table .c-flag{width:46px;}
.base-table .c-note{width:16%;}
#kr .kc{padding:8px 10px;}
#kr .kv{font-size:24px;}
#kr .kl{letter-spacing:0;}
.hl{width:460px;}
.hr{width:420px;}

#pts{position:absolute;inset:0;pointer-events:none;z-index:0;}
.scan{position:absolute;inset:0;pointer-events:none;z-index:999;
  background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,162,255,.012) 3px,rgba(0,162,255,.012) 4px);}

@keyframes nf{0%,100%{opacity:1}50%{opacity:.6}}
.nl{animation:nf 2.5s ease-in-out infinite;}
@keyframes fsi{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
.fi{animation:fsi .45s ease forwards;}