/* ============================================================
   AI组织适配度快测 V3.0 —— 样式表
   主色调：蓝白商务感；深色界面下保证文字可读
   ============================================================ */

:root {
  --blue-900: #0E2A4A;
  --blue-800: #143A66;
  --blue-700: #1B4C8C;
  --blue-600: #2563A8;
  --blue-500: #3B82C4;
  --blue-300: #8FB8DD;
  --blue-100: #E6EFF8;
  --blue-50:  #F4F8FC;

  --ink-900: #16202E;
  --ink-700: #37455A;
  --ink-500: #64748B;
  --ink-300: #9AA8BA;

  --red:     #D94A4A;
  --red-bg:  #FDEEEE;
  --green:   #2E9E6B;
  --teal:    #0FA9A0;
  --teal-bg: #E6F7F6;
  --gold:    #C8912B;
  --gold-bg: #FDF6E7;
  --purple:  #6D5AC7;

  --bg:      #EDF2F8;
  --card:    #FFFFFF;
  --line:    #DCE6F0;
  --shadow-sm: 0 1px 2px rgba(14,42,74,.06), 0 2px 8px rgba(14,42,74,.06);
  --shadow-md: 0 4px 12px rgba(14,42,74,.08), 0 12px 32px rgba(14,42,74,.08);
  --shadow-lg: 0 8px 24px rgba(14,42,74,.12), 0 24px 60px rgba(14,42,74,.14);
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", "Helvetica Neue", Arial, sans-serif;
  background: var(--bg);
  color: var(--ink-900);
  line-height: 1.65;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

.wrap { width: 100%; max-width: 720px; margin: 0 auto; padding: 0 20px; }

/* ---------------- 屏幕切换 ---------------- */
.screen { display: none; min-height: 100vh; }
.screen.active { display: block; animation: fadeUp .38s ease both; }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------------- 按钮 ---------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: none; border-radius: 999px; cursor: pointer;
  font-family: inherit; font-size: 16px; font-weight: 600;
  padding: 13px 26px; transition: all .18s ease; white-space: nowrap;
}
.btn-primary {
  background: linear-gradient(135deg, var(--blue-700), var(--blue-500));
  color: #fff; box-shadow: 0 4px 14px rgba(27,76,140,.28);
}
.btn-primary:hover:not(:disabled) { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(27,76,140,.36); }
.btn-primary:active:not(:disabled) { transform: translateY(0); }
.btn-primary:disabled { opacity: .38; cursor: not-allowed; box-shadow: none; }
.btn-lg { width: 100%; padding: 17px 26px; font-size: 17px; }
.btn-ghost {
  background: transparent; color: var(--ink-500); border: 1.5px solid var(--line);
  font-weight: 500;
}
.btn-ghost:hover:not(:disabled) { border-color: var(--blue-300); color: var(--blue-700); background: #fff; }
.btn-ghost:disabled { opacity: .35; cursor: not-allowed; }
.arrow { transition: transform .18s ease; }
.btn-primary:hover .arrow { transform: translateX(3px); }

.icon-btn {
  width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%;
  border: 1.5px solid var(--line); background: #fff; color: var(--ink-700);
  font-size: 18px; cursor: pointer; transition: all .18s ease;
  display: flex; align-items: center; justify-content: center;
}
.icon-btn:hover { border-color: var(--blue-300); color: var(--blue-700); }

/* ============================================================
   首页
   ============================================================ */
#screen-home { position: relative; }
.home-bg {
  position: absolute; inset: 0; z-index: 0; overflow: hidden;
  background:
    radial-gradient(1000px 520px at 50% -12%, #FFFFFF 0%, rgba(255,255,255,0) 62%),
    linear-gradient(178deg, #F7FAFD 0%, #E8F0F9 42%, #DFEAF6 100%);
}
.home-bg::after {
  content: ''; position: absolute; left: 50%; top: -160px;
  width: 620px; height: 620px; margin-left: -310px;
  background: radial-gradient(circle, rgba(59,130,196,.16), rgba(59,130,196,0) 68%);
}
.home-wrap {
  position: relative; z-index: 1;
  padding-top: 54px; padding-bottom: 56px;
  text-align: center; min-height: 100vh;
  display: flex; flex-direction: column;
}

.brand-line {
  display: inline-flex; align-items: center; gap: 8px;
  align-self: center;
  font-size: 12.5px; font-weight: 600; letter-spacing: .04em;
  color: var(--blue-700);
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(59,130,196,.22);
  padding: 7px 15px; border-radius: 999px;
  backdrop-filter: blur(6px);
}
.brand-dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--green);
  box-shadow: 0 0 0 3px rgba(46,158,107,.16);
  animation: pulse 2.4s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 3px rgba(46,158,107,.16); }
  50%     { box-shadow: 0 0 0 6px rgba(46,158,107,.06); }
}

