/* ═══════════════════════════════════════════════════════
   小豆学习机 · 设计变量
   设计画布 1180 × 780，根字号由 JS 按视口缩放
   ═══════════════════════════════════════════════════════ */
:root{
  /* 底色 —— 近黑深靛蓝（首页和科目页共用同一张底，保证两页观感一致） */
  --bg-1:#4160f5;
  --bg-2:#3b2fd0;
  --bg-3:#33208f;
  --bg-4:#241457;
  --bg-5:#1a0f42;

  /* ── 页面留白：首页和科目页**共用这两个值**，保证两页的导航/内容间距完全一致 ──
     以前两页各写各的（首页用 --pad + .35rem，科目页用 2.1rem），
     结果导航字号和上下间距都岔开了。改留白请只改这里。 */
  --page-pad:2.1rem;      /* 页面左右留白（导航行和内容区都用它） */
  --page-bottom:7.7rem;   /* 页面底部留白：避开应用坞 + 与内容区的呼吸距离 */

  /* ── 卡片配色：首页和科目页引用同一份，改一处两页一起变 ──
     色值取自你给的深色便当盒参考图 */
  --c-teal-1:#0d93a8;   --c-teal-2:#066f83;
  --c-teal-b1:#12a0b6;  --c-teal-b2:#078097;
  --c-amber-1:#f0b558;  --c-amber-2:#df9833;
  --c-coral-1:#f5946f;  --c-coral-2:#e7744e;
  --c-violet-1:#9a97ee; --c-violet-2:#7c77dd;
  --c-indigo-1:#6b7bf0; --c-indigo-2:#4a56cc;
  /* 卡片统一的"立体感"三件套：浅色描边 + 顶部高光 + 黑色柔影 */
  --card-ring:inset 0 0 0 1.5px rgba(255,255,255,.24);
  --card-top:inset 0 1px 0 rgba(255,255,255,.34);
  --card-drop:0 1.1rem 2.2rem rgba(0,0,0,.45);

  --violet:#7c5cff;
  --violet-deep:#5b3df0;
  --blue:#3b8cf0;
  --blue-lt:#7fd4ff;
  --mint:#2fe0b0;
  --cyan:#37d5ff;
  --pink:#ff5fa8;
  --amber:#ffb648;
  --danger:#ff5252;
  --green:#22c55e;

  /* 玻璃拟态 */
  --glass:linear-gradient(180deg,rgba(255,255,255,.155),rgba(255,255,255,.058));
  --glass-2:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035));
  --stroke:rgba(255,255,255,.17);
  --stroke-soft:rgba(255,255,255,.10);
  --shadow:0 .8rem 2.2rem rgba(10,4,50,.32);
  --shadow-sm:0 .4rem 1.2rem rgba(10,4,50,.22);

  /* 文字 */
  --ink:#ffffff;
  --ink-2:rgba(255,255,255,.74);
  --ink-3:rgba(255,255,255,.5);
  --ink-4:rgba(255,255,255,.34);
  --tile-ink:#28224f;
  --tile-ink-2:#6b6a8f;

  /* 尺寸 */
  --sb-h:2.5rem;
  --dock-h:8.7rem;
  --pad:1.9rem;
  --r-xl:1.75rem;
  --r-lg:1.4rem;
  --r-md:1.05rem;
  --r-sm:.7rem;

  --font:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --font-num:"DIN Alternate","SF Pro Display",Verdana,system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html,body{height:100%;margin:0;padding:0;}
html{
  font-size:16px;
  -webkit-text-size-adjust:100%;
  background:#04070f;
}
body{
  font-family:var(--font);
  color:var(--ink);
  overflow:hidden;
  overscroll-behavior:none;
  -webkit-user-select:none;user-select:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  /* 首页和科目页共用这一张底，两页之间切换不会有色差 */
  background-color:#05080f;
  background-image:
    radial-gradient(72% 46% at 50% -12%,rgba(38,96,168,.34),transparent 72%),
    radial-gradient(56% 46% at 96% 106%,rgba(74,54,150,.30),transparent 72%),
    linear-gradient(180deg,#0c1526 0%,#080e1c 55%,#04070f 100%);
  background-attachment:fixed;
}
body.is-light{background:linear-gradient(160deg,#eef1ff,#f7f4ff 60%,#eef6ff);}

h1,h2,h3,h4,p,ul,ol,figure{margin:0;padding:0;}
ul,ol{list-style:none;}
button,input,textarea{font:inherit;color:inherit;background:none;border:0;outline:none;}
button{cursor:pointer;}
img,svg{display:block;}
a{color:inherit;text-decoration:none;}
/* 关键：作者样式里的 display 会盖掉 UA 的 [hidden]{display:none}，
   锁定层 / 浮层都靠 hidden 属性开关，必须显式兜底 */
[hidden]{display:none !important;}

.sprite{position:absolute;width:0;height:0;overflow:hidden;}
.ic{width:1.25rem;height:1.25rem;flex:none;fill:none;}
.ic-sm{width:1rem;height:1rem;}
.ic-lg{width:1.85rem;height:1.85rem;}

::-webkit-scrollbar{width:.42rem;height:.42rem;}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:1rem;}
::-webkit-scrollbar-track{background:transparent;}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}