/* =============================================================
   智护外科·赋能健康 —— 大屏 & 评委端 公共样式
   主题色由页面 :root 内联变量注入（--brand / --accent）
   ============================================================= */
:root{
    --brand:#0f8a6a;
    --brand-d:#0a5f49;
    --brand-l:#3fae8e;
    --accent:#c9a227;
    --accent-l:#e7c65a;
    --ink:#14312a;
    --paper:#ffffff;
    --radius:20px;
}
*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body{ margin:0; padding:0; }
body{
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }

/* ---------- 背景 ---------- */
.stage{
    position:fixed; inset:0; overflow:hidden;
    background:
        radial-gradient(1200px 700px at 15% -10%, color-mix(in srgb, var(--brand-l) 55%, transparent), transparent 60%),
        radial-gradient(1000px 600px at 100% 110%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 55%),
        linear-gradient(160deg, var(--brand) 0%, var(--brand-d) 60%, #06392c 100%);
    color:#fff;
}
.stage::before{
    /* 细腻网格 + 医疗十字纹理 */
    content:""; position:absolute; inset:0; opacity:.10; pointer-events:none;
    background-image:
        linear-gradient(rgba(255,255,255,.5) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.5) 1px, transparent 1px);
    background-size:46px 46px;
    -webkit-mask-image:radial-gradient(circle at 50% 40%, #000 0%, transparent 78%);
            mask-image:radial-gradient(circle at 50% 40%, #000 0%, transparent 78%);
}
.stage::after{
    /* 底部律动心电线（装饰） */
    content:""; position:absolute; left:0; right:0; bottom:0; height:120px; opacity:.22;
    background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='120' viewBox='0 0 1200 120'><path d='M0 70 H360 l18 -46 20 92 22 -70 24 34 H700 l16 -30 18 60 20 -30 H1200' fill='none' stroke='white' stroke-width='3'/></svg>") repeat-x center;
    background-size:1200px 120px;
}

/* ============================= 大屏 ============================= */
.screen{ position:relative; z-index:2; height:100vh; display:flex; flex-direction:column; }
.screen-top{
    display:flex; align-items:center; gap:18px; padding:26px 46px;
}
.brand-logo{ height:64px; width:auto; border-radius:12px; background:rgba(255,255,255,.12); padding:6px; }
.brand-badge{
    height:64px; width:64px; border-radius:16px; display:flex; align-items:center; justify-content:center;
    background:linear-gradient(135deg, var(--accent), var(--accent-l)); color:#4a3a00; flex:none;
    font-weight:900; font-size:30px; box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.brand-text .t1{ font-size:30px; font-weight:800; letter-spacing:2px; }
.brand-text .t2{ font-size:15px; opacity:.82; letter-spacing:3px; margin-top:3px; }
.screen-meta{ margin-left:auto; text-align:right; font-size:15px; opacity:.85; line-height:1.7; }
.screen-meta .chip{ display:inline-block; background:rgba(255,255,255,.14); padding:5px 14px; border-radius:999px; margin-left:8px; }

.screen-body{ flex:1; display:flex; align-items:center; justify-content:center; padding:10px 46px 30px; min-height:0; }
.screen-foot{ text-align:center; padding:14px; font-size:14px; opacity:.7; letter-spacing:2px; }

/* 场景切换动画 */
.scene{ width:100%; max-width:1500px; animation:sceneIn .6s cubic-bezier(.2,.8,.2,1) both; }
@keyframes sceneIn{ from{ opacity:0; transform:translateY(26px) scale(.98);} to{opacity:1; transform:none;} }

/* --- 欢迎场景 --- */
.welcome{ text-align:center; }
.welcome .big{
    font-size:clamp(40px,7vw,104px); font-weight:900; letter-spacing:4px; line-height:1.1;
    text-shadow:0 10px 40px rgba(0,0,0,.35);
    background:linear-gradient(180deg,#fff, #d9f3e9); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.welcome .sub{ font-size:clamp(18px,2.4vw,34px); margin-top:18px; letter-spacing:6px; color:var(--accent-l); font-weight:700; }
.welcome .desc{ margin-top:30px; font-size:clamp(15px,1.5vw,22px); opacity:.9; }
.welcome .org{ margin-top:40px; font-size:clamp(14px,1.4vw,20px); opacity:.8; letter-spacing:2px; }
.welcome .deco-line{ width:120px; height:4px; margin:34px auto; border-radius:4px;
    background:linear-gradient(90deg, transparent, var(--accent), transparent); }

/* --- 打分场景 --- */
.scoring-grid{ display:grid; grid-template-columns:1.35fr 1fr; gap:34px; align-items:stretch; }
.card-glass{
    background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.18);
    border-radius:var(--radius); backdrop-filter:blur(6px);
    box-shadow:0 24px 60px rgba(0,0,0,.28); padding:38px 42px;
}
.contestant-no{ display:inline-flex; align-items:center; gap:12px; font-size:20px; letter-spacing:2px; opacity:.9; }
.contestant-no b{
    font-size:26px; background:linear-gradient(135deg,var(--accent),var(--accent-l)); color:#4a3a00;
    width:auto; padding:2px 16px; border-radius:999px; font-weight:900;
}
.contestant-title{ font-size:clamp(30px,3.6vw,58px); font-weight:900; line-height:1.18; margin:22px 0 26px; }
.contestant-info{ display:flex; gap:14px; flex-wrap:wrap; font-size:clamp(16px,1.6vw,24px); }
.contestant-info span{ background:rgba(255,255,255,.12); padding:9px 20px; border-radius:12px; }
.contestant-info .ico{ color:var(--accent-l); margin-right:8px; }

.judge-panel h3{ margin:0 0 20px; font-size:20px; letter-spacing:2px; opacity:.9; font-weight:700; display:flex; align-items:center; }
.judge-panel h3 .count{ margin-left:auto; color:var(--accent-l); font-weight:900; font-size:24px; }
.judge-dots{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:14px; }
.jdot{
    display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:14px;
    background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);
    transition:.4s; font-size:17px;
}
.jdot .dot{ width:12px; height:12px; border-radius:50%; background:rgba(255,255,255,.35); flex:none; transition:.4s; }
.jdot.on{ background:rgba(201,162,39,.22); border-color:var(--accent); }
.jdot.on .dot{ background:var(--accent-l); box-shadow:0 0 12px var(--accent-l); }
.jdot .nm{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jdot .ok{ margin-left:auto; color:var(--accent-l); opacity:0; transition:.4s; }
.jdot.on .ok{ opacity:1; }
.scoring-status{ margin-top:26px; text-align:center; font-size:20px; letter-spacing:3px; }
.pulse{ display:inline-block; width:10px; height:10px; border-radius:50%; background:var(--accent-l); margin-right:10px;
    animation:pulse 1.2s infinite; }
@keyframes pulse{ 0%,100%{ transform:scale(1); opacity:1;} 50%{ transform:scale(1.7); opacity:.4;} }

/* --- 揭晓场景 --- */
.reveal{ text-align:center; }
.reveal .label{ font-size:clamp(18px,2vw,30px); letter-spacing:8px; opacity:.85; }
.reveal .rtitle{ font-size:clamp(24px,2.8vw,44px); font-weight:800; margin:14px 0 6px; }
.reveal .rmeta{ opacity:.8; font-size:clamp(15px,1.4vw,20px); margin-bottom:14px; }
.score-huge{
    font-size:clamp(90px,18vw,240px); font-weight:900; line-height:1;
    background:linear-gradient(180deg,#fff,var(--accent-l)); -webkit-background-clip:text; background-clip:text; color:transparent;
    text-shadow:0 20px 60px rgba(0,0,0,.3); letter-spacing:2px;
}
.score-huge .unit{ font-size:.28em; -webkit-text-fill-color:var(--accent-l); margin-left:12px; letter-spacing:0; }
.reveal .note{ margin-top:10px; font-size:clamp(14px,1.3vw,19px); opacity:.8; }
.reveal .judge-scores{ margin-top:30px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.reveal .js{ background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16); border-radius:12px;
    padding:10px 16px; font-size:clamp(14px,1.3vw,18px); }
.reveal .js b{ color:var(--accent-l); font-size:1.2em; margin-left:8px; }
.reveal .js.drop{ opacity:.45; text-decoration:line-through; }

/* --- 排行榜场景 --- */
.rank-wrap{ width:100%; }
.rank-head{ text-align:center; margin-bottom:26px; }
.rank-head .rt{ font-size:clamp(30px,4vw,60px); font-weight:900; letter-spacing:4px; }
.rank-head .rt .k{ color:var(--accent-l); }
.podium{ display:grid; grid-template-columns:1fr 1.2fr 1fr; gap:20px; align-items:end; max-width:1100px; margin:0 auto 30px; }
.pod{ background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:18px; padding:22px; text-align:center; }
.pod .medal{ font-size:44px; }
.pod .pno{ font-size:15px; opacity:.75; margin-top:6px; }
.pod .pname{ font-size:clamp(17px,1.6vw,24px); font-weight:800; margin:8px 0 4px; line-height:1.3; }
.pod .punit{ font-size:13px; opacity:.7; }
.pod .pscore{ font-size:clamp(26px,2.6vw,40px); font-weight:900; color:var(--accent-l); margin-top:10px; }
.pod.p1{ transform:translateY(-16px); background:linear-gradient(180deg, rgba(201,162,39,.28), rgba(255,255,255,.08)); border-color:var(--accent); }
.rank-table{ width:100%; max-width:1200px; margin:0 auto; border-collapse:collapse; font-size:clamp(14px,1.35vw,20px); }
.rank-table th,.rank-table td{ padding:12px 16px; text-align:left; }
.rank-table thead th{ opacity:.7; font-weight:600; border-bottom:1px solid rgba(255,255,255,.2); letter-spacing:1px; }
.rank-table tbody tr{ background:rgba(255,255,255,.06); }
.rank-table tbody tr td:first-child{ border-radius:12px 0 0 12px; }
.rank-table tbody tr td:last-child{ border-radius:0 12px 12px 0; }
.rank-table .r-rank{ font-weight:900; width:70px; }
.rank-table .r-score{ font-weight:900; color:var(--accent-l); text-align:right; }
.award-tag{ display:inline-block; padding:3px 12px; border-radius:999px; font-size:.82em; font-weight:700; }
.award-一等奖{ background:linear-gradient(135deg,#c9a227,#e7c65a); color:#4a3a00; }
.award-二等奖{ background:rgba(210,215,220,.9); color:#33383d; }
.award-三等奖{ background:rgba(205,127,50,.85); color:#3a1f06; }
.award-优秀奖{ background:rgba(255,255,255,.16); color:#fff; }

.rank-scroll{ max-height:52vh; overflow:hidden; }

/* QR 悬浮（大屏欢迎页可选） */
.join-qr{ position:fixed; right:34px; bottom:34px; z-index:5; background:#fff; border-radius:16px; padding:14px;
    text-align:center; color:#14312a; box-shadow:0 16px 40px rgba(0,0,0,.3); }
.join-qr .qc{ width:150px; height:150px; }
.join-qr .qt{ font-size:13px; margin-top:8px; font-weight:700; }

/* 空数据提示 */
.empty-hint{ text-align:center; opacity:.75; font-size:20px; }