/* ============================================================
   教师工作台 · 设计令牌 + 动画 + hover 类
   由 docs/design-src/template.html 的 <style> 块移植而来
   ============================================================ */

/* ---- 夜间主题（默认） ---- */
:root{--bg:#070d18;--phone1:#0a1524;--phone2:#070d18;--sidebar:rgba(10,18,32,.85);--pillbg:rgba(10,18,32,.92);--panel:rgba(255,255,255,.03);--panel2:rgba(255,255,255,.02);--panel3:rgba(255,255,255,.015);--panel4:rgba(255,255,255,.04);--hovbg:rgba(255,255,255,.06);--scb:#1d2a3d;--grid:rgba(122,220,255,.02);--thumb1:#0d1b2e;--t1:#eaf4fb;--t2:#dce7f2;--t3:#a9b8ce;--t4:#8fa5bb;--t5:#5f7890;--t6:#4a6178;--t7:#3d5266;--cy:#46d5e6;--cyh:#7ce4f0;--blu:#2b7fd4;--vio:#8b7cf7;--vioL:#a99cf9;--vioT:#c9befc;--grn:#4ade9d;--amb:#e6b25a;--red:#ef7d68;--pnk:#ef9de6;--onAcc:#04121c;--radAvg:rgba(143,165,187,.55);--l05:rgba(122,220,255,.05);--l06:rgba(122,220,255,.06);--l07:rgba(122,220,255,.07);--l08:rgba(122,220,255,.08);--l10:rgba(122,220,255,.1);--l12:rgba(122,220,255,.12);--l14:rgba(122,220,255,.14);--l15:rgba(122,220,255,.15);--l16:rgba(122,220,255,.16);--l18:rgba(122,220,255,.18);--l20:rgba(122,220,255,.2);--l25:rgba(122,220,255,.25);--l30:rgba(122,220,255,.3)}

/* ---- 日间主题 ---- */
body[data-theme="day"]{--bg:#f2f5fa;--phone1:#fdfefe;--phone2:#edf2f9;--sidebar:rgba(255,255,255,.94);--pillbg:rgba(255,255,255,.96);--panel:#ffffff;--panel2:#fbfcfe;--panel3:#f3f6fb;--panel4:#f0f4fa;--hovbg:rgba(37,99,235,.08);--scb:#c9d6e8;--grid:rgba(30,70,140,.05);--thumb1:#eaf1fa;--t1:#0f1d33;--t2:#22344d;--t3:#3d5470;--t4:#5a7190;--t5:#7288a3;--t6:#93a6bd;--t7:#a9b8cb;--cy:#0795b4;--cyh:#0b7d99;--blu:#2563eb;--vio:#7c3aed;--vioL:#8b5cf6;--vioT:#5b21b6;--grn:#0d9e6e;--amb:#d97706;--red:#dc4b3e;--pnk:#d6219c;--onAcc:#ffffff;--radAvg:rgba(90,112,140,.6);--l05:rgba(20,50,110,.06);--l06:rgba(20,50,110,.08);--l07:rgba(20,50,110,.09);--l08:rgba(20,50,110,.1);--l10:rgba(20,50,110,.12);--l12:rgba(20,50,110,.14);--l14:rgba(20,50,110,.16);--l15:rgba(20,50,110,.16);--l16:rgba(20,50,110,.18);--l18:rgba(20,50,110,.18);--l20:rgba(20,50,110,.22);--l25:rgba(20,50,110,.26);--l30:rgba(20,50,110,.3)}

/* ---- 基础 reset ---- */
html,body{margin:0;padding:0;background:var(--bg);font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;color:var(--t2)}
a{color:var(--cy);text-decoration:none}a:hover{color:var(--cyh)}
*{box-sizing:border-box}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--scb);border-radius:4px}

