/*
 * 设计令牌（提交页与管理端共用）
 * ------------------------------------------------------------------
 * 参考 Apple 官网的做法：中性灰阶 + 单一强调色，靠留白和字号层级建立秩序，
 * 不靠边框和阴影堆叠。两个页面各自有独立样式表，只有这一层是共享的，
 * 改这里两边同时生效。
 *
 * 刻意保持克制：没有渐变、没有投影装饰、没有多层描边。
 */

:root {
  /* ---- 中性色 ---- */
  --c-text: #1d1d1f;
  --c-text-2: #6e6e73;
  --c-text-3: #86868b;
  --c-line: #d2d2d7;
  --c-line-soft: #e8e8ed;
  --c-bg: #ffffff;
  --c-bg-alt: #f5f5f7;
  --c-fill: #f5f5f7;
  --c-fill-2: #ececf0;

  /* ---- 强调色 ---- */
  --c-accent: #0071e3;
  --c-accent-hover: #0077ed;
  --c-accent-soft: #e8f2fd;

  /* ---- 状态色（去饱和，避免花哨） ---- */
  --c-danger: #d70015;
  --c-danger-soft: #fdecee;
  --c-warn: #a05a00;
  --c-warn-soft: #fff4e3;
  --c-ok: #1d7d4f;
  --c-ok-soft: #e7f6ee;
  --c-info: #0058b8;
  --c-info-soft: #e8f0fb;
  --c-plain-soft: #f0f0f2;

  /* ---- 圆角 ---- */
  --r-xl: 22px;
  --r-lg: 16px;
  --r-md: 12px;
  --r-sm: 9px;
  --r-pill: 980px;

  /* ---- 阴影：只用极轻的一层，靠色块分层 ---- */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-2: 0 4px 18px rgba(0, 0, 0, 0.06);
  --shadow-3: 0 16px 48px rgba(0, 0, 0, 0.12);

  /* ---- 字体 ---- */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro SC", "SF Pro Text",
    "Segoe UI Variable Text", "Segoe UI", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, "Cascadia Mono",
    Consolas, "Liberation Mono", monospace;

  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  color: var(--c-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1, "tnum" 0;
}

img {
  max-width: 100%;
  /* 图片底部的行内空隙，是卡片对齐错位的常见毛刺 */
  vertical-align: middle;
}

/*
 * hidden 属性只是 UA 样式（display:none），任何作者写的 display 都会盖掉它；
 * 而且 SVG 元素根本不认 hidden 属性。所以统一在这里兜底，
 * 否则「有 logo 就藏默认图标」这类切换会两个都显示出来。
 */
[hidden] {
  display: none !important;
}

/* 苹果官网那种「轻轻按下」的反馈，只用在可点元素上 */
button,
a {
  -webkit-tap-highlight-color: transparent;
}

/* 键盘可达性：保留焦点圈，但换成强调色而不是浏览器默认的橙色 */
:focus-visible {
  outline: 2px solid var(--c-accent);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
