/* ═══════════════════════════════════════════════════════════
   tokens.css — 历史课堂云 · 设计变量与纸面基底
   视觉基准：历史课堂主页设计 / V14-中央椭圆极繁彩铅版
   ═══════════════════════════════════════════════════════════ */

@font-face{font-family:"History Serif";src:url("../fonts/NotoSerifSC-VF.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"History Display";src:url("../fonts/SmileySans-Oblique.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"History Marker";src:url("../fonts/LXGWMarkerGothic-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"History MaShan";src:url("../fonts/MaShanZheng-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"History LongCang";src:url("../fonts/LongCang-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}

:root{
  /* ── 色 ── 与 V14 完全一致 */
  --cream:#f8f1df;      /* 页面底 */
  --paper:#fff9ea;      /* 纸片 / 卡片 */
  --ink:#263a54;        /* 墨蓝，正文与描边 */
  --muted:#746b60;      /* 次要文字 */
  --blue:#315f9f;       /* 群青 */
  --yellow:#f0c84d;     /* 姜黄 */
  --red:#d94d3d;        /* 砖红 */
  --ink-12:rgba(38,58,84,.12);
  --ink-24:rgba(38,58,84,.24);
  --ink-45:rgba(38,58,84,.45);
  --ink-72:rgba(38,58,84,.72);

  /* ── 字 ── */
  --serif:"History Serif","Noto Serif SC","Source Han Serif SC",serif;
  --sans:"HarmonyOS Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
  --display:"History Display","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
  --marker:"History Marker","Microsoft YaHei",sans-serif;   /* 主标题 / 数字 / 手写感 */
  --mashan:"History MaShan","STXingkai","KaiTi",cursive;
  --longcang:"History LongCang","STKaiti","KaiTi",cursive;

  /* ── 手绘形 ── */
  --blob-1:48% 52% 44% 56% / 56% 45% 55% 44%;
  --blob-2:52% 48% 55% 45% / 45% 56% 44% 55%;
  --torn:29px 20px 32px 18px;
  --hard-shadow:4px 4px 0 var(--ink);
  --hard-shadow-lg:7px 8px 0 var(--ink);

  --dur:.22s;
  --ease:cubic-bezier(.2,.75,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{
  color:var(--ink);
  background:var(--cream);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;
}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:var(--blue)}
::selection{color:var(--ink);background:var(--yellow)}
:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}

/* ── 纸面：彩铅色斑 + 斜纹 + 颗粒 ── */
.paper-bg{position:relative;isolation:isolate}
.paper-bg::before{
  content:"";position:fixed;z-index:-4;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 9% 12%,rgba(240,200,77,.46) 0 8%,transparent 8.2%),
    radial-gradient(circle at 91% 29%,rgba(49,95,159,.17) 0 12%,transparent 12.2%),
    radial-gradient(circle at 79% 86%,rgba(217,77,61,.13) 0 14%,transparent 14.3%),
    repeating-linear-gradient(7deg,transparent 0 28px,rgba(38,58,84,.045) 28px 29px),
    var(--cream);
}
.paper-grain{
  position:fixed;z-index:-3;inset:0;opacity:.46;pointer-events:none;
  background-image:repeating-radial-gradient(circle at 20% 30%,rgba(38,58,84,.07) 0 1px,transparent 1px 5px);
  background-size:19px 17px;mix-blend-mode:multiply;
}

/* 页眉左上角的「史 HISTORY CLASS」标 */
.top-label{position:fixed;z-index:20;left:clamp(16px,4vw,52px);top:26px;color:var(--ink);font:700 9px/1 var(--sans);letter-spacing:.22em}
.top-label b{margin-right:8px;color:var(--red);font:400 22px/1 var(--marker);letter-spacing:0}
.top-label a{color:inherit;text-decoration:none}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}