/* 实时数据大屏（官网区块 + /screen）· 小红书主题：白底 + 小红书红 */
.sc{--bg:#F6F6F8;--card:#FFFFFF;--ln:#EFEFF2;--tx:#1F1F24;--tx2:#55555E;--mu:#9A9AA3;
  --r:#FF2442;--r2:#FF5C74;--rs:#FFF0F2;--a:#FFAA00;--as:#FFF7E6;--b:#3D7EFF;--bs:#EEF4FF;--g:#00B578;
  background:var(--bg);color:var(--tx);border-radius:24px;padding:22px;
  font-family:-apple-system,"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;box-sizing:border-box}
.sc *{box-sizing:border-box}
.sc .num{font-family:"DIN Alternate","Bahnschrift","SF Pro Display",-apple-system,"Segoe UI",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* 头部 */
.sc-head{display:flex;align-items:center;gap:16px;margin-bottom:16px}
.sc-brand{display:flex;align-items:center;gap:12px;min-width:0}
.sc-logo{flex:none;width:40px;height:40px;border-radius:12px;background:var(--r);display:grid;place-items:center;box-shadow:0 6px 16px rgba(255,36,66,.28)}
.sc-title{font-size:20px;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sc-sub{font-size:12px;color:var(--mu);margin-top:3px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sc-sub i{width:7px;height:7px;border-radius:50%;background:var(--g);animation:scp 2s infinite;flex:none}
@keyframes scp{0%{box-shadow:0 0 0 0 rgba(0,181,120,.5)}70%{box-shadow:0 0 0 7px rgba(0,181,120,0)}100%{box-shadow:0 0 0 0 rgba(0,181,120,0)}}
.sc-time{margin-left:auto;text-align:right;flex:none}
.sc-clock{font-size:30px;font-weight:700;line-height:1}
.sc-date{font-size:12px;color:var(--mu);margin-top:5px}

/* 指标卡 */
.sc-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:12px}
.sc-kpi{position:relative;background:var(--card);border-radius:16px;padding:14px 16px 12px;min-width:0;overflow:hidden;box-shadow:0 1px 2px rgba(20,20,30,.04)}
.sc-kpi .l{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--tx2)}
.sc-kpi .l b{width:8px;height:8px;border-radius:3px;background:var(--mu)}
.sc-kpi .v{display:flex;align-items:baseline;gap:4px;margin-top:6px;font-size:32px;line-height:1.1;font-weight:700;white-space:nowrap;overflow:hidden}
.sc-kpi .v small{font-size:13px;color:var(--mu);font-weight:500}
.sc-kpi .s{font-size:12px;color:var(--mu);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;z-index:1}
.sc-kpi .s em{font-style:normal;font-weight:700;color:var(--r)}
.sc-kpi .sp{position:absolute;right:10px;bottom:10px;width:42%;height:34px;opacity:.9}
.sc-kpi.sc-hero{background:linear-gradient(135deg,#FF2442 0%,#FF5C74 100%);color:#fff;box-shadow:0 8px 22px rgba(255,36,66,.25)}
.sc-kpi.sc-hero .l,.sc-kpi.sc-hero .s,.sc-kpi.sc-hero .v small{color:rgba(255,255,255,.85)}
.sc-kpi.sc-hero .s em{color:#fff}
.sc-kpi.sc-hero .l b{background:#fff}
.sc-kpi.r .l b{background:var(--r)}.sc-kpi.a .l b{background:var(--a)}.sc-kpi.b .l b{background:var(--b)}
.sc-kpi.r .s em{color:var(--r)}.sc-kpi.a .s em{color:#E08A00}.sc-kpi.b .s em{color:var(--b)}

/* 主区 */
.sc-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px}
.sc-card{background:var(--card);border-radius:16px;padding:14px 16px;min-width:0;box-shadow:0 1px 2px rgba(20,20,30,.04);display:flex;flex-direction:column}
.sc-card h4{margin:0 0 10px;font-size:15px;font-weight:700;display:flex;align-items:center;gap:8px}
.sc-card h4::before{content:"";width:4px;height:14px;border-radius:2px;background:var(--r)}
.sc-card h4 small{font-size:12px;color:var(--mu);font-weight:400}
.sc-chart{height:260px;width:100%}
.sc-hour .sc-chart{height:190px}

/* 排行 */
.sc-rank ol{list-style:none;margin:0;padding:0;max-height:300px;overflow:hidden}
.sc-rank li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px dashed var(--ln)}
.sc-rank.cov li{grid-template-columns:24px 36px minmax(0,1fr) auto}
.sc-rank li:last-child{border-bottom:0}
.rk-n{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--mu);background:#F3F3F5}
.sc-rank li:nth-child(1) .rk-n{background:var(--r);color:#fff}
.sc-rank li:nth-child(2) .rk-n{background:#FF6B80;color:#fff}
.sc-rank li:nth-child(3) .rk-n{background:#FFA3B0;color:#fff}
.rk-c{width:36px;height:36px;border-radius:9px;background:#F1F1F3 center/cover no-repeat}
.rk-t{min-width:0}
.rk-t b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-t small{font-size:11px;color:var(--mu)}
.rk-bar{display:block;height:5px;background:#F3F3F5;border-radius:3px;margin-top:6px;overflow:hidden}
.rk-bar i{display:block;height:100%;border-radius:3px}
.rk-v{text-align:right;font-size:18px;font-weight:700;color:var(--r);white-space:nowrap}
.rk-v small{display:block;font-size:11px;color:var(--mu);font-weight:400;margin-top:1px}

/* 动态 */
.sc-feed ul{list-style:none;margin:0;padding:0;max-height:220px;overflow:hidden}
.sc-feed li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;padding:8px 0;border-bottom:1px dashed var(--ln);font-size:13px;align-items:center}
.sc-feed li:last-child{border-bottom:0}
.tk-ts{color:var(--mu);font-size:12px;background:#F5F5F7;border-radius:6px;padding:2px 6px}
.tk-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--tx)}
.tk-v{white-space:nowrap;display:flex;gap:6px}
.tk-v span{font-size:12px;border-radius:6px;padding:2px 7px;font-weight:600}
.tk-v .r{color:var(--r);background:var(--rs)}.tk-v .a{color:#E08A00;background:var(--as)}.tk-v .b{color:var(--b);background:var(--bs)}
.sc-empty{color:var(--mu);font-size:13px;padding:24px 0!important;display:block!important;text-align:center;border:0!important}
.sc [data-fit] > .fit-hide{display:none!important}

/* 全屏模式（/screen） */
.sc.full{border-radius:0;height:100vh;padding:2vh 1.8vw;display:flex;flex-direction:column;overflow:hidden}
.sc.full .sc-head{margin-bottom:1.6vh}
.sc.full .sc-logo{width:clamp(36px,2.4vw,52px);height:clamp(36px,2.4vw,52px)}
.sc.full .sc-title{font-size:clamp(20px,1.5vw,32px)}
.sc.full .sc-sub,.sc.full .sc-date{font-size:clamp(12px,.75vw,15px)}
.sc.full .sc-clock{font-size:clamp(26px,1.9vw,42px)}
.sc.full .sc-kpis{margin-bottom:1.4vh;gap:1.4vh}
.sc.full .sc-kpi{padding:1.6vh 1vw 1.3vh}
.sc.full .sc-kpi .v{font-size:clamp(28px,2.5vw,54px)}
.sc.full .sc-kpi .l,.sc.full .sc-kpi .s{font-size:clamp(12px,.8vw,16px)}
.sc.full .sc-kpi .sp{height:4.5vh}
.sc.full .sc-grid{flex:1;min-height:0;gap:1.4vh;grid-template-rows:minmax(0,1.3fr) minmax(0,1fr)}
.sc.full .sc-card{min-height:0;overflow:hidden;padding:1.6vh 1vw}
.sc.full .sc-card h4{font-size:clamp(15px,1vw,21px)}
.sc.full .sc-chart{flex:1;height:auto;min-height:0}
.sc.full .sc-rank ol,.sc.full .sc-feed ul{max-height:none;flex:1;min-height:0}
.sc.full .rk-t b,.sc.full .sc-feed li{font-size:clamp(13px,.88vw,18px)}
.sc.full .rk-v{font-size:clamp(16px,1.15vw,24px)}

@media (max-width:1100px){
  .sc-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
  .sc-kpi{grid-column:span 2}
  .sc-kpi:nth-child(1),.sc-kpi:nth-child(2){grid-column:span 3}
}
@media (max-width:900px){
  .sc.full{height:auto;overflow:visible}
  .sc.full .sc-grid{grid-template-rows:none}
  .sc.full .sc-chart{min-height:230px}
  .sc{padding:14px;border-radius:18px}
  .sc-head{flex-wrap:wrap;gap:10px}
  .sc-logo{width:34px;height:34px}
  .sc-title{font-size:17px}
  .sc-clock{font-size:22px}
  .sc-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .sc-kpis .sc-kpi{grid-column:auto}
  .sc-kpis .sc-kpi.sc-hero{grid-column:1/-1}
  .sc-kpi .v{font-size:24px}
  .sc-kpi .sp{display:none}
  .sc-grid{grid-template-columns:minmax(0,1fr)}
  .sc-chart{height:230px}
  .sc-rank ol,.sc-feed ul{max-height:none}
}
@media (max-width:420px){.sc-time{display:none}}
@media (prefers-reduced-motion:reduce){.sc-sub i{animation:none}}