:root {
  /* Primary - Deep Navy Blue System */
  --primary: #142B6F;
  --primary-dark: #0F172A;
  --primary-light: #1E3A8A;

  /* Accent - Gold System */
  --accent: #B68A2E;
  --accent-light: #C6922A;
  --accent-dark: #A16207;

  /* Background - Premium Gray-White */
  --bg: #FAFAFA;
  --surface: #FFFFFF;
  --surface-soft: #F8F8F6;

  /* Text - Deep Gray System */
  --text: #1F2937;
  --text-muted: #374151;
  --text-light: #6B7280;

  /* Functional Colors */
  --success: #059669;
  --warning: #D97706;
  --error: #DC2626;
  --info: #0284C7;

  /* Borders - Extremely Light */
  --border: #E5E7EB;
  --border-light: #F3F4F6;
  --line: rgba(229, 231, 235, 0.8);

  /* Legacy compatibility */
  --muted: #374151;
  --hero-a: #0F172A;
  --hero-b: #142B6F;
  --hero-c: #1E3A8A;
  --brand: #142B6F;
  --brand-2: #B68A2E;

  /* Shadows - Refined */
  --shadow: 0 4px 12px rgba(20, 43, 111, 0.08);
  --shadow-soft: 0 1px 3px rgba(0, 0, 0, 0.05);

  /* Layout - Unified System */
  --radius-xl: 8px;
  --radius-lg: 6px;
  --radius-md: 4px;
  --radius-sm: 3px;
  --wrap: min(1200px, calc(100% - 48px));
  --wrap-narrow: min(960px, calc(100% - 48px));
  --wrap-wide: min(1400px, calc(100% - 48px));
  --module-gap: 80px;
  --module-gap-sm: 48px;
  --module-pad: 32px 24px;
  --module-pad-lg: 64px 0;
  --card-min-md: 132px;
  --button-height: 48px;
  --button-height-lg: 52px;

  /* Spacing System */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;
  --space-3xl: 80px;

  /* Typography */
  --font-heading: 'Noto Serif SC', serif;
  --font-body: 'Noto Sans SC', sans-serif;

  /* Gradient & Effects */
  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-light));
  --shadow-hover: 0 12px 24px rgba(20, 43, 111, 0.12);
  --shadow-elevated: 0 20px 36px rgba(13, 43, 123, 0.18);
  --focus-ring: 0 0 0 4px rgba(20, 43, 111, 0.08);
  --border-dashed: rgba(20, 43, 111, 0.18);
  --transition-base: 200ms ease;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: var(--text);
  background: var(--bg);
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 600;
  line-height: 1.2;
}

h1 {
  font-size: 42px;
  font-weight: 600;
  line-height: 1.1;
}

h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 1.2;
}

h3 {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
}

h4 {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
}

a {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

button {
  cursor: pointer;
}

button,
input,
select,
textarea {
  font: inherit;
}

a,
button,
input,
select,
textarea {
  transition: box-shadow 200ms ease, border-color 200ms ease, transform 200ms ease, background 200ms ease, color 200ms ease;
}

/* P0: Improved focus states for accessibility */
*:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(30, 58, 138, 0.1);
}

/* P0: Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

svg {
  width: 34px;
  height: 34px;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.section-heading__eyebrow,
.law-results-hero__eyebrow,
.tool-hero__eyebrow,
.generate-hero__eyebrow,
.dashboard-hero__eyebrow,
.records-hero__eyebrow,
.detail-hero__eyebrow,
.auth-badge {
  display: none !important;
}

.hero-shell {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #0F172A 0%, #142B6F 100%);
}

.hero-shell::before {
  display: none;
}

.hero-container,
.section-inner,
.site-footer__inner,
.submenu-shell {
  width: var(--wrap);
  margin: 0 auto;
}

.submenu-shell,
.law-results-shell,
.law-detail-shell,
.tool-shell,
.generate-shell,
.case-detail-shell {
  padding-top: 32px;
  padding-bottom: 48px;
}

.hero-container {
  position: relative;
  z-index: 1;
  padding: 28px 0 84px;
}

.home-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 48px;
}

.site-topbar--inner {
  position: sticky;
  top: 0;
  z-index: 20;
  border-bottom: 1px solid rgba(97, 123, 177, 0.12);
  background: rgba(247, 250, 255, 0.92);
  backdrop-filter: blur(18px);
}

.site-topbar--inner .site-topbar__inner {
  width: var(--wrap);
  margin: 0 auto;
}

.site-topbar--inner .home-header {
  margin-bottom: 0;
  padding: 18px 0;
}

.site-topbar--inner .home-header__brand {
  color: var(--text);
}

.site-topbar--inner .home-header__mark {
  background: transparent;
  border: 0;
  box-shadow: none;
}

.site-topbar--inner .home-header__brand p {
  color: var(--muted);
}

.site-topbar--inner .hero-nav {
  color: #4d678e;
}

.site-topbar--inner .hero-nav a,
.site-topbar--inner .hero-nav span {
  color: inherit;
}

.site-topbar--inner .hero-nav__user {
  background: rgba(20, 43, 111, 0.08);
  border: 1px solid rgba(20, 43, 111, 0.12);
  color: var(--primary);
}

.home-header__brand {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: #fff;
  cursor: pointer;
}

.home-header__mark,
.footer-brand__mark {
  display: inline-block;
  border-radius: var(--radius-lg);
  object-fit: contain;
  flex-shrink: 0;
}

.home-header__mark {
  width: 50px;
  height: 50px;
  background: transparent;
  border: 0;
}

.home-header__brand strong {
  display: block;
  font-size: 24px;
  font-weight: 700;
}

.home-header__brand p {
  margin: 2px 0 0;
  color: rgba(255, 255, 255, 0.72);
  font-size: 13px;
}

.hero-nav {
  display: flex;
  align-items: center;
  gap: 28px;
  color: rgba(255, 255, 255, 0.84);
  font-size: 14px;
  font-weight: 500;
}

.hero-nav a,
.hero-nav span {
  white-space: nowrap;
  cursor: pointer;
}

.hero-nav__user {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.hero-nav__user--hidden,
.hero-nav__dashboard--hidden,
.hero-nav__logout--hidden,
.hero-nav__link--hidden,
.icon-card__badge--hidden {
  display: none;
}

/* P1: Hotline styling for trust and visibility */
.hero-nav__hotline {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: 0;
  color: rgba(255,255,255,0.84);
  font-weight: 600;
  white-space: nowrap;
}

.site-topbar--inner .hero-nav__hotline {
  background: transparent;
  color: var(--text-muted);
}

.hero-nav a {
  position: relative;
}

.hero-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 100%;
  height: 2px;
  border-radius: 999px;
  background: rgba(255,255,255,0.6);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 200ms ease;
}

.hero-nav a:hover::after {
  transform: scaleX(1);
}

.hero-nav a:hover {
  color: rgba(255, 255, 255, 1);
}

.hero-nav a.is-active {
  color: #fff;
  font-weight: 700;
}

.hero-nav a.is-active::after {
  transform: scaleX(1);
}

.site-topbar--inner .hero-nav a.is-active {
  color: var(--primary);
}

.hero-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 800px;
  margin: 0 auto;
}

.hero-copy {
  max-width: 800px;
  color: #fff;
  text-align: center;
}

.hero-copy h1 {
  margin: 0 0 20px;
  font-size: 42px;
  line-height: 1.1;
  font-weight: 600;
}

.hero-copy p {
  margin: 0 0 32px;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.7;
  font-size: 18px;
}

.hero-actions {
  display: flex;
  gap: 16px;
  margin-bottom: 32px;
  justify-content: center;
}

.hero-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 0 32px;
  border-radius: 4px;
  font-size: 16px;
  font-weight: 600;
  transition: all 200ms ease;
  cursor: pointer;
  border: 0;
}

.hero-btn--primary {
  background: #B68A2E;
  color: #FFFFFF;
}

.hero-btn--primary:hover {
  background: #C6922A;
  box-shadow: 0 4px 12px rgba(182, 138, 46, 0.3);
}

.hero-btn--secondary {
  background: transparent;
  color: #FFFFFF;
  border: 2px solid rgba(255, 255, 255, 0.3);
}

.hero-btn--secondary:hover {
  border-color: rgba(255, 255, 255, 0.6);
}

.hero-nav__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 20px;
  border-radius: 4px;
  background: #B68A2E;
  color: #FFFFFF !important;
  font-weight: 600;
  font-size: 14px;
}

.hero-nav__cta:hover {
  background: #C6922A;
}

.hero-nav__cta::after {
  display: none;
}

.hero-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
  justify-content: center;
}

.hero-tags span {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  color: rgba(255,255,255,0.6);
}

.hero-tags__sep {
  color: rgba(255,255,255,0.3);
}

.hero-visual {
  position: relative;
  min-height: 360px;
  display: none;
}

.visual-platform,
.visual-glow,
.visual-card,
.visual-shield,
.visual-doc,
.visual-scale,
.visual-logo {
  display: none;
}

.visual-platform {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 260px;
  height: 220px;
  transform: translate(-50%, -50%);
}

.visual-platform__base {
  position: absolute;
  inset: auto 18px 0;
  height: 28px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(94, 235, 255, 0.25), rgba(140, 113, 255, 0.32));
  filter: blur(2px);
}

.visual-platform__screen {
  position: absolute;
  inset: 0 34px 28px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-xl);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(226, 238, 255, 0.96));
  box-shadow:
    0 26px 44px rgba(6, 36, 111, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.visual-platform__screen::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(61, 141, 255, 0.14);
}

.visual-platform__screen-inner {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 128px;
  height: 128px;
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, rgba(61, 199, 255, 0.18), rgba(124, 104, 255, 0.14));
  color: #2d73ff;
  font-size: 28px;
  font-weight: 800;
}

.visual-platform__screen-inner--logo {
  color: var(--primary);
}

.visual-logo {
  width: 84px;
  height: 84px;
  stroke: none;
  fill: currentColor;
  filter: drop-shadow(0 10px 18px rgba(20, 43, 111, 0.18));
}

.visual-card {
  position: absolute;
  display: grid;
  place-items: center;
  min-width: 92px;
  min-height: 92px;
  padding: 16px;
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.18);
  border: 0;
  box-shadow: 0 20px 36px rgba(13, 43, 123, 0.18);
  backdrop-filter: blur(14px);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.visual-card--top {
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
}

.visual-card--left {
  top: 50%;
  left: 6px;
  transform: translateY(-50%);
}

.visual-card--right {
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
}

.visual-card--bottom {
  left: 50%;
  bottom: 8px;
  transform: translateX(-50%);
}

.visual-shield,
.visual-doc,
.visual-scale {
  position: absolute;
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, 0.14);
  border: 0;
  box-shadow: 0 20px 36px rgba(13, 43, 123, 0.18);
  backdrop-filter: blur(14px);
}

.visual-shield {
  top: 40px;
  right: 88px;
  display: grid;
  place-items: center;
  width: 72px;
  height: 88px;
  clip-path: polygon(50% 0%, 90% 14%, 90% 50%, 50% 100%, 10% 50%, 10% 14%);
  color: #fff;
  font-size: 28px;
  font-weight: 800;
}

.visual-doc {
  right: 22px;
  bottom: 48px;
  width: 84px;
  height: 108px;
  display: grid;
  place-items: center;
}

.visual-doc strong,
.visual-scale strong {
  color: rgba(255, 255, 255, 0.94);
  font-size: 28px;
  font-weight: 800;
}

.visual-scale {
  left: 38px;
  bottom: 54px;
  width: 88px;
  height: 88px;
  display: grid;
  place-items: center;
}

.visual-glow {
  position: absolute;
  inset: 24px;
  border-radius: 50%;
  border: 0;
}

.entry-section {
  margin-top: 0;
  position: relative;
  z-index: 2;
  padding-top: 8px;
}

.core-services-section {
  padding: 80px 0;
  background: var(--bg);
}

.core-services-section .section-heading {
  max-width: 720px;
  margin: 0 auto 48px;
  text-align: center;
}

.core-services-section .section-heading h2 {
  margin: 0 0 12px;
  font-size: 36px;
  font-weight: 600;
  color: var(--text);
}

.core-services-section .section-heading p {
  margin: 0;
  font-size: 16px;
  color: var(--text-light);
}

.core-services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.service-card {
  display: flex;
  flex-direction: column;
  padding: 32px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  transition: all 200ms ease;
}

.service-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow);
}

.service-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: 20px;
  color: var(--primary);
}

.service-card__icon svg {
  width: 32px;
  height: 32px;
  stroke-width: 2;
}

.service-card h3 {
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}

.service-card p {
  margin: 0 0 20px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--text-light);
  flex: 1;
}

.service-card__link {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  font-weight: 600;
  color: var(--primary);
  transition: all 200ms ease;
}

.service-card__link:hover {
  color: var(--accent);
}

.section-inner {
  padding: 0 0 56px;
}

.section-heading {
  max-width: 720px;
  margin: 0 auto 28px;
  text-align: center;
}

.section-heading__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  margin-bottom: 12px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.section-heading h2 {
  margin: 0 0 8px;
  font-size: 30px;
  font-weight: 600;
}

.section-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.85;
}

.section-heading--light h2,
.section-heading--light p {
  color: #fff;
}

.section-heading__eyebrow--light {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
}

.home-grid {
  display: grid;
  gap: 22px;
}

.home-grid--primary {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.icon-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 160px;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
  cursor: pointer;
}

.icon-card:hover {
  box-shadow: var(--shadow-hover);
  border-color: var(--primary);
}

.icon-card__badge {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(180, 83, 9, 0.1);
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
}

.icon-card--recent {
  border-color: var(--primary);
  box-shadow: var(--shadow-hover);
}

.icon-card--recent .icon-card__icon {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
}

.icon-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: var(--radius-xl);
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
  box-shadow: 0 6px 12px rgba(30, 58, 138, 0.18);
  transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
}

.icon-card strong {
  font-size: 18px;
  font-weight: 600;
}

.icon-card__desc {
  margin: 2px 0 0;
  max-width: 230px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
  opacity: 1;
}

.icon-card:hover .icon-card__icon,
.icon-card:focus-visible .icon-card__icon {
  box-shadow: var(--shadow-elevated);
  background: linear-gradient(135deg, var(--primary-dark), var(--primary-light));
}

.icon-card:hover .icon-card__desc,
.icon-card:focus-visible .icon-card__desc {
  opacity: 1;
}

.stats-section {
  padding: 60px 0 72px;
  background: #142B6F;
  color: #FFFFFF;
}

.stats-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.stat-card {
  display: grid;
  align-content: center;
  min-height: 136px;
  padding: 24px 18px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
  text-align: center;
  transition: transform 200ms ease, box-shadow 200ms ease, background 200ms ease;
}

.stat-card:hover {
  background: rgba(255, 255, 255, 0.12);
}

.stat-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 28px;
  font-weight: 600;
}

.stat-card span {
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
}

.consult-section {
  padding: 60px 0 76px;
  background: var(--bg);
}

.news-entry-section {
  padding: 72px 0;
  background: var(--bg);
}

.news-entry-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
  cursor: pointer;
}

.news-entry-card:hover {
  box-shadow: var(--shadow-hover);
  border-color: var(--primary);
}

.news-entry-card__copy {
  display: grid;
  gap: 8px;
}

.news-entry-card__copy strong {
  font-size: 20px;
  font-weight: 800;
}

.news-entry-card__copy span {
  color: var(--text-muted);
  font-size: 14px;
}

.news-entry-card__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(30, 58, 138, 0.1), rgba(59, 130, 246, 0.1));
  color: var(--primary);
  font-size: 24px;
  font-weight: 800;
  transition: all 200ms ease;
}

.news-entry-card:hover .news-entry-card__arrow {
  background: linear-gradient(135deg, var(--primary), var(--primary-light));
  color: #fff;
  transform: translateX(4px);
}

.news-qr-section {
  padding-top: 6px;
}

