:root{
  --ink:#26221c;
  --ink-soft:#6d6355;
  --line:#e3d9c6;
  --paper:#fbf7ef;
  --card:#ffffff;
  --amber:#b45309;
  --amber-soft:#fff4e2;
  --green:#15803d;
  --red:#b91c1c;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
[hidden]{display:none !important}
body{
  background:
    radial-gradient(1200px 400px at 50% -200px, #fff6e6 0%, rgba(255,246,230,0) 70%),
    var(--paper);
  color:var(--ink);
  font-family:"Songti SC","Noto Serif SC","Source Han Serif SC",STSong,"Times New Roman",serif;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1080px;margin:0 auto;padding:0 18px 120px}

/* ---------- 顶栏 ---------- */
.topbar{
  position:sticky;top:0;z-index:20;
  backdrop-filter:blur(10px);
  background:rgba(251,247,239,.88);
  border-bottom:1px solid var(--line);
}
.topbar-in{
  max-width:1080px;margin:0 auto;padding:10px 18px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.brand{
  display:flex;align-items:center;gap:14px;
  font-size:1.12rem;font-weight:700;letter-spacing:.04em;
}
.crossover-logo{display:block;width:150px;height:auto;flex-shrink:0}
.brand .sub{
  font-size:.72rem;font-weight:400;color:var(--ink-soft);
  letter-spacing:.12em;
}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
button{
  font-family:inherit;font-size:.86rem;cursor:pointer;
  border-radius:999px;padding:7px 16px;transition:.15s;
}
.ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.ghost:hover{border-color:var(--amber);color:var(--amber)}
.primary{
  background:linear-gradient(180deg,#c2600f,#a54b06);
  border:1px solid #8f4104;color:#fff;font-weight:700;letter-spacing:.06em;
  padding:9px 34px;box-shadow:0 2px 10px rgba(164,75,6,.25);
}
.primary:hover{filter:brightness(1.06)}
.primary:disabled{opacity:.45;cursor:default;filter:none;box-shadow:none}

/* ---------- 欢迎页 ---------- */
.hero{
  margin:34px 0 0;padding:34px 30px 30px;border-radius:18px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:0 10px 30px rgba(120,95,55,.09);
}
.hero .eyebrow{
  font-size:.76rem;letter-spacing:.18em;color:var(--amber);
  text-transform:uppercase;margin-bottom:12px;
}
.hero h1{margin:0 0 14px;font-size:2rem;letter-spacing:.02em;line-height:1.35}
.hero h1 em{font-style:normal;color:var(--amber)}
/* 活动说明：英文介绍 + 中文说明，两段都当正文看待 */
.hero .intro{
  font-size:1.06rem;line-height:1.95;color:var(--ink);margin:0 0 14px;max-width:62ch;
}
.hero .rules{
  font-size:1rem;line-height:2;color:var(--ink);margin:0 0 26px;max-width:62ch;
}
/* 题数、通过线这几个数字跟着 config.yaml 变，标成重点色，站台前一眼能看到 */
.hero .rules strong{color:var(--amber);font-weight:700;padding:0 .1em}
.hero .go{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.hero .note{font-size:.78rem;letter-spacing:.16em;color:#a89b86;margin-top:22px}
.notice{
  margin-top:18px;padding:12px 14px;border-radius:10px;font-size:.9rem;line-height:1.75;
  background:#fdf7ea;border:1px solid #f0e3c8;border-left:4px solid var(--amber);
}

/* ---------- 记分板 ---------- */
.scoreboard{
  margin:22px 0 6px;padding:20px 24px;border-radius:16px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:0 8px 26px rgba(120,95,55,.09);
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
}
.score-main{font-size:1.9rem;font-weight:700;letter-spacing:.03em}
.score-main b{font-size:2.6rem;margin:0 4px}
.verdict{font-size:1.12rem;font-weight:700;padding:6px 16px;border-radius:999px}
.verdict.pass{color:var(--green);background:#eafaef;border:1px solid #bde8c9}
.verdict.fail{color:var(--red);background:#fdeeee;border:1px solid #f3c9c9}
.score-note{margin-left:auto;color:var(--ink-soft);font-size:.86rem}

/* ---------- 题卡 ---------- */
.q{
  margin:20px 0;padding:18px 22px 20px;border-radius:16px;
  background:var(--card);border:1px solid var(--line);
  box-shadow:0 6px 20px rgba(120,95,55,.07);
}
.q.right{border-left:5px solid #35a35b}
.q.wrong{border-left:5px solid #d25555}
.q-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.q-no{
  font-size:.82rem;font-weight:700;letter-spacing:.1em;
  color:var(--amber);background:var(--amber-soft);
  border:1px solid #f2ddb9;border-radius:999px;padding:3px 12px;
}
.q-badge{font-size:.86rem;font-weight:700;letter-spacing:.04em}
.q-badge:empty{display:none}
.q.right .q-badge{color:var(--green)}
.q.wrong .q-badge{color:var(--red)}
.q-hint{font-size:.82rem;color:var(--ink-soft);margin-left:auto;display:none}
body.hints .q-hint{display:block}

pre.code{
  margin:0 0 16px;padding:14px 16px;border-radius:11px;
  background:#12161f;color:#dde5f2;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Courier New",monospace;
  font-size:13.5px;line-height:1.62;
  overflow-x:auto;white-space:pre;tab-size:4;
}

/* ---------- 填空 ---------- */
.blanks{line-height:2.9;font-size:1.02rem}
.punct{color:#9a8f7c;margin:0 .12em;user-select:none}
.punct.ell{letter-spacing:.14em}
input.blank{
  display:inline-block;vertical-align:bottom;
  font-family:inherit;font-size:1.1rem;text-align:center;
  color:var(--ink);
  background:transparent;
  border:0;border-bottom:2px solid #cbbb9b;border-radius:3px 3px 0 0;
  padding:1px .3em 3px;margin:0 .06em;
  transition:border-color .15s, background .15s;
}
input.blank:hover{border-bottom-color:var(--amber)}
input.blank:focus{
  outline:none;border-bottom-color:var(--amber);
  background:#fffaf0;box-shadow:0 2px 0 0 rgba(180,83,9,.18);
}
input.blank.ok{border-bottom-color:#35a35b;background:#f2fbf5;color:var(--green)}
input.blank.bad{border-bottom-color:#d25555;background:#fdf3f3;color:var(--red)}
input.blank:read-only{cursor:default}

.q-answer{
  margin-top:16px;padding:12px 14px;border-radius:10px;
  background:#fdf7ea;border:1px solid #f0e3c8;border-left:4px solid var(--amber);
  font-size:.98rem;line-height:1.8;
}
.q-answer .lbl{color:var(--amber);font-weight:700;margin-right:6px}
.q-answer .src{color:var(--ink-soft);font-size:.88rem;margin-left:8px}

/* ---------- 底栏 ---------- */
.bottombar{
  position:fixed;left:0;right:0;bottom:0;z-index:20;
  background:rgba(251,247,239,.94);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
}
.bottombar-in{
  max-width:1080px;margin:0 auto;padding:12px 18px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.tip{font-size:.84rem;color:var(--ink-soft)}
.actions{margin-left:auto;display:flex;gap:10px}

/* ---------- 屏幕切换 ---------- */
body.state-home .topbar-right,
body.state-home .bottombar{display:none}

@media (max-width:900px){
  .crossover-logo{width:120px}
}
@media (max-width:640px){
  .crossover-logo{width:96px}
  .brand{gap:10px}
  .brand .sub{font-size:.66rem}
  .hero{padding:24px 18px}
  .hero h1{font-size:1.5rem}
  .hero .intro{font-size:1rem}
  .score-main{font-size:1.4rem}
  .score-main b{font-size:2rem}
  .q{padding:14px 14px 16px}
  .q-hint{margin-left:0;width:100%}
  .actions{width:100%}
  .primary{flex:1}
  .score-note{margin-left:0;width:100%}
  .tip{display:none}
}
@media print{
  .topbar,.bottombar{position:static}
  .actions,.topbar-right{display:none}
  body{background:#fff}
  .q{break-inside:avoid}
}