/* Shared H5 theme and document layout. Device-only styles stay in xv-device.html. */
/* APP_THEME_START */
:root {
  --scanner-background: 0, 0%, 0%;
  --scanner-foreground: 0, 0%, 100%;
  --scanner-control: 220, 13%, 18%;
  --background: 0, 0%, 99.7%;
  --foreground: 224, 45%, 11%;
  --card: 0, 0%, 100%;
  --card-foreground: 224, 45%, 11%;
  --popover: 0, 0%, 100%;
  --popover-foreground: 224, 45%, 11%;
  --primary: 223, 91%, 58%;
  --primary-foreground: 0, 0%, 100%;
  --secondary: 218, 100%, 97%;
  --secondary-foreground: 223, 68%, 43%;
  --muted: 223, 33%, 96%;
  --muted-foreground: 219, 16%, 44%;
  --accent: 218, 100%, 97%;
  --accent-foreground: 223, 68%, 43%;
  --destructive: 354, 83%, 63%;
  --border: 220, 29%, 92%;
  --input: 220, 37%, 97%;
  --ring: 216, 100%, 75%;
  --radius: 0.75rem;
  --card-radius: 0.75rem;
  --brand: 223, 91%, 58%;
  --brand-violet: 273, 87%, 61%;
  --brand-soft: 218, 100%, 97%;
  --brand-strong: 216, 100%, 93%;
  --brand-navy: 223, 59%, 27%;
  --brand-cyan: 197, 86%, 54%;
  --progress-valid: 169.1667, 100%, 85.8824%;
  --success: 160, 77%, 41%;
  --success-soft: 160, 65%, 95%;
  --warning: 38, 91%, 54%;
  --warning-soft: 42, 100%, 95%;
  --expiry: 39.4286, 39.3258%, 65.098%;
  --expiry-overlay: 39.802, 82.1138%, 75.8824%;
  --expiry-foreground: 38.2609, 100%, 27.0588%;
  --chart-1: 223, 91%, 58%;
  --chart-2: 273, 87%, 61%;
  --chart-3: 160, 77%, 41%;
  --chart-4: 38, 91%, 54%;
  --chart-5: 197, 86%, 54%;
  --app-radius-action: 12px;
  --app-radius-card: 12px;
  --app-page-intro-gradient: linear-gradient(135deg, #dce9ff 0%, #eaf3ff 48%, #c8dcff 100%);
  --app-card-shadow: 0 10px 15px -3px rgb(2 6 23 / 0.06), 0 4px 6px -4px rgb(2 6 23 / 0.06);
}
.dark:root {
  --background: 228, 30%, 8%;
  --foreground: 228, 33%, 97%;
  --card: 227, 28%, 11%;
  --card-foreground: 228, 33%, 97%;
  --popover: 227, 28%, 11%;
  --popover-foreground: 228, 33%, 97%;
  --primary: 216, 100%, 70%;
  --primary-foreground: 230, 40%, 9%;
  --secondary: 229, 27%, 17%;
  --secondary-foreground: 228, 33%, 97%;
  --muted: 229, 24%, 17%;
  --muted-foreground: 226, 16%, 68%;
  --accent: 221, 45%, 20%;
  --accent-foreground: 216, 100%, 82%;
  --destructive: 0, 70.9%, 59.4%;
  --border: 228, 22%, 21%;
  --input: 228, 22%, 21%;
  --ring: 216, 100%, 70%;
  --brand: 216, 100%, 70%;
  --brand-violet: 266, 91%, 70%;
  --brand-soft: 221, 45%, 18%;
  --brand-strong: 221, 42%, 24%;
  --brand-navy: 216, 89%, 72%;
  --brand-cyan: 188, 90%, 61%;
  --progress-valid: 169.1667, 100%, 85.8824%;
  --success: 151, 61%, 52%;
  --success-soft: 151, 38%, 16%;
  --warning: 39, 94%, 56%;
  --warning-soft: 39, 43%, 17%;
  --expiry: 39.4286, 39.3258%, 65.098%;
  --expiry-overlay: 39.802, 82.1138%, 75.8824%;
  --expiry-foreground: 38.2609, 100%, 27.0588%;
  --chart-1: 216, 100%, 70%;
  --chart-2: 266, 91%, 70%;
  --chart-3: 151, 61%, 52%;
  --chart-4: 39, 94%, 56%;
  --chart-5: 199, 89%, 58%;
}
/* APP_THEME_END */

:root {
  color-scheme: only light;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --font-small: 0.875rem;
  --font-heading: 1.25rem;
  --font-title: 1.875rem;
  --reading-width: 48rem;
  --touch-height: 2.75rem;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html {
  background: hsl(var(--card));
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
body {
  margin: 0;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  font:
    1rem/1.8 -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    'PingFang SC',
    'Hiragino Sans GB',
    'Microsoft YaHei',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-overflow-scrolling: touch;
}

.app-sheet-body {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
.document-page {
  background: hsl(var(--card));
  overflow-wrap: break-word;
  overflow-wrap: anywhere;
}

.document-page,
.document-page * {
  box-sizing: border-box;
}

.document-page main {
  width: 100%;
  max-width: var(--reading-width);
  margin-right: auto;
  margin-left: auto;
  padding: var(--space-8) var(--space-5) var(--space-10);
}
@supports (padding: max(0px, 1px)) {
  .document-page main {
    padding-top: max(var(--space-8), env(safe-area-inset-top));
    padding-right: max(var(--space-5), env(safe-area-inset-right));
    padding-bottom: max(var(--space-10), env(safe-area-inset-bottom));
    padding-left: max(var(--space-5), env(safe-area-inset-left));
  }
}

.document-page h1,
.document-page h2,
.document-page h3,
.document-page p,
.document-page dl,
.document-page ol,
.document-page ul {
  margin: 0;
}

.document-page h1 {
  font-size: var(--font-title);
  line-height: 1.4;
}

.document-page h2 {
  margin-bottom: var(--space-3);
  font-size: var(--font-heading);
  line-height: 1.6;
}

.document-page h3 {
  margin-top: var(--space-5);
  margin-bottom: var(--space-2);
  font-size: 1rem;
}

.document-page p + p,
.document-page p + ul,
.document-page dl + p {
  margin-top: var(--space-3);
}

.document-page ul,
.document-page ol {
  padding-left: var(--space-6);
}

.document-page p + ol,
.document-page p + .table-scroll,
.document-page ol + p,
.document-page ul + p,
.document-page .table-scroll + p {
  margin-top: var(--space-3);
}

.document-page li + li {
  margin-top: var(--space-2);
}

.document-page a {
  color: hsl(var(--primary));
  text-decoration: underline;
  text-underline-offset: var(--space-1);
}

.document-page a:focus {
  outline: 2px solid hsl(var(--primary));
  outline-offset: var(--space-1);
  border-radius: var(--space-1);
}

.document-page .brand,
.document-page .document-meta,
.document-page .document-footer {
  color: hsl(var(--muted-foreground));
  font-size: var(--font-small);
}

.document-page .brand {
  margin-bottom: var(--space-2);
}

.document-page .legal-header {
  padding-bottom: var(--space-6);
  border-bottom: 1px solid hsl(var(--border));
}

.document-page .effective-date {
  margin-top: var(--space-2);
  color: hsl(var(--muted-foreground));
  font-size: var(--font-small);
}

.document-page .important-notice {
  margin-top: var(--space-5);
  padding: var(--space-3) var(--space-4);
  border-left: 3px solid hsl(var(--primary));
  border-radius: 0 var(--radius) var(--radius) 0;
  background: hsl(var(--brand-soft));
}

.document-page .important-notice strong {
  font-weight: inherit;
}

.document-page strong {
  font-weight: 650;
}

.document-page .document-meta {
  margin-top: var(--space-5);
}

.document-page .document-meta > div {
  display: flex;
  flex-wrap: wrap;
}

.document-page .document-meta dt {
  margin-right: var(--space-2);
}

.document-page dd {
  margin: 0;
}

.document-page .draft-notice,
.document-page .contents {
  margin-top: var(--space-6);
  padding: var(--space-4);
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
}

.document-page .draft-notice {
  background: hsl(var(--muted));
}

.document-page .draft-notice h2 {
  margin-bottom: var(--space-2);
  font-size: 1rem;
}

.document-page .contents a,
.document-page .document-footer a {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch-height);
}

.document-page .contents li + li {
  margin-top: 0;
}

.document-page section {
  margin-top: var(--space-8);
  scroll-margin-top: var(--space-6);
}

.document-page .table-scroll {
  width: 100%;
  margin-top: var(--space-4);
  overflow-x: auto;
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius);
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

.document-page .table-scroll:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}

.document-page table {
  width: 100%;
  min-width: 36rem;
  border-collapse: collapse;
  color: hsl(var(--foreground));
  font-size: var(--font-small);
  line-height: 1.6;
}

.document-page .table-scroll--6 table {
  min-width: 68rem;
}

.document-page th,
.document-page td {
  padding: var(--space-3);
  border-right: 1px solid hsl(var(--border));
  border-bottom: 1px solid hsl(var(--border));
  vertical-align: top;
  text-align: left;
}

.document-page th {
  background: hsl(var(--muted));
  font-weight: 600;
}

.document-page thead th {
  white-space: nowrap;
}

.document-page tbody th {
  background: transparent;
}

.document-page tr:last-child > * {
  border-bottom: 0;
}

.document-page tr > *:last-child {
  border-right: 0;
}

@media (max-width: 30rem) {
  .document-page main {
    padding: var(--space-6) var(--space-4) var(--space-8);
  }

  @supports (padding: max(0px, 1px)) {
    .document-page main {
      padding-top: max(var(--space-6), env(safe-area-inset-top));
      padding-right: max(var(--space-4), env(safe-area-inset-right));
      padding-bottom: max(var(--space-8), env(safe-area-inset-bottom));
      padding-left: max(var(--space-4), env(safe-area-inset-left));
    }
  }

  .document-page h1 {
    font-size: 1.625rem;
  }

  .document-page h2 {
    font-size: 1.125rem;
  }

  .document-page .important-notice {
    padding-right: var(--space-3);
    padding-left: var(--space-3);
  }
}

.document-page .document-footer {
  display: flex;
  flex-wrap: wrap;
  margin-top: var(--space-10);
  padding-top: var(--space-4);
  border-top: 1px solid hsl(var(--border));
}

.document-page .document-footer > a {
  margin-right: var(--space-6);
}

.document-page .document-footer > a:last-child {
  margin-right: 0;
}

@media print {
  .document-page main {
    max-width: none;
    padding: 0;
  }

  .document-page .contents,
  .document-page .document-footer {
    display: none;
  }

  .document-page h2,
  .document-page h3 {
    break-after: avoid;
  }

  .document-page .table-scroll {
    overflow: visible;
    border-color: hsl(var(--border));
  }

  .document-page table,
  .document-page .table-scroll--6 table {
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html,
  .app-sheet-body,
  .document-page .table-scroll {
    scroll-behavior: auto;
  }
}

[hidden] {
  display: none !important;
}

/* Shared environment selector for the two download pages. */
.release-environments {
  display: flex;
  margin-bottom: var(--space-4);
}
.release-environments button {
  min-height: var(--touch-height);
  padding: var(--space-2) var(--space-4);
  border: 1px solid hsl(var(--border));
  border-radius: var(--app-radius-action);
  background: hsl(var(--card));
  color: hsl(var(--muted-foreground));
  font: inherit;
  cursor: pointer;
}
.release-environments button + button {
  margin-left: var(--space-2);
}
.release-environments button[aria-pressed='true'] {
  color: hsl(var(--primary));
  background: hsl(var(--brand-soft));
  border-color: hsl(var(--primary));
}
.release-environments button:focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}