/* ===== Scene 10 · Certification Hall · 证明之殿 =====
   认证不是发证书，而是证明能力。
   能力之镜 + 认证路径 + 四重证明 + 能力雷达 + 毕业仪式
   Visual Language v1.0: Less UI More Space */

* { margin:0; padding:0; box-sizing:border-box; }
:root{
  --bg:#05070A; --panel:#10131A; --panel2:#171B24;
  --gold:#FFD45A; --gold2:#FFF0A6; --gold-deep:#B87816;
  --text:#FFF6E3; --muted:#C9B98E; --dim:#7F7255;
  --green:#5a9a5a; --line:rgba(255,212,90,0.35);
  --bronze:#cd7f32; --silver:#c0c0c0; --platinum:#e5e4e2;
  --font-lishu:"华文隶书","STLiti","LiSu","Source Han Serif SC","SimSun",serif;
  --font-songti:"Noto Serif SC","Source Han Serif SC","SimSun",serif;
}
body{background:var(--bg);color:var(--text);font-family:var(--font-songti);font-size:18px;line-height:2;overflow-x:hidden;}
.bg-glow{position:fixed;top:0;left:50%;width:80vw;height:60vh;transform:translateX(-50%);background:radial-gradient(ellipse at 50% 40%,rgba(255,212,90,0.15),transparent 60%);pointer-events:none;z-index:0;}
.bg-vignette{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 50%,rgba(0,0,0,0.55) 100%);}
.hall{max-width:820px;margin:0 auto;padding:0 24px 80px;position:relative;z-index:1;}

/* ===== ① 能力之镜 ===== */
.mirror{min-height:85vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px;}
.eyebrow{font-size:clamp(13px,1.8vw,16px);color:var(--gold);letter-spacing:.2em;font-weight:bold;margin-bottom:28px;font-family:var(--font-lishu);}
.mirror h1{font-family:var(--font-lishu);font-size:clamp(44px,7vw,80px);font-weight:400;letter-spacing:.14em;color:var(--gold2);text-shadow:0 0 18px rgba(255,212,90,.38);}
.head-line{width:220px;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:28px auto;}
.creed{font-size:clamp(16px,2.6vw,22px);color:var(--text);letter-spacing:4px;font-weight:300;margin-bottom:56px;}

