/* Generated from packages/ui/src/styles (tokens.css, theme-subway.css) by src/pages/access-theme.test.ts: do not edit. */
:root {
  --brand-primary: oklch(0.205 0 0);
  --brand-primary-foreground: oklch(0.985 0 0);
  --brand-primary-dark: oklch(0.922 0 0);
  --brand-primary-foreground-dark: oklch(0.205 0 0);
  --brand-accent-dark: oklch(0.488 0.243 264.376); 
  
  --brand-font: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --brand-radius: 0.625rem;
}
:root {
  --background: oklch(1 0 0);
  --foreground: oklch(0.145 0 0);
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --secondary: oklch(0.97 0 0);
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.97 0 0);
  --muted-foreground: oklch(0.53 0 0); 
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.985 0 0);
  
  --destructive-text: oklch(0.505 0.213 27.518);
  --success: oklch(0.527 0.154 150.069);
  --success-foreground: oklch(0.985 0 0);
  --border: oklch(0.922 0 0); 
  --input: oklch(0.62 0 0); 
  --ring: oklch(0.145 0 0); 
  --sidebar: oklch(0.985 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-accent: oklch(0.97 0 0);
  --sidebar-accent-foreground: oklch(0.205 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);

  
  --success-text: oklch(0.448 0.119 151.328);
  --warning: oklch(0.769 0.165 70.08);
  --warning-foreground: oklch(0.279 0.077 45.635);
  --warning-text: oklch(0.473 0.137 46.201);
  --info: oklch(0.546 0.215 262.881);
  --info-foreground: oklch(0.985 0 0);
  --info-text: oklch(0.488 0.217 264.376);

  
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);

  
  --enum-gray: oklch(0.556 0.01 260);
  --enum-gray-text: oklch(0.45 0.01 260);
  --enum-green: oklch(0.6 0.15 150);
  --enum-green-text: oklch(0.45 0.12 150);
  --enum-blue: oklch(0.55 0.2 262);
  --enum-blue-text: oklch(0.488 0.2 264);
  --enum-orange: oklch(0.7 0.17 50);
  --enum-orange-text: oklch(0.5 0.14 45);
  --enum-red: oklch(0.58 0.22 27);
  --enum-red-text: oklch(0.5 0.2 27);
  --enum-purple: oklch(0.56 0.2 300);
  --enum-purple-text: oklch(0.48 0.2 300);
  --enum-yellow: oklch(0.82 0.16 90);
  --enum-yellow-text: oklch(0.47 0.1 75);

  
  --line-red: oklch(0.575 0.14 28);
  --line-green: oklch(0.55 0.1 150);
  --line-blue: oklch(0.38 0.12 262);
  --line-orange: oklch(0.68 0.13 45);
  --line-purple: oklch(0.55 0.12 330);
  --line-yellow: oklch(0.85 0.11 92);
  --line-lime: oklch(0.72 0.11 135);
  --line-brown: oklch(0.52 0.065 65);
  --line-gray: oklch(0.56 0.004 260);
  --line-icon: oklch(1 0 0);
  --line-icon-dark: oklch(0.178 0 0);
}
:root,
.theme-subway,
.theme-base,
.theme-frontend {
  --font-sans: var(--brand-font);
  --primary: var(--brand-primary);
  --primary-foreground: var(--brand-primary-foreground);
  --sidebar-primary: var(--brand-primary);
  --sidebar-primary-foreground: var(--brand-primary-foreground);
  --radius: var(--brand-radius);
  --surface-page: var(--background);
  --surface-subtle: color-mix(in oklab, var(--muted) 40%, transparent);
  --surface-raised: var(--card);
}
@media (prefers-color-scheme: dark) {
:root {
  --background: oklch(0.145 0 0);
  --foreground: oklch(0.985 0 0);
  --card: oklch(0.205 0 0);
  --card-foreground: oklch(0.985 0 0);
  --popover: oklch(0.205 0 0);
  --popover-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.269 0 0);
  --secondary-foreground: oklch(0.985 0 0);
  --muted: oklch(0.269 0 0);
  --muted-foreground: oklch(0.708 0 0);
  --accent: oklch(0.269 0 0);
  --accent-foreground: oklch(0.985 0 0);
  --destructive: oklch(0.704 0.191 22.216);
  --destructive-text: oklch(0.704 0.191 22.216);
  --success: oklch(0.527 0.154 150.069);
  --success-foreground: oklch(0.985 0 0);
  --border: oklch(1 0 0 / 10%);
  --input: oklch(1 0 0 / 38%); 
  --ring: oklch(0.985 0 0); 
  --sidebar: oklch(0.205 0 0);
  --sidebar-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.269 0 0);
  --sidebar-accent-foreground: oklch(0.985 0 0);
  --sidebar-border: oklch(1 0 0 / 10%);
  --sidebar-ring: oklch(0.556 0 0);

  --success-text: oklch(0.792 0.209 151.711);
  --warning: oklch(0.828 0.189 84.429);
  --warning-foreground: oklch(0.279 0.077 45.635);
  --warning-text: oklch(0.828 0.189 84.429);
  --info: oklch(0.546 0.215 262.881); 
  --info-foreground: oklch(0.985 0 0);
  --info-text: oklch(0.707 0.165 254.624);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.4);

  --enum-gray-text: oklch(0.78 0.01 260);
  --enum-green-text: oklch(0.79 0.17 150);
  --enum-blue-text: oklch(0.72 0.15 255);
  --enum-orange-text: oklch(0.8 0.15 60);
  --enum-red-text: oklch(0.74 0.17 22);
  --enum-purple-text: oklch(0.76 0.14 305);
  --enum-yellow-text: oklch(0.86 0.15 95);
}
}
@media (prefers-color-scheme: dark) {
:root,
:root .theme-subway,
:root .theme-base,
:root .theme-frontend {
  --primary: var(--brand-primary-dark);
  --primary-foreground: var(--brand-primary-foreground-dark);
  --sidebar-primary: var(--brand-accent-dark);
  --sidebar-primary-foreground: oklch(0.985 0 0);
}
}
@media (prefers-color-scheme: dark) {
:root:is(.theme-frontend, .theme-base),
:root :is(.theme-frontend, .theme-base) {
  --sidebar-primary: var(--brand-primary-dark);
  --sidebar-primary-foreground: var(--brand-primary-foreground-dark);
}
}
@supports (color: oklch(from red l c h)) {
  :is(.theme-frontend, .theme-base)[data-brand] {
    --brand-primary-foreground: oklch(from var(--brand-primary) clamp(0.2, (0.57 - l) * 1000, 0.985) 0.01 h);
    --brand-primary-dark: oklch(from var(--brand-primary) max(l, 0.72) c h);
    --brand-primary-foreground-dark: oklch(from var(--brand-primary) 0.22 0.04 h);
  }
}
:root {
  --admin-row-h: 3rem;
  --admin-content-max: 72rem;
}
[data-density='compact'] {
  --admin-row-h: 2.5rem;
}
[data-density='compact'] [data-slot='table-cell'] {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-size: 0.8125rem;
}
[data-density='compact'] [data-slot='table-head'] {
  height: 2rem;
}
[data-density='compact'] [data-slot='card'] {
  --card-spacing: 0.75rem;
}
[data-density='compact'] main[data-slot='page'] {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
[data-density='compact'] main[data-slot='page'] .gap-4 {
  gap: 0.625rem;
}
[data-density='compact'] [data-slot='field'] {
  gap: 0.25rem;
}
[data-density='compact'] [data-slot='record-card'] {
  padding: 0.5rem 0.75rem;
}
.theme-subway {
  --brand-primary: oklch(0.2 0 0);
  --brand-primary-foreground: oklch(0.99 0 0);
  --brand-primary-dark: oklch(0.97 0 0);
  --brand-primary-foreground-dark: oklch(0.2 0 0);
  --brand-font: 'Inter Variable', 'Helvetica Neue', Helvetica, 'Nimbus Sans', Arial, sans-serif;
  --brand-radius: 0;
  
  --type-title: clamp(30px, 3.6vw, 40px);
  --type-record: clamp(24px, 3vw, 32px);
  --type-section: 24px;
  --type-lead: 17px;
  --type-body: 15px;
  --type-note: 13px;
  --type-stat: clamp(38px, 4.4vw, 56px);

  
  --sign: oklch(0.2 0 0);
  
  --sign-rule: linear-gradient(oklch(1 0 0), oklch(1 0 0)) 0 5px / 100% 2px no-repeat;
  --line-icon-dark: var(--sign);
  --row-selected: oklch(0.88 0.05 240);
  --rule-strong: oklch(0.78 0 0);

  --sidebar: var(--sign);
  --sidebar-foreground: oklch(0.97 0 0);
  --sidebar-accent: oklch(0.3 0 0);
  --sidebar-accent-foreground: oklch(1 0 0);
  --sidebar-border: oklch(1 0 0 / 12%);
  --sidebar-primary: oklch(0.99 0 0);
  --sidebar-primary-foreground: var(--sign);
  --sidebar-ring: oklch(0.99 0 0);
  --muted-foreground: oklch(0.48 0 0);
  
  --surface-page: oklch(0.962 0 0);
  --muted: oklch(0.935 0 0);
  font-optical-sizing: auto;
}
.theme-subway :is([data-slot='stat-value'], [data-slot='bulk-count'], time, .tabular-nums) {
  font-variant-numeric: tabular-nums;
}
@media (prefers-color-scheme: dark) {
:root.theme-subway,
:root .theme-subway {
  --row-selected: oklch(0.64 0.1 248);
  --rule-strong: oklch(1 0 0 / 22%);
  --background: oklch(0.235 0 0);
  --surface-page: oklch(0.235 0 0);
  --card: oklch(0.285 0 0);
  --popover: oklch(0.29 0 0);
  --muted: oklch(0.33 0 0);
  --secondary: oklch(0.33 0 0);
  --accent: oklch(0.34 0 0);
  --border: oklch(1 0 0 / 14%);
  --muted-foreground: oklch(0.76 0 0);
}
}
.theme-subway [data-line='red'] {
  --line: var(--line-red);
}
.theme-subway [data-line='green'] {
  --line: var(--line-green);
}
.theme-subway [data-line='blue'] {
  --line: var(--line-blue);
}
.theme-subway [data-line='orange'] {
  --line: var(--line-orange);
  
  --line-fg: var(--line-icon-dark);
}
.theme-subway [data-line='purple'] {
  --line: var(--line-purple);
}
.theme-subway [data-line='brown'] {
  --line: var(--line-brown);
}
.theme-subway [data-line='lime'] {
  --line: var(--line-lime);
  --line-fg: var(--line-icon-dark);
}
.theme-subway [data-line='yellow'] {
  --line: var(--line-yellow);
  --line-fg: var(--line-icon-dark);
}
.theme-subway [data-line='gray'] {
  --line: var(--line-gray);
}
.theme-subway [data-slot='line-bullet'] {
  background: var(--line, var(--line-gray));
  color: var(--line-fg, var(--line-icon));
  border-radius: 999px;
}
[data-bullet-letter] {
  display: none;
}
.theme-subway [data-slot='line-bullet']:has(> [data-bullet-letter]) > svg {
  display: none;
}
.theme-subway [data-slot='line-bullet'] > [data-bullet-letter] {
  display: block;
  font-size: var(--bullet-letter-size, 18px);
  font-weight: 700;
  line-height: 1;
}
.theme-subway :is([data-shape='diamond'] [data-slot='line-bullet'], [data-slot='line-bullet'][data-shape='diamond']),
.theme-subway [data-shape='diamond'] [data-sidebar='menu-button'] [data-bullet-letter],
.theme-subway main[data-shape='diamond'] :is([data-slot='page-header'], [data-slot='detail-header']) h1::before {
  border-radius: 0;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.theme-subway [data-slot='search-group-label'] {
  background: var(--line, var(--line-gray));
  color: var(--line-fg, var(--line-icon));
}
.theme-subway [data-slot='sidebar-inner'] {
  background: var(--sign-rule), var(--sidebar);
}
.theme-subway [data-slot='sidebar-container'] {
  border-color: oklch(1 0 0 / 14%);
}
.theme-subway [data-sidebar='header'] {
  
  min-height: 64px;
  padding-top: 11.5px;
  padding-bottom: 4.5px;
  border-bottom: 1px solid oklch(1 0 0 / 14%);
}
.theme-subway [data-slot='sidebar'][data-mobile='true'] {
  width: 100%;
  max-width: none;
  background: var(--sign-rule), var(--sidebar);
}
.theme-subway [data-sidebar='header'] [data-sidebar='menu-button']:not(:hover, :focus-visible) {
  background: transparent;
}
.theme-subway [data-sidebar='header'] .bg-sidebar-primary {
  border-radius: 999px;
}
.theme-subway [data-sidebar='header'] [data-sidebar='menu-button'] .font-semibold {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.02em;
}
.theme-subway [data-sidebar='group'] {
  padding-left: 0;
  padding-right: 0;
}
.theme-subway [data-sidebar='group-content'] {
  padding: 0 8px;
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-button'] {
  height: 40px;
  font-size: 15px;
  font-weight: 600;
  gap: 10px;
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-button'] > svg {
  display: none;
}
.theme-subway [data-sidebar='content'] [data-bullet-letter] {
  display: grid;
  place-items: center;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: var(--line, var(--line-gray));
  color: var(--line-fg, var(--line-icon));
  font-size: 14.5px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-button'][data-active] {
  background: var(--line, var(--line-gray)) !important;
  color: var(--line-fg, var(--line-icon)) !important;
  font-weight: 700;
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-button'][data-active] [data-bullet-letter] {
  background: var(--line-icon-dark);
  color: var(--line-icon);
}
.theme-subway [data-collapsible='icon'] [data-sidebar='content'] [data-sidebar='menu-button'] {
  padding: 3px !important;
  justify-content: center;
}
.theme-subway [data-slot='sidebar-menu-item'] [data-sidebar='menu-sub'] {
  border-left: 4px solid var(--line, var(--line-gray));
  margin: 0 0 4px 19px;
  padding: 6px 0 6px 12px;
  transform: none;
}
.theme-subway [data-sidebar='menu-sub'] > [data-slot='sidebar-menu-sub-item']::before {
  content: '';
  position: absolute;
  top: 50%;
  left: -19px;
  width: 10px;
  height: 10px;
  margin-top: -5px;
  border-radius: 999px;
  border: 2px solid oklch(1 0 0);
  background: var(--sign);
}
.theme-subway [data-sidebar='menu-sub'] > [data-slot='sidebar-menu-sub-item']:has(> [data-active])::before {
  left: -22px;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border: 4px solid var(--sign);
  background: oklch(1 0 0);
  box-shadow: 0 0 0 2px oklch(1 0 0);
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-sub-button'] {
  font-size: 14px;
  color: oklch(1 0 0 / 82%);
}
.theme-subway [data-sidebar='content']:not([data-long]) [data-sidebar='group-label'] {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  border: 0;
}
.theme-subway [data-sidebar='content']:not([data-long]) [data-sidebar='group'] + [data-sidebar='group'] {
  margin-top: 6px;
  padding-top: 10px;
  border-top: 1px solid oklch(1 0 0 / 16%);
}
.theme-subway [data-sidebar='content'][data-long] [data-sidebar='group-label'] {
  gap: 10px;
  height: auto;
  min-height: 28px;
  margin: 0 8px 2px;
  padding: 4px 2px;
  color: oklch(1 0 0 / 58%);
  letter-spacing: -0.01em;
  font-size: 12.5px;
  font-weight: 400;
  white-space: nowrap;
}
.theme-subway [data-sidebar='content'][data-long] [data-sidebar='group-label']::after {
  content: '';
  flex: 1 1 12px;
  min-width: 12px;
  height: 1px;
  background: oklch(1 0 0 / 18%);
}
.theme-subway [data-sidebar='content'] a:hover,
.theme-subway [data-sidebar='content'] a:focus-visible {
  color: var(--sidebar-accent-foreground);
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-button']:not([data-active]):hover,
.theme-subway [data-sidebar='content'] [data-sidebar='menu-sub-button']:hover {
  background: oklch(1 0 0 / 14%) !important;
  color: var(--sidebar-accent-foreground) !important;
}
.theme-subway [data-sidebar='content'] [data-sidebar='menu-sub-button'][data-active] {
  background: transparent;
  color: oklch(1 0 0);
  font-weight: 700;
}
.theme-subway [data-slot='sidebar-inset'] {
  background: var(--surface-page);
}
.theme-subway [data-slot='sidebar-inset'] > header {
  height: 72px;
  
  padding-top: 7px;
  gap: 10px;
  background: var(--sign-rule), var(--sign) !important;
  backdrop-filter: none;
  border-bottom: 8px solid var(--line, var(--line-gray)) !important;
  color: oklch(0.985 0 0);
  --background: var(--sign);
  --foreground: oklch(0.985 0 0);
  
  --card: oklch(1 0 0 / 8%);
  --card-foreground: oklch(0.985 0 0);
  --accent: oklch(1 0 0 / 14%);
  --accent-foreground: oklch(0.985 0 0);
  --muted: oklch(1 0 0 / 12%);
  --muted-foreground: oklch(1 0 0 / 70%);
  --border: oklch(1 0 0 / 22%);
  --input: oklch(1 0 0 / 26%);
  --ring: oklch(1 0 0 / 70%);
}
.theme-subway [data-slot='sidebar-inset'] > header [data-slot='select-trigger'] {
  font-size: 16px;
  font-weight: 700;
}
.theme-subway [data-slot='bar-title'] {
  font-size: 20px;
  letter-spacing: -0.02em;
}
.theme-subway [data-slot='bar-title'] > a {
  color: oklch(1 0 0);
  font-weight: 600;
}
.theme-subway [data-slot='bar-title']:has([data-slot='bar-record']) > a {
  color: oklch(1 0 0 / 75%);
}
.theme-subway [data-slot='bar-title'] > a:hover {
  color: oklch(1 0 0);
}
.theme-subway [data-slot='bar-title'] > [data-slot='bar-separator'] {
  color: oklch(1 0 0 / 50%);
}
.theme-subway [data-slot='bar-record'] {
  font-weight: 700;
}
@media (max-width: 767px) {
  .theme-subway [data-slot='bar-title'] {
    font-size: 17px;
  }
}
.theme-subway [data-slot='sidebar-inset'] > header [data-slot='avatar-fallback'] {
  background: oklch(1 0 0) !important;
  color: var(--sign) !important;
  font-weight: 800;
}
.theme-subway [data-slot='detail-header'].sticky {
  top: 72px;
}
[data-clock] {
  display: none;
}
.theme-subway [data-clock] {
  display: block;
  margin-left: 8px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 640px) {
  .theme-subway [data-clock] {
    display: none;
  }
}
.theme-subway :is([data-slot='sidebar-inset'] > header, [data-sidebar='header']) [data-circle] {
  width: 34px;
  height: 34px;
  min-width: 0;
  margin: 0 2px;
  padding: 0;
  gap: 0;
  border-radius: 999px;
  border: 1.5px solid oklch(1 0 0 / 55%);
  background: transparent;
}
@media (width < 768px) {
  .theme-subway :is([data-slot='sidebar-inset'] > header, [data-sidebar='header']) [data-circle] {
    width: 40px;
    height: 40px;
  }
}
@media (min-width: 768px) {
  .theme-subway [data-slot='sidebar-inset'] > header [data-circle='search'] {
    width: auto;
    padding: 0 6px 0 12px;
    gap: 8px;
    font-size: 14px;
  }
}
.theme-subway :is([data-slot='sidebar-inset'] > header, [data-sidebar='header']) [data-circle]:hover {
  background: oklch(1 0 0 / 14%);
  border-color: oklch(1 0 0);
}
.theme-subway :is([data-slot='sidebar-inset'] > header, [data-sidebar='header']) [data-circle] svg {
  width: 16px;
  height: 16px;
}
.theme-subway [data-slot='sidebar-inset'] > header [data-circle='code'] {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0;
}
.theme-subway [data-slot='sidebar-inset'] > header [data-circle='code'] svg {
  display: none;
}
.theme-subway [data-slot='notification-count'] {
  top: -3px;
  right: -4px;
}
.theme-subway [data-scope-notice] {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: -4px 0 16px;
  padding: 0;
  background: transparent;
  border: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  text-wrap: pretty;
}
.theme-subway [data-scope-notice]::before {
  content: 'i';
  flex: none;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 999px;
  background: var(--foreground);
  color: var(--background);
  font-size: 12px;
  font-weight: 700;
}
.theme-subway :is([data-slot='page-header'], [data-slot='detail-header']) h1 {
  font-weight: 800;
  letter-spacing: -0.03em;
  display: flex;
  
  align-items: flex-start;
  gap: 0.45em;
}
.theme-subway [data-slot='page-header'] h1 {
  font-size: var(--type-title);
  line-height: 1.05;
}
.theme-subway [data-slot='detail-header'] h1 {
  font-size: var(--type-record);
  line-height: 1.1;
}
.theme-subway main[data-line] :is([data-slot='page-header'], [data-slot='detail-header']) h1::before {
  content: '';
  flex: none;
  width: 0.78em;
  height: 0.78em;
  margin-top: calc((1lh - 0.78em) / 2);
  border-radius: 999px;
  background: var(--line);
}
.theme-subway main :is([data-slot='page-header'], [data-slot='detail-header']) h1:has(> [data-title-bullet])::before {
  display: none;
}
.theme-subway [data-slot='page-header'] h1 > [data-title-bullet] {
  display: grid;
  flex: none;
  place-items: center;
  width: 1.054em;
  height: 1.054em;
  border-radius: 999px;
  background: var(--line);
  color: var(--line-fg, var(--line-icon));
}
.theme-subway [data-slot='page-header'] h1 > [data-title-bullet] > svg {
  width: 0.55em;
  height: 0.55em;
}
.theme-subway main[data-module] :is([data-slot='page-header'], [data-slot='detail-header']) h1::before {
  content: var(--letter, '');
  display: grid;
  place-items: center;
  font-size: 0.62em;
  
  width: 1.7em;
  height: 1.7em;
  margin-top: 0;
  color: var(--line-fg, var(--line-icon));
  letter-spacing: 0;
  line-height: 1;
}
.theme-subway main [data-slot='detail-header']:has([data-slot='avatar']) h1::before {
  display: none;
}
.theme-subway [data-slot='page-header'] h1 + p {
  margin-top: 8px;
  font-size: var(--type-lead);
  line-height: 1.4;
  font-weight: 500;
  color: var(--foreground);
  max-width: 62ch;
  text-wrap: pretty;
}
.theme-subway .group\/card {
  border: 0;
  box-shadow: none;
}
.theme-subway main .border.bg-card {
  border-color: transparent;
}
.theme-subway [data-slot='card-title'] {
  font-weight: 700;
  letter-spacing: -0.01em;
}
.theme-subway main [data-slot='card-title'] {
  font-size: var(--type-lead);
}
.theme-subway [data-slot='card-header'] > .bg-primary {
  border-radius: 999px;
}
.theme-subway
  :is(
    [data-card='stat-widget'],
    [data-card='table-widget'],
    [data-card='chart-widget'],
    [data-card='schedule-widget'],
    [data-card='status-widget'],
    [data-card='favourites-widget']
  )::before {
  height: 8px;
}
.theme-subway
  :is(
    [data-card='stat-widget'],
    [data-card='table-widget'],
    [data-card='chart-widget'],
    [data-card='schedule-widget'],
    [data-card='status-widget'],
    [data-card='favourites-widget']
  ) {
  padding-top: calc(var(--card-spacing) + 8px);
}
.theme-subway [data-slot='stat-value'] {
  font-size: var(--type-stat);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.05;
}
.theme-subway main [data-slot='table-container'],
.theme-subway main [data-slot='empty'].border,
.theme-subway main [data-slot='input'],
.theme-subway main [data-slot='combobox-input'],
.theme-subway main [data-slot='select-trigger'],
.theme-subway main [data-slot='textarea'] {
  background-color: var(--card);
}
@media (prefers-color-scheme: dark) {
:root.theme-subway main .ui-button.border-border:not(:hover),
:root .theme-subway main .ui-button.border-border:not(:hover) {
  background-color: transparent;
}
}
.theme-subway main [data-slot='empty'].border {
  border: 0;
}
.theme-subway [data-slot='table-head'] {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--muted-foreground);
}
.theme-subway [data-slot='table-head'] button {
  font-size: inherit;
  font-weight: inherit;
}
.theme-subway [data-slot='table-header'] [data-slot='table-row'] {
  border-bottom: 2px solid var(--foreground);
}
.theme-subway [data-slot='card'] [data-slot='table-body'] [data-slot='table-row'] {
  border-color: var(--rule-strong);
}
.theme-subway main [data-slot='table-container'][data-variant='board'] {
  background: transparent;
}
.theme-subway [data-variant='board'] > [data-slot='table'] {
  border-collapse: separate;
  border-spacing: 0 3px;
  margin-top: -3px;
}
.theme-subway [data-variant='board'] [data-slot='table-head'] {
  border-bottom: 2px solid var(--foreground);
}
.theme-subway [data-variant='board'] [data-slot='table-body'] [data-slot='table-cell'] {
  background: var(--card);
  padding-top: 13px;
  padding-bottom: 13px;
  font-size: 14px;
  transition: background-color 0.12s;
}
.theme-subway [data-variant='board'] [data-slot='table-body'] [data-slot='table-row']:hover [data-slot='table-cell'] {
  background: color-mix(in oklab, var(--card) 88%, var(--foreground));
}
.theme-subway
  [data-variant='board']
  [data-slot='table-body']
  [data-slot='table-row'][data-state='selected']
  [data-slot='table-cell'] {
  background: color-mix(in oklab, var(--row-selected) 45%, var(--card));
}
.theme-subway [data-variant='board'] [data-slot='table-row'] > :first-child {
  padding-left: 16px;
}
.theme-subway [data-variant='board'] [data-slot='table-row'] > :last-child {
  padding-right: 12px;
}
.theme-subway[data-density='compact'] [data-variant='board'] [data-slot='table-body'] [data-slot='table-cell'] {
  padding-top: 8px;
  padding-bottom: 8px;
}
.theme-subway [data-variant='board'] [data-slot='table-cell'] :is(a, span).font-medium {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.theme-subway main ul[data-variant='board'] {
  gap: 3px;
}
.theme-subway main ul[data-variant='board'].border {
  display: flex;
  flex-direction: column;
  border: 0;
  background: transparent;
  overflow: visible;
}
.theme-subway main ul[data-variant='board'] > li {
  border: 0;
  background: var(--card);
}
.theme-subway [data-slot='record-card'] {
  border: 0;
  background: var(--card);
}
.theme-subway [data-slot='data-table-pagination'] {
  font-size: 14px;
}
.theme-subway :is(main, [data-slot='sheet-content']) .uppercase {
  text-transform: none;
  letter-spacing: 0;
  font-size: 13.5px;
  font-weight: 600;
}
.theme-subway
  :is(main, [data-slot='sheet-content'])
  :is([data-slot='tone-badge'], [data-slot='state-badge'], [data-slot='enum-badge']) {
  height: auto;
  padding: 0;
  gap: 6px;
  border: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: -0.005em;
}
.theme-subway
  :is(main, [data-slot='sheet-content'])
  :is([data-slot='tone-badge'], [data-slot='state-badge'], [data-slot='enum-badge'])
  > svg {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 2.4;
}
.theme-subway :is(main, [data-slot='sheet-content']) [data-slot='tone-badge'][data-tone='neutral']:not(:has(svg)),
.theme-subway
  :is(main, [data-slot='sheet-content'])
  [data-slot='badge']:is([data-variant='outline'], [data-variant='secondary']):not(:has(svg)) {
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 14px;
  font-weight: 500;
  color: var(--muted-foreground);
}
.theme-subway .ui-button {
  font-weight: 700;
}
.theme-subway :is(main, [data-slot='sheet-content']) .ui-button.border-border {
  border-color: var(--input);
}
.theme-subway
  .ui-button:not([data-variant='ghost'], [data-variant='link']):is(:disabled, [data-disabled], [aria-disabled='true']) {
  opacity: 1;
  background: transparent;
  border: 1px dashed var(--input);
  color: var(--muted-foreground);
  box-shadow: none;
}
.theme-subway
  .ui-button:is([data-variant='ghost'], [data-variant='link']):is(:disabled, [data-disabled], [aria-disabled='true']) {
  opacity: 1;
  color: color-mix(in oklab, var(--muted-foreground) 55%, transparent);
}
.theme-subway main [data-slot='page-header'] :is(button, .ui-button),
.theme-subway main [data-slot='detail-header-actions'] :is(a, button) {
  height: 36px;
  padding: 0 14px;
  font-size: 15px;
}
.theme-subway
  main
  .group\/card
  .ui-button:is(
    [data-variant='default'],
    [data-variant='outline'],
    [data-variant='secondary'],
    [data-variant='destructive']
  ):not([data-size^='icon'], [data-slot='field'] *) {
  height: 36px;
  padding: 0 14px;
}
@media (width < 40rem) {
  .theme-subway
    main
    .group\/card
    .ui-button:is(
      [data-variant='default'],
      [data-variant='outline'],
      [data-variant='secondary'],
      [data-variant='destructive']
    ):not([data-size^='icon'], [data-slot='field'] *) {
    height: 40px;
  }
}
.theme-subway main [data-slot='field'] [data-slot='select-trigger'] {
  width: 100%;
}
@media (width < 40rem) {
  .theme-subway main [data-slot='page-header'] :is(button, .ui-button),
  .theme-subway main [data-slot='detail-header-actions'] :is(a, button) {
    height: 40px;
  }
}
.theme-subway [role='tablist'] > [role='tab'] {
  border-radius: 999px;
}
.theme-subway [role='tab'][aria-selected='true'] {
  font-weight: 700;
}
.theme-subway [role='tablist'] > [role='tab'][aria-selected='true'] {
  background: var(--primary) !important;
  color: var(--primary-foreground) !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  border-bottom-color: var(--primary) !important;
}
.theme-subway [role='tablist'] > [role='tab'][aria-selected='true'] > [data-slot='tab-count'] {
  
  background: color-mix(in oklab, currentColor 22%, transparent) !important;
  color: inherit !important;
}
.theme-subway main [data-variant='pill'] {
  padding: 3px;
  gap: 2px;
  border-radius: 999px;
}
.theme-subway main [data-variant='pill'] > [role='tab'] {
  
  height: 40px;
  padding: 0 12px;
  font-size: 15px;
  gap: 8px;
}
@media (min-width: 768px) {
  .theme-subway main [data-variant='pill'] > [role='tab'] {
    height: 30px;
  }
}
.theme-subway main [data-variant='pill'] > [role='tab'] > [data-slot='tab-count'] {
  font-size: 13px;
}
.theme-subway main [data-variant='pill'] > [role='tab'][aria-selected='true'] > [data-slot='tab-count'] {
  background: transparent !important;
  font-weight: 700;
}
.theme-subway main [data-slot='group-band'] {
  margin: 0;
  padding: 15px 16px 9px;
  background: var(--sign-rule), var(--sign);
  color: oklch(0.985 0 0);
  font-size: var(--type-body);
  font-weight: 700;
  letter-spacing: -0.01em;
  text-transform: none;
}
@media (prefers-color-scheme: dark) {
:root.theme-subway main [data-slot='group-band'],
:root .theme-subway main [data-slot='group-band'] {
  box-shadow: inset 0 0 0 1px var(--sidebar-border);
}
}
.theme-subway main [data-slot='empty-title'] {
  font-size: var(--type-lead);
  font-weight: 700;
  letter-spacing: -0.01em;
}
.theme-subway main [data-slot='empty-icon'][data-variant='icon'] {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: var(--line, var(--foreground));
  color: var(--line-fg, var(--line-icon));
}
.theme-subway main [data-slot='empty-icon'][data-variant='icon'] svg {
  width: 26px !important;
  height: 26px !important;
}
[data-auth-split] {
  display: flex;
  flex-direction: column;
  min-height: 100svh;
}
@media (min-width: 768px) {
  .theme-subway [data-auth-split] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  }
}
.theme-subway [data-auth] {
  background: var(--surface-page);
}
.theme-subway [data-slot='access-mosaic'] {
  --wall: color-mix(in oklab, var(--line-yellow) 14%, var(--surface-page));
  --grout: color-mix(in oklab, var(--line-yellow) 30%, var(--surface-page));
  display: grid;
  place-items: center;
  padding: 36px 16px;
  background-color: var(--wall);
  background-image:
    linear-gradient(var(--grout) 1.5px, transparent 1.5px),
    linear-gradient(90deg, var(--grout) 1.5px, transparent 1.5px),
    linear-gradient(90deg, var(--grout) 1.5px, transparent 1.5px);
  background-size:
    96px 48px,
    96px 96px,
    96px 96px;
  background-position:
    0 0,
    0 0,
    48px 48px;
}
@media (min-width: 768px) {
  .theme-subway [data-slot='access-mosaic'] {
    padding: 48px 24px;
  }
}
.theme-subway [data-slot='access-mosaic-tiles'] {
  max-width: 100%;
  padding: 16px;
  background: repeating-conic-gradient(var(--line-red) 0 25%, var(--line-yellow) 0 50%) 0 0 / 16px 16px;
}
.theme-subway [data-slot='access-mosaic-plate'] {
  display: flex;
  justify-content: center;
  padding: 16px 22px;
  border: 6px solid var(--line-blue);
  background: color-mix(in oklab, var(--line-yellow) 22%, white);
}
.theme-subway [data-slot='access-mosaic-name'] {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: center;
  color: var(--line-blue);
  font-size: clamp(36px, 6vw, 76px);
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}
@media (prefers-color-scheme: dark) {
:root.theme-subway [data-slot='access-mosaic'],
:root .theme-subway [data-slot='access-mosaic'] {
  --wall: color-mix(in oklab, var(--line-yellow) 8%, var(--surface-page));
  --grout: color-mix(in oklab, var(--line-yellow) 16%, var(--surface-page));
}
}
@media (prefers-color-scheme: dark) {
:root.theme-subway [data-slot='access-mosaic-tiles'],
:root .theme-subway [data-slot='access-mosaic-tiles'] {
  filter: brightness(0.88);
}
}
.theme-subway [data-auth] [data-auth-bullet] {
  border-radius: 999px;
}
.theme-subway [data-auth] main [data-slot='card'] {
  max-width: 28rem;
}
.theme-subway [data-auth] [data-slot='card-title'] {
  font-size: clamp(30px, 4vw, 40px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.theme-subway [data-auth] [data-slot='card-description'] {
  font-size: 17px;
  line-height: 1.35;
  font-weight: 500;
  color: var(--foreground);
  margin-top: 8px;
  text-wrap: pretty;
}
.theme-subway [data-auth] [data-slot='field-label'] {
  font-weight: 700;
  font-size: 15px;
}
.theme-subway [data-auth] main [data-slot='input'] {
  height: 48px;
  font-size: 16px;
}
.theme-subway [data-auth] main .ui-button {
  height: 48px;
  font-size: 16px;
}
.theme-subway [data-auth] main .ui-button.h-auto {
  height: auto;
  font-size: 14px;
}
.theme-subway [data-auth] [data-slot='field-separator'] {
  font-size: 13.5px;
  font-weight: 600;
}
.theme-subway :is([data-slot='save-bar'], [data-slot='next-step']) {
  background: var(--sign-rule), var(--sign) !important;
  color: oklch(0.985 0 0);
  border-top: 0;
  backdrop-filter: none;
  --background: var(--sign);
  --foreground: oklch(0.985 0 0);
  --card: var(--sign);
  --primary: oklch(0.985 0 0);
  --primary-foreground: var(--sign);
  --muted: oklch(1 0 0 / 14%);
  --muted-foreground: oklch(1 0 0 / 72%);
  --border: oklch(1 0 0 / 30%);
  --input: oklch(1 0 0 / 45%);
  --ring: oklch(1 0 0 / 70%);
}
.theme-subway [data-slot='next-step'] {
  padding: 18px 16px 12px;
}
.theme-subway [data-slot='save-bar'] p {
  font-size: var(--type-body);
  font-weight: 700;
}
.theme-subway [data-slot='save-bar-to-fix'] {
  color: oklch(0.8 0.12 28);
}
.theme-subway [data-slot='bulk-action-bar'] {
  background: var(--sign-rule), var(--sign);
  color: oklch(0.985 0 0);
  border: 0;
  box-shadow: none;
  padding: 18px 16px 12px;
  gap: 10px 12px;
  --background: var(--sign);
  --foreground: oklch(0.985 0 0);
  --card: var(--sign);
  --popover-foreground: oklch(0.985 0 0);
  --primary: oklch(0.985 0 0);
  --primary-foreground: var(--sign);
  --accent: oklch(1 0 0 / 14%);
  --accent-foreground: oklch(0.985 0 0);
  --muted: oklch(1 0 0 / 14%);
  --muted-foreground: oklch(1 0 0 / 72%);
  --border: oklch(1 0 0 / 55%);
  --input: oklch(1 0 0 / 55%);
  --ring: oklch(1 0 0 / 70%);
}
.theme-subway [data-slot='bulk-action-bar'] > div:first-child {
  font-size: 16px;
  font-weight: 700;
}
.theme-subway [data-slot='bulk-count'] {
  height: 30px;
  min-width: 30px;
  font-size: 15px;
  font-weight: 800;
}
.theme-subway [data-slot='bulk-action-bar'] .ui-button {
  height: 40px;
}
.theme-subway [data-slot='bulk-action-bar'] [data-slot='bulk-clear'] {
  width: 40px;
  border-radius: 999px;
}
.theme-subway [data-slot='bulk-action-bar'] .ui-button[data-variant='destructive'] {
  background: transparent;
  color: oklch(0.985 0 0);
  border: 1px solid oklch(1 0 0 / 55%);
}
.theme-subway [data-slot='record-card'][data-selected] {
  background: color-mix(in oklab, var(--row-selected) 45%, var(--card));
}
.theme-subway [data-slot='toast'] {
  background: var(--sign-rule), var(--sign);
  color: oklch(0.985 0 0);
  border-color: oklch(1 0 0 / 14%);
  padding-top: 16px;
  align-items: center;
}
.theme-subway [data-slot='toast'][data-kind='success'] {
  --line: var(--line-green);
}
.theme-subway [data-slot='toast'][data-kind='error'] {
  --line: var(--line-red);
}
.theme-subway [data-slot='toast'][data-kind='info'] {
  --line: var(--line-blue);
}
.theme-subway [data-slot='toast-icon'] {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--line);
  color: var(--line-icon);
}
.theme-subway [data-slot='toast-icon'] svg {
  width: 16px;
  height: 16px;
  margin: 0;
  color: inherit;
}
.theme-subway [data-slot='toast-title'] {
  font-weight: 700;
  font-size: 15px;
}
.theme-subway [data-slot='toast-description'] {
  color: oklch(1 0 0 / 72%);
}
.theme-subway [data-slot='toast-close'] {
  color: oklch(1 0 0 / 70%);
}
.theme-subway [data-slot='toast-close']:hover {
  background: oklch(1 0 0 / 14%);
  color: oklch(1 0 0);
}
.theme-subway [data-slot='toast-action'] {
  border-color: oklch(1 0 0 / 30%);
  font-weight: 700;
}
.theme-subway [data-slot='toast-action']:hover {
  background: oklch(1 0 0 / 14%);
}

/* Generated from packages/ui/src/styles (theme-base.css) by src/pages/access-theme.test.ts: do not edit. */
.theme-base {
  --brand-font:
    'Geist Variable', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
@media (min-width: 768px) {
  .theme-base [data-auth-split] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  }
}
.theme-base [data-slot='access-mosaic'] {
  display: flex;
  align-items: flex-end;
  padding: 20px 16px;
  background: var(--muted);
  border-bottom: 1px solid var(--border);
}
@media (min-width: 768px) {
  .theme-base [data-slot='access-mosaic'] {
    padding: 40px;
    border-bottom: 0;
    border-right: 1px solid var(--border);
  }
}
.theme-base [data-slot='access-mosaic-name'] {
  overflow-wrap: anywhere;
  font-size: clamp(20px, 3vw, 32px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.theme-base [data-slot='route-map'] {
  --line-icon: var(--card);
  --line-icon-dark: var(--primary);
}
.theme-base [data-slot='route-map'] > [aria-hidden] {
  top: 7px;
  height: 2px;
  margin-inline: var(--card-spacing, 1.5rem);
  background: var(--border);
}
.theme-base [data-slot='danger-zone'] {
  overflow: hidden;
  border: 1px solid color-mix(in oklab, var(--destructive) 40%, transparent);
  border-radius: var(--radius-xl);
}
.theme-base [data-slot='danger-edge'] {
  display: none;
}
.theme-base [data-slot='danger-zone'] h2 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--destructive-text);
}
.theme-base [data-slot='lifecycle-line'] {
  --line: var(--input);
}
.theme-base [data-slot='lifecycle-track'] {
  width: 2px;
}
@media (min-width: 768px) {
  .theme-base [data-slot='lifecycle-track'] {
    width: 100%;
    height: 2px;
  }
}
.theme-base [data-slot='lifecycle-line'] [data-stop] > span > span[aria-hidden] {
  width: 1rem;
  height: 1rem;
  border-width: 2px;
}
.theme-base [data-slot='lifecycle-line'] [data-stop='current'] > span > span[aria-hidden] {
  width: 1.5rem;
  height: 1.5rem;
  border-width: 6px;
  border-color: var(--primary);
  box-shadow: none;
}
.theme-base [data-slot='next-step'] {
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--muted);
  color: var(--foreground);
}
.theme-base [data-scope-notice] {
  margin-bottom: 16px;
  font-size: 14px;
  line-height: 1.35;
  color: var(--muted-foreground);
}

/*
 * The API's access pages (decisions 0039, 0155) in the admin's look: the kit's tokens and Subway theme
 * come first (subway.css, generated, served together with this file), then the elements of these pages
 * drawn as the kit's parts draw them (card, field, button, notice), with the theme's variables only.
 */
:root {
  color-scheme: light dark;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--surface-page);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}
/* Elements with their own display (label.check) would otherwise ignore the hidden attribute. */
[hidden] {
  display: none !important;
}

/* ---------- The frame: grey plane, one card ---------- */
[data-auth] {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}

/*
 * The mosaic (decision 0181): the instance's name on a tiled wall, framed by a checkered border, as
 * the names of the stations; only on these pages. Colours from the theme's lines.
 */
.mosaic {
  --wall: color-mix(in oklab, var(--line-yellow) 14%, var(--surface-page));
  --grout: color-mix(in oklab, var(--line-yellow) 30%, var(--surface-page));
  display: grid;
  place-items: center;
  padding: 36px 16px;
  background-color: var(--wall);
  background-image:
    linear-gradient(var(--grout) 1.5px, transparent 1.5px),
    linear-gradient(90deg, var(--grout) 1.5px, transparent 1.5px),
    linear-gradient(90deg, var(--grout) 1.5px, transparent 1.5px);
  background-size:
    96px 48px,
    96px 96px,
    96px 96px;
  background-position:
    0 0,
    0 0,
    48px 48px;
}
@media (min-width: 768px) {
  .mosaic {
    padding: 48px 24px;
  }
}
.mosaic .tiles {
  max-width: 100%;
  padding: 16px;
  background: repeating-conic-gradient(var(--line-red) 0 25%, var(--line-yellow) 0 50%) 0 0 / 16px 16px;
}
.mosaic .plate {
  display: flex;
  justify-content: center;
  padding: 16px 22px;
  border: 6px solid var(--line-blue);
  background: color-mix(in oklab, var(--line-yellow) 22%, white);
}
.mosaic .name {
  max-width: 100%;
  overflow-wrap: anywhere;
  text-align: center;
  color: var(--line-blue);
  font-size: clamp(36px, 6vw, 76px);
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
}
@media (prefers-color-scheme: dark) {
  .mosaic {
    --wall: color-mix(in oklab, var(--line-yellow) 8%, var(--surface-page));
    --grout: color-mix(in oklab, var(--line-yellow) 16%, var(--surface-page));
  }
  .mosaic .tiles {
    filter: brightness(0.88);
  }
}
[data-auth] > main {
  flex: 1;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 1.5rem 1rem 3rem;
}
@media (min-width: 640px) {
  [data-auth] > main {
    align-items: center;
    padding-top: 3rem;
  }
}
/* From md the wall and the card side by side, 5 to 6. */
@media (min-width: 768px) {
  [data-auth] {
    flex-direction: row;
  }
  [data-auth] > .mosaic {
    flex: 5 1 0;
  }
  [data-auth] > main {
    flex: 6 1 0;
  }
}
[data-slot='card'] {
  width: 100%;
  max-width: 28rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem 1rem;
  background: var(--card);
  color: var(--card-foreground);
  /* Square in Subway (decision 0181), as the kit's cards. */
  border-radius: var(--radius);
}
[data-slot='card-header'] {
  display: grid;
  gap: 0.25rem;
}
.instance {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  color: var(--muted-foreground);
}
.heading {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
[data-auth-bullet] {
  flex: none;
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: var(--line, var(--primary));
  color: var(--line-fg, var(--line-icon));
}
[data-auth-bullet] svg {
  width: 1.375rem;
  height: 1.375rem;
}
h1 {
  margin: 0;
}
[data-slot='card-content'] {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
[data-slot='card-content'] > *,
form,
section,
fieldset > * {
  margin-top: 0;
  margin-bottom: 0;
}
form,
section,
#enrol-key,
#backup-codes {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
p {
  margin: 0;
  text-wrap: pretty;
}
/* The intros the script fills in: no gap while they are empty. */
p:empty {
  display: none;
}
h2 {
  margin: 0.75rem 0 0;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}
h3 {
  margin: 0.5rem 0 0;
  font-size: 1rem;
  font-weight: 700;
}
a {
  color: var(--foreground);
  font-weight: 600;
  text-underline-offset: 4px;
}

/* ---------- Fields ---------- */
label {
  display: block;
  margin-top: 0.5rem;
  font-weight: 700;
  font-size: 15px;
}
form > label:first-child {
  margin-top: 0;
}
input,
select {
  width: 100%;
  height: 48px;
  padding: 0 0.75rem;
  font: inherit;
  font-size: 16px;
  color: inherit;
  background: transparent;
  border: 1px solid var(--input);
  border-radius: var(--radius);
  outline: none;
  transition: border-color 150ms;
}
input:focus-visible,
select:focus-visible {
  border-color: var(--ring);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--ring) 50%, transparent);
}
input:disabled {
  opacity: 0.5;
}
small {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: var(--muted-foreground);
}
label.check {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  margin-top: 0.25rem;
  font-weight: 400;
}
label.check input {
  width: 1rem;
  height: 1rem;
  margin: 0.2rem 0 0;
  accent-color: var(--primary);
}
fieldset {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0.75rem 1rem 1rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
legend {
  padding: 0 0.25rem;
  font-weight: 700;
}

/* ---------- Buttons: the kit's default (black) and outline ---------- */
button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  min-height: 48px;
  padding: 0 1rem;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  color: var(--primary-foreground);
  background: var(--primary);
  border: 1px solid transparent;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background 150ms;
}
button:hover {
  background: color-mix(in oklab, var(--primary) 80%, transparent);
}
form > button,
#passkey > button,
details > button {
  width: 100%;
  margin-top: 0.5rem;
}
button.secondary {
  color: var(--foreground);
  background: var(--card);
  border-color: var(--border);
}
button.secondary:hover {
  background: var(--muted);
}
button[disabled] {
  opacity: 0.5;
  cursor: wait;
}
button:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 3px solid color-mix(in oklab, var(--ring) 50%, transparent);
  outline-offset: 2px;
}