.news-qr-card {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 24px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.news-qr-card__copy {
  display: grid;
  align-content: center;
  gap: 14px;
}

.news-qr-card__copy strong {
  font-size: 24px;
  font-weight: 800;
}

.news-qr-card__copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.85;
}

.news-qr-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  aspect-ratio: 1 / 1;
  border: 1px dashed rgba(20, 43, 111, 0.22);
  border-radius: var(--radius-xl);
  background:
    linear-gradient(135deg, rgba(20, 43, 111, 0.05), rgba(20, 43, 111, 0.08)),
    repeating-linear-gradient(45deg, rgba(20, 43, 111, 0.03), rgba(20, 43, 111, 0.03) 10px, rgba(255, 255, 255, 0.4) 10px, rgba(255, 255, 255, 0.4) 20px);
}

.news-qr-placeholder span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--primary);
  font-size: 13px;
  font-weight: 800;
}

.consult-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.consult-summary__card {
  padding: 18px 18px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-soft);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}

.consult-summary__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 32px rgba(30, 59, 120, 0.12);
  border-color: rgba(20, 43, 111, 0.18);
}

.consult-summary__card strong {
  display: block;
  margin-bottom: 6px;
  color: var(--primary);
  font-size: 26px;
  font-weight: 800;
}

.consult-summary__card span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.consult-board {
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.consult-board__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  border-bottom: 1px solid var(--border-light);
  background: var(--surface-soft);
}

.consult-board__live {
  display: none;
}

.consult-board__live strong {
  color: var(--text);
  font-size: 14px;
  font-weight: 800;
}

.consult-board__dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--gradient-primary);
  box-shadow: 0 0 0 8px rgba(20, 43, 111, 0.12);
  animation: consult-pulse 1.8s ease-in-out infinite;
}

.consult-board__meta-text {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.consult-board__head,
.consult-row {
  display: grid;
  grid-template-columns: 150px 120px 110px 110px minmax(0, 1fr) 96px;
  gap: 16px;
  align-items: center;
}

.consult-board__head {
  padding: 18px 24px;
  background: #F9FAFB;
  color: #374151;
  font-size: 13px;
  font-weight: 600;
}

.consult-board__list {
  position: relative;
  height: 364px;
  overflow: hidden;
}

.consult-board__list::before,
.consult-board__list::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 42px;
  z-index: 2;
  pointer-events: none;
}

.consult-board__list::before {
  top: 0;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0));
}

.consult-board__list::after {
  bottom: 0;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0));
}

.consult-board__track {
  display: grid;
  animation: consult-scroll 26s linear infinite;
}

.consult-board__list:hover .consult-board__track {
  animation-play-state: paused;
}

.consult-row {
  padding: 18px 24px;
  border-top: 1px solid rgba(97, 123, 177, 0.1);
  font-size: 14px;
  transition: background 0.18s ease, transform 0.18s ease;
}

.consult-row:nth-child(odd) {
  background: rgba(247, 250, 255, 0.72);
}

.consult-row:hover {
  background: linear-gradient(135deg, rgba(20, 43, 111, 0.04), rgba(20, 43, 111, 0.04));
  transform: translateX(2px);
}

.consult-row span {
  color: var(--muted);
}

.consult-row strong {
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.75;
}

.consult-row__phone {
  color: var(--primary) !important;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.consult-row__category {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  max-width: fit-content;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: #3c5f95 !important;
  font-size: 12px;
  font-weight: 700;
}

.consult-row__status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

.consult-row__status.is-resolved {
  background: rgba(39, 200, 154, 0.12);
  color: #1ca57c;
}

.consult-row__status.is-pending {
  background: rgba(255, 166, 0, 0.12);
  color: #cc7b00;
}

@keyframes consult-scroll {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}

@keyframes consult-pulse {
  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 8px rgba(20, 43, 111, 0.12);
  }
  50% {
    transform: scale(1.12);
    box-shadow: 0 0 0 12px rgba(20, 43, 111, 0.05);
  }
}

@media (prefers-reduced-motion: reduce) {
  .consult-board__track {
    animation: none;
  }

  .consult-board__dot {
    animation: none;
  }

  .consult-row:hover {
    transform: none;
  }
}

.site-footer {
  background: #0F172A;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.75);
}

.site-footer__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 28px 0 14px;
}

.footer-brand__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.footer-brand__mark {
  width: 38px;
  height: 38px;
  background: transparent;
}

.footer-brand strong,
.footer-links h3 {
  font-size: 17px;
  font-weight: 800;
}

.footer-brand p {
  margin: 0;
  color: var(--muted);
  line-height: 1.85;
  font-size: 13px;
}

.footer-center {
  display: flex;
  justify-content: center;
  width: 100%;
}

.footer-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}

.footer-links > div {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
  text-align: center;
}

.footer-links a {
  display: inline-flex;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
  cursor: pointer;
  transition: color 200ms ease;
}

.footer-links a:hover {
  color: #FFFFFF;
}

.footer-sites {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 24px;
  width: var(--wrap);
  margin: 0 auto;
  padding: 0 0 28px;
}

.footer-sites a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 12px;
  cursor: pointer;
  transition: color 200ms ease;
}

.footer-sites a:hover {
  color: #FFFFFF;
}

.footer-records {
  display: grid;
  place-items: center;
  gap: 6px;
  padding: 16px 16px 18px;
  background: #0F172A;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
}

.footer-records p {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.footer-records__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px 14px;
}

.footer-records__links a {
  color: #eef4ff;
  font-size: 12px;
  opacity: 0.96;
}

.footer-records__links a:hover {
  opacity: 1;
}

.submenu-page {
  min-height: 100vh;
  background: var(--bg);
}

.submenu-shell {
  padding: 28px 0 40px;
}

.submenu-topbar {
  display: none;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  z-index: 12;
  padding: 14px 18px;
  border: 1px solid rgba(97, 123, 177, 0.12);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(14px);
  box-shadow: var(--shadow);
}

.back-link,
.home-link {
  color: var(--primary);
  font-weight: 700;
  font-size: 14px;
}

.home-link {
  color: var(--text);
}

.submenu-topbar .home-link {
  display: none;
}

.submenu-hero,
.panel-grid-section,
.query-section,
.case-list-section,
.law-results-hero,
.law-search-panel,
.law-upload-panel,
.law-results-toolbar,
.law-result-card,
.law-detail-hero,
.law-detail-card,
.tool-hero,
.tool-card,
.generate-hero,
.generate-card,
.generate-disclaimer,
.case-detail-hero,
.case-detail-card,
.dashboard-hero,
.dashboard-stat,
.dashboard-card,
.detail-hero,
.detail-block,
.detail-side__card,
.auth-hero,
.auth-panel {
  animation: page-rise 320ms ease both;
}

@keyframes page-rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}

.submenu-hero {
  margin-bottom: 20px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-soft);
  position: relative;
  overflow: hidden;
  text-align: center;
}

.submenu-hero::after {
  content: "";
  position: absolute;
  right: -30px;
  top: -30px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(63, 199, 255, 0.16), transparent 70%);
  pointer-events: none;
}

.submenu-hero h1 {
  margin: 0 0 10px;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.submenu-hero p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  max-width: 720px;
  display: none;
}

.panel-grid-section {
  padding: 4px 0 0;
}

/* Query and Case section intro headings */
.query-intro,
.case-intro {
  margin-bottom: 20px;
}

.query-intro h2,
.case-intro h2 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
}

.query-intro p,
.case-intro p {
  margin: 0;
  color: var(--text-muted);
  font-size: 15px;
  line-height: 1.6;
}

.query-category-section h3 {
  margin: 24px 0 16px;
  font-size: 18px;
  font-weight: 600;
}

.panel-grid-section--hidden {
  display: none;
}

.panel-grid-section h2 {
  display: none;
}

.panel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.panel-grid--tools {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.panel-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: var(--card-min-md);
  padding: 24px;
  border: 1px solid #d9e4e7;
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: 0 6px 18px rgba(30, 59, 120, 0.06);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.panel-tile:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
}

.panel-tile__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(20, 43, 111, 0.12), rgba(20, 43, 111, 0.1));
  color: var(--primary);
}

.panel-tile__icon svg {
  width: 28px;
  height: 28px;
}

.panel-tile strong {
  color: #1d2b43;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.panel-tile p {
  margin: 0;
  color: #6f819c;
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

.panel-note {
  margin-top: 16px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.08);
  color: #4b627f;
  font-size: 13px;
  line-height: 1.75;
}

.query-section,
.case-list-section {
  padding: var(--space-lg) 0;
}

.query-section--hidden {
  display: none;
}

.query-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-soft);
}

.query-search input {
  width: 100%;
  min-height: var(--button-height);
  padding: 0 16px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: #fff;
  outline: none;
  font: inherit;
}

.query-search button {
  min-width: 96px;
  min-height: var(--button-height);
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.query-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.query-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 110px;
  padding: 20px 16px;
  border: 1px solid #d8e3e6;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(30, 59, 120, 0.06);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.query-category-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
}

.query-category-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(20, 43, 111, 0.12), rgba(20, 43, 111, 0.1));
  color: var(--primary);
}

.query-category-card__icon svg {
  width: 28px;
  height: 28px;
}

.query-category-card strong {
  color: #1d2b43;
  font-size: 15px;
  font-weight: 700;
}

.query-helper-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 18px;
}

.query-helper-card {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: var(--card-min-md);
  padding: 24px;
  border: 1px solid #d8e3e6;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(30, 59, 120, 0.06);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.query-helper-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-hover);
}

.query-helper-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: var(--primary);
}

.query-helper-card__icon svg {
  width: 24px;
  height: 24px;
}

.query-helper-card strong {
  display: block;
  margin-bottom: 6px;
  font-size: 15px;
}

.query-helper-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.75;
}

.query-upload {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
  padding: 24px;
  border: 1px dashed rgba(20, 43, 111, 0.24);
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 247, 255, 0.94));
}

.query-upload__copy strong {
  display: block;
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 800;
}

.query-upload__copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  font-size: 13px;
}

.query-upload button {
  min-width: 118px;
  min-height: var(--button-height);
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.case-list-section--hidden {
  display: none;
}

.case-simple-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.case-simple-search input {
  width: 100%;
  min-height: var(--button-height);
  padding: 0 16px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: #fff;
  outline: none;
  font: inherit;
}

.case-simple-search button {
  min-width: 96px;
  min-height: var(--button-height);
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.case-list {
  display: grid;
  gap: 16px;
}

.case-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 20px rgba(30, 59, 120, 0.06);
}

.case-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.case-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.case-card__actions {
  display: flex;
  align-items: center;
}

.case-card__top h3 {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.4;
}

.case-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.case-card__meta span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.case-card__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: var(--radius-sm);
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  transition: all 200ms ease;
  white-space: nowrap;
}

.case-card__head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
}

.case-card__icon {
  color: #7f8ba2;
}

.case-card__icon svg {
  width: 20px;
  height: 20px;
}

.case-card__tags {
  margin-top: 10px;
}

.case-card__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.case-card__summary {
  margin: 16px 0;
  color: #4e6076;
  line-height: 1.8;
  font-size: 14px;
}

.case-card__points strong {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--primary);
  font-size: 13px;
}

.case-card__points ul {
  margin: 10px 0 0;
  padding-left: 18px;
  color: #1d2b43;
  line-height: 1.9;
  font-size: 13px;
}

.case-card__laws {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.case-card__laws span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid rgba(97, 123, 177, 0.14);
  border-radius: var(--radius-md);
  background: #fff;
  color: #1d2b43;
  font-size: 12px;
  font-weight: 700;
}

.case-card--empty h3 {
  margin: 0;
}

.law-results-page,
.law-detail-page {
  min-height: 100vh;
  background: var(--bg);
}

.law-results-shell,
.law-detail-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.law-results-hero,
.law-detail-hero {
  margin-bottom: 20px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(235, 245, 255, 0.95));
  box-shadow: var(--shadow-soft);
}

.law-results-hero__eyebrow,
.law-detail-hero__meta span {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.law-detail-hero__top,
.case-detail-hero__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.law-results-hero h1,
.law-detail-hero h1 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.law-results-hero p,
.law-detail-hero p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  max-width: 760px;
}

.law-search-panel,
.law-results-toolbar,
.law-detail-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.law-search-panel {
  padding: 24px;
}

.law-search-panel__form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
}

.law-search-shelf,
.case-search-shelf {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}

.law-search-shelf__group,
.case-search-shelf__group {
  display: grid;
  gap: 10px;
}

.law-search-shelf__group strong,
.case-search-shelf__group strong {
  font-size: 14px;
  font-weight: 800;
}

.law-search-shelf__chips,
.case-search-shelf__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.law-search-shelf__chip,
.case-search-shelf__chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.law-search-shelf__chip--muted,
.case-search-shelf__chip--muted {
  background: rgba(97, 123, 177, 0.08);
  color: #56709b;
}

.law-search-shelf__empty,
.case-search-shelf__empty {
  color: var(--muted);
  font-size: 13px;
}

.law-search-panel__form input {
  width: 100%;
  min-height: var(--button-height);
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: #fff;
  outline: none;
  font: inherit;
}

.law-search-panel__form button,
.law-upload-panel__action button {
  min-width: 108px;
  min-height: var(--button-height);
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.query-search button:hover,
.case-simple-search button:hover,
.law-search-panel__form button:hover,
.law-result-card__action:hover,
.case-card__link:hover,
.tool-actions button:hover,
.generate-actions button:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-hover);
}

.law-search-panel__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.law-filter-bar {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(97, 123, 177, 0.12);
}

.law-filter-group {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.law-filter-group strong {
  font-size: 14px;
  font-weight: 800;
}

.law-chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.06);
  color: #44689e;
  font-size: 13px;
  font-weight: 700;
}

.law-chip.is-active {
  background: var(--gradient-primary);
  color: #fff;
}

.law-filter-chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.06);
  color: #4d678e;
  font-size: 12px;
  font-weight: 700;
}

.law-filter-chip.is-active {
  background: var(--gradient-primary);
  color: #fff;
}

.law-upload-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  margin-top: 16px;
  padding: 24px;
  border: 1px dashed rgba(20, 43, 111, 0.22);
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(239, 247, 255, 0.94));
}

.law-upload-panel--hidden,
.law-empty--hidden {
  display: none;
}

.law-upload-panel__copy strong {
  display: block;
  margin-bottom: 8px;
  font-size: 17px;
  font-weight: 800;
}

.law-upload-panel__copy p,
.law-upload-panel__feedback p,
.law-empty p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.law-upload-panel__action {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.law-upload-panel__feedback {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.law-upload-panel__feedback strong {
  font-size: 14px;
}

.law-upload-panel__tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.1);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.law-results-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 16px;
  padding: 18px 20px;
}

.law-results-toolbar strong {
  font-size: 28px;
  font-weight: 800;
}

.law-results-toolbar span,
.law-results-toolbar__meta {
  color: var(--muted);
  font-size: 13px;
}

.law-results-toolbar__actions,
.case-toolbar__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.law-results-list {
  display: grid;
  gap: 16px;
  margin-top: 16px;
}

.law-result-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.law-result-card__meta,
.law-result-card__tags,
.law-detail-hero__meta,
.law-detail-hero__tags,
.case-detail-hero__meta,
.case-detail-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.law-result-card__meta span,
.law-result-card__tags span,
.law-detail-hero__tags span,
.case-detail-hero__meta span,
.case-detail-hero__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.favorite-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 118px;
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(20, 43, 111, 0.18);
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.06);
  color: var(--primary);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
}

.favorite-button:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-hover);
}

.favorite-button.is-active {
  border-color: transparent;
  background: var(--gradient-primary);
  color: #fff;
}

.law-result-card h2 {
  margin: 16px 0 8px;
  font-size: 22px;
  font-weight: 800;
}

.law-result-card h2 a:hover,
.law-related-link:hover strong {
  color: var(--primary);
}

