/* ============================================================
   T笔记 · 基础样式
   变量、重置、通用按钮、滚动条
   ============================================================ */

:root{
  --bg:#eef1f5;              /* 整体浅灰背景 */
  --card:#ffffff;            /* 白色卡片 */
  --line:#e4e8ee;            /* 分割线 */
  --line-strong:#d3d9e3;
  --text:#1e232b;
  --muted:#8a93a3;
  --muted-2:#aab2c0;
  --brand:#2f6bff;
  --brand-soft:#e9f0ff;
  --brand-dark:#1f52d8;
  --danger:#e5484d;
  --danger-soft:#fdecec;
  --top-h:56px;
  --toast-bottom:150px;      /* 轻提示距离底部的距离（工具栏收起时会改） */
  --shadow-s:0 1px 2px rgba(23,32,48,.06), 0 1px 3px rgba(23,32,48,.05);
  --shadow-m:0 4px 14px rgba(23,32,48,.08), 0 14px 40px rgba(23,32,48,.10);
  --shadow-l:0 10px 30px rgba(23,32,48,.14), 0 24px 60px rgba(23,32,48,.16);
  --r-s:8px; --r-m:12px; --r-l:18px;
}

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}

html,body{height:100%;margin:0;padding:0;}

body{
  font-family:"HarmonyOS Sans SC","PingFang SC","Microsoft YaHei UI","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--text);
  background:var(--bg);
  overflow:hidden;
  -webkit-user-select:none;user-select:none;
  overscroll-behavior:none;
}

button{font-family:inherit;color:inherit;border:0;background:none;cursor:pointer;padding:0;}
input,select{font-family:inherit;color:inherit;}
svg{display:block;}

.hidden{display:none !important;}
.screen{position:fixed;inset:0;display:flex;flex-direction:column;}

/* 隐藏的原生文件选择框：不能用 display:none，
   部分环境（希沃白板浏览器）会因此点不动，所以用 1px 透明 */
input[type=file].sr-file{
  position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;left:-9999px;
}

/* ---------- 通用按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:44px;padding:0 18px;border-radius:var(--r-m);
  background:var(--card);border:1px solid var(--line);
  font-size:15px;font-weight:500;color:var(--text);
  box-shadow:var(--shadow-s);transition:transform .08s ease,background .15s ease;
}
.btn:active{transform:scale(.97);}
.btn-lg{height:54px;padding:0 26px;font-size:16px;border-radius:14px;}
.btn-primary{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 4px 12px rgba(47,107,255,.28);}
.btn-primary:active{background:var(--brand-dark);}
.btn-ghost{background:#fff;}
.btn[disabled],.btn[disabled]:active{opacity:.45;transform:none;cursor:not-allowed;}

.icon-btn{
  width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  color:var(--muted);transition:background .15s,color .15s;
}
.icon-btn:hover{background:#f1f4f9;color:var(--text);}
.icon-btn:active{background:#e8edf6;}

.card{
  background:var(--card);border-radius:var(--r-l);border:1px solid var(--line);
  box-shadow:var(--shadow-m);overflow:hidden;
}

/* ---------- 通用动画 ---------- */
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes pop{from{transform:scale(.96);opacity:.6;}to{transform:scale(1);opacity:1;}}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:#c9d2e0;border-radius:6px;border:2px solid var(--bg);}
::-webkit-scrollbar-track{background:transparent;}