/*
 * ---------- The other ways in: rows under the form, opened in place ----------
 * A toggle drawn as the kit's disclosures (decision 0173 point 10): the text after a chevron that
 * turns when the row opens; the browser's triangle is hidden (list-style for most, the marker for Safari).
 */
details {
  border-top: 1px solid var(--border);
  padding-top: 0.75rem;
}
details + details {
  margin-top: -0.25rem;
}
summary {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  width: fit-content;
  cursor: pointer;
  font-weight: 600;
  list-style: none;
  text-underline-offset: 4px;
}
summary::-webkit-details-marker {
  display: none;
}
summary:hover {
  text-decoration: underline;
}
summary svg {
  flex: none;
  width: 1rem;
  height: 1rem;
  color: var(--muted-foreground);
  transition: transform 150ms;
}
details[open] > summary svg {
  transform: rotate(90deg);
}
details[open] > summary {
  margin-bottom: 0.75rem;
}
details > form + form,
details > button + form {
  margin-top: 0.75rem;
}

/* ---------- Notices: the API's explanation, a warning ---------- */
.status,
.warning {
  padding: 0.75rem;
  border: 1px solid;
  border-radius: var(--radius);
  font-size: 0.875rem;
  color: var(--notice-text);
  border-color: color-mix(in oklab, var(--notice) 40%, var(--border));
  background: color-mix(in oklab, var(--notice) 6%, var(--card));
}
.status {
  --notice: var(--destructive);
  --notice-text: var(--destructive-text);
}
.status.ok {
  --notice: var(--success);
  --notice-text: var(--success-text);
}
.warning {
  --notice: var(--warning);
  --notice-text: var(--warning-text);
}