.law-result-card__article {
  display: block;
  color: var(--primary);
  font-size: 14px;
  font-weight: 700;
}

.law-result-card__summary {
  margin: 14px 0;
  color: #4e6076;
  line-height: 1.8;
}

.law-result-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 16px;
}

.law-result-card__info {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  color: var(--muted);
  font-size: 13px;
}

.law-result-card__action,
.law-empty a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.law-empty {
  margin-top: 18px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
  text-align: center;
}

.law-empty strong {
  display: block;
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 800;
}

.law-empty a {
  margin-top: 18px;
}

.law-empty__links,
.case-empty-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
}

.law-empty__links a,
.case-empty-links a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.law-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: var(--module-gap);
}

.law-detail-main {
  display: grid;
  gap: var(--module-gap);
}

.law-detail-card {
  padding: 24px;
}

.law-detail-card h2,
.law-detail-card h3 {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
}

.law-detail-info {
  display: grid;
  gap: 12px;
}

.law-detail-info__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(97, 123, 177, 0.12);
}

.law-detail-info__row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.law-detail-info__row span,
.law-related-link span {
  color: var(--muted);
  font-size: 13px;
}

.law-detail-info__row strong,
.law-article-card strong,
.law-highlight-card strong,
.law-related-link strong {
  font-size: 15px;
  font-weight: 700;
}

.law-article-list,
.law-highlight-list,
.law-related-list {
  display: grid;
  gap: 14px;
}

.law-article-card,
.law-highlight-card,
.law-related-link {
  display: grid;
  gap: 8px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.law-article-card p,
.law-highlight-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.85;
}

.tool-page {
  min-height: 100vh;
  background: var(--bg);
}

.tool-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.tool-hero {
  margin-bottom: 20px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(235, 245, 255, 0.95));
  box-shadow: var(--shadow-soft);
}

.tool-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.tool-hero h1 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.tool-hero p,
.tool-side__item p,
.tool-result__note {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  max-width: 760px;
}

.tool-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.tool-hero__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.tool-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--module-gap);
}

.tool-main,
.tool-side {
  display: grid;
  gap: var(--module-gap);
}

.tool-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.tool-card h2,
.tool-card h3 {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
}

.tool-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.tool-form__field {
  display: grid;
  gap: 8px;
}

.tool-form__field span {
  font-size: 14px;
  font-weight: 700;
}

.tool-form__field input,
.tool-form__field select {
  width: 100%;
  min-height: var(--button-height);
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.18);
  border-radius: var(--radius-md);
  background: #f8fbff;
  outline: none;
  font: inherit;
}

.tool-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
}

.tool-actions button {
  min-height: var(--button-height);
  padding: 0 18px;
  border: 0;
  border-radius: var(--radius-md);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.tool-actions button:first-child {
  background: var(--gradient-primary);
  color: #fff;
}

.tool-actions__secondary {
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
}

.tool-result {
  display: grid;
  gap: 16px;
}

.tool-result__tools,
.generate-preview__tools {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.tool-copy,
.generate-copy {
  min-height: 40px;
  padding: 0 16px;
  border: 0;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.tool-copy:hover,
.generate-copy:hover {
  background: rgba(20, 43, 111, 0.14);
}

.tool-result--empty {
  padding: 18px;
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.tool-result--empty strong {
  font-size: 18px;
  font-weight: 800;
}

.tool-result__headline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(20, 43, 111, 0.08), rgba(20, 43, 111, 0.12));
}

.tool-result__headline strong {
  font-size: 18px;
  font-weight: 800;
}

.tool-result__headline span {
  color: var(--primary);
  font-size: 24px;
  font-weight: 800;
}

.tool-result__list {
  display: grid;
  gap: 12px;
}

.tool-result__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.tool-result__row span {
  color: var(--muted);
  font-size: 13px;
}

.tool-result__row strong,
.tool-side__item strong {
  font-size: 15px;
  font-weight: 700;
}

.tool-side__list {
  display: grid;
  gap: 12px;
}

.tool-side__item {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.generate-page {
  min-height: 100vh;
  background: var(--bg);
}

.generate-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.generate-hero {
  margin-bottom: 16px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(235, 245, 255, 0.95));
  box-shadow: var(--shadow-soft);
  text-align: center;
}

.generate-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.generate-hero h1 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.generate-hero p,
.generate-side__item p,
.generate-preview--empty p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  max-width: 760px;
}

.generate-hero p {
  margin-left: auto;
  margin-right: auto;
}

.generate-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
  justify-content: center;
}

.generate-hero__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.generate-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.generate-tab {
  display: inline-flex;
  align-items: center;
  min-height: var(--button-height);
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--line);
  color: #4d678e;
  font-size: 13px;
  font-weight: 700;
  box-shadow: var(--shadow-soft);
}

.generate-tab.is-active {
  background: var(--gradient-primary);
  color: #fff;
  border-color: transparent;
}

.generate-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--module-gap);
}

.generate-main,
.generate-side {
  display: grid;
  gap: var(--module-gap);
}

.generate-card {
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.generate-card h2,
.generate-card h3 {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
}

.generate-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.generate-form__field {
  display: grid;
  gap: 8px;
}

.generate-form__field:nth-child(4n + 4),
.generate-form__field textarea {
  grid-column: 1 / -1;
}

.generate-form__field span {
  font-size: 14px;
  font-weight: 700;
}

.generate-form__field input,
.generate-form__field select,
.generate-form__field textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(97, 123, 177, 0.18);
  border-radius: var(--radius-md);
  background: #f8fbff;
  outline: none;
  font: inherit;
}

.generate-form__field textarea {
  min-height: 120px;
  resize: vertical;
}

.generate-form__field input[type="file"] {
  padding: 10px 12px;
  background: linear-gradient(180deg, #ffffff, #f4f9ff);
}

.generate-form__hint {
  color: #6f819c;
  font-size: 12px;
  line-height: 1.6;
}

.generate-actions {
  display: flex;
  gap: 12px;
  margin-top: 18px;
}

.generate-actions button {
  min-height: var(--button-height);
  padding: 0 18px;
  border: 0;
  border-radius: var(--radius-md);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.generate-actions button:first-child {
  background: var(--gradient-primary);
  color: #fff;
}

.generate-actions__secondary {
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
}

.generate-preview {
  display: grid;
  gap: 16px;
}

.generate-preview--empty {
  padding: 18px;
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.generate-preview--empty strong {
  font-size: 18px;
  font-weight: 800;
}

.generate-preview__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(20, 43, 111, 0.08), rgba(20, 43, 111, 0.12));
}

.generate-preview__head strong {
  font-size: 18px;
  font-weight: 800;
}

.generate-preview__head span {
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.generate-preview__body {
  margin: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  color: #1b2941;
  font: 14px/1.9 "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  white-space: pre-wrap;
}

.generate-preview__editor {
  width: 100%;
  min-height: 320px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  color: #1b2941;
  font: 14px/1.9 "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  resize: vertical;
}

.generate-side__list {
  display: grid;
  gap: 12px;
}

.generate-side__item {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.generate-side__item strong {
  font-size: 15px;
  font-weight: 700;
}

.generate-disclaimer {
  margin-top: 16px;
  padding: 16px 20px;
  border: 1px dashed rgba(20, 43, 111, 0.2);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.86);
}

.generate-disclaimer p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
  text-align: center;
}

.case-detail-page {
  min-height: 100vh;
  background: var(--bg);
}

.case-detail-shell {
  padding-bottom: 0;
}

.case-detail-content {
  padding: var(--space-xl) 0 var(--space-3xl);
}

.inner-hero__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}

.case-detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--space-lg);
  align-items: start;
}

.case-detail-main,
.case-detail-side {
  display: grid;
  gap: var(--space-md);
}

.case-detail-side {
  position: sticky;
  top: 20px;
}

.case-detail-card {
  padding: 28px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  transition: all 200ms ease;
}

.case-detail-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow);
}

.case-detail-card--side {
  background: var(--surface-soft);
}

.case-detail-card--side:hover {
  background: var(--surface);
}

.case-detail-card h2 {
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--border);
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}

.case-detail-card h3 {
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}

.case-detail-card p {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.8;
  font-size: 14.5px;
}

.case-detail-card #case-detail-focus p {
  padding: 12px 16px;
  margin-bottom: 8px;
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  border: 1px solid var(--border-light);
  font-weight: 500;
  color: var(--text-muted);
  line-height: 1.7;
}

.case-detail-card #case-detail-focus p:last-child {
  margin-bottom: 0;
}

.case-detail-card #case-detail-basis p {
  padding: 12px 16px;
  margin-bottom: 8px;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.04);
  border: 1px solid var(--border-light);
  font-size: 13.5px;
  color: var(--text-muted);
  line-height: 1.7;
}

.case-detail-card #case-detail-basis p:last-child {
  margin-bottom: 0;
}

.case-detail-card #case-detail-value p {
  padding: 12px 16px;
  margin-bottom: 8px;
  border-radius: var(--radius-md);
  background: rgba(5, 150, 105, 0.04);
  border: 1px solid var(--border-light);
  font-size: 13.5px;
  color: var(--text-muted);
  line-height: 1.7;
}

.case-detail-card #case-detail-value p:last-child {
  margin-bottom: 0;
}

.case-detail-hero__meta,
.case-detail-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.case-detail-hero__meta span,
.case-detail-hero__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.case-detail-list,
.case-detail-laws,
.case-detail-points {
  display: grid;
  gap: 12px;
}

.case-detail-list__item,
.case-detail-laws__item,
.case-detail-points__item,
.case-detail-meaning {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.case-detail-list__item strong,
.case-detail-laws__item strong,
.case-detail-points__item strong,
.case-detail-meaning strong {
  font-size: 15px;
  font-weight: 700;
}

.case-detail-laws__item span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-page {
  min-height: 100vh;
  background: var(--bg);
}

.dashboard-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.dashboard-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 16px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(235, 245, 255, 0.95));
  box-shadow: var(--shadow-soft);
}

.dashboard-hero__copy {
  max-width: 620px;
}

.dashboard-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.dashboard-hero h1 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
}

.dashboard-hero p,
.dashboard-grid__item span,
.dashboard-list__item span,
.dashboard-side__item span {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.dashboard-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.dashboard-hero__tags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.dashboard-summary {
  min-width: 290px;
  padding: 20px;
  border: 1px solid rgba(20, 43, 111, 0.12);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(242, 248, 255, 0.94));
  box-shadow: var(--shadow-hover);
}

.dashboard-summary__top {
  display: grid;
  gap: 6px;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(97, 123, 177, 0.12);
}

.dashboard-summary__top strong {
  font-size: 20px;
  font-weight: 800;
}

.dashboard-summary__top span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-summary__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0;
  color: var(--muted);
  font-size: 13px;
}

.dashboard-summary__meta strong {
  color: var(--text);
  font-size: 14px;
  font-weight: 700;
}

.dashboard-logout {
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.dashboard-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 16px;
}

.dashboard-stat {
  min-height: var(--card-min-md);
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
  text-align: center;
}

.dashboard-stat strong {
  display: block;
  margin-bottom: 8px;
  font-size: 28px;
  font-weight: 800;
}

.dashboard-stat span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--module-gap);
}

.dashboard-main,
.dashboard-side {
  display: grid;
  gap: var(--module-gap);
}

.dashboard-card {
  padding: var(--module-pad);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.dashboard-card h2,
.dashboard-card h3 {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
}

.dashboard-card--actions {
  display: grid;
  gap: 18px;
}

.dashboard-links {
  display: grid;
  gap: 12px;
}

.dashboard-links a {
  display: block;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  color: var(--text);
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  transition: all 200ms ease;
}

.dashboard-links a:hover {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
  transform: translateX(4px);
}

.dashboard-card--recent {
  min-height: 100%;
}

.dashboard-empty {
  display: grid;
  gap: 8px;
  padding: 18px;
  border: 1px dashed rgba(97, 123, 177, 0.2);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.dashboard-empty strong {
  font-size: 15px;
  font-weight: 700;
}

.dashboard-empty span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
}

.dashboard-grid,
.dashboard-list,
.dashboard-side__list {
  display: grid;
  gap: 12px;
}

.dashboard-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-grid--main {
  align-items: start;
}

.dashboard-grid__item,
.dashboard-list__item,
.dashboard-side__item {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
  transition: all 200ms ease;
}

a.dashboard-list__item {
  cursor: pointer;
}

a.dashboard-list__item:hover {
  background: var(--surface);
  border-color: var(--primary);
  transform: translateX(4px);
}

.dashboard-grid__item strong,
.dashboard-list__item strong,
.dashboard-side__item strong {
  font-size: 15px;
  font-weight: 700;
}

.records-page {
  min-height: 100vh;
  background: var(--bg);
}

.records-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.records-hero {
  margin-bottom: 16px;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(235, 245, 255, 0.95));
  box-shadow: var(--shadow-soft);
}

.records-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.records-hero h1 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
}

.records-hero p,
.records-item span,
.records-empty p,
.records-item p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.records-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.records-manage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.records-manage--hidden {
  display: none;
}

.records-manage__check,
.records-item__check {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
}

.records-manage__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.records-manage__filters {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}

.records-manage__search,
.records-manage__select {
  min-height: 42px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--text);
  font: inherit;
}

.records-manage__search {
  flex: 1;
  min-width: 220px;
  padding: 0 14px;
}

.records-manage__select {
  min-width: 140px;
  padding: 0 12px;
}

.records-manage__actions span {
  color: var(--muted);
  font-size: 13px;
}

.records-manage__actions button,
.records-item__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(20, 43, 111, 0.14);
  background: rgba(20, 43, 111, 0.06);
  color: var(--primary);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.records-manage__actions button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.records-tab {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--line);
  color: #4d678e;
  font-size: 13px;
  font-weight: 700;
  box-shadow: var(--shadow-soft);
}

.records-tab.is-active {
  background: var(--gradient-primary);
  color: #fff;
  border-color: transparent;
}

.records-list {
  display: grid;
  gap: 16px;
}

.records-item {
  display: grid;
  gap: 10px;
  padding: var(--module-pad);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.records-item--favorite {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
}

.records-item__main {
  min-width: 0;
}

.records-item__link {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.records-item__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.records-item__action--ghost {
  text-decoration: none;
}

.records-item__action--danger {
  border-color: rgba(240, 92, 92, 0.16);
  background: rgba(240, 92, 92, 0.08);
  color: #d84747;
}

.records-item strong {
  font-size: 16px;
  font-weight: 800;
}

.records-item p {
  padding-top: 4px;
  border-top: 1px solid rgba(97, 123, 177, 0.1);
  font-size: 13px;
}

.records-empty {
  margin-top: 16px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
  text-align: center;
}

.records-empty--hidden {
  display: none;
}

.records-empty strong {
  display: block;
  margin-bottom: 10px;
  font-size: 22px;
  font-weight: 800;
}

.records-empty a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-top: 18px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.auth-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(124, 104, 255, 0.16), transparent 22%),
    linear-gradient(135deg, #eef5ff 0%, #f8fbff 100%);
}

.auth-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 460px;
  gap: 26px;
  width: var(--wrap);
  min-height: 100vh;
  margin: 0 auto;
  padding: 32px 0;
  align-items: stretch;
}

.auth-hero,
.auth-panel {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow);
}

.auth-hero {
  position: relative;
  padding: 28px 34px;
  background:
    radial-gradient(circle at 24% 20%, rgba(255, 255, 255, 0.12), transparent 24%),
    linear-gradient(130deg, var(--hero-a), var(--hero-b), var(--hero-c));
  color: #fff;
}

.auth-hero::after {
  content: "";
  position: absolute;
  right: -60px;
  bottom: -60px;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.14), transparent 68%);
}

.auth-hero__content {
  position: relative;
  z-index: 1;
  max-width: 440px;
}

.auth-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 0;
  font-size: 13px;
  font-weight: 700;
}

.auth-hero h1 {
  margin: 18px 0 14px;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.15;
}

