/* ---------------------------------------------------------------------------
 * 全站基础样式：设计变量、全局重置与通用动画。
 * 桌面与手机的搜索控件、页面布局各自在对应平台资源中定义。
 * ------------------------------------------------------------------------- */
:root{
  /* 配色体系 */
  --bg:#f4f7fc;
  --surface:#ffffff;
  --ink:#1c2b4a;
  --ink-2:#5f6f8a;
  --muted:#93a0b4;
  --blue:#2f73e8;
  --blue-deep:#2865cf;
  --blue-deeper:#2459b8;
  --blue-soft:#ecf3fe;
  --line:#e3eaf3;
  --ring:rgba(47,115,232,.14);
  /* 圆角 */
  --r-lg:18px;
  --r-md:14px;
  /* 阴影 */
  --shadow-sm:0 1px 2px rgba(28,43,74,.05);
  --shadow-md:0 2px 4px rgba(28,43,74,.04),0 12px 28px rgba(47,111,232,.08);
  --shadow-lg:0 4px 8px rgba(28,43,74,.05),0 20px 44px rgba(28,43,74,.12);
}
*{box-sizing:border-box}
html,body{width:100%;margin:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  background:
    radial-gradient(1100px 520px at 50% -8%,#e7f0fd 0%,rgba(231,240,253,0) 62%),
    radial-gradient(820px 420px at 88% 108%,#edf3fc 0%,rgba(237,243,252,0) 58%),
    var(--bg);
  background-attachment:fixed;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
}
::selection{background:var(--blue);color:#fff}
button,input{font:inherit}

@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* 轻提示：详情页点「分块播放」但没有时间划分时弹出，桌面与手机共用，故放共用文件。
   元素由 word-detail.js 动态插到 <body> 上——页面主容器 .content 带 rise 动画
   （transform 会成为包含块），插在里面 position:fixed 会被劫持成相对 .content 定位。 */
.toast{
  position:fixed;left:50%;bottom:40px;z-index:60;
  transform:translateX(-50%) translateY(8px);
  max-width:min(88vw,420px);padding:11px 20px;border-radius:999px;
  background:rgba(28,43,74,.93);color:#fff;font-size:14px;line-height:1.45;text-align:center;
  box-shadow:var(--shadow-lg);
  opacity:0;pointer-events:none;
  transition:opacity .18s,transform .18s;
}
.toast.is-on{opacity:1;transform:translateX(-50%) translateY(0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}