.home-title {
  margin-top: 30px;
  font-size: clamp(27px, 6.6vw, 40px);
  line-height: 1.32; font-weight: 800; letter-spacing: -.01em;
  color: var(--blue-900);
}
.home-title em {
  font-style: normal; position: relative; white-space: nowrap;
  background: linear-gradient(100deg, var(--blue-700), var(--teal));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.home-title em::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -2px; height: 4px;
  background: linear-gradient(90deg, rgba(27,76,140,.20), rgba(15,169,160,.20));
  border-radius: 3px;
}

.home-sub {
  margin-top: 20px; font-size: 15px; line-height: 1.9; color: var(--ink-700);
}
.home-sub strong { color: var(--blue-700); font-weight: 700; }

.home-meta {
  margin: 32px auto 0; display: inline-flex; align-items: center; gap: 4px;
  background: rgba(255,255,255,.9); border: 1px solid rgba(59,130,196,.16);
  border-radius: var(--r-md); padding: 14px 10px;
  box-shadow: var(--shadow-sm); backdrop-filter: blur(8px);
}
.meta-item { display: flex; align-items: baseline; gap: 4px; padding: 0 18px; }
.meta-item b { font-size: 23px; font-weight: 800; color: var(--blue-700); letter-spacing: -.02em; }
.meta-item span { font-size: 12.5px; color: var(--ink-500); }
.meta-sep { width: 1px; height: 24px; background: var(--line); }

#btn-start { margin-top: 30px; }
.home-tip { margin-top: 14px; font-size: 12.5px; color: var(--ink-300); }