.auth-hero p {
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  line-height: 1.8;
}

.auth-points {
  display: grid;
  gap: 12px;
  padding: 0;
  margin: 28px 0 0;
  list-style: none;
}

.auth-points li {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.12);
  border: 0;
}

.auth-panel {
  padding: 28px;
  background: rgba(255, 255, 255, 0.94);
}

.auth-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 6px;
  border-radius: 999px;
  background: #eef4ff;
}

.auth-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border-radius: 999px;
  color: var(--muted);
  font-weight: 700;
}

.auth-tab.is-active {
  background: #fff;
  color: var(--primary);
  box-shadow: 0 10px 20px rgba(30, 59, 120, 0.08);
}

.auth-form-wrap {
  margin-top: 26px;
}

.auth-form-wrap--hidden {
  display: none;
}

.auth-heading h2 {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 800;
}

.auth-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.auth-form {
  display: grid;
  gap: 16px;
  margin-top: 24px;
}

.auth-form label {
  display: grid;
  gap: 8px;
}

.auth-form span {
  font-size: 14px;
  font-weight: 700;
}

.auth-form input {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.18);
  border-radius: var(--radius-md);
  background: #f8fbff;
  outline: none;
}

.auth-form input:focus {
  border-color: rgba(20, 43, 111, 0.32);
  box-shadow: 0 0 0 4px rgba(20, 43, 111, 0.08);
}

.auth-form__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: var(--muted);
  font-size: 13px;
}

.auth-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.auth-check input {
  width: 16px;
  min-height: 16px;
  height: 16px;
  margin: 0;
}

.auth-code {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}

.auth-code .auth-code__label {
  grid-column: 1 / -1;
}

.auth-code input {
  min-width: 0;
}

.auth-code button,
.auth-button {
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.auth-code button {
  min-width: 118px;
  padding: 0 14px;
}

.auth-button {
  min-height: 50px;
}

.auth-form__note {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.7;
}

.auth-form__row a {
  color: var(--primary);
  font-weight: 700;
}

.auth-form__row .auth-check span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
}

.detail-page {
  min-height: 100vh;
  background: var(--bg);
}

.detail-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.about-shell {
  width: var(--wrap);
  margin: 0 auto;
  padding: 28px 0 40px;
}

.about-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 22px;
  align-items: stretch;
  margin-bottom: 18px;
}

.about-hero__copy,
.about-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.95);
  box-shadow: var(--shadow-soft);
}

.about-hero__copy {
  padding: 32px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(236, 245, 255, 0.96)),
    linear-gradient(135deg, rgba(20, 43, 111, 0.06), rgba(20, 43, 111, 0.04));
}

.about-hero__copy h1 {
  margin: 0 0 14px;
  font-size: 38px;
  font-weight: 800;
  line-height: 1.2;
}

.about-hero__copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.9;
  font-size: 15px;
}

.about-hero__summary {
  display: grid;
  gap: 14px;
}

.about-hero__stat {
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-soft);
}

.about-hero__stat strong {
  font-size: 30px;
  font-weight: 800;
  color: var(--primary);
}

.about-hero__stat span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}

.about-intro,
.about-principles,
.about-grid {
  margin-bottom: 18px;
}

.about-panel {
  padding: 24px;
}

.about-panel--lead {
  padding: 28px 30px;
}

.about-panel h2 {
  margin: 0 0 14px;
  font-size: 24px;
  font-weight: 800;
}

.about-panel p {
  margin: 0;
  color: var(--muted);
  line-height: 1.9;
}

.about-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.about-list,
.about-principles__grid {
  display: grid;
  gap: 14px;
}

.about-list__item,
.about-principles__item {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.about-list__item strong,
.about-principles__item strong {
  font-size: 16px;
  font-weight: 800;
}

.about-list__item span,
.about-principles__item span {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
}

.about-principles__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-page {
  background: #eef2f6;
  color: #1b2432;
}

.admin-login-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at top left, rgba(84, 128, 255, 0.2), transparent 24%),
    linear-gradient(135deg, #eef4ff 0%, #f8fbff 100%);
  color: #1b2432;
}

.admin-login-shell {
  width: min(100% - 24px, 1180px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 32px 0;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) 420px;
  gap: 24px;
  align-items: stretch;
}

.admin-login-hero,
.admin-login-panel {
  border: 1px solid rgba(201, 211, 225, 0.72);
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 20px 44px rgba(35, 67, 116, 0.1);
}

.admin-login-hero {
  padding: 36px 38px;
  background:
    radial-gradient(circle at top right, rgba(73, 184, 255, 0.22), transparent 22%),
    linear-gradient(135deg, rgba(20, 43, 111, 0.96), rgba(20, 43, 111, 0.94));
  color: #fff;
}

.admin-login-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  font-size: 13px;
  font-weight: 700;
}

.admin-login-hero h1 {
  margin: 18px 0 14px;
  font-size: 40px;
  font-weight: 800;
  line-height: 1.15;
}

.admin-login-hero p {
  margin: 0;
  max-width: 560px;
  color: rgba(255, 255, 255, 0.84);
  line-height: 1.8;
}

.admin-login-points {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.admin-login-points article {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-login-points strong {
  font-size: 16px;
  font-weight: 800;
}

.admin-login-points span {
  color: rgba(255, 255, 255, 0.8);
  font-size: 13px;
  line-height: 1.7;
}

.admin-login-panel {
  padding: 34px 32px;
  align-self: center;
}

.admin-login-panel__head h2 {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 800;
  color: #173152;
}

.admin-login-panel__head p {
  margin: 0;
  color: #6d809b;
  line-height: 1.7;
}

.admin-login-form {
  display: grid;
  gap: 16px;
  margin-top: 28px;
}

.admin-login-form label {
  display: grid;
  gap: 8px;
}

.admin-login-form label span {
  color: #425a83;
  font-size: 13px;
  font-weight: 700;
}

.admin-login-form input {
  width: 100%;
  min-height: 46px;
  padding: 0 15px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-login-remember {
  display: flex !important;
  align-items: center;
  gap: 10px !important;
  min-height: 20px;
}

.admin-login-remember input {
  width: 16px;
  min-height: 16px;
  height: 16px;
  padding: 0;
  margin: 0;
  box-shadow: none;
}

.admin-login-remember span {
  font-size: 13px;
  font-weight: 700;
  color: #506989;
}

.admin-login-message {
  margin: -2px 0 0;
  min-height: 20px;
  color: #6f819c;
  font-size: 13px;
  line-height: 1.6;
}

.admin-login-message.is-error {
  color: #c14646;
}

.admin-login-message.is-success {
  color: #1f7a49;
}

.admin-login-form__submit {
  width: 100%;
  margin-top: 4px;
}

.admin-shell {
  width: min(100% - 12px, 1880px);
  margin: 6px auto;
  padding: 0;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.admin-sidebar {
  display: grid;
  gap: 16px;
  padding: 16px 12px;
  position: sticky;
  top: 6px;
  min-height: calc(100vh - 12px);
  align-self: start;
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, #1f242d 0%, #151920 100%);
  box-shadow: 0 18px 38px rgba(14, 18, 24, 0.24);
  overflow: hidden;
}

.admin-sidebar__brand {
  display: grid;
  gap: 6px;
  padding: 12px 12px 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-sidebar__brand strong {
  color: #f5f7fb;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.35;
}

.admin-sidebar__brand span {
  color: rgba(224, 229, 238, 0.66);
  font-size: 12px;
  letter-spacing: 0.08em;
}

.admin-sidebar__nav {
  display: grid;
  gap: 8px;
}

.admin-sidebar__nav button {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  min-height: 50px;
  padding: 0 15px;
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  color: rgba(235, 240, 247, 0.82);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
  transition: background 0.2s ease, color 0.2s ease;
}

.admin-sidebar__nav button:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  transform: translateX(2px);
}

.admin-sidebar__nav button.is-active {
  background: linear-gradient(180deg, #e4eefb, #d7e6f8);
  color: #10263f;
  box-shadow: var(--shadow-hover);
}

.admin-sidebar__nav button.is-active::after {
  content: "";
  position: absolute;
  left: -12px;
  top: 8px;
  bottom: 8px;
  width: 4px;
  border-radius: 999px;
  background: var(--gradient-primary);
  box-shadow: 0 0 0 4px rgba(76, 160, 255, 0.12);
}

.admin-sidebar__nav button::before {
  display: none;
}

.admin-sidebar__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.12);
  color: inherit;
  flex: 0 0 30px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.admin-sidebar__icon svg {
  width: 16px;
  height: 16px;
}

.admin-sidebar__nav button.is-active .admin-sidebar__icon {
  background: rgba(255, 255, 255, 0.82);
  color: var(--primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-sidebar__nav button > span:last-child {
  flex: 1;
}

.admin-sidebar__foot {
  margin-top: auto;
  display: grid;
  gap: 10px;
  padding: 14px 10px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-sidebar__mini {
  display: grid;
  gap: 4px;
  padding: 12px 12px;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.admin-sidebar__mini span {
  color: rgba(224, 229, 238, 0.64);
  font-size: 12px;
}

.admin-sidebar__mini strong {
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}

.admin-main {
  display: grid;
  gap: 14px;
  padding: 14px 14px 22px 0;
}

.admin-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 60px;
  padding: 10px 18px;
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(201, 211, 225, 0.72);
  box-shadow: 0 10px 26px rgba(35, 67, 116, 0.08);
}

.admin-topbar__search {
  flex: 1;
}

.admin-topbar__search input {
  width: min(100%, 720px);
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(188, 204, 224, 0.72);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #fafcff, #f4f8ff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.admin-topbar__actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  color: #70809a;
  font-size: 13px;
  font-weight: 700;
}

.admin-topbar__link {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: #f5f8fc;
  color: #506989;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

.admin-topbar__link--button {
  border: 0;
  background: #f5f8fc;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.admin-topbar__link:hover,
.admin-topbar__link--button:hover {
  background: #ebf2fb;
  color: #1e4fc6;
}

.admin-topbar__link--danger {
  color: #b0425b;
}

.admin-topbar__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(188, 204, 224, 0.78);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #f8fbff, #f2f7ff);
  color: #587295;
  cursor: pointer;
}

.admin-topbar__icon svg {
  width: 16px;
  height: 16px;
}

.admin-topbar__status,
.admin-topbar__user {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 13px;
  border-radius: 999px;
  background: #f5f8fc;
  color: #526b8c;
  font-size: 12px;
  font-weight: 700;
}

.admin-topbar__role {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 13px;
  border-radius: 999px;
  background: #f5f8fc;
  color: #526b8c;
  font-size: 12px;
  font-weight: 700;
}

.admin-topbar__role select {
  border: 0;
  background: transparent;
  color: #18314f;
  font: inherit;
  font-weight: 800;
  outline: none;
}

.admin-topbar__status i {
  display: inline-flex;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 999px;
  background: #2ec27e;
}

.admin-topbar__hotline {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  background: linear-gradient(180deg, #edf4ff, #e6f0ff);
  color: #2452c9;
  font-size: 12px;
  font-weight: 800;
}

.admin-password-form {
  display: grid;
  gap: 14px;
}

.admin-password-form label {
  display: grid;
  gap: 8px;
}

.admin-password-form label span {
  color: #425a83;
  font-size: 13px;
  font-weight: 700;
}

.admin-password-form input {
  width: 100%;
  min-height: 44px;
  padding: 0 15px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-password-message {
  margin: 0;
  min-height: 20px;
  color: #6f819c;
  font-size: 13px;
  line-height: 1.6;
}

.admin-password-strength {
  margin: -4px 0 0;
  min-height: 20px;
  font-size: 13px;
  font-weight: 700;
  color: #6f819c;
}

.admin-password-strength.is-weak {
  color: #c14646;
}

.admin-password-strength.is-medium {
  color: #b87a19;
}

.admin-password-strength.is-strong {
  color: #1f7a49;
}

.admin-password-message.is-error {
  color: #c14646;
}

.admin-password-message.is-success {
  color: #1f7a49;
}

.admin-hero__copy,
.admin-panel {
  border: 1px solid rgba(201, 211, 225, 0.72);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 22px rgba(35, 67, 116, 0.06);
}

.admin-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
  gap: 14px;
}

.admin-hero__copy {
  padding: 24px;
  min-height: 168px;
  background:
    linear-gradient(135deg, rgba(50, 144, 255, 0.96), rgba(33, 109, 242, 0.92)),
    linear-gradient(135deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.02));
  color: #fff;
}

.admin-hero__copy h1 {
  margin: 0 0 12px;
  font-size: 28px;
  font-weight: 800;
  line-height: 1.2;
}

.admin-hero__copy p {
  margin: 0;
  max-width: 560px;
  color: rgba(255, 255, 255, 0.84);
  line-height: 1.8;
}

.admin-hero__stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.admin-hero__stat,
.admin-summary-card,
.admin-monitor-card {
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(201, 211, 225, 0.72);
  box-shadow: 0 8px 20px rgba(35, 67, 116, 0.05);
}

.admin-panel {
  display: none;
  padding: 18px;
}

.admin-panel.is-active {
  display: grid;
  gap: 16px;
}

.admin-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(188, 204, 224, 0.65);
}

.admin-panel__head h2 {
  margin: 0 0 6px;
  font-size: 24px;
  font-weight: 800;
}

.admin-panel__head p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.admin-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.admin-monitor-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.admin-summary-card {
  position: relative;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 12px;
  min-height: 144px;
  padding: 18px 18px 16px;
  overflow: hidden;
  align-content: start;
  border-radius: var(--radius-lg);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 250, 255, 0.98));
}

.admin-summary-card::after {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, rgba(20, 43, 111, 0.92), rgba(30, 58, 138, 0.82));
  opacity: 0.92;
}

.admin-summary-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.admin-summary-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #eaf2ff, #d5e7ff);
  color: var(--primary);
  font-size: 14px;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.admin-summary-card__icon svg {
  width: 18px;
  height: 18px;
}

.admin-summary-card__label {
  color: #364764;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

.admin-summary-card__meta {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: #58729b;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-summary-card strong {
  display: block;
  color: #142b48;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
}

.admin-summary-card__foot {
  color: #8a9ab1;
  font-size: 12px;
  line-height: 1.55;
}

.admin-summary-card--laws {
  background: linear-gradient(180deg, rgba(255, 246, 242, 0.98), rgba(255, 255, 255, 0.98));
}

.admin-summary-card--cases {
  background: linear-gradient(180deg, rgba(243, 248, 255, 0.98), rgba(255, 255, 255, 0.98));
}

.admin-summary-card--templates {
  background: linear-gradient(180deg, rgba(245, 252, 247, 0.98), rgba(255, 255, 255, 0.98));
}

.admin-summary-card--ads {
  background: linear-gradient(180deg, rgba(255, 247, 237, 0.98), rgba(255, 255, 255, 0.98));
}

.admin-monitor-card {
  position: relative;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 10px;
  min-height: 116px;
  padding: 18px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(188, 204, 224, 0.64);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 255, 0.98));
  overflow: hidden;
}

.admin-monitor-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: linear-gradient(90deg, rgba(20, 43, 111, 0.84), rgba(30, 58, 138, 0.7));
  opacity: 0.72;
}

.admin-monitor-card__top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-monitor-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.1);
  color: var(--primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.admin-monitor-card__icon svg {
  width: 16px;
  height: 16px;
}

.admin-monitor-card__label {
  color: #607390;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.admin-monitor-card strong {
  color: #142b48;
  font-size: 34px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
}

.admin-monitor-card__meta {
  color: #8a9ab1;
  font-size: 12px;
  line-height: 1.55;
}

.admin-monitor-card--laws .admin-monitor-card__icon {
  background: rgba(93, 144, 255, 0.12);
  color: #2d73ff;
}

.admin-monitor-card--users .admin-monitor-card__icon {
  background: rgba(86, 193, 132, 0.14);
  color: #228754;
}

.admin-monitor-card--collect .admin-monitor-card__icon {
  background: rgba(36, 183, 217, 0.14);
  color: #1585a0;
}

.admin-monitor-card--alert .admin-monitor-card__icon {
  background: rgba(255, 170, 59, 0.16);
  color: #b46a12;
}

.admin-two-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.admin-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 14px;
}

.admin-overview-grid--secondary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-card {
  padding: 18px;
  border: 1px solid rgba(188, 204, 224, 0.64);
  border-radius: var(--radius-md);
  background: #fff;
}

.admin-card--editing {
  border-color: rgba(20, 43, 111, 0.34);
  box-shadow: var(--shadow-elevated);
}

.admin-card--editing .admin-form-panel__icon {
  background: linear-gradient(135deg, rgba(20, 43, 111, 0.18), rgba(20, 43, 111, 0.26));
  color: #1f4fc9;
}

.admin-card h3 {
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 800;
}

.admin-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.admin-card__head--toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: nowrap;
}