/* ---------- Lists of the account and of the OAuth choice ---------- */
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--border);
}
li:last-child {
  border-bottom: 0;
}
li button {
  min-height: 36px;
  padding: 0 0.75rem;
  font-size: 14px;
}
.choices li {
  column-gap: 0.75rem;
  row-gap: 0.125rem;
  font-weight: 700;
}
.choices li button {
  min-height: 40px;
}
/* What a choice means, on its own line under the name and the button. */
.choices li small {
  flex-basis: 100%;
  margin-top: 0;
  font-weight: 400;
}
code {
  word-break: break-all;
  font-size: 1rem;
}

/*
 * ---------- The Base style (decision 0187) ----------
 * The admin's neutral style, as its own access pages draw it: the instance's name on a plain panel
 * instead of the tiled wall, outlined cards, the bullet with the theme's corners. The font falls back
 * on the system's: these pages serve none (decision 0181).
 */
.theme-base .mosaic {
  display: flex;
  align-items: flex-end;
  padding: 20px 16px;
  background: var(--muted);
  border-bottom: 1px solid var(--border);
}
@media (min-width: 768px) {
  .theme-base .mosaic {
    padding: 40px;
    border-bottom: 0;
    border-right: 1px solid var(--border);
  }
}
.theme-base .mosaic .tiles,
.theme-base .mosaic .plate {
  padding: 0;
  border: 0;
  background: none;
  filter: none;
}
.theme-base .mosaic .name {
  text-align: left;
  color: var(--foreground);
  font-size: clamp(20px, 3vw, 32px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-transform: none;
}
.theme-base [data-slot='card'] {
  border: 1px solid var(--border);
  box-shadow: var(--shadow-xs);
}
.theme-base [data-auth-bullet] {
  border-radius: calc(var(--radius) * 0.8);
  background: var(--primary);
  color: var(--primary-foreground);
}