.home-covers { margin-top: 46px; text-align: left; }
.covers-title {
  font-size: 13px; font-weight: 700; color: var(--ink-500);
  letter-spacing: .04em; margin-bottom: 14px; text-align: center;
}
.covers-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.cover-chip {
  background: rgba(255,255,255,.86); border: 1px solid rgba(59,130,196,.14);
  border-radius: var(--r-sm); padding: 11px 6px; text-align: center;
  font-size: 11.5px; font-weight: 600; color: var(--blue-800);
  line-height: 1.4; transition: all .18s ease;
}
.cover-chip:hover { border-color: var(--blue-300); background: #fff; transform: translateY(-2px); }
.cover-chip small { display: block; font-weight: 500; font-size: 10px; color: var(--ink-300); margin-top: 2px; }

.home-foot { margin-top: 28px; font-size: 11.5px; color: var(--ink-300); }

/* ============================================================
   答题页
   ============================================================ */
#screen-quiz { display: none; flex-direction: column; background: #F2F6FA; }
#screen-quiz.active { display: flex; }

.quiz-header {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 14px;
  padding: 14px 20px 12px; background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px); border-bottom: 1px solid var(--line);
}
.progress-wrap { flex: 1; }
.progress-info {
  display: flex; justify-content: space-between;
  font-size: 12.5px; font-weight: 600; color: var(--ink-500); margin-bottom: 7px;
}
#progress-pct { color: var(--blue-700); }
.progress-bar { height: 6px; background: #E2EAF3; border-radius: 999px; overflow: hidden; }
.progress-fill {
  height: 100%; width: 0%; border-radius: 999px;
  background: linear-gradient(90deg, var(--blue-700), var(--blue-500), var(--teal));
  transition: width .34s cubic-bezier(.4,0,.2,1);
}

.quiz-main { flex: 1; padding-top: 24px; padding-bottom: 18px; }

.q-card {
  background: var(--card); border-radius: var(--r-lg);
  padding: 26px 22px 24px; box-shadow: var(--shadow-md);
  border: 1px solid var(--line);
}
.q-card.swap { animation: qSwap .3s ease both; }
@keyframes qSwap {
  from { opacity: 0; transform: translateX(14px); }
  to   { opacity: 1; transform: translateX(0); }
}

.q-tag { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.q-num {
  font-size: 11.5px; font-weight: 800; letter-spacing: .06em;
  color: #fff; background: var(--blue-700);
  padding: 3px 9px; border-radius: 5px;
}
.q-dim {
  font-size: 12px; font-weight: 600; color: var(--blue-700);
  background: var(--blue-100); padding: 3px 10px; border-radius: 999px;
}
.q-new {
  font-size: 10.5px; font-weight: 800; letter-spacing: .08em;
  color: #fff; background: linear-gradient(135deg, #E39A2B, #D9744A);
  padding: 3px 8px; border-radius: 5px;
}

.q-title {
  margin-top: 16px; font-size: clamp(18px, 4.6vw, 21px);
  line-height: 1.5; font-weight: 700; color: var(--blue-900);
}
.q-oh {
  margin-top: 9px; font-size: 12px; color: var(--ink-300);
  padding-left: 11px; border-left: 2.5px solid var(--blue-100);
  line-height: 1.55;
}

.options { margin-top: 22px; display: flex; flex-direction: column; gap: 10px; }
.option {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 15px 16px; border-radius: var(--r-md);
  border: 1.5px solid var(--line); background: #FBFCFE;
  cursor: pointer; transition: all .16s ease; text-align: left;
  font-family: inherit; font-size: 14.5px; line-height: 1.6; color: var(--ink-700);
  position: relative;
}
.option:hover { border-color: var(--blue-300); background: #fff; transform: translateX(2px); }
.option .opt-score {
  flex: 0 0 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12.5px; font-weight: 800; color: var(--ink-500);
  background: #EDF2F8; transition: all .16s ease; margin-top: 1px;
}
.option .opt-text { flex: 1; }

.option.selected {
  border-color: var(--blue-600); background: linear-gradient(100deg, #F2F8FE, #FFFFFF);
  box-shadow: 0 0 0 3px rgba(37,99,168,.10);
  color: var(--ink-900); font-weight: 500;
}
.option.selected .opt-score {
  background: var(--blue-700); color: #fff;
}
.option.selected::after {
  content: '✓'; position: absolute; right: 15px; top: 50%;
  transform: translateY(-50%);
  color: var(--blue-600); font-weight: 800; font-size: 14px;
}

.quiz-footer {
  position: sticky; bottom: 0; z-index: 20;
  display: flex; gap: 12px; padding: 14px 20px calc(14px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.95); backdrop-filter: blur(10px);
  border-top: 1px solid var(--line); max-width: 720px; margin: 0 auto; width: 100%;
}
.quiz-footer .btn { flex: 1; }
.quiz-footer .btn-ghost { flex: 0 0 104px; font-size: 15px; }

/* ---- ICP 备案（页面底部，管局要求） ---- */
.icp {
  padding: 18px 20px calc(16px + env(safe-area-inset-bottom));
  text-align: center; font-size: 11px; letter-spacing: .3px;
}
.icp a { color: #8a93a3; text-decoration: none; }
.icp a:hover { color: var(--blue-700, #378ADD); }

/* ============================================================
   报告页
   ============================================================ */
.report-wrap { padding-top: 26px; padding-bottom: 60px; }

.report-hero {
  background: linear-gradient(158deg, var(--blue-900) 0%, var(--blue-700) 52%, var(--blue-600) 100%);
  border-radius: var(--r-lg); padding: 30px 24px 26px; color: #fff;
  position: relative; overflow: hidden; box-shadow: var(--shadow-lg);
}
.report-hero::before {
  content: ''; position: absolute; right: -70px; top: -90px;
  width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.16), rgba(255,255,255,0) 70%);
}
.report-hero::after {
  content: ''; position: absolute; left: -50px; bottom: -110px;
  width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(15,169,160,.30), rgba(15,169,160,0) 70%);
}
.hero-inner { position: relative; z-index: 1; text-align: center; }
.hero-label {
  font-size: 11.5px; font-weight: 600; letter-spacing: .1em;
  color: rgba(255,255,255,.62); text-transform: uppercase;
}
.badge {
  margin: 16px auto 0; width: 118px; height: 118px; border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: rgba(255,255,255,.10); border: 2.5px solid rgba(255,255,255,.34);
  box-shadow: 0 0 0 8px rgba(255,255,255,.05), inset 0 0 24px rgba(255,255,255,.10);
  backdrop-filter: blur(4px);
}
.badge-code { font-size: 36px; font-weight: 800; letter-spacing: -.02em; line-height: 1; }
.badge-name { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.86); margin-top: 6px; }
.hero-levelname {
  margin-top: 18px; font-size: 22px; font-weight: 800; letter-spacing: .01em;
}
.hero-avg {
  margin-top: 8px; display: inline-flex; align-items: baseline; gap: 6px;
  font-size: 13px; color: rgba(255,255,255,.72);
}
.hero-avg b { font-size: 27px; font-weight: 800; color: #fff; letter-spacing: -.02em; }
.hero-summary {
  margin-top: 18px; font-size: 14.5px; line-height: 1.8;
  color: rgba(255,255,255,.94); padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.16);
  text-align: left;
}
.hero-summary strong { color: #FFE9A8; font-weight: 800; }

/* ---- 模块通用 ---- */
.module {
  background: var(--card); border-radius: var(--r-lg);
  padding: 24px 22px; margin-top: 16px;
  box-shadow: var(--shadow-sm); border: 1px solid var(--line);
}
.module-title {
  display: flex; align-items: center; gap: 9px;
  font-size: 16.5px; font-weight: 800; color: var(--blue-900);
  letter-spacing: -.005em;
}
.module-title .ico { font-size: 18px; line-height: 1; }
.module-sub { margin-top: 6px; font-size: 12.5px; color: var(--ink-300); line-height: 1.6; }
.module-body { margin-top: 18px; }

/* ---- 8维度图 ---- */
.chart-switch {
  display: inline-flex; gap: 3px; padding: 3px; border-radius: 999px;
  background: #EDF2F8; margin-top: 14px;
}
.chart-switch button {
  border: none; background: transparent; cursor: pointer;
  font-family: inherit; font-size: 12.5px; font-weight: 600; color: var(--ink-500);
  padding: 6px 16px; border-radius: 999px; transition: all .18s ease;
}
.chart-switch button.on { background: #fff; color: var(--blue-700); box-shadow: var(--shadow-sm); }

.chart-area { margin-top: 18px; }

/* 柱状图 */
.bars { display: flex; flex-direction: column; gap: 11px; }
.bar-row { display: flex; align-items: center; gap: 11px; }
.bar-name {
  flex: 0 0 108px; font-size: 12.5px; font-weight: 600; color: var(--ink-700);
  text-align: right; line-height: 1.35;
}
.bar-track {
  flex: 1; height: 22px; background: #EFF4F9; border-radius: 6px; overflow: hidden;
  position: relative;
}
.bar-fill {
  height: 100%; border-radius: 6px; width: 0;
  background: linear-gradient(90deg, var(--blue-600), var(--blue-400, #5B9BD5));
  transition: width .75s cubic-bezier(.3,0,.2,1);
}
.bar-row.weak .bar-fill { background: linear-gradient(90deg, #C93B3B, #E06666); }
.bar-row.weak .bar-name { color: var(--red); }
.bar-val {
  flex: 0 0 34px; font-size: 13px; font-weight: 800; color: var(--blue-700);
  font-variant-numeric: tabular-nums;
}
.bar-row.weak .bar-val { color: var(--red); }
.bar-row.weak .bar-val::after {
  content: '短板'; display: block; font-size: 9px; font-weight: 700;
  color: var(--red); letter-spacing: .04em; margin-top: -3px;
}

/* 雷达图 */
.radar-box { display: flex; justify-content: center; padding: 4px 0 0; }
.radar-box svg { width: 100%; max-width: 380px; height: auto; }

/* ---- 特有模式 ---- */
.pattern-card {
  display: flex; gap: 0; border-radius: var(--r-md); overflow: hidden;
  background: #FFFBF5; border: 1px solid #F3E2C8; margin-bottom: 11px;
}
.pattern-card:last-child { margin-bottom: 0; }
.pattern-bar { flex: 0 0 4px; background: linear-gradient(180deg, #E39A2B, #D9744A); }
.pattern-inner { padding: 14px 16px; flex: 1; }
.pattern-name {
  font-size: 14.5px; font-weight: 800; color: #A96518;
  display: flex; align-items: center; gap: 7px;
}
.pattern-name::before { content: '⚠'; font-size: 14px; }
.pattern-desc { margin-top: 7px; font-size: 13.5px; color: var(--ink-700); line-height: 1.68; }
.pattern-root {
  margin-top: 8px; font-size: 12.5px; color: #8A6A2E; line-height: 1.6;
  padding: 8px 11px; background: rgba(255,255,255,.66); border-radius: var(--r-sm);
}
.pattern-root b { color: #A96518; font-weight: 700; }

/* ---- 根因定位 ---- */
.root-head { font-size: 14.5px; line-height: 1.8; color: var(--ink-700); }
.root-head b { color: var(--blue-700); font-weight: 800; }
.root-list { margin-top: 16px; display: flex; flex-direction: column; gap: 9px; }
.root-item {
  display: flex; align-items: flex-start; gap: 11px;
  padding: 12px 14px; border-radius: var(--r-md);
  background: var(--blue-50); border-left: 3px solid var(--blue-500);
}
.root-score {
  flex: 0 0 auto; font-size: 12px; font-weight: 800; color: #fff;
  background: var(--blue-600); padding: 3px 9px; border-radius: 5px;
  font-variant-numeric: tabular-nums; margin-top: 1px;
}
.root-score.low { background: var(--red); }
.root-content { flex: 1; }
.root-dim { font-size: 13.5px; font-weight: 700; color: var(--blue-900); }
.root-dim span { color: var(--ink-500); font-weight: 500; }
.root-cause { margin-top: 3px; font-size: 12.5px; color: var(--ink-500); line-height: 1.6; }
.root-tail {
  margin-top: 18px; padding: 15px 16px; border-radius: var(--r-md);
  background: linear-gradient(100deg, #F3F8FE, #FFFFFF);
  border: 1px dashed var(--blue-300);
  font-size: 14px; font-weight: 600; color: var(--blue-800); line-height: 1.7;
}

/* ---- 前瞻信号 ---- */
.fs-card {
  border-radius: var(--r-md); padding: 15px 16px; margin-bottom: 11px;
  background: var(--teal-bg); border: 1px solid #BFE9E6;
  border-left: 3px solid var(--teal);
}
.fs-card:last-child { margin-bottom: 0; }
.fs-dim {
  font-size: 13px; font-weight: 800; color: #0B7B75;
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.fs-score {
  font-size: 11.5px; font-weight: 700; color: #fff; background: var(--teal);
  padding: 2px 8px; border-radius: 5px; font-variant-numeric: tabular-nums;
}
.fs-text { margin-top: 8px; font-size: 13.5px; color: #2A5E5B; line-height: 1.75; }

/* ---- 政策红利 ---- */
.policy-card {
  border-radius: var(--r-md); padding: 15px 16px; margin-bottom: 11px;
  background: #F4FAFE; border: 1px solid #CFE6F5;
  border-left: 3px solid var(--blue-500, #45B7D1);
}
.policy-card:last-child { margin-bottom: 0; }
.policy-name {
  font-size: 14px; font-weight: 800; color: var(--blue-800);
  display: flex; align-items: center; gap: 7px;
}
.policy-name::before { content: '🏛'; font-size: 13px; }
.policy-desc { margin-top: 7px; font-size: 13px; color: var(--ink-700); line-height: 1.72; }
.policy-note { margin-top: 14px; font-size: 11.5px; color: var(--ink-300); text-align: center; }

/* ---- 转化入口 ---- */
.cta {
  margin-top: 16px; border-radius: var(--r-lg); padding: 28px 24px;
  background: linear-gradient(150deg, var(--blue-900), var(--blue-700));
  color: #fff; text-align: center; box-shadow: var(--shadow-md);
  position: relative; overflow: hidden;
}

/* ============================================================
   报告页双栏布局
   桌面（≥1024px）：左侧粘性画像（等级/分数/总结+操作），
   右侧滚动看五个分析模块；移动端保持单列
   ============================================================ */
/* 注意：用双类选择器提高优先级，避免被后面 .report-actions 的 display:flex 按源顺序覆盖 */
.report-actions.side-actions { display: none; }

@media (min-width: 1024px) {
  .report-wrap { max-width: 1180px; padding-top: 30px; }
  .report-layout {
    display: grid;
    grid-template-columns: 400px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
  }
  .report-side {
    position: sticky; top: 20px; z-index: 5;
  }
  .report-side .report-hero { margin-top: 0; }
  .report-actions.side-actions { display: flex; }
  .report-actions.main-actions { display: none; }
  .report-main .module:first-child { margin-top: 0; }
  .report-main .cta { margin-top: 18px; }
}
.cta::before {
  content: ''; position: absolute; left: -60px; top: -80px;
  width: 200px; height: 200px; border-radius: 50%;
  background: radial-gradient(circle, rgba(15,169,160,.34), rgba(15,169,160,0) 70%);
}
.cta h3 { position: relative; font-size: 19px; font-weight: 800; line-height: 1.5; }
.cta p {
  position: relative; margin-top: 10px; font-size: 13.5px;
  color: rgba(255,255,255,.80); line-height: 1.75;
}
.cta-btn {
  position: relative; margin-top: 20px; width: 100%;
  background: #fff; color: var(--blue-700); border: none;
  border-radius: 999px; padding: 15px; font-family: inherit;
  font-size: 15.5px; font-weight: 800; cursor: pointer;
  transition: all .18s ease; box-shadow: 0 4px 16px rgba(0,0,0,.16);
}
.cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.22); }

.report-actions {
  margin-top: 16px; display: flex; gap: 10px; flex-wrap: wrap;
}
.report-actions .btn { flex: 1; min-width: 140px; font-size: 14.5px; padding: 13px 18px; }

.toast {
  position: fixed; left: 50%; bottom: 40px; transform: translate(-50%, 20px);
  background: var(--blue-900); color: #fff; font-size: 13.5px; font-weight: 600;
  padding: 11px 22px; border-radius: 999px; box-shadow: var(--shadow-md);
  opacity: 0; pointer-events: none; transition: all .28s ease; z-index: 999;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---- 加载 ---- */
.loading {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(237,242,248,.92); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
}
/* 关键：显式让 hidden 属性赢过上面的 display:flex，否则遮罩永远显示 */
.loading[hidden] { display: none; }
.loading-inner { text-align: center; }
.spinner {
  width: 42px; height: 42px; margin: 0 auto 16px;
  border: 3.5px solid var(--blue-100); border-top-color: var(--blue-700);
  border-radius: 50%; animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
.loading-inner p { font-size: 14px; font-weight: 600; color: var(--blue-700); }

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 560px) {
  .covers-grid { grid-template-columns: repeat(2, 1fr); }
  .meta-item { padding: 0 13px; }
  .bar-name { flex: 0 0 82px; font-size: 11.5px; }
  .bar-val { flex: 0 0 28px; font-size: 12px; }
  .module { padding: 20px 17px; }
  .report-hero { padding: 26px 19px 22px; }
  .badge { width: 102px; height: 102px; }
  .badge-code { font-size: 31px; }
  .q-card { padding: 22px 17px 20px; }
  .option { padding: 13px 14px; font-size: 14px; }
  .quiz-footer .btn-ghost { flex: 0 0 88px; }
}

@media (min-width: 561px) {
  .home-wrap { padding-top: 74px; }
}

/* 打印 */
@media print {
  .report-actions, .cta-btn, .quiz-footer, .quiz-header { display: none !important; }
  body { background: #fff; }
  .module, .report-hero, .cta { box-shadow: none; border: 1px solid #ddd; page-break-inside: avoid; }
}