.admin-card__title {
  display: grid;
  gap: 4px;
  min-width: 220px;
  flex: 0 0 auto;
}

.admin-card__title h3 {
  margin: 0;
}

.admin-card__title p {
  margin: 0;
  color: #6f819c;
  font-size: 12px;
  line-height: 1.5;
  max-width: 320px;
}

.admin-card__lead {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.admin-card__head-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #eef4ff, #dbe9ff);
  color: var(--primary);
  flex: 0 0 auto;
}

.admin-card__head-icon svg {
  width: 18px;
  height: 18px;
}

.admin-card__head h3 {
  margin-bottom: 0;
}

.admin-card__hint {
  color: #6b7d96;
  font-size: 12px;
  font-weight: 700;
}

.admin-card--chart {
  min-height: 260px;
}

.admin-traffic-board {
  display: grid;
  gap: 14px;
}

.admin-traffic-board__canvas {
  position: relative;
  min-height: 180px;
  border-radius: var(--radius-md);
  border: 1px solid rgba(188, 204, 224, 0.7);
  background:
    linear-gradient(rgba(207, 219, 237, 0.4) 1px, transparent 1px) 0 0 / 100% 30px,
    linear-gradient(90deg, rgba(207, 219, 237, 0.25) 1px, transparent 1px) 0 0 / 16.6% 100%,
    #fbfdff;
  overflow: hidden;
}

.admin-traffic-board__canvas::before {
  content: "10 分钟";
  position: absolute;
  top: 12px;
  left: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #7d8ea7;
  font-size: 12px;
  font-weight: 700;
}

.admin-traffic-board__line {
  position: absolute;
  left: 18px;
  right: 18px;
  height: 2px;
  border-radius: 999px;
}

.admin-traffic-board__line--laws {
  top: 82px;
  background: linear-gradient(90deg, #ff9a73 0%, #ff9a73 8%, transparent 8%, transparent 18%, #ff9a73 18%, #ff9a73 25%, transparent 25%, transparent 39%, #ff9a73 39%, #ff9a73 43%, transparent 43%, transparent 60%, #ff9a73 60%, #ff9a73 67%, transparent 67%, transparent 82%, #ff9a73 82%, #ff9a73 88%, transparent 88%);
  box-shadow: 0 -18px 0 0 rgba(255, 154, 115, 0.45), 220px 26px 0 0 rgba(255, 154, 115, 0.35), 470px -22px 0 0 rgba(255, 154, 115, 0.4), 720px 12px 0 0 rgba(255, 154, 115, 0.3);
}

.admin-traffic-board__line--cases {
  top: 92px;
  background: linear-gradient(90deg, #2f80ff 0%, #2f80ff 12%, transparent 12%, transparent 24%, #2f80ff 24%, #2f80ff 34%, transparent 34%, transparent 49%, #2f80ff 49%, #2f80ff 56%, transparent 56%, transparent 72%, #2f80ff 72%, #2f80ff 82%, transparent 82%);
  box-shadow: 140px -8px 0 0 rgba(47, 128, 255, 0.4), 390px 10px 0 0 rgba(47, 128, 255, 0.35), 630px -6px 0 0 rgba(47, 128, 255, 0.38);
}

.admin-traffic-board__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #647896;
  font-size: 13px;
  font-weight: 700;
}

.admin-dot {
  display: inline-flex;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-right: 6px;
}

.admin-dot--laws {
  background: #ff9a73;
}

.admin-dot--cases {
  background: #2f80ff;
}

.admin-dot--ads {
  background: #3fcb7c;
}

.admin-status-list {
  display: grid;
  gap: 12px;
}

.admin-status-list__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 60px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  background: #f7faff;
  border: 1px solid rgba(188, 204, 224, 0.65);
}

.admin-status-list__item:nth-child(1) {
  background: linear-gradient(180deg, rgba(255, 247, 242, 0.96), rgba(255, 255, 255, 0.98));
}

.admin-status-list__item:nth-child(2) {
  background: linear-gradient(180deg, rgba(243, 248, 255, 0.96), rgba(255, 255, 255, 0.98));
}

.admin-status-list__item:nth-child(3) {
  background: linear-gradient(180deg, rgba(244, 252, 246, 0.96), rgba(255, 255, 255, 0.98));
}

.admin-status-list__item:nth-child(4) {
  background: linear-gradient(180deg, rgba(255, 249, 242, 0.96), rgba(255, 255, 255, 0.98));
}

.admin-status-list__item span {
  color: #42536f;
  font-size: 13px;
  font-weight: 700;
}

.admin-status-list__item strong {
  font-size: 16px;
  font-weight: 800;
}

.admin-toolbar {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  padding: 10px 12px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(246, 250, 255, 0.96), rgba(255, 255, 255, 0.98));
  border: 1px solid rgba(188, 204, 224, 0.58);
  flex: 1 1 auto;
  min-width: 0;
}

.admin-toolbar__search {
  flex: 1 1 340px;
  width: auto;
  min-width: 240px;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-toolbar__filter {
  flex: 0 0 156px;
  min-width: 120px;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-toolbar .admin-button {
  flex: 0 0 auto;
}

.admin-form {
  display: grid;
  gap: 14px;
}

.admin-form-panel__head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(188, 204, 224, 0.65);
}

.admin-form-panel__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #ebf2ff, #d8e8ff);
  color: var(--primary);
  flex: 0 0 auto;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 10px 22px rgba(20, 43, 111, 0.1);
}

.admin-form-panel__icon svg {
  width: 20px;
  height: 20px;
}

.admin-form-panel__head h3 {
  margin: 0 0 6px;
  font-size: 20px;
}

.admin-form-panel__head p {
  margin: 0;
  color: #6f819c;
  font-size: 13px;
  line-height: 1.7;
}

.admin-form__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.admin-form label {
  display: grid;
  gap: 9px;
}

.admin-form label span {
  font-size: 13px;
  font-weight: 700;
  color: #425a83;
}

.admin-form input,
.admin-form select,
.admin-form textarea {
  width: 100%;
  min-height: 42px;
  padding: 0 15px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.admin-form textarea {
  min-height: 120px;
  padding: 14px 15px;
  resize: vertical;
}

.admin-upload-note {
  margin-top: -2px;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  background: rgba(244, 248, 255, 0.92);
  border: 1px solid rgba(188, 204, 224, 0.58);
  color: #6f819c;
  font-size: 13px;
  line-height: 1.7;
}

.admin-autofill-tip {
  display: flex;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(20, 43, 111, 0.08), rgba(20, 43, 111, 0.04));
  color: #2450b8;
  font-size: 13px;
  line-height: 1.6;
  border: 1px solid rgba(20, 43, 111, 0.1);
}

.admin-upload-preview {
  display: grid;
  gap: 10px;
}

.admin-upload-preview:empty {
  display: none;
}

.admin-upload-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.admin-upload-summary-wrap {
  display: grid;
  gap: 10px;
}

.admin-upload-summary__item {
  display: grid;
  gap: 4px;
  min-height: 72px;
  align-content: center;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  background: #f4f8ff;
  border: 1px solid rgba(188, 204, 224, 0.68);
}

.admin-upload-summary__item strong {
  color: #1d3251;
  font-size: 20px;
  font-weight: 800;
}

.admin-upload-summary__item span {
  color: #6f819c;
  font-size: 12px;
  line-height: 1.5;
}

.admin-upload-summary__item--success {
  background: rgba(86, 193, 132, 0.1);
  border-color: rgba(86, 193, 132, 0.22);
}

.admin-upload-summary__item--warning {
  background: rgba(20, 43, 111, 0.08);
  border-color: rgba(20, 43, 111, 0.2);
}

.admin-upload-summary__item--error {
  background: rgba(226, 92, 92, 0.08);
  border-color: rgba(226, 92, 92, 0.22);
}

.admin-upload-summary__action {
  justify-self: flex-end;
}

.admin-upload-preview__item {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #f8fbff, #ffffff);
  border: 1px solid rgba(188, 204, 224, 0.68);
}

.admin-upload-preview__item--error {
  background: #fff6f6;
  border-color: rgba(226, 92, 92, 0.24);
}

.admin-upload-preview__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.admin-upload-preview__item strong {
  color: #1d3251;
  font-size: 14px;
  font-weight: 800;
}

.admin-upload-preview__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.12);
  color: #1f4fc9;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.admin-upload-preview__badge--error {
  background: rgba(226, 92, 92, 0.14);
  color: #d14b4b;
}

.admin-upload-preview__item span {
  color: #71839f;
  font-size: 12px;
  line-height: 1.6;
}

.admin-upload-preview__issue {
  color: #d14b4b !important;
}

.admin-file-cell {
  display: grid;
  gap: 8px;
}

.admin-file-cell strong {
  font-size: 13px;
  font-weight: 700;
  color: #1e3453;
}

.admin-file-cell__meta {
  color: #7b8da6;
  font-size: 12px;
  line-height: 1.6;
}

.admin-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 18px;
  border: 0;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--shadow-elevated);
}

.admin-button--ghost {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(97, 123, 177, 0.16);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.98));
  color: #2f4f87;
  box-shadow: none;
}

.admin-button--danger {
  color: #b0425b;
}

.admin-form .admin-button + .admin-button {
  margin-left: 10px;
}

.admin-form--readonly {
  opacity: 0.72;
}

.admin-form--readonly .admin-button,
.admin-form--readonly input,
.admin-form--readonly select,
.admin-form--readonly textarea {
  cursor: not-allowed;
}

.admin-table-wrap {
  overflow-x: auto;
  border: 1px solid rgba(188, 204, 224, 0.7);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, #ffffff, #fbfdff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-table th {
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(238, 245, 255, 0.95));
}

.admin-table th,
.admin-table td {
  padding: 15px 14px;
  border-bottom: 1px solid rgba(97, 123, 177, 0.12);
  text-align: left;
  font-size: 13px;
  vertical-align: middle;
}

.admin-table th:first-child,
.admin-table td:first-child {
  width: 42px;
  text-align: center;
}

.admin-table input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--primary);
}

.admin-sort-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(20, 43, 111, 0.12), rgba(20, 43, 111, 0.18));
  color: #1f4fc9;
  font-size: 0.82rem;
  font-weight: 700;
}

.admin-ad-thumb {
  display: grid;
  gap: 8px;
}

.admin-ad-thumb img {
  width: 112px;
  height: 64px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: #eef4ff;
  box-shadow: 0 10px 24px rgba(31, 79, 201, 0.12);
}

.admin-ad-thumb span {
  display: inline-block;
  color: #5d7290;
  font-size: 12px;
  line-height: 1.5;
  word-break: break-all;
}

.admin-ad-thumb--empty {
  min-height: 64px;
  align-content: center;
}

.admin-table th {
  color: #516985;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  white-space: nowrap;
  background: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(238, 245, 255, 0.95));
  position: sticky;
  top: 0;
  z-index: 1;
}

.admin-table td strong {
  font-size: 14px;
  line-height: 1.45;
}

.admin-table td small {
  display: inline-block;
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.6;
}

.admin-table tbody tr:hover {
  background: rgba(243, 248, 255, 0.82);
}

.admin-table__row--pending td {
  background: linear-gradient(180deg, rgba(255, 248, 240, 0.92), rgba(255, 255, 255, 0.98));
}

.admin-table__row--editing td {
  background: linear-gradient(180deg, rgba(236, 244, 255, 0.96), rgba(255, 255, 255, 0.98));
}

.admin-table__row--saved td {
  background: linear-gradient(180deg, rgba(235, 249, 242, 0.96), rgba(255, 255, 255, 0.98));
}

.is-disabled {
  opacity: 0.48;
  pointer-events: none;
}

.admin-status {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.admin-status--active {
  background: rgba(41, 174, 103, 0.12);
  color: #1f8d56;
}

.admin-status--pending {
  background: rgba(20, 43, 111, 0.1);
  color: var(--primary);
}

.admin-status--inactive {
  background: rgba(176, 66, 91, 0.1);
  color: #b0425b;
}

.admin-status--neutral {
  background: rgba(97, 123, 177, 0.12);
  color: #5c7398;
}

.admin-tag {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(97, 123, 177, 0.12);
  color: #597094;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}

.admin-tag--type {
  background: rgba(20, 43, 111, 0.1);
  color: var(--primary);
}

.admin-tag--role-company {
  background: rgba(20, 43, 111, 0.12);
  color: #2450b8;
}

.admin-tag--role-personal {
  background: rgba(92, 115, 152, 0.12);
  color: #5c7398;
}

.admin-tag--source {
  background: rgba(86, 193, 132, 0.12);
  color: #228754;
}

.admin-tag--cycle {
  background: rgba(255, 170, 59, 0.14);
  color: #b46a12;
}

.admin-inline-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  min-height: 96px;
  padding: 20px 16px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(246, 250, 255, 0.96), rgba(255, 255, 255, 0.98));
  border: 1px dashed rgba(188, 204, 224, 0.88);
  color: var(--muted);
  text-align: center;
}

.admin-empty::before {
  content: "";
  width: 34px;
  height: 34px;
  border-radius: var(--radius-md);
  background:
    linear-gradient(135deg, #eef4ff, #dbe9ff),
    no-repeat center/18px 18px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h10a2 2 0 0 1 2 2v11H5V7a2 2 0 0 1 2-2Zm0 3v8h10V8Zm2 2h6v2H9Zm0 4h4v2H9Z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 5h10a2 2 0 0 1 2 2v11H5V7a2 2 0 0 1 2-2Zm0 3v8h10V8Zm2 2h6v2H9Zm0 4h4v2H9Z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
  background-color: var(--primary);
}

.admin-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 12px;
}

.admin-pagination__meta,
.admin-pagination__page {
  color: #6e819c;
  font-size: 13px;
  font-weight: 700;
}

.admin-pagination__controls {
  display: flex;
  align-items: center;
  gap: 10px;
}

.admin-pagination__button[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

.admin-list {
  display: grid;
  gap: 12px;
}

.admin-list--tight {
  gap: 10px;
}

.admin-list__item {
  position: relative;
  display: grid;
  gap: 6px;
  min-height: 74px;
  padding: 14px 16px 14px 46px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(249, 251, 255, 0.98), rgba(255, 255, 255, 0.98));
  border: 1px solid rgba(188, 204, 224, 0.65);
  box-shadow: 0 6px 18px rgba(35, 67, 116, 0.04);
}

.admin-list__item::before {
  content: "";
  position: absolute;
  top: 16px;
  left: 16px;
  width: 20px;
  height: 20px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #edf4ff, #dce9ff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.admin-list__item::after {
  content: "";
  position: absolute;
  top: 22px;
  left: 22px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #2f80ff;
}

.admin-list__item strong {
  color: #1a3354;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
}

.admin-list__item span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}

.admin-panel-grid {
  margin-top: 14px;
}

.admin-metric-list,
.admin-source-list {
  display: grid;
  gap: 12px;
}

.admin-metric-list__item,
.admin-source-list__item {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, rgba(244, 248, 255, 0.96), rgba(255, 255, 255, 0.98));
  border: 1px solid rgba(188, 204, 224, 0.72);
}