/* 成长阶段总览 */
.levels-overview{width:100%;max-width:480px;display:flex;flex-direction:column;gap:20px;}
.lv-overview{display:flex;align-items:center;gap:14px;padding:16px 20px;border:1px solid var(--line);border-radius:4px;background:rgba(255,255,255,.02);}
.lv-done{border-color:rgba(90,154,90,.3);background:rgba(90,154,90,.04);}
.lv-active{border-color:var(--gold);box-shadow:0 0 16px rgba(255,212,90,.08);}
.lv-locked{opacity:0.4;}
.lv-num{font-size:22px;font-weight:bold;letter-spacing:2px;font-family:'JetBrains Mono',monospace;color:var(--gold);min-width:36px;text-align:center;}
.lv-done .lv-num{color:var(--green);}
.lv-name{font-size:18px;color:var(--text);letter-spacing:3px;font-family:var(--font-lishu);min-width:56px;}
.lv-bar{flex:1;height:10px;background:#232733;border-radius:5px;overflow:hidden;}
.lv-fill{height:100%;transition:width 1s ease;border-radius:5px;}
.lv-pct{font-size:15px;color:var(--gold2);font-weight:bold;font-family:'JetBrains Mono',monospace;min-width:40px;text-align:right;}
.lv-done .lv-pct{color:var(--green);}

/* ===== ② 认证路径 ===== */
.cert-road{padding:40px 0;}

.cert-card{margin-bottom:36px;padding:40px 36px;background:linear-gradient(145deg,var(--panel2),#080A0F);border:1px solid rgba(255,212,90,.15);border-radius:4px;transition:all .4s;}
.cert-completed{border-color:rgba(90,154,90,.3);background:linear-gradient(145deg,rgba(90,154,90,.04),#080A0F);}
.cert-unlocked{border-color:rgba(255,212,90,.35);box-shadow:0 0 20px rgba(255,212,90,.06);}
.cert-locked{opacity:0.4;}

.cc-header{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:36px;padding-bottom:24px;border-bottom:1px solid rgba(255,212,90,.1);}
.cc-level{font-size:20px;font-weight:bold;letter-spacing:3px;font-family:'JetBrains Mono',monospace;padding:6px 16px;border:1px solid;border-radius:2px;}
.cc-name{font-family:var(--font-lishu);font-size:28px;color:var(--gold2);letter-spacing:4px;}
.cc-desc{font-size:15px;color:var(--muted);letter-spacing:1px;margin-left:auto;}
.cc-badge-icon{font-size:16px;color:var(--green);letter-spacing:2px;font-weight:bold;}
.cc-progress-mini{font-size:16px;color:var(--gold);font-weight:bold;font-family:'JetBrains Mono',monospace;}
.cc-locked{font-size:15px;color:var(--dim);letter-spacing:1px;}

/* 四重证明 */
.cc-requirements{margin-top:32px;}
.cc-section-label{display:block;font-size:14px;color:var(--gold-deep);letter-spacing:.14em;font-weight:bold;margin-bottom:20px;font-family:'JetBrains Mono',monospace;}
.req-item{display:flex;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.05);}
.req-item:last-child{border-bottom:none;}
.req-check{font-size:20px;color:var(--dim);min-width:24px;}
.req-item.done .req-check{color:var(--green);}
.req-content{display:flex;flex-direction:column;gap:4px;}
.req-label{font-size:17px;color:var(--text);letter-spacing:1px;}
.req-detail{font-size:14px;color:var(--muted);}
.req-item.done .req-label{color:var(--green);}

/* 能力雷达 */
.cc-radar{margin-top:36px;}
.radar-row{display:flex;align-items:center;gap:14px;padding:10px 0;}
.radar-label{font-size:16px;color:var(--text);letter-spacing:2px;font-family:var(--font-lishu);min-width:80px;}
.radar-bar{flex:1;height:12px;background:#232733;border-radius:6px;overflow:hidden;}
.radar-fill{height:100%;background:linear-gradient(90deg,var(--gold-deep),var(--gold),var(--gold2));box-shadow:0 0 12px rgba(255,212,90,.25);transition:width 1s ease;border-radius:6px;}
.radar-val{font-size:15px;color:var(--gold2);font-weight:bold;font-family:'JetBrains Mono',monospace;min-width:40px;text-align:right;}

/* 徽章 */
.cc-badge-section{margin-top:36px;}
.cc-badge-display{display:inline-block;padding:12px 32px;border:2px solid;font-size:18px;letter-spacing:4px;font-family:'JetBrains Mono',monospace;font-weight:bold;border-radius:4px;background:rgba(255,255,255,.03);}

/* Connector */
.cert-connector{text-align:center;font-size:20px;color:var(--gold-deep);padding:8px 0;}

/* ===== ③ 毕业仪式 ===== */
.ceremony{margin-top:56px;padding:72px 40px;text-align:center;background:linear-gradient(145deg,rgba(205,127,50,.06),rgba(255,212,90,.04));border:1px solid rgba(205,127,50,.3);border-radius:8px;position:relative;overflow:hidden;}
.cer-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:280px;height:280px;border-radius:50%;background:radial-gradient(circle,rgba(205,127,50,.15),transparent 60%);pointer-events:none;}
.cer-label{color:var(--bronze);font-size:15px;letter-spacing:.18em;font-weight:bold;font-family:'JetBrains Mono',monospace;margin-bottom:24px;position:relative;}
.cer-title{font-family:var(--font-lishu);font-size:clamp(40px,6vw,64px);font-weight:400;color:var(--gold2);letter-spacing:.14em;text-shadow:0 0 24px rgba(255,212,90,.3);position:relative;}
.cer-line{width:160px;height:2px;background:linear-gradient(90deg,transparent,var(--bronze),transparent);margin:32px auto;position:relative;}
.cer-level{font-size:clamp(18px,2.6vw,24px);color:var(--text);letter-spacing:4px;font-family:var(--font-lishu);margin-bottom:36px;position:relative;}
.cer-badge{display:inline-block;padding:14px 36px;border:2px solid var(--bronze);background:rgba(205,127,50,.08);color:var(--bronze);font-size:20px;letter-spacing:4px;font-family:'JetBrains Mono',monospace;font-weight:bold;border-radius:4px;margin-bottom:36px;position:relative;box-shadow:0 0 24px rgba(205,127,50,.2);}
.cer-next{font-size:17px;color:var(--gold);letter-spacing:4px;font-weight:300;position:relative;}

/* Roadmap */
.roadmap{text-align:center;padding:56px 24px;border-top:1px solid var(--line);margin-top:56px;}
.roadmap-flow{display:flex;align-items:center;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:24px;}
.rf-node{padding:8px 18px;border:1px solid var(--line);color:var(--muted);font-size:14px;letter-spacing:3px;border-radius:2px;font-family:var(--font-lishu);text-decoration:none;transition:all .3s;}
.rf-node:hover{border-color:var(--gold);}
.rf-current{border-color:var(--gold);color:#05070A;background:linear-gradient(180deg,var(--gold2),var(--gold));font-weight:bold;}
.rf-future{opacity:0.4;}
.rf-arrow{color:var(--gold-deep);font-size:14px;}
.roadmap-text{color:var(--gold2);font-size:clamp(16px,2.4vw,20px);letter-spacing:4px;font-weight:300;}
.foot-link{color:var(--gold2);text-decoration:none;border-bottom:1px solid var(--line);font-size:14px;letter-spacing:2px;}
.foot-sep{color:var(--dim);margin:0 10px;}

@media(max-width:600px){
  .hall{padding:0 16px 60px;}
  .mirror h1{letter-spacing:.06em;}
  .cert-card{padding:28px 20px;}
  .cc-desc{margin-left:0;width:100%;}
  .levels-overview{max-width:100%;}
}