/* ---- 动画 ---- */
@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
@keyframes glowPulse{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes radarIn{from{opacity:0;transform:scale(.25)}to{opacity:1;transform:scale(1)}}
@keyframes drawLine{to{stroke-dashoffset:0}}
@keyframes growBar{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes growX{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes shimmer{from{transform:translateX(-120%)}to{transform:translateX(320%)}}
@keyframes floatA{0%,100%{transform:translate(0,0)}50%{transform:translate(46px,-34px)}}
@keyframes floatB{0%,100%{transform:translate(0,0)}50%{transform:translate(-54px,42px)}}
@keyframes btnGlow{0%,100%{box-shadow:0 0 22px rgba(70,213,230,.3)}50%{box-shadow:0 0 46px rgba(70,213,230,.65)}}
@keyframes flipIn{from{transform:rotateY(90deg);opacity:0}to{transform:rotateY(0);opacity:1}}

/* ---- hover 类（由模板 style-hover 属性转换而来；
        内联样式优先级高于类，故一律 !important） ---- */
.hv-nav:hover{background:rgba(70,213,230,.08)!important;color:var(--t2)!important}
/* 2026-08-30 hover 位移移除 (用户: 滚动后卡片上下快速晃动) — 鼠标停在卡片边缘时
   translateY 会造成 悬停→移出→落回→再悬停 的抖振循环; 反馈只留边框+辉光 */
.hv-lift:hover{box-shadow:0 0 14px rgba(70,213,230,.18)!important}
.hv-amb:hover{box-shadow:0 0 20px rgba(230,178,90,.15)!important}
.hv-card:hover{border-color:rgba(70,213,230,.4)!important;box-shadow:0 0 28px rgba(70,213,230,.12)!important}
.hv-cybg:hover{background:rgba(70,213,230,.1)!important}
.hv-cybg2:hover{background:rgba(70,213,230,.2)!important}
.hv-viol:hover{color:var(--vioL)!important}
.hv-row:hover{background:rgba(70,213,230,.05)!important}
.hv-glow32:hover{box-shadow:0 0 32px rgba(70,213,230,.5)!important}
.hv-glow20:hover{box-shadow:0 0 20px rgba(70,213,230,.4)!important}
.hv-glow18:hover{box-shadow:0 0 18px rgba(70,213,230,.4)!important}
.hv-cy:hover{color:var(--cy)!important}
.hv-t2:hover{color:var(--t2)!important}
.hv-slide:hover{border-color:var(--cy)!important;box-shadow:0 0 18px rgba(70,213,230,.2)!important}
.hv-grnbg:hover{background:rgba(74,222,157,.12)!important}
.hv-red:hover{color:var(--red)!important;border-color:rgba(239,125,104,.4)!important}
.hv-pill:hover{color:var(--t2)!important;background:var(--hovbg)!important}
/* ============================================================
   每日一签 · 红包抽签 (方案 3B) 关键帧 — 追加到 public/style.css 的动画区
   前缀统一 fc*(fortune card), 与既有 tubeShake / stickRise 不冲突。
   旧的 tubeShake / stickRise 在换用本方案后即成死代码, 确认无回头需求可一并删。
   ============================================================ */
@keyframes fcFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-4px) rotate(2deg)}}
@keyframes fcEnvShake{0%{transform:rotate(0) translateY(0)}10%{transform:rotate(-11deg) translateY(-2px)}24%{transform:rotate(9deg) translateY(1px)}38%{transform:rotate(-7deg)}52%{transform:rotate(5deg)}66%{transform:rotate(-3deg)}80%{transform:rotate(1.5deg)}100%{transform:rotate(0)}}
@keyframes fcSlipOut{0%{transform:translateY(20px) scaleY(.4);opacity:0}45%{opacity:1}70%{transform:translateY(-30px) scaleY(1)}100%{transform:translateY(-26px) scaleY(1);opacity:1}}
@keyframes fcSparkPop{0%{transform:scale(.2) rotate(-30deg);opacity:0}45%{transform:scale(1.15) rotate(6deg);opacity:1}100%{transform:scale(.9) rotate(0);opacity:0}}
@keyframes fcStamp{0%{transform:scale(1.9) rotate(-12deg);opacity:0}60%{transform:scale(.94) rotate(3deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
/* 2026-09-05 文本保存状态独立浮层: 页面切换后仍可看见未保存和重试，不推动记录卡片。 */
.text-save-status {
  position: fixed; right: 20px; bottom: 20px; z-index: 1200;
  display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 40px);
  box-sizing: border-box; padding: 10px 14px; border-radius: 10px;
  background: var(--pillbg); color: var(--t2); border: 1px solid var(--l14);
  box-shadow: 0 4px 18px rgba(0,0,0,.12); font-size: 12px; line-height: 1.5;
}
.text-save-status[hidden] { display: none; }
.text-save-status[data-status="error"] { border-color: var(--red); }
.text-save-status button {
  flex: none; background: var(--panel3); color: var(--t1); border: 1px solid var(--l30);
  border-radius: 7px; padding: 8px 12px; cursor: pointer; font: inherit;
}
@media (max-width: 768px) {
  .text-save-status { right: 14px; bottom: calc(76px + env(safe-area-inset-bottom)); max-width: calc(100vw - 28px); }
  .text-save-status button { min-height: 44px; }
}