.admin-metric-list__item span,
.admin-source-list__item span {
  color: #667995;
  font-size: 13px;
  line-height: 1.6;
}

.admin-metric-list__item strong,
.admin-source-list__item strong {
  color: #18314f;
  font-size: 17px;
  font-weight: 800;
}

.admin-metric-list__item small {
  color: #7b8da6;
  font-size: 12px;
  line-height: 1.6;
}

.admin-breakdown-list {
  display: grid;
  gap: 14px;
}

.admin-breakdown-list__item {
  display: grid;
  gap: 8px;
}

.admin-breakdown-list__meta,
.admin-progress-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #667995;
  font-size: 13px;
}

.admin-breakdown-list__meta strong,
.admin-progress-card__value strong {
  color: #18314f;
  font-weight: 800;
}

.admin-breakdown-list__track {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: rgba(207, 219, 237, 0.62);
  overflow: hidden;
}

.admin-breakdown-list__track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2d73ff, #58a8ff);
}

.admin-breakdown-list__track--wide {
  height: 14px;
}

.admin-progress-card {
  display: grid;
  gap: 16px;
  align-content: start;
}

.admin-progress-card__value {
  display: grid;
  gap: 4px;
}

.admin-progress-card__value strong {
  font-size: 34px;
}

.admin-progress-card__value span {
  color: #6f819c;
  font-size: 13px;
  font-weight: 700;
}

.admin-table-panels {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.admin-mini-table {
  display: grid;
  gap: 2px;
}

.admin-mini-table__head {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) 92px minmax(92px, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 44px;
  padding: 0 4px 10px;
  border-bottom: 1px solid rgba(188, 204, 224, 0.52);
}

.admin-mini-table__head span {
  color: #7b8da6;
  font-size: 12px;
  font-weight: 700;
}

.admin-mini-table__row {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) 92px minmax(92px, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 56px;
  padding: 0 4px;
  border-bottom: 1px solid rgba(188, 204, 224, 0.45);
  border-radius: var(--radius-md);
  transition: background 0.2s ease, transform 0.2s ease;
}

.admin-mini-table__row:hover {
  background: rgba(242, 247, 255, 0.86);
  transform: translateY(-1px);
}

.admin-mini-table__row:last-child {
  border-bottom: 0;
}

.admin-mini-table__row strong {
  color: #1d3251;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
}

.admin-mini-table__row span {
  color: #70819c;
  font-size: 12px;
  line-height: 1.5;
}

.admin-mini-table__row .admin-status,
.admin-mini-table__row .admin-tag {
  justify-self: flex-start;
}

.admin-ring-card {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 18px;
  align-items: center;
}

.admin-ring-card__chart {
  --progress: 85%;
  width: 180px;
  height: 180px;
  margin: 0 auto;
  border-radius: 999px;
  background: conic-gradient(#3495ff 0 var(--progress), #e8f0fb var(--progress) 100%);
  display: grid;
  place-items: center;
}

.admin-ring-card__inner {
  display: grid;
  gap: 4px;
  place-items: center;
  width: 132px;
  height: 132px;
  border-radius: 999px;
  background: #fff;
}

.admin-ring-card__inner strong {
  color: #1a3150;
  font-size: 32px;
  font-weight: 800;
}

.admin-ring-card__inner span {
  color: #7a8ca6;
  font-size: 12px;
  font-weight: 700;
}

.admin-ring-card__meta {
  display: grid;
  gap: 12px;
}

.admin-ring-card__meta span {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border-radius: var(--radius-md);
  background: #f6f9fd;
  color: #607390;
  font-size: 13px;
  font-weight: 700;
}

.admin-ring-card__meta span i {
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, #2d73ff, #58a8ff);
}

.admin-system-list {
  display: grid;
}

.admin-system-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 48px;
  border-bottom: 1px solid rgba(188, 204, 224, 0.52);
}

.admin-system-list__item:last-child {
  border-bottom: 0;
}

.admin-system-list__item span {
  color: #71839f;
  font-size: 13px;
}

.admin-system-list__item strong {
  color: #1c3252;
  font-size: 13px;
  font-weight: 800;
}

.admin-bar-board {
  display: grid;
  gap: 18px;
  padding: 4px 2px 2px;
}

.admin-bar-board__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #6f819c;
  font-size: 12px;
  font-weight: 700;
}

.admin-bar-board__legend span {
  display: inline-flex;
  align-items: center;
}

.admin-bar-board__dot {
  width: 8px;
  height: 8px;
  margin-right: 6px;
  border-radius: 999px;
}

.admin-bar-board__dot--laws {
  background: #3495ff;
}

.admin-bar-board__dot--cases {
  background: #24b7d9;
}

.admin-bar-board__dot--templates {
  background: #5c74ff;
}

.admin-bar-board__dot--ads {
  background: #62cbff;
}

.admin-bar-board__row {
  display: grid;
  gap: 10px;
}

.admin-bar-board__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #5f7190;
  font-size: 13px;
  font-weight: 700;
}

.admin-bar-board__meta strong {
  color: #122b47;
  font-size: 14px;
  font-weight: 800;
}

.admin-bar-board__track {
  position: relative;
  overflow: hidden;
  min-height: 16px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(236, 243, 251, 0.96), rgba(226, 237, 249, 0.96));
  box-shadow: inset 0 1px 2px rgba(35, 67, 116, 0.08);
}

.admin-bar-board__mark {
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 72%;
  width: 2px;
  border-radius: 999px;
  background: rgba(23, 41, 67, 0.18);
}

.admin-bar-board__fill {
  display: block;
  height: 16px;
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(53, 124, 255, 0.18);
}

.admin-bar-board__fill--laws {
  background: linear-gradient(90deg, #3495ff, #61b0ff);
}

.admin-bar-board__fill--cases {
  background: linear-gradient(90deg, #24b7d9, #59d4ec);
}

.admin-bar-board__fill--templates {
  background: linear-gradient(90deg, #5c74ff, #8997ff);
}

.admin-bar-board__fill--ads {
  background: linear-gradient(90deg, #5d90ff, #62cbff);
}

.admin-modal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 29, 49, 0.45);
  backdrop-filter: blur(4px);
}

.admin-modal--hidden {
  display: none;
}

.admin-modal__dialog {
  width: min(100%, 640px);
  max-height: min(80vh, 760px);
  overflow: auto;
  padding: 24px;
  border-radius: var(--radius-lg);
  background: #fff;
  box-shadow: 0 22px 56px rgba(14, 27, 48, 0.18);
}

.admin-modal__dialog--compact {
  width: min(100%, 520px);
}

.admin-modal__head h3 {
  margin: 0 0 6px;
  font-size: 22px;
  font-weight: 800;
}

.admin-modal__head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.admin-modal__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, #edf4ff, #dae9ff);
  color: var(--primary);
  flex: 0 0 auto;
}

.admin-modal__icon--export {
  background: linear-gradient(135deg, #eff7ff, #daf1ff);
  color: #1b8dbb;
}

.admin-modal__icon svg {
  width: 20px;
  height: 20px;
}

.admin-modal__head p {
  margin: 0;
  color: #6b7d96;
  line-height: 1.7;
}

.admin-modal__body {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.admin-modal__foot {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 18px;
}

.admin-field-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.admin-field-picker__item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 14px;
  border-radius: var(--radius-md);
  background: #f4f8ff;
  color: #203656;
  font-size: 14px;
  font-weight: 600;
}

.admin-field-picker__item input {
  width: 16px;
  height: 16px;
  accent-color: var(--primary);
}

.admin-toast {
  position: fixed;
  top: 28px;
  right: 28px;
  z-index: 90;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 240px;
  max-width: min(92vw, 360px);
  padding: 14px 18px;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(20, 36, 61, 0.96), rgba(29, 57, 98, 0.96));
  color: #fff;
  box-shadow: 0 18px 42px rgba(10, 20, 36, 0.26);
  transform: translateY(-12px);
  opacity: 0;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.admin-toast--hidden {
  display: none;
}

.admin-toast.is-visible {
  display: inline-flex;
  opacity: 1;
  transform: translateY(0);
}

.admin-toast__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: rgba(77, 211, 141, 0.2);
  color: #75f0a6;
  font-weight: 800;
}

.admin-toast__icon svg {
  width: 16px;
  height: 16px;
}

.admin-toast__text {
  font-size: 0.94rem;
  font-weight: 600;
  letter-spacing: 0.01em;
}

@media (max-width: 980px) {
  .admin-toast {
    top: 18px;
    right: 18px;
    left: 18px;
    max-width: none;
  }

  .admin-shell {
    grid-template-columns: 1fr;
  }

  .admin-login-shell {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    min-height: auto;
  }

  .admin-summary-grid,
  .admin-monitor-grid,
  .admin-table-panels,
  .admin-two-col {
    grid-template-columns: 1fr;
  }

  .admin-overview-grid,
  .admin-overview-grid--secondary {
    grid-template-columns: 1fr;
  }

  .admin-ring-card {
    grid-template-columns: 1fr;
  }

  .admin-form__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .admin-main {
    padding-right: 0;
  }

  .admin-topbar {
    flex-direction: column;
    align-items: stretch;
    padding: 14px;
  }

  .admin-login-panel,
  .admin-login-hero {
    padding: 24px;
  }

  .admin-topbar__search input {
    width: 100%;
  }

  .admin-topbar__actions {
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .admin-card__head,
  .admin-panel__head {
    flex-direction: column;
    align-items: stretch;
  }

  .admin-upload-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-card__head--toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .admin-card__title {
    min-width: 0;
  }

  .admin-toolbar,
  .admin-toolbar__search,
  .admin-toolbar__filter {
    width: 100%;
  }

  .admin-toolbar {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .admin-inline-actions {
    flex-direction: column;
  }

  .admin-inline-actions .admin-button {
    width: 100%;
  }

  .admin-modal {
    padding: 16px;
  }

  .admin-upload-summary {
    grid-template-columns: 1fr;
  }

  .admin-modal__foot {
    flex-direction: column-reverse;
  }

  .admin-field-picker {
    grid-template-columns: 1fr;
  }

  .admin-form__grid,
  .admin-summary-grid,
  .admin-monitor-grid,
  .admin-table-panels,
  .admin-hero__stats {
    grid-template-columns: 1fr;
  }

  .admin-pagination {
    flex-direction: column;
    align-items: stretch;
  }

  .admin-pagination__controls {
    justify-content: space-between;
  }

  .admin-sidebar {
    min-height: auto;
  }

  .admin-sidebar__foot {
    grid-template-columns: 1fr 1fr;
  }
}

.detail-hero {
  margin-bottom: 20px;
  padding: 40px 36px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(235, 245, 255, 0.94));
  box-shadow: var(--shadow-soft);
}

.detail-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: rgba(20, 43, 111, 0.08);
  color: var(--primary);
  font-size: 13px;
  font-weight: 700;
}

.detail-hero h1 {
  margin: 16px 0 10px;
  font-size: 32px;
  font-weight: 800;
}

.detail-hero p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
}

.detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: var(--module-gap);
}

.detail-main,
.detail-side__card,
.detail-block {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow-soft);
}

.detail-main {
  display: grid;
  gap: var(--module-gap);
  border: 0;
  background: transparent;
  box-shadow: none;
}

.detail-block,
.detail-side__card {
  padding: var(--module-pad);
}

.detail-block h2,
.detail-side__card h3 {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 800;
}

.detail-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.detail-feature-grid--2col {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.detail-feature {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.detail-feature strong {
  display: block;
  margin-bottom: 8px;
  font-size: 15px;
}

.detail-feature p,
.detail-side__card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  font-size: 13px;
}

.detail-list {
  display: grid;
  gap: 12px;
}

.detail-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.detail-list__item strong {
  font-size: 15px;
}

.detail-list__item span {
  color: var(--primary);
  font-size: 12px;
  font-weight: 700;
}

.detail-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  margin-top: 18px;
  padding: 0 18px;
  border-radius: var(--radius-md);
  background: var(--gradient-primary);
  color: #fff;
  font-weight: 700;
}

.info-stack {
  display: grid;
  gap: 16px;
}

.info-article,
.info-note {
  display: grid;
  gap: 10px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.info-article h3,
.info-note strong {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
}

.info-article p,
.info-article li,
.info-note p,
.info-meta li {
  margin: 0;
  color: var(--muted);
  line-height: 1.85;
  font-size: 14px;
}

.info-article ul,
.info-meta {
  display: grid;
  gap: 10px;
  margin: 0;
  padding-left: 18px;
}

.info-meta {
  padding-left: 0;
  list-style: none;
}

.info-meta strong {
  color: var(--text);
  font-weight: 700;
}

.info-links {
  display: grid;
  gap: 12px;
}

.info-link-item {
  display: grid;
  gap: 6px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-soft);
}

.info-link-item strong {
  font-size: 15px;
}

.info-link-item span {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.8;
  word-break: break-all;
}

.policy-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-bottom: 16px;
}

.policy-nav a {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  color: #4d678e;
  font-size: 13px;
  font-weight: 700;
  box-shadow: var(--shadow-soft);
}

.policy-nav a.is-active {
  border-color: transparent;
  background: var(--gradient-primary);
  color: #fff;
}

/* ========================================
   Mobile Navigation Toggle
   ======================================== */

.nav-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: var(--radius-md);
  background: transparent;
  cursor: pointer;
  flex-shrink: 0;
}

.nav-toggle__bar {
  display: block;
  width: 22px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 200ms ease, opacity 200ms ease;
}

.nav-toggle__bar + .nav-toggle__bar {
  margin-top: 5px;
}

.nav-toggle.is-active .nav-toggle__bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}

.nav-toggle.is-active .nav-toggle__bar:nth-child(2) {
  opacity: 0;
}

.nav-toggle.is-active .nav-toggle__bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Home page toggle color */
.hero-shell .nav-toggle {
  color: #fff;
}

/* Topbar toggle color */
.site-topbar--inner .nav-toggle {
  color: var(--text);
}

