/* Critical CSS for beijing.html */
/* Above-the-fold styles required for initial render */

a, button, input, select, textarea, [role="button"] { min-width: 44px; min-height: 44px; }
  

    .skip-link { position: absolute; left: -999px; top: auto; width: 1px; height: 1px; overflow: hidden; } .skip-link:focus { left: 0; top: 0; width: auto; height: auto; overflow: visible; }
  

    a, button, input, select, textarea, [role="button"] { min-width: 44px; min-height: 44px; }
  

    .skip-link { position: absolute; left: -999px; top: auto; width: 1px; height: 1px; overflow: hidden; } .skip-link:focus { left: 0; top: 0; width: auto; height: auto; overflow: visible; }
  

/* ========== 全局重置与基础样式 ========== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --color-primary: #C41E3A;
  --color-primary-light: #E8384F;
  --color-primary-dark: #9B1830;
  --color-gold: #B8860B;
  --color-gold-light: #D4A017;
  --bg-primary: #F8FAFC;
  --bg-card: #FFFFFF;
  --text-primary: #1E293B;
  --text-secondary: #64748B;
  --text-light: #94A3B8;
  --border-color: #E2E8F0;
  --color-green: #16A34A;
  --color-green-light: #F0FDF4;
  --color-yellow: #EAB308;
  --color-yellow-light: #FEFCE8;
  --color-red: #DC2626;
  --color-red-light: #FEF2F2;
  --color-blue: #2563EB;
  --color-blue-light: #EFF6FF;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,.1);
  --shadow-lg: 0 8px 30px rgba(0,0,0,.12);
  --radius: 16px;
  --radius-sm: 10px;
  --radius-xs: 6px;

  /* spacing system */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;

  /* font scale */
  --text-xs: 0.75rem;
  --text-sm: 0.85rem;
  --text-base: 1rem;
  --text-lg: 1.15rem;
  --text-xl: 1.5rem;
  --text-2xl: 1.8rem;
  --text-3xl: 2.2rem;

  /* z-index scale */
  --z-nav: 1000;
  --z-subnav: 999;
  --z-float: 999;
  --z-modal: 10000;
  --z-loader: 99999;

  --transition: all .3s cubic-bezier(.4,0,.2,1);
  /* 暗色模式扩展变量（亮色默认值） */
  --bg-secondary: #F1F5F9;
  --card-shadow: rgba(0,0,0,.08);
  --card-border: #E2E8F0;
  --table-bg: #FFFFFF;
  --table-alt: #F8FAFC;
  --table-border: #F1F5F9;
  --nav-bg: rgba(255,255,255,.92);
  --nav-dropdown-bg: rgba(255,255,255,.98);
  --hover-bg: #F1F5F9;
  --info-row-border: #F1F5F9;
  /* 新增：表单元素暗色模式变量 */
  --input-bg: #FFFFFF;
  --input-border: #E2E8F0;
  --input-focus-border: #2563EB;
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2364748B' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
  --slider-thumb-border: #FFFFFF;
  --modal-overlay: rgba(0,0,0,0.45);
  --modal-bg: #FFFFFF;
  --modal-border: #E2E8F0;
  --btn-secondary-bg: #F1F5F9;
  --btn-secondary-hover: #E2E8F0;
  --loader-bg: #F8FAFC;
  --loader-text: #64748B;
  --loader-bar-bg: #E2E8F0;
  --loader-bar-fill: linear-gradient(90deg, #667eea, #764ba2);
  --img-brightness: 1;
  --dropdown-shadow: 0 8px 30px rgba(0,0,0,0.15);
  --card-shadow-dark: 0 4px 12px rgba(0,0,0,0.1);
  --card-hover-shadow-dark: 0 12px 40px rgba(0,0,0,0.18);
}

/* ========== 焦点可见样式 (a11y) ========== */
:focus-visible {
  outline: 2px solid #2563EB !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}

/* 暗色模式下的焦点样式 */
[data-theme="dark"] :focus-visible {
  outline-color: #60A5FA !important;
}

/* 减少动效模式下禁用焦点环动画 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ========== 暗色模式 ========== */
[data-theme="dark"] {
  --bg-primary: #0f172a;
  --bg-card: #1e293b;
  --bg-secondary: #1e293b;
  --text-primary: #e2e8f0;
  --text-secondary: #94a3b8;
  --text-light: #64748b;
  --border-color: #334155;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,.4);
  --shadow-lg: 0 8px 30px rgba(0,0,0,.5);
  --card-shadow: rgba(0,0,0,.3);
  --card-border: #334155;
  --table-bg: #1e293b;
  --table-alt: #0f172a;
  --table-border: #334155;
  --nav-bg: rgba(15,23,42,.92);
  --nav-dropdown-bg: rgba(15,23,42,.98);
  --hover-bg: #334155;
  --info-row-border: #334155;
  --color-green-light: rgba(22,163,74,.15);
  --color-yellow-light: rgba(234,179,8,.15);
  --color-red-light: rgba(220,38,38,.15);
  --color-blue-light: rgba(37,99,235,.15);
  /* 鏂板锛氳〃鍗曞厓绱犳殫鑹叉ā寮忓彉閲?*/
  --input-bg: #1e293b;
  --input-border: #475569;
  --input-focus-border: #60a5fa;
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2394a3b8' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
  --slider-thumb-border: #0f172a;
  --modal-overlay: rgba(0,0,0,0.6);
  --modal-bg: #1e293b;
  --modal-border: #334155;
  --btn-secondary-bg: #334155;
  --btn-secondary-hover: #475569;
  --loader-bg: #0f172a;
  --loader-text: #94a3b8;
  --loader-bar-bg: #334155;
  --loader-bar-fill: linear-gradient(90deg, #60a5fa, #818cf8);
  --img-brightness: 0.85;
  --dropdown-shadow: 0 8px 30px rgba(0,0,0,0.5);
  --card-shadow-dark: 0 4px 20px rgba(0,0,0,0.4);
  --card-hover-shadow-dark: 0 12px 40px rgba(0,0,0,0.5);
}