/* ============================================================
 * JYB 设计系统 v2 · 干净商业风 · 金银高级（共享跨页面美化层）
 * 由 index/jyb-scores/jyb-app/jyb-admin <link> 引入（置于各页 inline <style> 之后，统一精炼）。
 * 只做「跨页面、低风险、高一致性」的元件/排版/微交互精炼；页面专属布局由各页内联负责。
 * ============================================================ */

:root {
  --jds-gold: #c2912f; --jds-gold-deep: #a3781f; --jds-gold-soft: #f6efdf; --jds-gold-line: #e6d8b6;
  --jds-ink: #20242e; --jds-muted: #6b7280; --jds-faint: #9aa0ab;
  --jds-paper: #faf9f6; --jds-surface: #ffffff; --jds-border: #ece8df;
  --jds-live: #d8453a; --jds-up: #2e9e63;
  --jds-r-sm: 8px; --jds-r-md: 12px; --jds-r-lg: 16px;
  --jds-sh-1: 0 1px 2px rgba(31,36,46,.05), 0 1px 3px rgba(31,36,46,.04);
  --jds-sh-2: 0 4px 14px rgba(31,36,46,.08), 0 2px 6px rgba(31,36,46,.05);
  --jds-ease: cubic-bezier(.2,.7,.3,1);
}

/* —— 全局排版与渲染 —— */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
body { letter-spacing: .005em; }
.num, [class*="num"], .score, .sc, .pts, .kv { font-variant-numeric: tabular-nums; }

/* —— 统一微交互：焦点/选区/滚动条/过渡 —— */
:where(a, button, input, [role="button"], .chip, .c, .btn, .tab, .sport-row, .row, .match, .mi, .ib) {
  transition: background-color .15s var(--jds-ease), color .15s var(--jds-ease), border-color .15s var(--jds-ease), box-shadow .15s var(--jds-ease), transform .12s var(--jds-ease);
}
:where(a, button, [role="button"], input, .chip, .c, [tabindex]):focus-visible {
  outline: 2px solid var(--jds-gold); outline-offset: 2px; border-radius: 6px;
}
::selection { background: rgba(194, 145, 47, .22); }
* { scrollbar-width: thin; scrollbar-color: var(--jds-gold-line) transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: var(--jds-gold-line); border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: var(--jds-gold-deep); background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

/* —— 可点元素的统一悬浮/按压微反馈（不改色，只加质感）—— */
:where(button, .btn, .btn-gold, .buy, .send, .c, .chip):not(:disabled):hover { filter: brightness(1.03); }
:where(button, .btn, .btn-gold, .buy, .send, .c, .chip):not(:disabled):active { transform: translateY(.5px) scale(.995); }
:where(button, .btn, a):disabled, :where(button, .btn, a)[disabled] { opacity: .55; cursor: not-allowed; }

/* —— 列表行 / 卡片 悬浮一致性 —— */
:where(.row, .match, .mrow, .nrow, .mi, .exp-card, .plan, .tip):hover { background: var(--jds-gold-soft); }

/* —— 骨架屏（统一载入态，替代「加载中…」文字闪烁）—— */
@keyframes jskel { 0% { background-position: 100% 0 } 100% { background-position: -100% 0 } }
.jds-skel { background: linear-gradient(90deg, #efece4 25%, #f6f3ec 37%, #efece4 63%); background-size: 300% 100%; animation: jskel 1.2s ease-in-out infinite; border-radius: var(--jds-r-sm); }
.jds-skel-row { height: 56px; margin: 8px 0; }
.jds-skel-line { height: 12px; margin: 8px 0; }

/* —— 统一空状态 —— */
.jds-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 18px; color: var(--jds-muted); font-size: 13.5px; text-align: center; }
.jds-empty .ic { font-size: 26px; opacity: .9; }

/* —— 图片：防布局抖动 + 圆角队徽更干净 —— */
img { max-width: 100%; height: auto; }
img[src*="media.api-sports.io"] { object-fit: contain; background: #fff; }

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

/* —— 移动端输入聚焦防 iOS Safari 自动放大：字号 <16px 聚焦会触发 zoom，仅触屏生效、桌面零影响 —— */
@media (hover: none) and (pointer: coarse) { input, textarea, select { font-size: 16px !important; } }