@media (max-width: 980px) {
  .home-header {
    flex-wrap: wrap;
    gap: 0;
  }

  .nav-toggle {
    display: flex;
    flex-direction: column;
  }

  .hero-nav {
    display: none;
    width: 100%;
    flex-direction: column;
    gap: 0;
    margin-top: 12px;
    padding: 12px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }

  .site-topbar--inner .hero-nav {
    border-top-color: var(--border);
  }

  .hero-nav.is-open {
    display: flex;
  }

  .hero-nav a,
  .hero-nav span {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 0 12px;
    border-radius: var(--radius-md);
    background: transparent;
  }

  .hero-nav a:hover {
    background: rgba(255, 255, 255, 0.08);
  }

  .site-topbar--inner .hero-nav a:hover {
    background: rgba(20, 43, 111, 0.06);
  }

  .hero-nav a::after {
    display: none;
  }

  .hero-nav__cta {
    margin-top: 8px;
    justify-content: center;
    background: #B68A2E !important;
  }

  .hero-panel {
    grid-template-columns: 1fr;
  }

  .hero-copy {
    max-width: none;
  }

  .hero-visual {
    max-width: 420px;
    width: 100%;
    margin: 0 auto;
  }

  .home-grid--primary,
  .stats-strip,
  .core-services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer__inner {
    flex-direction: column;
    align-items: center;
  }

  .auth-shell {
    grid-template-columns: 1fr;
  }

  .detail-grid {
    grid-template-columns: 1fr;
  }

  .about-hero,
  .about-grid,
  .about-principles__grid {
    grid-template-columns: 1fr;
  }

  .law-detail-layout {
    grid-template-columns: 1fr;
  }

  .tool-layout {
    grid-template-columns: 1fr;
  }

  .generate-layout {
    grid-template-columns: 1fr;
  }

  .case-detail-layout {
    grid-template-columns: 1fr;
  }

  .case-detail-side {
    position: static;
  }

  .dashboard-layout {
    grid-template-columns: 1fr;
  }

  .dashboard-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .records-tabs {
    flex-direction: column;
    align-items: stretch;
  }

  .records-manage {
    flex-direction: column;
    align-items: stretch;
  }

  .records-manage__filters {
    flex-direction: column;
    align-items: stretch;
  }

  .records-manage__search {
    min-width: 0;
    width: 100%;
  }

  .query-search,
  .case-search,
  .law-search-panel__form,
  .law-upload-panel {
    grid-template-columns: 1fr;
  }

  .ad-slide {
    grid-template-columns: 1fr;
  }

  .ad-slide__visual {
    justify-items: start;
    min-height: 220px;
  }

  .ad-slide__chips {
    top: 14px;
    left: 14px;
  }

  .consult-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }

  .news-qr-card {
    grid-template-columns: 1fr;
  }

  .consult-board__meta {
    align-items: flex-start;
    flex-direction: column;
  }

  .consult-board__head,
  .consult-row {
    grid-template-columns: 132px 100px 100px 100px minmax(0, 1fr) 86px;
    gap: 12px;
  }

  .query-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .query-helper-grid {
    grid-template-columns: 1fr;
  }

  .query-upload {
    align-items: flex-start;
    flex-direction: column;
  }

  .law-results-toolbar,
  .law-result-card__footer,
  .case-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .tool-form {
    grid-template-columns: 1fr;
  }

  .generate-form {
    grid-template-columns: 1fr;
  }

  .dashboard-stats,
  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .detail-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .hero-container,
  .section-inner,
  .site-footer__inner,
  .footer-sites,
  .submenu-shell,
  .auth-shell,
  .detail-shell,
  .law-results-shell,
  .law-detail-shell,
  .tool-shell,
  .generate-shell,
  .case-detail-shell,
  .dashboard-shell,
  .records-shell {
    width: min(100% - 24px, 1180px);
  }

  .hero-container {
    padding: 22px 0 58px;
  }

  .hero-copy h1 {
    font-size: 2rem;
  }

  .hero-panel {
    gap: 22px;
  }

  .hero-tags {
    gap: 10px;
    margin-top: 18px;
  }

  .entry-section {
    margin-top: 0;
  }

  .ad-section {
    margin-top: -42px;
  }

  .ad-banner {
    min-height: 340px;
  }

  .ad-slide {
    padding: 26px 24px 74px;
  }

  .ad-slide__visual {
    min-height: 240px;
  }

  .ad-banner__copy {
    max-width: none;
  }

  .ad-banner__copy strong {
    font-size: 28px;
  }

  .ad-banner__actions a {
    min-width: 132px;
  }

  .icon-card {
    min-height: 140px;
  }

  .icon-card__icon {
    width: 56px;
    height: 56px;
  }

  .icon-card__desc {
    opacity: 1;
    transform: translateY(0);
  }

  .footer-links {
    gap: 28px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .footer-links > div {
    align-items: center;
  }

  .submenu-topbar {
    gap: 12px;
  }

  .submenu-hero,
  .panel-grid-section,
  .query-section,
  .case-list-section,
  .law-results-hero,
  .law-search-panel,
  .law-results-toolbar,
  .law-result-card,
  .law-detail-card,
  .tool-hero,
  .tool-card,
  .generate-hero,
  .generate-card,
  .case-detail-hero,
  .case-detail-card,
  .dashboard-hero,
  .dashboard-card,
  .records-hero,
  .records-manage,
  .records-item,
  .records-empty {
    padding-left: 20px;
    padding-right: 20px;
  }

  .law-detail-hero__top,
  .case-detail-hero__top,
  .inner-hero__top {
    flex-direction: column;
    align-items: stretch;
  }

  .favorite-button {
    width: 100%;
  }

  .tool-actions,
  .generate-actions {
    flex-direction: column;
  }

  .tool-actions button,
  .generate-actions button {
    width: 100%;
  }

  .tool-result__tools,
  .generate-preview__tools {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .case-card__top {
    flex-direction: column;
    align-items: stretch;
  }

  .tool-copy,
  .generate-copy {
    width: 100%;
    justify-content: center;
  }

  /* Inner hero responsive */
  .inner-hero__title {
    font-size: 26px;
  }

  .inner-hero__desc {
    font-size: 14px;
  }

  .inner-hero__container {
    width: min(100% - 24px, 1180px);
    margin: 0 auto;
  }

  .page-container {
    width: min(100% - 24px, 1180px);
  }

  /* News QR card responsive */
  .news-qr-card {
    grid-template-columns: 1fr;
  }

  /* Case detail layout */
  .case-detail-layout {
    grid-template-columns: 1fr;
  }

  .case-detail-side {
    position: static;
  }

  /* Detail hero padding */
  .detail-hero {
    padding: 28px 20px;
  }

  .detail-hero h1 {
    font-size: 26px;
  }

  /* About hero */
  .about-hero__copy h1 {
    font-size: 28px;
  }

  /* Auth panel padding */
  .auth-panel {
    padding: 20px;
  }

  /* Dashboard summary */
  .dashboard-summary {
    min-width: 0;
    width: 100%;
  }

  /* Section module gap */
  .section-inner {
    padding: 0 0 36px;
  }

  .core-services-section {
    padding: 48px 0;
  }

  .stats-section {
    padding: 40px 0 48px;
  }

  .consult-section {
    padding: 40px 0 48px;
  }

  .news-entry-section {
    padding: 8px 0 48px;
  }

  /* Smaller section heading on mobile */
  .section-heading h2 {
    font-size: 24px;
  }

  .core-services-section .section-heading h2 {
    font-size: 28px;
  }

  /* Records tabs scrollable */
  .records-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }

  .records-tab {
    flex-shrink: 0;
  }
}

@media (max-width: 560px) {
  .consult-summary {
    grid-template-columns: 1fr;
  }

  .news-entry-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .consult-board__meta {
    padding: 14px 18px;
  }

  .query-category-grid,
  .panel-grid,
  .detail-feature-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .case-simple-search {
    grid-template-columns: 1fr;
  }

  .home-grid--primary,
  .stats-strip,
  .core-services-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .service-scenarios-grid {
    grid-template-columns: 1fr;
  }

  .consult-board__head {
    display: none;
  }

  .consult-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .consult-board__list {
    height: 420px;
  }

  .consult-row {
    padding: 16px 18px;
  }

  .consult-row span,
  .consult-row strong {
    display: block;
  }

  .consult-row__phone::before {
    content: "咨询电话：";
    color: var(--text);
    font-weight: 700;
  }

  .consult-row span:nth-child(2)::before {
    content: "类别：";
    color: var(--text);
    font-weight: 700;
  }

  .consult-row span:nth-child(3)::before {
    content: "咨询时间：";
    color: var(--text);
    font-weight: 700;
  }

  .consult-row span:nth-child(4)::before {
    content: "地区：";
    color: var(--text);
    font-weight: 700;
  }

  .consult-row strong::before {
    content: "咨询内容：";
    display: inline-block;
    margin-right: 4px;
    color: var(--text);
    font-weight: 700;
  }

  .consult-row__status::before {
    content: "状态：";
    margin-right: 4px;
    color: var(--text);
    font-weight: 700;
  }

  .ad-slide {
    padding: 24px 64px;
  }

  .ad-slide__visual {
    min-height: 200px;
    padding: 18px;
  }

  .ad-slide__chips span {
    min-height: 28px;
    padding: 0 10px;
    font-size: 11px;
  }

  .ad-banner__controls {
    right: 16px;
    bottom: 14px;
    left: 16px;
  }

  .home-header__brand strong {
    font-size: 20px;
  }

  .hero-visual {
    min-height: 300px;
  }

  .hero-copy p {
    font-size: 14px;
  }

  .hero-tags span {
    font-size: 12px;
  }

  .home-grid {
    gap: 14px;
  }

  .icon-card {
    min-height: 130px;
    padding: 20px 16px;
  }

  .icon-card strong {
    font-size: 18px;
  }

  .icon-card__desc {
    font-size: 12px;
    line-height: 1.7;
  }

  .stat-card {
    min-height: 120px;
    padding: 18px 14px;
  }

  .stat-card strong {
    font-size: 26px;
  }

  .visual-platform {
    width: 204px;
    height: 176px;
  }

  .visual-platform__screen-inner {
    width: 110px;
    height: 110px;
    font-size: 24px;
  }

  .visual-card {
    min-width: 78px;
    min-height: 78px;
    font-size: 14px;
  }

  .visual-shield {
    right: 64px;
    width: 60px;
    height: 74px;
    font-size: 22px;
  }

  .visual-doc {
    right: 8px;
    width: 72px;
    height: 94px;
  }

  .visual-scale {
    left: 14px;
    width: 76px;
    height: 76px;
  }

  .footer-sites {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  .footer-records__links {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }

  .footer-center {
    width: 100%;
    justify-content: center;
  }

  .submenu-topbar {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .submenu-hero h1,
  .law-results-hero h1,
  .law-detail-hero h1,
  .tool-hero h1,
  .generate-hero h1,
  .case-detail-hero h1,
  .dashboard-hero h1,
  .records-hero h1 {
    font-size: 26px;
  }

  .query-search button,
  .case-search button,
  .law-search-panel__form button,
  .law-upload-panel__action button,
  .query-upload button {
    width: 100%;
  }

  .query-upload {
    padding: 18px;
  }

  .case-filter-group,
  .law-filter-group {
    align-items: flex-start;
    flex-direction: column;
  }

  .tool-result__tools,
  .generate-preview__tools {
    grid-template-columns: 1fr;
  }

  .dashboard-hero {
    flex-direction: column;
  }

  .records-item--favorite {
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 12px;
  }

  .records-item__actions {
    justify-content: stretch;
  }

  .records-item__action {
    width: 100%;
  }

  .records-manage__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .records-manage__actions button {
    width: 100%;
  }

  .dashboard-stats {
    grid-template-columns: 1fr;
  }

  /* Landscape-optimized touch targets */
  .panel-tile {
    min-height: 110px;
    padding: 18px;
    gap: 10px;
  }

  .panel-tile__icon {
    width: 44px;
    height: 44px;
  }

  .panel-tile__icon svg {
    width: 22px;
    height: 22px;
  }
}

@media (max-width: 420px) {
  .home-grid--primary,
  .stats-strip,
  .dashboard-stats,
  .query-category-grid,
  .panel-grid,
  .detail-feature-grid,
  .detail-feature-grid--2col {
    grid-template-columns: 1fr;
  }

  .hero-container,
  .section-inner,
  .site-footer__inner,
  .footer-sites,
  .submenu-shell,
  .auth-shell,
  .detail-shell,
  .law-results-shell,
  .law-detail-shell,
  .tool-shell,
  .generate-shell,
  .case-detail-shell,
  .dashboard-shell,
  .records-shell {
    width: min(100% - 18px, 1180px);
  }

  .icon-card {
    min-height: 120px;
  }

  .inner-hero__container,
  .page-container {
    width: min(100% - 18px, 1180px);
  }

  .hero-copy h1 {
    font-size: 1.6rem;
  }

  .hero-copy p {
    font-size: 14px;
  }

  .hero-btn {
    height: 46px;
    padding: 0 24px;
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .core-services-grid,
  .home-grid--primary,
  .stats-strip {
    grid-template-columns: 1fr;
  }

  .hero-actions {
    flex-direction: column;
    width: 100%;
  }

  .hero-btn {
    width: 100%;
  }
}
/* ========================================
   UNIFIED DESIGN SYSTEM - 律秤网
   统一设计系统 - 全站共享组件
   ======================================== */

/* ========================================
   0. 全局变量补充
   ======================================== */

:root {
  --auth-hero-bg: linear-gradient(135deg, #1a2332 0%, #2d3e50 100%);
}

/* ========================================
   1. 统一容器系统
   ======================================== */

.page-container {
  width: var(--wrap);
  margin: 0 auto;
}

.page-container--narrow {
  width: var(--wrap-narrow);
  margin: 0 auto;
}

.page-container--wide {
  width: var(--wrap-wide);
  margin: 0 auto;
}

/* ========================================
   2. 统一内页 Hero 区
   ======================================== */

.inner-hero {
  padding: var(--space-lg) 0;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}

.inner-hero__container {
  width: var(--wrap);
  margin: 0 auto;
}

.inner-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 14px;
  color: var(--text-light);
}

.inner-hero__breadcrumb a {
  color: var(--text-light);
  transition: color 200ms ease;
}

.inner-hero__breadcrumb a:hover {
  color: var(--primary);
}

.inner-hero__breadcrumb span {
  color: var(--border);
}

.inner-hero__title {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.2;
}

.inner-hero__desc {
  margin: 0;
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.6;
  max-width: 720px;
}

.inner-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.inner-hero__tag {
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  font-size: 13px;
  font-weight: 500;
  color: var(--text-muted);
}

.inner-hero__actions {
  display: flex;
  gap: 12px;
  margin-top: 24px;
}

/* ========================================
   3. 统一卡片系统
   ======================================== */

.card {
  padding: 32px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  transition: all 200ms ease;
}

.card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow);
  transform: translateY(-2px);
}

.card--no-hover:hover {
  border-color: var(--border);
  box-shadow: var(--shadow-soft);
  transform: none;
}

.card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
  border-radius: var(--radius-md);
  background: rgba(20, 43, 111, 0.06);
  color: var(--primary);
}

.card__icon svg {
  width: 24px;
  height: 24px;
}

.card__title {
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}

.card__desc {
  margin: 0 0 16px;
  font-size: 14px;
  color: var(--text-light);
  line-height: 1.6;
}

.card__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--primary);
  transition: gap 200ms ease;
}

.card__link:hover {
  gap: 10px;
}

.card__link::after {
  content: '→';
}

/* 服务卡片 */
.service-card {
  padding: 32px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  transition: all 200ms ease;
}

.service-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow);
}

/* 信息卡片 */
.info-card {
  padding: 24px;
  background: var(--surface-soft);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
}

.info-card__title {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}

.info-card__content {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ========================================
   4. 统一按钮系统
   ======================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--button-height);
  padding: 0 24px;
  border: none;
  border-radius: var(--radius-md);
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: all 200ms ease;
  text-decoration: none;
}

.btn--primary {
  background: var(--primary);
  color: #fff;
}

.btn--primary:hover {
  background: var(--primary-light);
  box-shadow: 0 4px 12px rgba(20, 43, 111, 0.2);
}

.btn--accent {
  background: var(--accent);
  color: #fff;
}

.btn--accent:hover {
  background: var(--accent-light);
  box-shadow: 0 4px 12px rgba(182, 138, 46, 0.2);
}

.btn--secondary {
  background: transparent;
  border: 2px solid var(--border);
  color: var(--text);
}

.btn--secondary:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: rgba(20, 43, 111, 0.04);
}

.btn--outline {
  background: transparent;
  border: 2px solid var(--primary);
  color: var(--primary);
}

.btn--outline:hover {
  background: var(--primary);
  color: #fff;
}

.btn--text {
  background: transparent;
  border: none;
  color: var(--primary);
  padding: 0 12px;
}

.btn--text:hover {
  color: var(--primary-light);
  background: rgba(20, 43, 111, 0.04);
}

.btn--lg {
  height: var(--button-height-lg);
  padding: 0 32px;
  font-size: 16px;
}

.btn--sm {
  height: 36px;
  padding: 0 16px;
  font-size: 14px;
}

.btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.btn--primary.is-active {
  background: var(--text-light);
}

.btn--primary.is-active:hover {
  background: var(--text-muted);
}

/* ========================================
   5. 统一网格系统
   ======================================== */

.grid {
  display: grid;
  gap: var(--space-lg);
}

