/* =====================================================
   《廉途·智伴》base.css — 设计基座 v5.1
   色：廉青 #2E7D6B / 长征红 #C8321E / 米纸 #F6F3EC / 篝火橙 #E8863A(仅S2)
   ===================================================== */
:root{
  --c-main:#2E7D6B;        /* 廉青 */
  --c-main-deep:#1F5A4C;
  --c-stamp:#C8321E;       /* 长征红 */
  --c-paper:#F6F3EC;       /* 米纸 */
  --c-paper-dark:#EAE4D6;
  --c-ember:#E8863A;       /* 篝火橙：仅 S2 光晕 */
  --c-ink:#33302A;
  --c-ink-soft:#6B675E;
  --c-line:#C9C2B2;
  --c-ok:#2E7D6B;
  --c-warn:#C8321E;
  --paper-tex:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='0.05'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E");
  --serif:"Source Han Serif SC","Songti SC","SimSun",serif;
  --sans:-apple-system,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-t:env(safe-area-inset-top,0px);
  --fs-base:16px;
}
html[data-font="ap"]{ --fs-base:18px; }
html[data-contrast="1"]{
  --c-ink:#1B1915; --c-ink-soft:#43403A; --c-paper:#FFFFFF; --c-paper-dark:#EFEAE0;
  --c-main:#1F5A4C; --c-line:#9A937F;
}

