/*
 * 极简 globals.css —— 用户要求「背景白色 + 原生浏览器按钮/输入框样式 + 不搞导航栏标题栏装饰」
 * 因此：
 *   1. 只做字体和 box-sizing reset；
 *   2. 完全不对 button / input / select / textarea 做样式覆盖；
 *   3. 不提供任何 card、btn、gradient、glow、玻璃拟态类，
 *      (就算组件里写了那些 Tailwind class，它们在 tailwind.config.ts 里也被压成了 plain/浅灰
 *       —— 再保险起见，保留一批「清零」强覆盖，避免组件内字面类残留样式)。
 */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/fonts/material-symbols-outlined.woff2') format('woff2');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-feature-settings: 'liga';
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* ──── 1. 基础 reset，保证所有页面背景纯白 ─────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: #ffffff !important;
  color: #111111;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  line-height: 1.5;
}

html { scroll-behavior: auto; }

a { color: #0057d1; text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4, h5, h6 { color: #111; font-weight: 600; margin: 0 0 8px 0; }
p  { margin: 0 0 8px 0; }

/* 让滚动条别抢戏，朴素即可 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d8d8d8; border-radius: 5px; }
::-webkit-scrollbar-thumb:hover { background: #b8b8b8; }
::selection { background: #cce2ff; color: #111; }

/* ──── 2. 清零旧组件层类（组件还可能引用），避免装饰残留 ─────── */
.card-surface, .card-hover, .drop-zone, .drop-zone-active,
.btn-primary, .btn-secondary, .btn-ghost,
.input-field, .bg-glass, .bg-glass-dark, .glow-indigo,
.section-title, .bg-slate-900, .bg-slate-900\/95, .bg-slate-950,
.bg-slate-800, .bg-slate-700, .bg-slate-600,
.border-slate-800\/50, .border-slate-800, .border-slate-700,
.bg-gradient-to-r, .bg-gradient-to-br, .rounded-full,
.shadow-lg, .shadow-md, .shadow-xl, .shadow-2xl {
  background: transparent !important;
  border: none !important;
  border-color: #d8d8d8 !important;  /* 仅对需要边的地方有效 */
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  background-image: none !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  color: inherit !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

/* 工具内部可能写了 hover:-translate-y-1 之类的，禁止动效 */
.hover\:-translate-y-1:hover, .active\:scale-95:active { transform: none !important; }
.transition-all, .transition-transform, .transition-colors, .transition-opacity { transition: none !important; }

/* 渐变字恢复为普通黑字 */
.text-transparent, .bg-clip-text, .text-gradient-indigo, .text-gradient-green {
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: initial !important;
  color: #111 !important;
}

/* 任何写了 text-slate-50/100/200 (旧深主题亮文字) → 黑字 */
.text-slate-50, .text-slate-100, .text-slate-200, .text-slate-300, .text-slate-400, .text-slate-500, .text-white {
  color: #111 !important;
}
.placeholder-slate-500::placeholder { color: #888 !important; }

/* drop-zone 的旧 dashed 厚边 → 改为 1px 普通灰边 */
.drop-zone, .drop-zone-active {
  border: 1px solid #d8d8d8 !important;
  border-radius: 4px !important;
  padding: 24px !important;
  background: #fafafa !important;
}

/* 让输入框组件里 input-field：退回原生 border，不要加 focus ring 大边框 */
.input-field {
  border: 1px solid #d0d0d0 !important;
  background: #fff !important;
  color: #111 !important;
  padding: 4px 8px !important;
  border-radius: 4px !important;
  box-shadow: none !important;
}
.input-field:focus { outline: 1px solid #0057d1 !important; }

*{margin:0;padding:0;box-sizing:border-box}
body{font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:#f5f5f5;color:#333;padding:20px}
.wrap{max-width:820px;margin:0 auto}
h1{font-size:20px;margin-bottom:4px}
.sub{color:#666;font-size:12px;margin-bottom:16px}
h2{font-size:14px;color:#555;margin:18px 0 8px;padding-left:2px}
ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px;list-style:none}
a{display:block;padding:8px 12px;background:#fff;border:1px solid #e0e0e0;border-radius:6px;color:#333;text-decoration:none;font-size:13px;transition:.15s}
a:hover{border-color:#999;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.foot{margin-top:20px;font-size:11px;color:#999}
.container{max-width:900px;margin:0 auto;padding:0 8px}
.description{color:#666;margin-bottom:1.5rem}
.tool-container{margin-top:1.5rem;background:#fff;border:1px solid #e0e0e0;border-radius:6px;padding:16px}
input,textarea,button,select{font:inherit}
.row{display:flex;gap:8px;margin:12px 0;align-items:center;flex-wrap:wrap}
textarea{width:100%;padding:12px;border:1px solid #ccc;border-radius:4px;resize:vertical}
input[type="text"],input[type="number"]{padding:8px 12px;border:1px solid #ccc;border-radius:4px}
button{padding:8px 16px;background:#06c;color:#fff;border:none;border-radius:4px;cursor:pointer}
button:hover{background:#0052a3}
@media(max-width:600px){body{padding:.5rem}ul{grid-template-columns:1fr 1fr}}