
  :root{
    --bg0:#070b16;--bg1:#0b1124;--bg2:#0e1530;
    --lime:#c6ff4d;--lime-d:#9bd02f;--mag:#ff3d71;--cyan:#2de2ff;--amber:#ffc23a;--violet:#b388ff;
    --white:#f3f6ff;--text:#e7ecff;--text2:#9aa6cc;--dim:#5f6a92;--faint:#2b3358;
    --line:rgba(180,200,255,.10);--line2:rgba(198,255,77,.30);
    --mono:"SF Mono","Menlo","Consolas","Liberation Mono",monospace;
    --sans:-apple-system,"PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;
    --ease:cubic-bezier(.22,1,.36,1);--bounce:cubic-bezier(.2,1.4,.34,1);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html,body{width:100%;height:100%;overflow:hidden;background:#02030a;font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;}
  .num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:0;}
  .tv{position:fixed;inset:0;color:var(--text);overflow:hidden;background:var(--bg0);}
  .grid-ov{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;
    background-image:linear-gradient(rgba(120,170,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,255,.045) 1px,transparent 1px);
    background-size:4vh 4vh;animation:gridmove 24s linear infinite;mask:radial-gradient(125% 100% at 50% 0%,#000 44%,transparent 92%);}
  @keyframes gridmove{to{background-position:4vh 4vh,4vh 4vh;}}
  .vig{position:absolute;inset:0;z-index:1;pointer-events:none;box-shadow:inset 0 0 280px rgba(0,0,0,.82);}
  .scan{position:absolute;left:0;right:0;top:-34vh;height:34vh;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(198,255,77,.05),transparent);animation:scan 9s ease-in-out infinite;}
  @keyframes scan{0%{transform:translateY(0)}55%{transform:translateY(134vh)}100%{transform:translateY(134vh)}}
  .content{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;}

  /* head + tabs */
  .head{flex:none;display:flex;align-items:center;gap:1.4vw;padding:1.4vh 2.4vw 1vh;}
  .homebtn{width:4.4vh;height:4.4vh;display:grid;place-items:center;flex:none;border:1px solid var(--line);border-radius:1vh;background:rgba(13,20,44,.58);color:var(--text);font-size:2.2vh;font-weight:800;cursor:pointer;box-shadow:0 0 1.4vh rgba(0,0,0,.25);transition:transform .2s var(--ease),border-color .25s,background .25s;}
  .homebtn:hover{border-color:var(--line2);background:rgba(198,255,77,.09);transform:translateX(-.15vw);}
  /* 0815：门面不许断行。1280×720（常见电视分辨率）实测「NBB 生／态交互」被折成三行，"生"字孤悬。 */
  .logo{font-size:3vh;font-weight:800;letter-spacing:.06em;color:#fff;text-shadow:0 0 1.6vh rgba(45,226,255,.18);white-space:nowrap;flex:none;}
  .logo b{color:var(--lime);text-shadow:0 0 1.6vh rgba(198,255,77,.4);}.logo span{display:block;font-size:1.1vh;letter-spacing:.5em;color:var(--cyan);font-weight:700;margin-top:.2vh;}
  .live{display:flex;align-items:center;gap:.5vw;font-family:var(--mono);font-size:1.3vh;font-weight:800;letter-spacing:.18em;color:var(--mag);padding:.5vh 1vw;border:1px solid rgba(255,61,113,.34);border-radius:.7vh;}
  .live i{width:1vh;height:1vh;border-radius:50%;background:var(--mag);box-shadow:0 0 1vh var(--mag);animation:bl 1.5s infinite;}
  @keyframes bl{0%,100%{opacity:1}50%{opacity:.32}}
  .tabs{display:flex;gap:.7vw;margin-left:.6vw;}
  .tab{font-size:1.7vh;font-weight:700;letter-spacing:.06em;color:var(--text2);padding:.8vh 1.5vw;border-radius:1vh;border:1px solid var(--line);cursor:pointer;transition:.3s;white-space:nowrap;}
  .tab.on{color:#06121a;background:var(--lime);border-color:transparent;box-shadow:0 0 2vh rgba(198,255,77,.4);font-weight:800;}
  .clock{margin-left:auto;text-align:right;}
  .clock .ct{font-family:var(--mono);font-size:2.4vh;font-weight:700;color:var(--cyan);letter-spacing:.02em;}
  .clock .cd{font-size:1.2vh;color:var(--dim);letter-spacing:.16em;}

  /* page area */
  .stageP{position:relative;flex:1;min-height:0;}
  .page{position:absolute;inset:0;padding:.4vh 2.4vw 0;opacity:0;visibility:hidden;transition:opacity .6s var(--ease);}
  .page.on{opacity:1;visibility:visible;}

  /* ---- rank page: two columns ---- */
  .twocol{display:grid;grid-template-columns:1fr 1fr;gap:1.8vw;height:100%;}
  .col{display:flex;flex-direction:column;min-height:0;}
  .colh{flex:none;display:flex;align-items:baseline;gap:1vw;padding:0 .4vw .8vh;border-bottom:1px solid var(--line);margin-bottom:.7vh;}
  .colh .t{font-size:2vh;font-weight:800;letter-spacing:.14em;color:var(--text);text-shadow:0 0 1.2vh rgba(198,255,77,.14);}.colh .t b{color:var(--lime);}
  .colh .e{font-family:var(--mono);font-size:1.1vh;letter-spacing:.16em;color:var(--dim);}
  .colh .pg{margin-left:auto;font-family:var(--mono);font-size:1.2vh;color:var(--dim);}.colh .pg b{color:var(--cyan);}
  .rows{position:relative;flex:1;min-height:0;}
  .row{position:absolute;left:0;right:0;display:flex;align-items:center;gap:.9vw;padding:0 1vw;border-radius:1vh;border:1px solid var(--line);background:rgba(13,20,44,.5);overflow:hidden;
    will-change:transform;transition:transform .8s var(--ease),border-color .4s;}
  .row .fill{position:absolute;inset:0;width:0;background:linear-gradient(90deg,rgba(198,255,77,.16),rgba(198,255,77,.03) 70%,transparent);border-right:2px solid rgba(198,255,77,.5);transition:width 1s var(--ease);}
  .row .fill .shine{position:absolute;top:0;bottom:0;left:0;width:26%;transform:translateX(-120%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);animation:barshine 5.4s linear var(--shd,0s) infinite;}
  @keyframes barshine{0%{transform:translateX(-120%)}100%{transform:translateX(420%)}}
  .row>*{position:relative;z-index:2;}
  .row .rk{font-family:var(--mono);font-size:2.2vh;font-weight:700;color:var(--dim);width:2.8vh;text-align:center;flex:none;}
  .row .av{width:3.4vh;height:3.4vh;border-radius:.7vh;flex:none;overflow:hidden;background:#0e1734;}
  .row .av svg{display:block;}
  /* R66 真实头像:所有头像容器(行.av/hav/top3Av/sav/leaderAv/pmAv/hav2/bav…)均为定尺寸+overflow:hidden,一条全局规则通吃;行高自适应时随容器(av尺寸=rh*0.58)缩放 */
  .avReal{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block;}
  .row .nm{font-size:2vh;font-weight:800;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:9vw;letter-spacing:.01em;}
  .row .tt{font-size:1.2vh;color:var(--cyan);letter-spacing:.06em;white-space:nowrap;opacity:.85;}
  .row .pts{font-family:var(--mono);font-size:2.1vh;color:var(--white);font-weight:700;margin-left:auto;}
  .row .chg{font-family:var(--mono);font-size:1.3vh;width:2.6vw;text-align:right;font-weight:700;color:var(--dim);flex:none;}
  .row .chg.u{color:var(--lime)}.row .chg.d{color:var(--mag)}
  .row .tr{font-size:1.4vh;font-weight:700;white-space:nowrap;}
  .row .crown{position:absolute;left:0;top:-.3vh;font-size:1.6vh;z-index:3;}
  .row.t1{border-color:var(--line2);box-shadow:0 0 2.4vh rgba(198,255,77,.14);}
  .row.t1 .fill{background:linear-gradient(90deg,rgba(198,255,77,.3),rgba(198,255,77,.06) 70%,transparent);}
  .row.t1 .rk{color:var(--lime);text-shadow:0 0 1.4vh rgba(198,255,77,.6);}
  .row.t1 .nm{color:#fbffe8;}
  .row.t1 .av{box-shadow:0 0 0 .2vh var(--lime),0 0 1.6vh rgba(198,255,77,.5);}
  .row.t2 .rk{color:#cfd6e6}.row.t3 .rk{color:var(--amber)}
  .row .bp{position:absolute;right:4vw;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:1.6vh;font-weight:800;color:var(--lime);opacity:0;pointer-events:none;z-index:4;}

  /* ---- today page: MVP centered ---- */
  .today{position:relative;height:100%;}
  .today .orbit{position:absolute;left:50%;top:48%;width:42vh;height:42vh;transform:translate(-50%,-50%);border:1px dashed rgba(198,255,77,.14);border-radius:50%;}
  .today .orbit::after{content:"";position:absolute;left:50%;top:50%;width:78%;height:78%;transform:translate(-50%,-50%);border:1px dashed rgba(45,226,255,.12);border-radius:50%;}
  .periodBoard{position:relative;height:100%;display:flex;flex-direction:column;gap:1.15vh;overflow:hidden;isolation:isolate;}
  .periodBoard::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 62% at 50% 25%,rgba(198,255,77,.07),transparent 72%);}
  .periodBoard.week::before{background:radial-gradient(60% 62% at 50% 25%,rgba(45,226,255,.08),transparent 72%);}
  .periodHead{display:flex;align-items:flex-end;justify-content:space-between;padding:.1vh .35vw .85vh;border-bottom:1px solid var(--line);}
  .periodHead b{display:block;font-size:2.75vh;letter-spacing:.12em;color:#fff}.periodHead span{font-family:var(--mono);font-size:1.15vh;letter-spacing:.12em;color:var(--cyan)}
  .periodHead i{font-style:normal;font-family:var(--mono);font-size:1.3vh;color:var(--lime)}
  .periodFeatured{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:.85vh .7vw;height:36vh;flex:none;}
  .periodCard{position:relative;min-width:0;display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;gap:.75vw;padding:.85vh .9vw;border:1px solid rgba(180,200,255,.12);border-radius:1.15vh;background:linear-gradient(105deg,rgba(13,20,44,.78),rgba(7,11,22,.72));overflow:hidden;box-shadow:inset 0 1px rgba(255,255,255,.035);animation:top3In .54s var(--ease) both;animation-delay:calc(var(--slot,0)*.045s);}
  .periodCard.top3{border-color:rgba(198,255,77,.4);background:linear-gradient(105deg,rgba(198,255,77,.11),rgba(13,20,44,.78) 52%,rgba(7,11,22,.72));box-shadow:0 0 2.2vh rgba(198,255,77,.1),inset 0 1px rgba(255,255,255,.05);}
  .periodBoard.week .periodCard.top3{border-color:rgba(45,226,255,.42);background:linear-gradient(105deg,rgba(45,226,255,.11),rgba(13,20,44,.78) 52%,rgba(7,11,22,.72));}
  .periodCard.empty{opacity:.5}
  .periodRank{font-family:var(--mono);font-size:2.8vh;font-weight:900;color:var(--lime);min-width:2.2vw;text-align:center}
  .periodBoard.week .periodRank{color:var(--cyan)}
  .periodAv{width:7.2vh;height:7.2vh;border-radius:1.25vh;overflow:hidden;background:#0e1734;box-shadow:0 0 0 .2vh rgba(198,255,77,.42);}
  .periodBoard.week .periodAv{box-shadow:0 0 0 .2vh rgba(45,226,255,.46)}
  .periodWho{min-width:0}.periodWho b{display:block;font-size:2.05vh;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.periodWho span{display:block;font-family:var(--mono);font-size:1.05vh;color:var(--text2);margin-top:.35vh}
  .periodPts{font-family:var(--mono);font-size:2.25vh;font-weight:900;color:var(--lime);white-space:nowrap}.periodBoard.week .periodPts{color:var(--cyan)}
  .periodRest{position:relative;flex:1;min-height:0;overflow:hidden;border-top:1px solid rgba(180,200,255,.07);padding-top:.8vh;mask:linear-gradient(180deg,#000 0,#000 88%,transparent)}
  .periodRestTrack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55vh .65vw;align-content:start}
  .periodMini{min-width:0;height:5.2vh;display:grid;grid-template-columns:2.7vw 5.2vh minmax(0,1fr) auto;align-items:center;gap:.6vw;padding:0 .75vw;border-radius:.82vh;background:rgba(13,20,44,.55);border:1px solid rgba(180,200,255,.07)}
  .periodMini .periodRank{font-size:1.65vh}.periodMini .periodAv{width:4.1vh;height:4.1vh;border-radius:.65vh;box-shadow:none}.periodMini .periodWho b{font-size:1.65vh}.periodMini .periodWho span{font-size:1.08vh}.periodMini .periodPts{font-size:1.65vh}
  .periodEmpty{height:100%;display:grid;place-items:center;color:var(--text2);font-size:2vh;letter-spacing:.08em}
  .mvpc{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);text-align:center;z-index:3;}
  .mvpc .lab{font-family:var(--mono);font-size:1.6vh;letter-spacing:.4em;color:var(--lime);text-shadow:0 0 1.8vh rgba(198,255,77,.5);}
  .mvpc .av{width:14vh;height:14vh;border-radius:2vh;overflow:hidden;margin:1.4vh auto 1vh;box-shadow:0 0 0 .3vh var(--lime),0 0 4vh rgba(198,255,77,.5);animation:mb 3s ease-in-out infinite;}
  @keyframes mb{0%,100%{box-shadow:0 0 0 .3vh var(--lime),0 0 3vh rgba(198,255,77,.4)}50%{box-shadow:0 0 0 .3vh var(--lime),0 0 6vh rgba(198,255,77,.75)}}
  .mvpc .nm{font-size:3.6vh;font-weight:800;color:#fbffe8;letter-spacing:.02em;}
  .mvpc .tt{font-size:1.7vh;color:var(--cyan);letter-spacing:.16em;margin-top:.4vh;}
  .mvpc .gain{font-family:var(--mono);font-size:2.6vh;font-weight:800;color:var(--lime);margin-top:1vh;}
  .mvpc .gain span{font-size:1.4vh;color:var(--text2);}
  .sat{position:absolute;transform:translate(-50%,-50%);text-align:center;z-index:2;width:11vh;}
  .sat .sa{width:6vh;height:6vh;border-radius:1.2vh;overflow:hidden;margin:0 auto .4vh;}
  .sat .sn{font-size:1.5vh;font-weight:800;color:var(--white);}.sat .sg{font-family:var(--mono);font-size:1.3vh;color:var(--cyan);}

  /* ---- tier page ---- */
  .tierL{display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:.6vh 0;}
  .trow{position:relative;display:flex;align-items:center;gap:1.2vw;height:12%;border-radius:1.2vh;overflow:hidden;padding:0 1.4vw;border:1px solid var(--line);background:rgba(13,20,44,.4);}
  .trow .tb2{position:absolute;left:0;top:0;bottom:0;width:0;transition:width 1s var(--ease);}
  .trow .ico{position:relative;z-index:2;width:4.4vh;height:4.4vh;border-radius:1vh;display:grid;place-items:center;font-size:2.4vh;flex:none;}
  .trow .tn{position:relative;z-index:2;font-size:2.4vh;font-weight:800;letter-spacing:.06em;width:14vh;flex:none;}
  .trow .tmin{position:relative;z-index:2;font-family:var(--mono);font-size:1.3vh;color:var(--dim);}
  .trow .tav{position:relative;z-index:2;margin-left:auto;display:flex;gap:.5vw;}
  .trow .tav .a{width:4.2vh;height:4.2vh;border-radius:.8vh;overflow:hidden;}
  .trow .tc{position:relative;z-index:2;font-family:var(--mono);font-size:2.8vh;font-weight:800;margin-left:1vw;width:3vh;text-align:right;}

  /* ---- social page ---- */
  .social{display:grid;grid-template-columns:1.2fr 1fr;gap:1.8vw;height:100%;}
  .talk{display:flex;flex-direction:column;gap:1.4vh;justify-content:center;}
  .talk .hd{font-family:var(--mono);font-size:1.5vh;letter-spacing:.2em;color:var(--lime);}
  .cm{display:flex;gap:1.2vw;align-items:flex-start;border:1px solid var(--line);border-left:.3vh solid var(--lime);border-radius:1.2vh;padding:1.4vh 1.4vw;background:rgba(13,20,44,.5);}
  .cm .ca{width:6vh;height:6vh;border-radius:1.2vh;overflow:hidden;flex:none;}
  .cm .cn{font-size:2vh;font-weight:800;color:#fff;}.cm .cn b{font-family:var(--mono);font-size:1.4vh;color:var(--lime);margin-left:.6vw;}
  .cm .cn .md{margin-left:.5vw;}
  .cm .ctx{font-size:1.8vh;color:var(--text2);margin-top:.6vh;line-height:1.5;}
  .side{display:flex;flex-direction:column;gap:1.4vh;justify-content:center;}
  .card{border:1px solid var(--line);border-radius:1.4vh;padding:1.8vh 1.6vw;background:rgba(13,20,44,.45);}
  .card .ct3{font-size:1.9vh;font-weight:800;color:var(--lime);letter-spacing:.06em;}
  .card .welcome{display:flex;flex-wrap:wrap;gap:.7vw;margin-top:1.2vh;}
  .card .wchip{display:flex;align-items:center;gap:.5vw;font-size:1.6vh;font-weight:700;color:var(--white);background:rgba(45,226,255,.1);border:1px solid rgba(45,226,255,.25);border-radius:2vh;padding:.5vh 1vw;}
  .card .wchip i{width:1.2vh;height:1.2vh;border-radius:50%;background:var(--cyan);}
  .card .big{font-family:var(--mono);font-size:4.4vh;font-weight:800;color:#fff;margin-top:.6vh;}
  .card .big span{font-size:1.6vh;color:var(--text2);}
  .card .sub{font-size:1.5vh;color:var(--text2);margin-top:.4vh;}

  /* ticker + law */
  .ticker{flex:none;display:flex;align-items:center;height:5vh;overflow:hidden;border-top:1px solid var(--line);background:linear-gradient(90deg,rgba(7,11,22,.95),rgba(11,17,36,.8));}
  .ticker .tg{flex:none;height:100%;display:flex;align-items:center;padding:0 1.6vw;font-family:var(--mono);font-size:1.4vh;font-weight:800;letter-spacing:.16em;color:#06121a;background:linear-gradient(90deg,var(--lime),#7af0c0);}
  .trk{flex:1;overflow:hidden;}
  .mv{display:inline-block;white-space:nowrap;padding-left:100%;animation:marq 38s linear infinite;font-size:1.8vh;color:var(--text2);}
  .mv b{color:var(--lime);}.mv em{color:var(--cyan);font-style:normal;}.mv .hot{color:var(--amber);}
  @keyframes marq{to{transform:translateX(-100%)}}
  .law{flex:none;height:3vh;display:flex;align-items:center;justify-content:center;font-size:1.3vh;letter-spacing:.16em;color:var(--dim);font-weight:600;background:rgba(4,7,14,.92);}
  .law b{color:var(--text2);}
  .privacyNotice{flex:none;margin:0 2.4vw .55vh;min-height:3vh;display:flex;align-items:center;gap:.7vw;padding:.45vh 1vw;border:1px solid rgba(198,255,77,.26);border-radius:1vh;
    background:linear-gradient(90deg,rgba(198,255,77,.12),rgba(45,226,255,.055),rgba(7,11,22,.35));box-shadow:0 0 2.2vh rgba(198,255,77,.08);color:#dfead0;font-size:1.35vh;font-weight:700;letter-spacing:.08em;}
  .privacyNotice b{color:var(--lime);font-family:var(--mono);letter-spacing:.14em;}
  .privacyNotice span{color:var(--text2);font-weight:600;}
  .qb{position:absolute;right:.5vw;bottom:3.2vh;z-index:40;font-family:var(--mono);font-size:1.1vh;color:var(--faint);opacity:.5;display:none;}
  html.qdbg .qb{display:block;}
  #boardSet select{width:12vw;border:1px solid var(--line);border-radius:.65vh;background:#0d142c;color:var(--text);padding:.55vh .55vw;font-size:1.35vh;}
  #boardSet .bsHint{max-width:22vw;color:var(--dim);font-size:1.15vh;line-height:1.55;border-top:1px solid var(--line);padding-top:.8vh;}
  body.lowfps .scan,body.lowfps .grid-ov{animation:none;}