*{ box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
html,body{ height:100%; }
body{
  font-family:var(--sans); font-size:var(--fs-base); color:var(--c-ink);
  background:var(--c-paper); overflow:hidden;
  touch-action:manipulation; /* 禁双击缩放 */
  -webkit-font-smoothing:antialiased;
}
button{ font:inherit; color:inherit; border:0; background:none; cursor:pointer; touch-action:manipulation; }
img{ display:block; max-width:100%; }
input,textarea{ font:inherit; color:inherit; }

#app{
  position:fixed; inset:0; height:100svh; height:100vh; overflow:hidden;
  background:var(--c-paper);
}
@supports not (height:100svh){ #app{ height:100vh; } }

/* 纸纹叠层（全局） */
.paper-tex{ position:absolute; inset:0; background-image:var(--paper-tex); pointer-events:none; z-index:5; }

/* ---------- 标题/正文 ---------- */
h1,h2,h3,.serif{ font-family:var(--serif); letter-spacing:.02em; }
.page-title{ font-size:1.35rem; color:var(--c-main-deep); }

/* ---------- 通用按钮 ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.4em;
  min-height:44px; min-width:44px; padding:0 1.1em;
  border-radius:10px; font-size:1rem; user-select:none;
  border:1.5px solid var(--c-main); color:var(--c-main-deep); background:transparent;
  transition:transform .12s ease, background .15s ease;
}
.btn:active{ transform:scale(.97); }
.btn.primary{ background:var(--c-main); color:#fff; font-family:var(--serif); }
.btn.primary:disabled{ opacity:.45; }
.btn.red{ border-color:var(--c-stamp); color:var(--c-stamp); }
.btn.ghost{ border-color:var(--c-line); color:var(--c-ink-soft); }

/* ---------- Toast ---------- */
#toast-root{
  position:fixed; left:50%; top:calc(12px + var(--safe-t)); transform:translateX(-50%);
  z-index:900; display:flex; flex-direction:column; gap:8px; align-items:center;
  pointer-events:none; width:max-content; max-width:92vw;
}
.toast{
  background:rgba(31,50,45,.92); color:#F6F3EC; padding:9px 16px; border-radius:22px;
  font-size:.92rem; max-width:92vw; text-align:center;
  animation:toast-in .25s ease; box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.toast.out{ animation:toast-out .3s ease forwards; }
@keyframes toast-in{ from{ opacity:0; transform:translateY(-8px);} to{ opacity:1; transform:none;} }
@keyframes toast-out{ to{ opacity:0; transform:translateY(-8px);} }

/* ---------- 模态 ---------- */
.modal-mask{
  position:fixed; inset:0; z-index:800; background:rgba(24,28,26,.55);
  display:flex; align-items:center; justify-content:center; padding:20px;
  animation:fade-in .2s ease;
}
.modal-card{
  width:min(92vw,420px); max-height:80svh; max-height:80vh; overflow:auto;
  background:var(--c-paper); border-radius:14px; padding:20px 18px;
  background-image:var(--paper-tex);
  box-shadow:0 12px 40px rgba(0,0,0,.28); border:1px solid var(--c-line);
}
.modal-card h3{ color:var(--c-main-deep); margin-bottom:.6em; font-size:1.15rem; }
.modal-actions{ display:flex; gap:10px; margin-top:16px; }
.modal-actions .btn{ flex:1; }
.modal-close{ position:absolute; top:10px; right:10px; width:44px; height:44px; color:var(--c-ink-soft); }
.modal-wrap{ position:relative; }
@keyframes fade-in{ from{ opacity:0; } to{ opacity:1; } }

/* ---------- Dock（画卷/伴学/校园） ---------- */
.dock{
  position:fixed; left:0; right:0; bottom:0; z-index:600;
  display:flex; justify-content:space-around; align-items:stretch;
  background:rgba(246,243,236,.96); border-top:1px solid var(--c-line);
  padding-bottom:var(--safe-b); backdrop-filter:blur(4px);
}
.dock button{
  flex:1; min-height:56px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  color:var(--c-ink-soft); font-size:.78rem; user-select:none;
}
.dock button.active{ color:var(--c-main-deep); font-weight:600; }
.dock button.active .dock-ic{ color:var(--c-main); }
.dock svg{ width:24px; height:24px; }
.dock-label{ font-family:var(--serif); }

/* 顶右工具（行囊/设置） */
.top-tools{
  position:fixed; top:calc(8px + var(--safe-t)); right:8px; z-index:600;
  display:flex; gap:6px;
}
.tool-btn{
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(246,243,236,.92); border:1px solid var(--c-line);
  color:var(--c-main-deep); position:relative; box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.tool-btn svg{ width:22px; height:22px; }
.tool-badge{
  position:absolute; top:-4px; right:-6px; background:var(--c-stamp); color:#fff;
  font-size:.62rem; min-width:17px; height:17px; border-radius:9px;
  display:flex; align-items:center; justify-content:center; padding:0 4px;
}

/* ---------- 印章动画（篆体廉·朱印） ---------- */
.stamp{
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:var(--serif); font-weight:700;
  background:var(--c-stamp); border-radius:8px;
  box-shadow:0 0 0 3px var(--c-stamp) inset, 0 0 0 2px rgba(255,255,255,.55) inset, 0 4px 10px rgba(200,50,30,.35);
  position:relative;
}
.stamp::after{ /* 印泥质感 */
  content:""; position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(circle at 30% 25%, rgba(255,255,255,.18), transparent 55%);
}
.stamp-anim{ animation:stamp-in .5s cubic-bezier(.2,1.6,.4,1) forwards; }
@keyframes stamp-in{
  0%{ opacity:0; transform:scale(2.1) rotate(14deg); }
  60%{ opacity:1; transform:scale(.94) rotate(-4deg); }
  100%{ opacity:1; transform:scale(1) rotate(-4deg); }
}

/* ---------- 页脚 disclaimer ---------- */
.page-footer{
  padding:10px 16px calc(10px + var(--safe-b)); color:var(--c-ink-soft);
  font-size:.72rem; line-height:1.5; text-align:center;
}
.page-footer .src-link{ color:var(--c-main); text-decoration:underline; }

/* ---------- 高对比微调 ---------- */
html[data-contrast="1"] .toast{ background:#111; }
html[data-contrast="1"] .dock{ background:#fff; }

/* ---------- 特效关闭：暂停动画 ---------- */
@media (prefers-reduced-motion:reduce){
  .kb-anim,.pulse-hint{ animation-play-state:paused !important; }
}

/* ---------- 无障碍焦点 ---------- */
:focus-visible{ outline:2px solid var(--c-stamp); outline-offset:2px; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}