.grid--2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid--3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid--4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid--auto {
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

@media (max-width: 1024px) {
  .grid--4 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .grid--2,
  .grid--3,
  .grid--4 {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   6. 统一标题区系统
   ======================================== */

.section-header {
  margin-bottom: var(--space-xl);
  text-align: center;
}

.section-header--left {
  text-align: left;
}

.section-header__eyebrow {
  display: inline-block;
  margin-bottom: 12px;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--accent);
}

.section-header__title {
  margin: 0 0 12px;
  font-size: 32px;
  font-weight: 700;
  color: var(--text);
}

.section-header__desc {
  margin: 0;
  font-size: 16px;
  color: var(--text-muted);
  line-height: 1.6;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

.section-header--left .section-header__desc {
  margin-left: 0;
}

/* ========================================
   7. 统一搜索框系统
   ======================================== */

.search-box {
  display: flex;
  gap: 8px;
  max-width: 640px;
  margin: 0 auto 24px;
}

.search-box__input {
  flex: 1;
  height: 52px;
  padding: 0 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  font-size: 15px;
  background: var(--surface);
  color: var(--text);
  transition: all 200ms ease;
}

.search-box__input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(20, 43, 111, 0.08);
}

.search-box__button {
  height: 52px;
  padding: 0 32px;
  border: none;
  border-radius: var(--radius-md);
  background: var(--primary);
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  transition: all 200ms ease;
}

.search-box__button:hover {
  background: var(--primary-light);
  box-shadow: 0 4px 12px rgba(20, 43, 111, 0.2);
}

/* ========================================
   8. 统一筛选标签系统
   ======================================== */

.filter-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: var(--space-lg);
}

.filter-tag {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 16px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: 14px;
  font-weight: 500;
  color: var(--text-muted);
  cursor: pointer;
  transition: all 200ms ease;
}

.filter-tag:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: rgba(20, 43, 111, 0.04);
}

.filter-tag--active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}

.filter-tag--active:hover {
  background: var(--primary-light);
}

/* ========================================
   9. 统一提示信息系统
   ======================================== */

.notice {
  padding: 20px 24px;
  border-radius: var(--radius-md);
  font-size: 14px;
  line-height: 1.6;
}

.notice--info {
  background: rgba(2, 132, 199, 0.08);
  border: 1px solid rgba(2, 132, 199, 0.2);
  color: #0369a1;
}

.notice--warning {
  background: rgba(217, 119, 6, 0.08);
  border: 1px solid rgba(217, 119, 6, 0.2);
  color: #92400e;
}

.notice--success {
  background: rgba(5, 150, 105, 0.08);
  border: 1px solid rgba(5, 150, 105, 0.2);
  color: #065f46;
}

.notice--error {
  background: rgba(220, 38, 38, 0.08);
  border: 1px solid rgba(220, 38, 38, 0.2);
  color: #991b1b;
}

.notice__title {
  margin: 0 0 8px;
  font-weight: 600;
}

.notice__content {
  margin: 0;
}

/* ========================================
   10. 统一分组系统
   ======================================== */

.content-group {
  margin-bottom: var(--space-3xl);
}

.content-group__header {
  margin-bottom: var(--space-lg);
  padding-bottom: 16px;
  border-bottom: 2px solid var(--border);
}

.content-group__title {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
}

.content-group__desc {
  margin: 8px 0 0;
  font-size: 14px;
  color: var(--text-muted);
}

/* ========================================
   11. 统一空状态系统
   ======================================== */

.empty-state {
  padding: var(--space-3xl) var(--space-lg);
  text-align: center;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}

.empty-state__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 20px;
  color: var(--text-light);
}

.empty-state__title {
  margin: 0 0 12px;
  font-size: 20px;
  font-weight: 600;
  color: var(--text);
}

.empty-state__desc {
  margin: 0 0 24px;
  font-size: 14px;
  color: var(--text-muted);
}

.empty-state__actions {
  display: flex;
  justify-content: center;
  gap: 12px;
}

/* ========================================
   12. 统一列表系统
   ======================================== */

.list-item {
  padding: 20px 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  transition: all 200ms ease;
}

.list-item:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-soft);
}

.list-item__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.list-item__title {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}

.list-item__meta {
  display: flex;
  gap: 12px;
  font-size: 13px;
  color: var(--text-light);
}

.list-item__content {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

/* ========================================
   13. 响应式工具类
   ======================================== */

.hide-mobile {
  display: block;
}

.show-mobile {
  display: none;
}

@media (max-width: 768px) {
  .hide-mobile {
    display: none;
  }

  .show-mobile {
    display: block;
  }
}

/* ========================================
   14. 首页专用样式
   ======================================== */

/* 咨询入口区 */
.consult-entry-grid {
  max-width: 1000px;
  margin: 0 auto;
}

.consult-entry-card {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: var(--space-xl);
  padding: var(--space-xl);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.consult-entry-card__content h3 {
  margin: 0 0 12px;
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
}

.consult-entry-card__content > p {
  margin: 0 0 20px;
  font-size: 15px;
  color: var(--text-muted);
  line-height: 1.6;
}

.consult-entry-card__features {
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

.consult-entry-card__features li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

.consult-entry-card__features li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--primary);
  font-weight: bold;
}

.consult-entry-card__info {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  background: var(--surface-soft);
  border-radius: var(--radius-md);
}

.consult-entry-card__info-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.consult-entry-card__info-item strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-light);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.consult-entry-card__info-item span {
  font-size: 15px;
  font-weight: 500;
  color: var(--text);
}

/* 服务场景网格 */
.service-scenarios-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  margin-bottom: var(--space-xl);
}

.scenario-card {
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  transition: all 200ms ease;
}

.scenario-card:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-soft);
}

.scenario-card h3 {
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
}

.scenario-card p {
  margin: 0;
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

.service-notice {
  padding: 20px 24px;
  background: rgba(182, 138, 46, 0.08);
  border: 1px solid rgba(182, 138, 46, 0.2);
  border-radius: var(--radius-md);
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

.service-notice strong {
  color: var(--text);
  font-weight: 600;
}

/* Footer 重构样式 */
.site-footer {
  background: #0F172A;
  color: rgba(255, 255, 255, 0.8);
}

.footer-main {
  display: grid;
  grid-template-columns: 1.5fr 2fr;
  gap: var(--space-3xl);
  padding: var(--space-3xl) 0;
}

.footer-brand__logo {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.footer-brand__mark {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  display: inline-block;
  object-fit: contain;
  flex-shrink: 0;
}

.footer-brand__logo strong {
  display: block;
  font-size: 20px;
  font-weight: 700;
  color: #FFFFFF;
}

.footer-brand__logo p {
  margin: 0;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.55);
}

.footer-brand__desc {
  margin: 0;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.6;
  max-width: 400px;
}

.footer-links-group {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-xl);
}

.footer-column h4 {
  margin: 0 0 16px;
  font-size: 15px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
}

.footer-column a {
  display: block;
  margin-bottom: 12px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  transition: color 200ms ease;
}

.footer-column a:hover {
  color: #FFFFFF;
}

.footer-contact {
  margin: 0 0 12px;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
}

.footer-sites {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 24px;
  padding: 24px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-sites__label {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
}

.footer-sites a {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  transition: color 200ms ease;
}

.footer-sites a:hover {
  color: #FFFFFF;
}

/* 响应式 */
@media (max-width: 1024px) {
  .consult-entry-card {
    grid-template-columns: 1fr;
  }

  .service-scenarios-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .footer-main {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }

  .footer-links-group {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .service-scenarios-grid {
    grid-template-columns: 1fr;
  }

  .footer-links-group {
    grid-template-columns: 1fr;
  }

  .footer-sites {
    flex-direction: column;
    gap: 12px;
  }

  .footer-sites__label {
    width: 100%;
    text-align: center;
  }
}

/* ========================================
   15. 登录/注册页面统一样式
   ======================================== */

/* 覆盖旧的 auth-page 背景 */
.auth-page {
  min-height: 100vh;
  background: #f8f9fa;
}

/* 覆盖旧的 auth-shell 布局 */
.auth-shell {
  display: block;
  width: 100%;
  min-height: auto;
  margin: 0;
  padding: 0;
}

.auth-container {
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: var(--space-xl);
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--space-3xl) var(--space-lg);
  min-height: calc(100vh - 200px);
}

.auth-hero {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-3xl);
  background: linear-gradient(135deg, #1a2332 0%, #2d3e50 100%);
  border-radius: var(--radius-lg);
  color: #fff;
  box-shadow: var(--shadow);
  overflow: visible;
  position: relative;
}

/* 移除旧样式的伪元素 */
.auth-hero::after {
  display: none;
}

.auth-hero__content {
  position: relative;
  z-index: 1;
  max-width: 100%;
}

.auth-badge {
  display: none;
}

.auth-hero__content h1 {
  margin: 0 0 16px;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
}

.auth-hero__content p {
  margin: 0 0 24px;
  font-size: 16px;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
}

.auth-points {
  margin: 0;
  padding: 0;
  list-style: none;
}

.auth-points li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 12px;
  font-size: 15px;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
}

.auth-points li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--accent);
  font-weight: bold;
  font-size: 18px;
}

.auth-panel {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
}

.auth-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
}

.auth-tab {
  flex: 1;
  padding: 20px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  color: var(--text-muted);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: all 200ms ease;
  text-decoration: none;
}

.auth-tab:hover {
  color: var(--primary);
  background: rgba(20, 43, 111, 0.04);
}

.auth-tab.is-active {
  color: var(--primary);
  background: rgba(20, 43, 111, 0.06);
  border-bottom: 2px solid var(--primary);
}

.auth-form-wrap {
  padding: var(--space-xl);
}

.auth-heading {
  margin-bottom: var(--space-lg);
  text-align: center;
}

.auth-heading h2 {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
}

.auth-heading p {
  margin: 0;
  font-size: 14px;
  color: var(--text-muted);
}

.auth-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.auth-form label {
  display: grid;
  gap: 8px;
}

.auth-form label > span {
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}

.auth-form input[type="text"],
.auth-form input[type="password"] {
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  font-size: 15px;
  background: var(--surface);
  color: var(--text);
  transition: all 200ms ease;
}

.auth-form input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(20, 43, 111, 0.08);
  outline: none;
}

.auth-code {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: end;
}

.auth-code__label {
  grid-column: 1 / -1;
}

.auth-code input {
  grid-column: 1;
}

.auth-code button {
  height: 48px;
  padding: 0 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--surface);
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: all 200ms ease;
  white-space: nowrap;
}

.auth-code button:hover {
  border-color: var(--primary);
  color: var(--primary);
  background: rgba(20, 43, 111, 0.04);
}

.auth-form__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.auth-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.auth-check input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.auth-check span {
  font-size: 13px;
  color: var(--text-muted);
}

.auth-check span a {
  color: var(--primary);
  text-decoration: none;
  margin: 0 2px;
}

.auth-check span a:hover {
  text-decoration: underline;
}

#auth-secondary-link {
  font-size: 13px;
  color: var(--primary);
  text-decoration: none;
  white-space: nowrap;
}

#auth-secondary-link:hover {
  text-decoration: underline;
}

.auth-button {
  height: 52px;
  padding: 0 32px;
  border: none;
  border-radius: var(--radius-md);
  background: var(--primary);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 200ms ease;
}

.auth-button:hover {
  background: var(--primary-light);
  box-shadow: 0 4px 12px rgba(20, 43, 111, 0.2);
}

.auth-form__note {
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 13px;
  color: var(--text-light);
  text-align: center;
  line-height: 1.5;
}

/* 响应式 */
@media (max-width: 1024px) {
  .auth-container {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }

  .auth-hero {
    padding: var(--space-xl);
  }
}

@media (max-width: 768px) {
  .auth-container {
    padding: var(--space-lg);
  }

  .auth-hero__content h1 {
    font-size: 24px;
  }

  .auth-form-wrap {
    padding: var(--space-lg);
  }

  .auth-form__row {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ========================================
   16. Footer 统一样式覆盖
   ======================================== */

.footer-records {
  display: grid;
  place-items: center;
  gap: 6px;
  padding: 16px 16px 18px;
  background: #0F172A;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
}

.footer-records p {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  letter-spacing: 0.02em;
}

.footer-records__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 8px 14px;
}

.footer-records__links a {
  color: #eef4ff;
  font-size: 12px;
  opacity: 0.96;
  text-decoration: none;
  transition: opacity 200ms ease;
}

.footer-records__links a:hover {
  opacity: 1;
}

/* ========================================
   17. 关于页面专用样式
   ======================================== */

.about-page {
  min-height: 100vh;
  background: var(--bg);
}

.about-shell {
  width: 100%;
  margin: 0;
  padding: 0 0 var(--space-3xl);
}

.about-intro {
  padding: var(--space-3xl) 0;
  margin-bottom: 0;
  background: var(--surface);
}

.about-panel {
  padding: var(--space-xl);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}

.about-panel--lead {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}

.about-panel h2 {
  margin: 0 0 24px;
  font-size: 24px;
  font-weight: 600;
  color: var(--text);
}

.about-panel--lead h2 {
  font-size: 28px;
  margin-bottom: 20px;
}

.about-panel p {
  margin: 0;
  font-size: 16px;
  color: var(--text-muted);
  line-height: 1.8;
}

.about-grid {
  display: block;
  grid-template-columns: none;
  margin-bottom: 0;
  padding: var(--space-3xl) 0;
}

.about-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  grid-template-columns: none;
}

.about-list__item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 20px;
  background: var(--surface-soft);
  border-radius: var(--radius-md);
  border: 1px solid var(--border-light);
  transition: all 200ms ease;
}

.about-list__item:hover {
  border-color: var(--primary);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.about-list__item strong {
  font-size: 16px;
  font-weight: 600;
  color: var(--text);
}

.about-list__item span {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

.about-principles {
  padding: var(--space-3xl) 0;
  margin-bottom: 0;
  background: var(--surface-soft);
}

.about-principles__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.about-principles__item {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 24px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  text-align: center;
  transition: all 200ms ease;
}

.about-principles__item:hover {
  border-color: var(--primary);
  box-shadow: var(--shadow-soft);
  transform: translateY(-2px);
}

.about-principles__item strong {
  font-size: 18px;
  font-weight: 600;
  color: var(--primary);
}

.about-principles__item span {
  font-size: 14px;
  color: var(--text-muted);
  line-height: 1.6;
}

.about-boundary {
  padding: var(--space-3xl) 0;
}

.policy-nav {
  padding: var(--space-xl) 0;
  background: var(--surface);
  border-top: 1px solid var(--border);
}

.policy-nav__links {
  display: flex;
  justify-content: center;
  gap: 32px;
  flex-wrap: wrap;
}

.policy-nav__links a {
  font-size: 15px;
  font-weight: 500;
  color: var(--text-muted);
  text-decoration: none;
  padding: 8px 16px;
  border-radius: var(--radius-md);
  transition: all 200ms ease;
}

.policy-nav__links a:hover {
  color: var(--primary);
  background: rgba(20, 43, 111, 0.04);
}

.policy-nav__links a.is-active {
  color: var(--primary);
  background: rgba(20, 43, 111, 0.08);
  font-weight: 600;
}

/* 响应式 */
@media (max-width: 1024px) {
  .about-principles__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .about-principles__grid {
    grid-template-columns: 1fr;
  }

  .policy-nav__links {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }

  .policy-nav__links a {
    width: 100%;
    text-align: center;
  }
}


/* ========================================
   18. Shell layout overrides
   Reset old styles.css width constraints on shell elements
   so inner-hero and sections can go full-width
   ======================================== */

.tool-shell,
.generate-shell,
.submenu-shell,
.case-detail-shell {
  width: 100%;
  margin: 0;
  padding: 0 0 var(--space-3xl);
}

.tool-layout,
.generate-layout {
  display: block;
  grid-template-columns: none;
}

.tool-layout .page-container,
.generate-layout .page-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: var(--space-xl);
}

.tool-main,
.tool-side,
.generate-main,
.generate-side {
  display: grid;
  gap: var(--space-lg);
}

@media (max-width: 1024px) {
  .tool-layout .page-container,
  .generate-layout .page-container {
    grid-template-columns: 1fr;
  }
}/* ======== unified-system.css merged above ======== */
