@layer components {
  .ssec-display-xl,
  .ssec-display,
  .ssec-h1,
  .ssec-h2 {
    font-family: var(--font-display);
    font-stretch: var(--font-display-stretch);
    font-weight: var(--weight-display);
    color: var(--text-primary);
    text-wrap: balance;
  }

  .ssec-display-xl {
    font-size: var(--text-display-xl);
    line-height: var(--lh-display-xl);
    letter-spacing: var(--ls-display-xl);
  }

  .ssec-display {
    font-size: var(--text-display);
    line-height: var(--lh-display);
    letter-spacing: var(--ls-display);
  }

  .ssec-display-xl,
  .ssec-display,
  .ssec-h1,
  .ssec-h2 {
    overflow-wrap: break-word;
  }

  .ssec-h1 {
    font-size: var(--text-h1);
    line-height: var(--lh-h1);
    letter-spacing: var(--ls-h1);
  }

  .ssec-h2 {
    font-size: var(--text-h2);
    line-height: var(--lh-h2);
    letter-spacing: var(--ls-h2);
  }

  .ssec-section-title {
    font-family: var(--font-display);
    font-size: 1.125rem;
    line-height: 1.3;
    font-weight: var(--weight-heading);
    color: var(--text-primary);
  }

  .ssec-h3 {
    font-family: var(--font-sans);
    font-weight: var(--weight-heading);
    font-size: var(--text-h3);
    line-height: var(--lh-h3);
    letter-spacing: var(--ls-h3);
    color: var(--text-primary);
  }

  .ssec-body-l {
    font-size: var(--text-body-l);
    line-height: var(--lh-body-l);
  }

  .ssec-body {
    font-size: var(--text-body);
    line-height: var(--lh-body);
  }

  .ssec-small {
    font-size: var(--text-small);
    line-height: var(--lh-small);
  }

  .ssec-label {
    font-family: var(--font-mono);
    font-size: var(--text-label);
    line-height: var(--lh-label);
    letter-spacing: var(--ls-label);
    text-transform: uppercase;
    font-weight: var(--weight-label);
  }

  .ssec-lede {
    color: var(--text-secondary);
    max-width: var(--measure);
    text-wrap: pretty;
  }

  .ssec-lede strong {
    color: var(--text-primary);
    font-weight: 500;
  }

  .ssec-link {
    position: relative;
    color: var(--accent);
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: var(--accent-line);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color var(--dur-fast), text-decoration-color var(--dur-fast);
  }

  .ssec-link:hover,
  .ssec-link:focus-visible {
    color: var(--accent-hover);
    text-decoration-color: currentColor;
  }

  .ssec-link[data-arrow]::after {
    content: " →";
  }

  .ssec-link:not(p *, li *, td *, .ssec-prose *)::before {
    content: "";
    position: absolute;
    inset: -0.75rem -0.25rem;
  }

  .ssec-band[data-surface="sunken"] .ssec-link {
    color: var(--accent-hover);
  }

  .ssec-link-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
  }

  .ssec-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
  }

  .ssec-actions[data-align="center"] {
    justify-content: center;
  }

  @media (max-width: 479px) {
    .ssec-actions:not([data-stack="narrow"]),
    .ssec-actions:not([data-stack="narrow"]) .ssec-btn {
      width: 100%;
    }
  }

  @media (max-width: 359px) {
    .ssec-actions,
    .ssec-actions .ssec-btn {
      width: 100%;
    }
  }

  .ssec-deflist dt {
    color: var(--text-tertiary);
  }

  .ssec-deflist dd {
    color: var(--text-secondary);
    font-size: var(--text-small);
    line-height: var(--lh-small);
  }

  .ssec-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 20px;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    font-weight: 600;
    font-size: var(--text-ui);
    line-height: 1.2;
    white-space: nowrap;
    text-align: center;
    transition:
      background var(--dur-fast),
      color var(--dur-fast),
      border-color var(--dur-fast),
      box-shadow var(--dur-base),
      transform var(--dur-base) var(--ease-out);
  }

  .ssec-btn[data-size="xs"] {
    min-height: 32px;
    padding: 0 12px;
    font-size: var(--text-xs);
  }

  .ssec-btn[data-size="sm"] {
    min-height: 36px;
    padding: 0 14px;
    font-size: var(--text-small);
  }

  .ssec-btn[data-size="sm"]::before {
    content: "";
    position: absolute;
    inset: -4px 0;
  }

  .ssec-btn[data-size="xs"]::before {
    content: "";
    position: absolute;
    inset: -6px 0;
  }

  .ssec-btn[data-size="lg"] {
    min-height: 52px;
    padding: 0 26px;
    font-size: 1rem;
  }

  .ssec-btn[data-variant="primary"] {
    background: var(--accent);
    color: var(--text-on-accent);
  }

  .ssec-btn[data-variant="primary"]::after {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: var(--brand-gradient);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity var(--dur-fast);
    pointer-events: none;
  }

  .ssec-btn[data-variant="primary"]:hover:not(:disabled),
  .ssec-btn[data-variant="primary"]:focus-visible:not(:disabled) {
    background: var(--accent-hover);
    box-shadow: var(--glow-ion);
  }

  .ssec-btn[data-variant="primary"]:hover:not(:disabled)::after,
  .ssec-btn[data-variant="primary"]:focus-visible:not(:disabled)::after {
    opacity: 1;
  }

  .ssec-btn[data-variant="secondary"] {
    border-color: var(--border-strong);
    color: var(--text-primary);
  }

  .ssec-btn[data-variant="secondary"]:hover:not(:disabled),
  .ssec-btn[data-variant="secondary"]:focus-visible:not(:disabled) {
    border-color: var(--accent);
    background: var(--accent-tint);
  }

  .ssec-btn[data-variant="ghost"] {
    color: var(--text-secondary);
  }

  .ssec-btn[data-variant="ghost"]:hover:not(:disabled),
  .ssec-btn[data-variant="ghost"]:focus-visible:not(:disabled) {
    background: color-mix(in srgb, currentColor 6%, transparent);
    color: var(--text-primary);
  }

  .ssec-btn[data-variant="danger"] {
    border-color: color-mix(in srgb, var(--danger) 40%, transparent);
    color: var(--danger);
  }

  .ssec-btn[data-variant="danger"]:hover:not(:disabled),
  .ssec-btn[data-variant="danger"]:focus-visible:not(:disabled) {
    border-color: var(--danger);
    background: var(--danger-surface);
  }

  .ssec-btn[data-variant="danger-solid"] {
    background: var(--danger);
    color: light-dark(#ffffff, #1a0405);
  }

  .ssec-btn[data-variant="danger-solid"]:hover:not(:disabled),
  .ssec-btn[data-variant="danger-solid"]:focus-visible:not(:disabled) {
    background: color-mix(in srgb, var(--danger) 88%, light-dark(black, white));
  }

  .ssec-btn[data-tone="success"] {
    border-color: color-mix(in srgb, var(--success) 40%, transparent);
    color: var(--success);
  }

  .ssec-btn[data-tone="warning"] {
    border-color: color-mix(in srgb, var(--warning) 40%, transparent);
    color: var(--warning);
  }

  .ssec-btn[data-icon] {
    width: 44px;
    padding: 0;
  }

  .ssec-btn:disabled {
    cursor: not-allowed;
    opacity: 0.55;
    box-shadow: none;
  }

  @media (hover: hover) {
    .ssec-btn[data-variant="primary"]:hover:not(:disabled),
    .ssec-btn[data-variant="secondary"]:hover:not(:disabled) {
      transform: translateY(-1px);
    }
  }

  .ssec-btn:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
  }

  .ssec-chrome-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding-inline: 12px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-subtle);
    font-size: var(--text-small);
    font-weight: 500;
    color: var(--text-secondary);
  }

  .ssec-chrome-btn:hover,
  .ssec-chrome-btn:focus-visible {
    border-color: var(--border-medium);
    color: var(--text-primary);
  }

  .ssec-chrome-btn[data-icon] {
    min-width: 44px;
    padding-inline: 8px;
  }

  .ssec-icon-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
  }

  .ssec-icon-btn::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    width: 44px;
    height: 44px;
  }

  .ssec-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 24px;
    padding: 0 9px;
    border-radius: var(--radius-pill);
    font-family: var(--font-mono);
    font-size: var(--text-label);
    line-height: 1;
    font-weight: var(--weight-label);
    white-space: nowrap;
    --ink: light-dark(var(--text-primary), var(--c, var(--text-secondary)));
    color: color-mix(in srgb, var(--c, var(--text-secondary)) 72%, var(--ink));
    background: color-mix(in srgb, var(--c, var(--text-tertiary)) var(--semantic-tint), transparent);
    border: 1px solid color-mix(in srgb, var(--c, var(--text-tertiary)) 28%, transparent);
  }

  .ssec-pill[data-size="md"] {
    min-height: 28px;
    padding: 0 11px;
    font-size: var(--text-xs);
  }

  .ssec-pill[data-kind="severity"] {
    border-radius: var(--radius-xs);
    padding-left: 0;
  }

  .ssec-pill[data-kind="severity"]::before {
    content: "";
    width: 3px;
    align-self: stretch;
    margin-right: 6px;
    background: var(--c);
    border-radius: 2px 0 0 2px;
  }

  .ssec-pill[data-kind="severity"][data-value="critical"] { --c: var(--sev-critical); }
  .ssec-pill[data-kind="severity"][data-value="high"] { --c: var(--sev-high); }
  .ssec-pill[data-kind="severity"][data-value="medium"] { --c: var(--sev-medium); }
  .ssec-pill[data-kind="severity"][data-value="low"] { --c: var(--sev-low); }
  .ssec-pill[data-kind="severity"][data-value="info"] { --c: var(--sev-info); }

  .ssec-pill[data-kind="stage"]::before {
    font-family: var(--font-sans);
    font-size: 0.8em;
    text-decoration: none;
    display: inline-block;
  }

  .ssec-pill[data-kind="stage"][data-value="possible"] {
    --c: var(--stage-possible);
    background: transparent;
    border-style: dashed;
    border-color: var(--c);
  }

  .ssec-pill[data-kind="stage"][data-value="possible"]::before { content: "○"; }
  .ssec-pill[data-kind="stage"][data-value="confirmed"] { --c: var(--stage-confirmed); }
  .ssec-pill[data-kind="stage"][data-value="confirmed"]::before { content: "●"; }
  .ssec-pill[data-kind="stage"][data-value="exploited"] { --c: var(--stage-exploited); }
  .ssec-pill[data-kind="stage"][data-value="exploited"]::before { content: "◆"; }

  .ssec-pill[data-kind="stage"][data-value="refuted"] {
    --c: var(--stage-refuted);
    text-decoration: line-through;
    text-decoration-thickness: 1px;
  }

  .ssec-pill[data-kind="stage"][data-value="refuted"]::before { content: "⊘"; }

  .ssec-pill[data-kind="status"]::before {
    font-family: var(--font-sans);
    font-size: 0.8em;
    display: inline-block;
  }

  .ssec-pill[data-kind="status"][data-value="live"] { --c: var(--success); }
  .ssec-pill[data-kind="status"][data-value="live"]::before { content: "●"; }
  .ssec-pill[data-kind="status"][data-value="validation"] { --c: var(--accent); }
  .ssec-pill[data-kind="status"][data-value="validation"]::before { content: "◐"; }
  .ssec-pill[data-kind="status"][data-value="closed"] { --c: var(--text-tertiary); }
  .ssec-pill[data-kind="status"][data-value="closed"]::before { content: "○"; }

  .ssec-pill[data-kind="agent"] { --c: var(--agent); }
  .ssec-pill[data-kind="engine"] { --c: var(--accent); }

  .ssec-pill[data-kind="tag"] {
    --c: var(--text-tertiary);
    background: var(--surface-sunken);
    border-color: var(--border-subtle);
    color: var(--text-secondary);
  }

  .ssec-pill[data-kind="tone"][data-value="neutral"] { --c: var(--text-tertiary); }
  .ssec-pill[data-kind="tone"][data-value="success"] { --c: var(--success); }
  .ssec-pill[data-kind="tone"][data-value="warning"] { --c: var(--warning); }
  .ssec-pill[data-kind="tone"][data-value="danger"] { --c: var(--danger); }
  .ssec-pill[data-kind="tone"][data-value="accent"] { --c: var(--accent); }
  .ssec-pill[data-kind="tone"][data-value="high"] { --c: var(--sev-high); }

  .ssec-pill[data-kind="tone"][data-value="subtle"] {
    --c: var(--text-tertiary);
    background: transparent;
    border-color: var(--border-subtle);
  }

  .ssec-card {
    background: var(--surface-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-lg);
    box-shadow: var(--elev-1);
    padding: var(--card-pad, 24px);
    --table-bleed: var(--card-pad, 24px);
  }

  .ssec-card[data-variant="edge"] {
    border-color: transparent;
    background: linear-gradient(var(--surface-card), var(--surface-card)) padding-box, var(--edge-light) border-box;
    box-shadow: var(--edge-inset), var(--elev-2);
  }

  .ssec-card[data-variant="raised"] {
    box-shadow: var(--elev-2);
  }

  .ssec-card[data-variant="flat"] {
    box-shadow: none;
  }

  @media (min-width: 1024px) {
    .ssec-card {
      padding: var(--card-pad, 32px);
    }

    .ssec-card[data-pad="tight"] {
      padding: 24px;
    }
  }

  .ssec-card-hover {
    transition: border-color var(--dur-fast), box-shadow var(--dur-base), transform var(--dur-base) var(--ease-out);
  }

  .ssec-card-hover:hover,
  .ssec-card-hover:focus-visible {
    border-color: var(--accent-line);
    box-shadow: var(--elev-3);
  }

  @media (hover: hover) {
    .ssec-card-hover:hover {
      transform: translateY(-2px);
    }
  }

  .ssec-container {
    width: 100%;
    max-width: calc(var(--container) + 2 * var(--gutter));
    margin-inline: auto;
    padding-inline: var(--gutter);
  }

  .ssec-container[data-width="wide"] {
    max-width: calc(var(--container-wide) + 2 * var(--gutter));
  }

  .ssec-container[data-width="text"] {
    max-width: calc(46rem + 2 * var(--gutter));
  }

  .ssec-band {
    position: relative;
    padding-block: var(--section-y);
  }

  .ssec-band[data-space="tight"] {
    padding-block: var(--space-8);
  }

  .ssec-band[data-space="flush"] {
    padding-top: 0;
  }

  .ssec-band[data-surface="sunken"] {
    background: var(--surface-sunken);
  }

  .ssec-band[data-surface="chamber"] {
    color-scheme: dark;
    print-color-adjust: exact;
    background-color: var(--surface-chamber);
    color: var(--text-primary);
    background-image:
      linear-gradient(var(--graticule-color) 1px, transparent 1px),
      linear-gradient(90deg, var(--graticule-color) 1px, transparent 1px);
    background-size: var(--graticule-size) var(--graticule-size);
  }

  .ssec-band[data-surface="chamber"] .ssec-lede,
  .ssec-band[data-surface="chamber"] .ssec-section-head p {
    color: var(--text-secondary);
  }

  .ssec-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-5);
  }

  .ssec-grid > * {
    grid-column: 1 / -1;
    min-width: 0;
  }

  @media (min-width: 1024px) {
    .ssec-grid {
      gap: var(--space-6);
    }

    .ssec-grid > [data-span="3"] { grid-column: span 3; }
    .ssec-grid > [data-span="4"] { grid-column: span 4; }
    .ssec-grid > [data-span="5"] { grid-column: span 5; }
    .ssec-grid > [data-span="6"] { grid-column: span 6; }
    .ssec-grid > [data-span="7"] { grid-column: span 7; }
    .ssec-grid > [data-span="8"] { grid-column: span 8; }
    .ssec-grid > [data-span="9"] { grid-column: span 9; }
    .ssec-grid > [data-start="9"] { grid-column: 9 / -1; }
    .ssec-grid[data-align="start"] { align-items: start; }
    .ssec-grid[data-align="center"] { align-items: center; }
  }

  .ssec-cards {
    display: grid;
    gap: var(--space-5);
  }

  @media (min-width: 640px) {
    .ssec-cards[data-cols="2"],
    .ssec-cards[data-cols="3"],
    .ssec-cards[data-cols="4"] {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (min-width: 1024px) {
    .ssec-cards[data-cols="3"] {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ssec-cards[data-cols="4"] {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }

  .ssec-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
    margin-bottom: var(--space-7);
  }

  .ssec-section-head[data-align="center"] {
    justify-items: center;
    text-align: center;
  }

  .ssec-section-head .ssec-kicker + .ssec-h2,
  .ssec-section-head .ssec-kicker + .ssec-display,
  .ssec-section-head .ssec-kicker + .ssec-h1 {
    margin-top: var(--space-3);
  }

  .ssec-section-head[data-split] {
    grid-template-columns: minmax(0, 1fr);
  }

  @media (min-width: 1024px) {
    .ssec-section-head[data-split] {
      grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
      align-items: end;
      gap: var(--space-6);
    }

    .ssec-section-head[data-split] .ssec-lede {
      padding-bottom: 6px;
    }
  }

  .ssec-head-aside {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: var(--space-4);
  }

  @media (min-width: 1024px) {
    .ssec-head-aside {
      justify-content: flex-end;
    }
  }

  .ssec-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--accent);
  }

  .ssec-kicker::before {
    content: "";
    flex-shrink: 0;
    width: 18px;
    height: 1px;
    background: currentColor;
  }

  .ssec-kicker[data-tone="agent"] {
    color: var(--agent);
  }

  .ssec-kicker[data-tone="neutral"] {
    color: var(--text-tertiary);
  }

  .ssec-ion-line {
    display: block;
    position: relative;
    height: 1px;
    width: 100%;
    background: linear-gradient(90deg, transparent, var(--accent-line) 20%, var(--accent-line) 80%, transparent);
    overflow: hidden;
  }

  .ssec-ion-line[data-length="short"] {
    width: 160px;
  }

  .ssec-ion-line[data-travel]::after {
    content: "";
    position: absolute;
    top: 0;
    left: -64px;
    width: 64px;
    height: 1px;
    background: var(--ion-line);
    animation: ion-travel var(--dur-sweep) linear infinite;
  }

  .ssec-ion-rail {
    position: relative;
    display: grid;
    gap: var(--space-5);
    padding-left: 28px;
  }

  .ssec-ion-rail::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 5px;
    width: 1px;
    background: linear-gradient(180deg, transparent, var(--accent-line) 12%, var(--accent-line) 88%, transparent);
  }

  .ssec-ion-rail > li {
    position: relative;
  }

  .ssec-ion-rail > li::before {
    content: "";
    position: absolute;
    left: -28px;
    top: 7px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    border: 1px solid var(--accent);
    background: var(--surface-base);
  }

  .ssec-ion-rail > li[data-state="done"]::before,
  .ssec-ion-rail > li[data-state="live"]::before {
    background: var(--accent);
    box-shadow: 0 0 10px var(--glow-color);
  }

  .ssec-ion-rail > li[data-state="closed"]::before {
    border-color: var(--border-strong);
  }

  .ssec-gate {
    --g: currentColor;
    position: relative;
    display: inline-block;
    width: 1em;
    height: 1em;
    flex: none;
    vertical-align: -0.12em;
  }

  .ssec-gate::before,
  .ssec-gate::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 34%;
    border: 1.5px solid var(--g);
    transition: transform var(--dur-slow) var(--ease-gate), box-shadow var(--dur-slow) var(--ease-gate);
  }

  .ssec-gate::before {
    left: 0;
    border-right: 0;
    border-radius: 2px 0 0 2px;
  }

  .ssec-gate::after {
    right: 0;
    border-left: 0;
    border-radius: 0 2px 2px 0;
  }

  .ssec-gate i {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 6px;
    height: 6px;
    margin: -3px 0 0 -3px;
    border-radius: 50%;
    background: transparent;
  }

  .ssec-gate[data-size="bullet"] {
    width: 14px;
    height: 14px;
    color: var(--stage-confirmed);
  }

  .ssec-gate[data-size="bullet"] i {
    width: 5px;
    height: 5px;
    margin: -2.5px 0 0 -2.5px;
    background: var(--stage-confirmed);
  }

  .ssec-gate[data-size="inline"] {
    width: 22px;
    height: 22px;
    color: var(--text-tertiary);
    opacity: 0.75;
  }

  .ssec-chamber .ssec-gate[data-size="inline"],
  .ssec-band[data-surface="chamber"] .ssec-gate[data-size="inline"] {
    color: var(--proof-light);
    opacity: 0.55;
  }

  .ssec-gate[data-size="bullet"][data-state="passed"] i {
    background: var(--stage-confirmed);
    box-shadow: none;
  }

  .ssec-gate[data-size="bullet"][data-state="passed"]::before,
  .ssec-gate[data-size="bullet"][data-state="passed"]::after {
    transform: none;
  }

  .ssec-gate[data-size="frame"] {
    width: 0.7em;
    height: 0.9em;
    color: var(--proof-light);
    opacity: 0.8;
  }

  .ssec-gate[data-state="passed"] {
    opacity: 1;
  }

  .ssec-gate[data-state="passed"]::before { transform: translateX(-2px); }
  .ssec-gate[data-state="passed"]::after { transform: translateX(2px); }

  .ssec-gate[data-state="passed"] i {
    background: var(--proof-light);
    box-shadow: 0 0 8px 1px rgb(244 241 234 / 0.6);
  }

  .ssec-gate[data-state="failed"] {
    opacity: 0.8;
    color: var(--stage-refuted);
  }

  .ssec-gate[data-state="failed"] i {
    width: 10px;
    height: 1.5px;
    margin: -1px 0 0 -5px;
    border-radius: 0;
    background: var(--stage-refuted);
    transform: rotate(-45deg);
  }

  .ssec-gate[data-state="open"]::before {
    transform: translateX(-3px);
    box-shadow: var(--proof-glow);
  }

  .ssec-gate[data-state="open"]::after {
    transform: translateX(3px);
    box-shadow: var(--proof-glow);
  }

  .ssec-checklist {
    display: grid;
    gap: 10px;
  }

  .ssec-checklist li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: var(--text-secondary);
    font-size: var(--text-small);
    line-height: var(--lh-small);
  }

  .ssec-checklist[data-size="md"] li {
    font-size: var(--text-body);
    line-height: var(--lh-body);
  }

  .ssec-checklist li .ssec-gate {
    margin-top: 4px;
  }

  .ssec-checklist li strong {
    color: var(--text-primary);
    font-weight: 500;
  }

  .ssec-callout {
    display: grid;
    gap: 8px;
    padding: var(--space-5);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-medium);
    background: var(--surface-raised);
    color: var(--text-secondary);
    font-size: var(--text-small);
    line-height: var(--lh-small);
  }

  .ssec-callout .ssec-label {
    color: var(--text-tertiary);
  }

  .ssec-callout strong {
    color: var(--text-primary);
    font-weight: 500;
  }

  .ssec-callout[data-tone="accent"] {
    border-color: var(--accent-line);
    background: var(--accent-tint);
  }

  .ssec-callout[data-tone="agent"] {
    border-color: var(--agent-line);
    background: var(--agent-tint);
  }

  .ssec-callout[data-tone="agent"] .ssec-label {
    color: var(--agent);
  }

  .ssec-faq {
    display: grid;
    border-top: 1px solid var(--border-subtle);
  }

  .ssec-faq > details {
    border-bottom: 1px solid var(--border-subtle);
  }

  .ssec-faq summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    min-height: 56px;
    padding: 12px 0;
    cursor: pointer;
    font-weight: 600;
    color: var(--text-primary);
    list-style: none;
  }

  .ssec-faq summary::-webkit-details-marker {
    display: none;
  }

  .ssec-faq summary::after {
    content: "+";
    flex-shrink: 0;
    font-family: var(--font-mono);
    font-size: 1.25rem;
    line-height: 1;
    color: var(--text-tertiary);
    width: 24px;
    text-align: center;
  }

  .ssec-faq details[open] summary::after {
    content: "−";
  }

  .ssec-faq-body {
    padding: 0 0 20px;
    color: var(--text-secondary);
    max-width: var(--measure);
  }

  .ssec-chamber {
    color-scheme: dark;
    print-color-adjust: exact;
    position: relative;
    color: var(--text-primary);
    background-color: var(--surface-chamber);
    border-radius: var(--radius-chamber);
    border: 1px solid var(--chamber-line-faint);
    box-shadow: var(--edge-inset), var(--elev-3);
    background-image:
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--graticule-color) 1px, transparent 1px), linear-gradient(90deg, var(--graticule-color) 1px, transparent 1px);
    background-repeat: no-repeat;
    background-size: 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px, var(--graticule-size) var(--graticule-size), var(--graticule-size) var(--graticule-size);
    background-position: 10px 10px, 10px 10px, right 10px top 10px, right 10px top 10px, 10px bottom 10px, 10px bottom 10px, right 10px bottom 10px, right 10px bottom 10px, 0 0, 0 0;
  }

  .ssec-chamber[data-graticule="off"] {
    background-image:
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color)),
      linear-gradient(var(--tick-color), var(--tick-color)), linear-gradient(var(--tick-color), var(--tick-color));
    background-size: 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px, 12px 1px, 1px 12px;
    background-position: 10px 10px, 10px 10px, right 10px top 10px, right 10px top 10px, 10px bottom 10px, 10px bottom 10px, right 10px bottom 10px, right 10px bottom 10px;
  }

  .ssec-chamber[data-glow] {
    box-shadow: var(--edge-inset), var(--glow-ion), var(--elev-3);
  }

  .ssec-chamber-chrome {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 8px 20px 8px 24px;
    border-bottom: 1px solid var(--chamber-line-faint);
    color: var(--text-secondary);
    flex-wrap: wrap;
  }

  .ssec-chamber-chrome .ssec-label {
    color: var(--text-tertiary);
  }

  .ssec-chamber-chips {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
  }

  .ssec-chamber-body {
    padding: var(--space-5);
  }

  .ssec-chamber-foot {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 12px 24px;
    border-top: 1px solid var(--chamber-line-faint);
    color: var(--text-tertiary);
    font-family: var(--font-mono);
    font-size: var(--text-label);
  }

  .ssec-chamber-raised {
    background: var(--surface-chamber-raised);
  }

  .ssec-scene-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    border: 1px solid var(--chamber-line-subtle);
    position: relative;
  }

  .ssec-scene-toggle::before {
    content: "";
    position: absolute;
    inset: -4px;
  }

  .ssec-scene-toggle:hover,
  .ssec-scene-toggle:focus-visible {
    color: #ffffff;
    background: var(--chamber-line-faint);
  }

  .ssec-scene-toggle svg {
    width: 14px;
    height: 14px;
  }

  .ssec-scene-toggle .ssec-ico-play {
    display: none;
  }

  [data-paused] .ssec-scene-toggle .ssec-ico-play {
    display: block;
  }

  [data-paused] .ssec-scene-toggle .ssec-ico-pause {
    display: none;
  }

  [data-paused] *,
  [data-paused]::before,
  [data-paused]::after {
    animation-play-state: paused !important;
  }

  figure[data-scene] {
    margin: 0;
  }

  .ssec-scene-visual {
    display: contents;
  }

  .ssec-announce {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    min-height: 36px;
    padding: 6px var(--gutter);
    background: var(--surface-sunken);
    border-bottom: 1px solid var(--border-subtle);
    font-size: var(--text-small);
    color: var(--text-secondary);
    text-align: center;
    flex-wrap: wrap;
  }

  .ssec-announce .ssec-announce-long {
    display: none;
  }

  @media (max-width: 639px) {
    .ssec-announce {
      min-height: 40px;
    }
  }

  @media (min-width: 640px) {
    .ssec-announce .ssec-announce-long {
      display: inline;
    }

    .ssec-announce .ssec-announce-short {
      display: none;
    }
  }

  .ssec-topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--glass-fill);
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    border-bottom: 1px solid var(--glass-border);
    transition: box-shadow var(--dur-base);
  }

  @supports not (backdrop-filter: blur(1px)) {
    .ssec-topbar {
      background: var(--surface-base);
    }
  }

  .ssec-topbar[data-scrolled] {
    box-shadow: var(--elev-1);
  }

  .ssec-topbar-inner {
    display: flex;
    align-items: center;
    gap: 16px;
    height: var(--topbar-height);
  }

  .ssec-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    color: var(--text-primary);
  }

  .ssec-brand svg {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
  }

  .ssec-brand-word {
    font-family: var(--font-display);
    font-stretch: var(--font-display-stretch);
    font-weight: var(--weight-display);
    font-size: 1.25rem;
    letter-spacing: -0.02em;
  }

  .ssec-brand-word b {
    color: var(--accent);
    font-weight: inherit;
  }

  @media (max-width: 399px) {
    .ssec-topbar .ssec-brand-word {
      display: none;
    }
  }

  .ssec-nav {
    display: none;
    align-items: center;
    gap: 4px;
    margin-left: 12px;
  }

  @media (min-width: 1024px) {
    .ssec-nav {
      display: flex;
    }
  }

  .ssec-nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 12px;
    color: var(--text-secondary);
    font-weight: 500;
    font-size: var(--text-ui);
    border-radius: var(--radius-sm);
    cursor: pointer;
    list-style: none;
    transition: color var(--dur-fast);
  }

  .ssec-nav-link::-webkit-details-marker {
    display: none;
  }

  .ssec-nav-link:hover,
  .ssec-nav-link:focus-visible {
    color: var(--text-primary);
  }

  .ssec-nav-link[aria-current="page"],
  .ssec-nav-link[data-active] {
    color: var(--text-primary);
  }

  .ssec-nav-link[aria-current="page"]::after,
  .ssec-nav-link[data-active]::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 4px;
    height: 2px;
    background: var(--accent);
    border-radius: 1px;
  }

  .ssec-nav-link .ssec-icon {
    width: 12px;
    height: 12px;
    color: var(--text-tertiary);
    transition: transform var(--dur-base);
  }

  details[open] > .ssec-nav-link .ssec-icon {
    transform: rotate(180deg);
  }

  .ssec-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 30;
    min-width: 200px;
    padding: 6px;
    background: var(--surface-overlay);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    box-shadow: var(--elev-3);
    display: grid;
  }

  .ssec-dropdown[data-align="end"] {
    left: auto;
    right: 0;
  }

  .ssec-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 12px;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-weight: 500;
    font-size: var(--text-ui);
    white-space: nowrap;
  }

  .ssec-dropdown-item:hover,
  .ssec-dropdown-item:focus-visible,
  .ssec-dropdown-item[aria-current="page"] {
    background: var(--accent-tint);
    color: var(--text-primary);
  }

  details[data-dropdown] {
    position: relative;
  }

  details[data-dropdown] > summary {
    list-style: none;
  }

  details[data-dropdown] > summary::-webkit-details-marker {
    display: none;
  }

  details[data-dropdown][open] > .ssec-dropdown {
    animation: reveal-up var(--dur-fast) both;
  }

  .ssec-topbar-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .ssec-theme-form {
    display: contents;
  }

  .ssec-theme-toggle .ssec-icon {
    width: 18px;
    height: 18px;
  }

  .ssec-theme-icon-light {
    display: none;
  }

  .ssec-theme-icon-dark {
    display: block;
  }

  :root[data-theme="dark"] .ssec-theme-icon-dark {
    display: none;
  }

  :root[data-theme="dark"] .ssec-theme-icon-light {
    display: block;
  }

  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .ssec-theme-icon-dark {
      display: none;
    }

    :root:not([data-theme="light"]) .ssec-theme-icon-light {
      display: block;
    }
  }

  .ssec-signin {
    display: none;
  }

  @media (min-width: 1024px) {
    .ssec-signin {
      display: inline-flex;
    }
  }

  .ssec-cta-top .ssec-cta-long {
    display: none;
  }

  .ssec-cta-top .ssec-cta-short {
    display: inline;
  }

  @media (min-width: 480px) {
    .ssec-cta-top .ssec-cta-long {
      display: inline;
    }

    .ssec-cta-top .ssec-cta-short {
      display: none;
    }
  }

  @media (max-width: 639px) {
    .ssec-topbar-actions > .ssec-theme-form {
      display: none;
    }
  }

  html:not([data-js]) .ssec-menu[data-action],
  html[data-js] .ssec-menu[data-nojs] {
    display: none;
  }

  @media (min-width: 1024px) {
    .ssec-menu,
    .ssec-drawer {
      display: none;
    }
  }

  .ssec-menu .ssec-icon {
    width: 20px;
    height: 20px;
  }

  .ssec-drawer {
    margin: 0 0 0 auto;
    width: min(20rem, 85vw);
    height: 100dvh;
    padding: 0;
    border: 0;
    border-left: 1px solid var(--border-subtle);
    background: var(--surface-overlay);
    color: var(--text-primary);
    box-shadow: var(--elev-3);
  }

  .ssec-drawer-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .ssec-drawer-head {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    min-height: var(--topbar-height);
    padding: 0 10px 0 16px;
    border-bottom: 1px solid var(--border-subtle);
  }

  .ssec-drawer-body {
    display: grid;
    gap: 2px;
    align-content: start;
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 8px 12px 16px;
  }

  .ssec-drawer-link,
  .ssec-drawer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 0 8px;
    border-radius: var(--radius-sm);
    font-weight: 500;
    color: var(--text-primary);
  }

  .ssec-drawer-link:hover,
  .ssec-drawer-link:focus-visible,
  .ssec-drawer-link[aria-current="page"] {
    background: var(--accent-tint);
  }

  .ssec-drawer hr {
    border: 0;
    border-top: 1px solid var(--border-subtle);
    margin: 6px 0;
  }

  .ssec-drawer-row .ssec-theme-toggle {
    display: inline-flex;
  }

  html:has(dialog[data-drawer][open]) {
    overflow: hidden;
  }

  .ssec-skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 200;
    padding: 10px 14px;
    background: var(--surface-overlay);
    color: var(--text-primary);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-sm);
    font-size: var(--text-small);
    font-weight: 600;
    text-decoration: none;
    transform: translateY(-200%);
  }

  .ssec-skip-link:focus-visible {
    transform: none;
  }

  .ssec-hero {
    position: relative;
    padding-top: clamp(40px, 6vw, 72px);
    padding-bottom: clamp(48px, 6vw, 96px);
    overflow: clip;
  }

  .ssec-hero[data-layout="doc"] {
    padding-top: clamp(40px, 5vw, 64px);
    padding-bottom: clamp(32px, 4vw, 48px);
  }

  .ssec-hero-copy {
    display: grid;
    gap: 18px;
    align-content: start;
    min-width: 0;
  }

  .ssec-hero[data-layout="stage"] .ssec-hero-copy {
    text-align: center;
    justify-items: center;
    max-width: 880px;
    margin-inline: auto;
  }

  .ssec-hero-title {
    max-width: 18ch;
  }

  .ssec-hero[data-layout="split"] .ssec-hero-title,
  .ssec-hero[data-layout="doc"] .ssec-hero-title {
    max-width: 22ch;
  }

  .ssec-hero-line {
    display: block;
  }

  .ssec-hero-title .ssec-ion-line {
    margin: 18px 0 0;
  }

  .ssec-hero[data-layout="stage"] .ssec-hero-title .ssec-ion-line {
    margin-inline: auto;
  }

  .ssec-hero-note {
    color: var(--text-tertiary);
    font-family: var(--font-mono);
    font-size: var(--text-label);
    letter-spacing: 0.04em;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
  }

  .ssec-hero[data-layout="stage"] .ssec-hero-note {
    justify-content: center;
  }

  .ssec-hero-note span::before {
    content: "■";
    font-size: 0.5rem;
    vertical-align: 0.2em;
    margin-right: 8px;
    color: var(--accent);
  }

  .ssec-hero-updated {
    color: var(--text-tertiary);
  }

  @media (max-width: 479px) {
    .ssec-hero[data-layout="stage"] .ssec-hero-title {
      font-size: clamp(2.125rem, 9vw, 3rem);
      font-stretch: 100%;
    }
  }

  .ssec-hero-stage {
    position: relative;
    margin-top: clamp(32px, 4vw, 48px);
    perspective: 1600px;
  }

  .ssec-hero-glow {
    position: absolute;
    inset: -10% -5% auto;
    height: 70%;
    background: radial-gradient(ellipse at 50% 30%, var(--glow-color), transparent 62%);
    filter: blur(24px);
    opacity: 0.9;
    pointer-events: none;
  }

  .ssec-hero-stage .ssec-chamber[data-tilt] {
    transform: rotateX(6deg);
    transform-origin: 50% 0;
  }

  [data-playing] .ssec-hero-stage .ssec-chamber[data-tilt],
  .ssec-hero-stage .ssec-chamber[data-tilt][data-playing] {
    animation: chamber-rise var(--dur-scene) var(--ease-out) both;
    animation-delay: 120ms;
  }

  @media (max-width: 767px) {
    .ssec-hero-stage .ssec-chamber[data-tilt] {
      transform: none;
    }

    [data-playing] .ssec-hero-stage .ssec-chamber[data-tilt],
    .ssec-hero-stage .ssec-chamber[data-tilt][data-playing] {
      animation-name: chamber-rise-flat;
    }
  }

  .ssec-hero-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-7);
    align-items: center;
  }

  @media (min-width: 1024px) {
    .ssec-hero-split {
      grid-template-columns: 5fr 7fr;
      gap: var(--space-8);
    }
  }

  .ssec-hero-doc {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  @media (min-width: 1024px) {
    .ssec-hero-doc {
      grid-template-columns: repeat(12, minmax(0, 1fr));
      align-items: start;
    }

    .ssec-hero-doc > .ssec-hero-copy {
      grid-column: 1 / span 8;
    }

    .ssec-hero-doc > .ssec-hero-aside {
      grid-column: 9 / -1;
    }

    .ssec-hero-doc[data-aside="none"] > .ssec-hero-copy {
      grid-column: 1 / span 9;
    }
  }

  .ssec-cta {
    text-align: center;
    display: grid;
    justify-items: center;
    gap: 22px;
  }

  .ssec-cta-title {
    display: inline-flex;
    align-items: center;
    gap: 18px;
  }

  .ssec-cta:hover .ssec-cta-title .ssec-gate::before {
    transform: translateX(-3px);
    box-shadow: var(--proof-glow);
  }

  .ssec-cta:hover .ssec-cta-title .ssec-gate::after {
    transform: translateX(3px);
    box-shadow: var(--proof-glow);
  }

  .ssec-cta p {
    color: var(--text-secondary);
    max-width: 56ch;
  }

  @media (max-width: 479px) {
    .ssec-cta-title .ssec-gate {
      display: none;
    }
  }

  .ssec-footer {
    background: var(--surface-sunken);
    border-top: 1px solid var(--border-subtle);
    padding: var(--space-8) 0 var(--space-6);
  }

  .ssec-footer-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: var(--space-6);
  }

  .ssec-footer-brand {
    grid-column: span 5;
    display: grid;
    gap: var(--space-4);
    align-content: start;
  }

  .ssec-footer-brand p {
    color: var(--text-secondary);
    font-size: var(--text-small);
    max-width: 42ch;
  }

  .ssec-footer-form {
    display: grid;
    gap: 8px;
    margin-top: 8px;
  }

  .ssec-footer-form label,
  .ssec-footer-form-title {
    font-weight: 600;
    font-size: var(--text-small);
    color: var(--text-primary);
  }

  .ssec-footer-form small,
  .ssec-footer-form-note {
    color: var(--text-tertiary);
    font-size: var(--text-xs);
  }

  .ssec-footer-cols {
    grid-column: 7 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
  }

  .ssec-footer-col {
    display: grid;
    align-content: start;
  }

  .ssec-footer-col h2 {
    margin-bottom: 8px;
    color: var(--text-tertiary);
  }

  .ssec-footer-link {
    display: flex;
    align-items: center;
    min-height: 44px;
    color: var(--text-secondary);
    font-size: var(--text-small);
    font-weight: 500;
    transition: color var(--dur-fast);
  }

  .ssec-footer-link:hover,
  .ssec-footer-link:focus-visible {
    color: var(--accent-hover);
  }

  .ssec-footer-legal {
    margin-top: var(--space-7);
    padding-top: 20px;
    color: var(--text-tertiary);
    font-size: var(--text-label);
    line-height: var(--lh-label);
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
  }

  .ssec-footer-legal .ssec-link {
    font-weight: 400;
  }

  @media (max-width: 1023px) {
    .ssec-footer-grid {
      grid-template-columns: minmax(0, 1fr);
    }

    .ssec-footer-brand,
    .ssec-footer-cols {
      grid-column: 1 / -1;
    }
  }

  @media (max-width: 639px) {
    .ssec-footer-cols {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  .ssec-input {
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-strong);
    background: var(--surface-input);
    min-height: 44px;
    padding: 0 14px;
    font-size: var(--text-ui);
    line-height: 1.25rem;
    color: var(--text-primary);
    transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
  }

  textarea.ssec-input {
    padding-block: 10px;
  }

  @media (max-width: 767px) {
    .ssec-input {
      font-size: 1rem;
    }
  }

  .ssec-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-tint);
  }

  .ssec-input:focus-visible {
    outline-offset: 0;
    box-shadow: none;
  }

  .ssec-input[readonly] {
    background: var(--surface-sunken);
    border-style: dashed;
  }

  .ssec-input[readonly],
  .ssec-input:disabled {
    color: var(--text-tertiary);
    cursor: default;
  }

  .ssec-input:disabled {
    opacity: 0.6;
  }

  .ssec-input::placeholder {
    color: var(--text-tertiary);
    opacity: 1;
  }

  .ssec-input:-webkit-autofill,
  .ssec-input:-webkit-autofill:hover,
  .ssec-input:-webkit-autofill:active {
    box-shadow: inset 0 0 0 1000px var(--autofill-surface);
    -webkit-text-fill-color: var(--text-primary);
    caret-color: var(--text-primary);
    border-color: var(--border-strong);
    transition: background-color 9999s ease-in-out 0s;
  }

  .ssec-input:-webkit-autofill:focus {
    box-shadow: inset 0 0 0 1000px var(--autofill-surface), 0 0 0 3px var(--accent-tint);
    border-color: var(--accent);
  }

  .ssec-check-label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding-block: 2px;
    font-size: var(--text-small);
    line-height: 1.4;
    color: var(--text-secondary);
  }

  .ssec-check-label[data-align="start"] {
    align-items: flex-start;
  }

  .ssec-check {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--accent);
  }

  .ssec-check-label[data-align="start"] .ssec-check {
    margin-top: 2px;
  }

  .ssec-field-error {
    display: block;
    margin-top: 4px;
    font-size: var(--text-label);
    line-height: 1.4;
    color: var(--sev-critical);
  }

  .ssec-field-error-list {
    display: grid;
    gap: 2px;
    padding-left: 16px;
    list-style: disc;
  }

  .ssec-input[data-invalid] {
    border-color: var(--danger);
    box-shadow: 0 0 0 3px var(--danger-surface);
  }

  .ssec-input::file-selector-button {
    margin-right: 12px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--border-medium);
    background: var(--surface-card);
    padding: 4px 12px;
    color: var(--text-primary);
    font: inherit;
    cursor: pointer;
    transition: border-color var(--dur-fast), background var(--dur-fast);
  }

  .ssec-input::file-selector-button:hover {
    border-color: var(--accent);
  }

  .ssec-file-field {
    position: relative;
    display: flex;
    min-height: 44px;
    align-items: center;
    gap: 12px;
    border-radius: var(--radius-sm);
    border: 1px solid var(--border-strong);
    background: var(--surface-input);
    padding: 6px 8px;
    transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
  }

  .ssec-file-field:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-tint);
  }

  .ssec-file-field[data-invalid] {
    border-color: var(--danger);
    box-shadow: 0 0 0 3px var(--danger-surface);
  }

  .ssec-file-field input {
    position: absolute;
    inset: 0;
    width: 100%;
    opacity: 0;
    cursor: pointer;
  }

  .ssec-file-field-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--text-small);
    color: var(--text-secondary);
  }

  select.ssec-input {
    appearance: none;
    padding-right: 2rem;
    background-image:
      linear-gradient(45deg, transparent 50%, var(--text-tertiary) 50%),
      linear-gradient(135deg, var(--text-tertiary) 50%, transparent 50%);
    background-position: calc(100% - 1.05rem) center, calc(100% - 0.75rem) center;
    background-size: 0.3rem 0.3rem, 0.3rem 0.3rem;
    background-repeat: no-repeat;
    max-width: 100%;
  }

  .ssec-focus-page {
    margin-inline: auto;
    max-width: 28rem;
    padding: 3rem 1rem;
  }

  .ssec-section {
    margin-inline: auto;
    max-width: calc(var(--container) + 2 * var(--gutter));
    padding-inline: var(--gutter);
    padding-block: var(--space-8);
  }

  .ssec-stat-grid-cell {
    display: block;
    min-width: 0;
    padding: 0.75rem 1rem;
    background: var(--surface-card);
    box-shadow: 0 0 0 1px var(--border-medium);
  }

  a.ssec-stat-grid-cell {
    transition: background var(--dur-fast);
  }

  a.ssec-stat-grid-cell:hover,
  a.ssec-stat-grid-cell:focus-visible {
    background: color-mix(in srgb, var(--text-primary) 5%, var(--surface-card));
  }

  .ssec-stat-grid-cell[data-tone="danger"] {
    background: color-mix(in srgb, var(--danger) 6%, var(--surface-card));
  }

  .ssec-stat-grid-cell[data-tone="warning"] {
    background: color-mix(in srgb, var(--warning) 7%, var(--surface-card));
  }

  .ssec-stack > * + * {
    margin-block-start: 1rem;
  }

  .ssec-hit {
    position: relative;
    display: inline-flex;
    align-items: center;
  }

  .ssec-hit::after {
    content: "";
    position: absolute;
    inset: -0.75rem -0.25rem;
  }

  .ssec-table td .ssec-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-size: var(--text-small);
  }

  .ssec-table td .ssec-link::after {
    content: "";
    position: absolute;
    inset: -0.75rem -0.25rem;
  }

  .ssec-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    min-height: 36px;
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-subtle);
    background: var(--surface-sunken);
    padding: 0 12px;
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--text-secondary);
    white-space: nowrap;
    position: relative;
    transition: color var(--dur-fast), border-color var(--dur-fast), background var(--dur-fast);
  }

  a.ssec-chip::before,
  button.ssec-chip::before {
    content: "";
    position: absolute;
    inset: -4px 0;
  }

  .ssec-chip[data-variant="rail"] {
    flex-shrink: 0;
    background: transparent;
    color: var(--text-tertiary);
    transition-duration: var(--dur-base);
  }

  .ssec-chip[data-tone="accent"],
  .ssec-chip[aria-pressed="true"],
  .ssec-chip[data-active] {
    border-color: var(--accent-line);
    background: var(--accent-tint);
    color: var(--accent-ink);
  }

  .ssec-chip[data-tone="accent"]:hover {
    background: color-mix(in srgb, var(--accent) 18%, transparent);
  }

  .ssec-chip[data-tone="danger"] {
    border-color: color-mix(in srgb, var(--danger) 40%, transparent);
    background: var(--danger-surface);
    color: var(--danger);
  }

  .ssec-chip-strip {
    scrollbar-width: none;
    scroll-snap-type: x proximity;
    mask-image: linear-gradient(to right, transparent, black 1rem, black calc(100% - 1.5rem), transparent);
  }

  .ssec-chip-strip:has(:focus-visible) {
    mask-image: none;
  }

  .ssec-chip-strip::-webkit-scrollbar {
    display: none;
  }

  .ssec-chip-strip > * {
    scroll-snap-align: center;
  }

  .ssec-table-host {
    --table-bleed: 1rem;
  }

  .ssec-table-scroll {
    position: relative;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    margin-inline: calc(var(--table-bleed, 0rem) * -1);
    padding-inline: var(--table-bleed, 0rem);
  }

  .ssec-table {
    width: 100%;
    text-align: left;
    font-size: var(--text-small);
    line-height: 1.25rem;
  }

  .ssec-table th,
  .ssec-table td {
    padding-block: 0.5rem;
    padding-right: 1rem;
    vertical-align: top;
  }

  .ssec-table tbody tr {
    border-top: 1px solid var(--border-subtle);
  }

  .ssec-table th:last-child,
  .ssec-table td:last-child {
    padding-right: 0;
  }

  .ssec-table th {
    min-width: var(--column-min-width, auto);
  }

  .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan]) {
    position: sticky;
    right: 0;
    padding-left: 1rem;
  }

  .ssec-table[data-pinned-actions] :is(th, td):nth-last-child(2):not([colspan]) {
    padding-right: 0;
  }

  @media (max-width: 639px) {
    .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan]) {
      position: static;
    }

    .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::before,
    .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::after {
      content: none;
    }
  }

  .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::before,
  .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::after {
    content: "";
    position: absolute;
    inset-block: 0;
  }

  .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::before {
    left: 0;
    right: 0;
    z-index: -1;
    background: linear-gradient(to left, var(--surface-card) calc(100% - 1rem), transparent);
    pointer-events: none;
  }

  .ssec-table[data-pinned-actions] :is(th, td):last-child:not([colspan])::after {
    left: 100%;
    z-index: -1;
    width: var(--table-bleed, 0rem);
    background: var(--surface-card);
  }

  .ssec-table-scroll:has(> [data-pinned-actions]) {
    scroll-padding-inline-end: 6rem;
  }

  .ssec-table-scroll:has(> [data-pinned-start]) {
    scroll-padding-inline-start: 9rem;
  }

  .ssec-table[data-pinned-start] :is(th, td):first-child:not([colspan]) {
    position: sticky;
    left: 0;
    z-index: 1;
  }

  .ssec-table[data-pinned-start] :is(th, td):first-child:not([colspan])::before,
  .ssec-table[data-pinned-start] :is(th, td):first-child:not([colspan])::after {
    content: "";
    position: absolute;
    inset-block: 0;
  }

  .ssec-table[data-pinned-start] :is(th, td):first-child:not([colspan])::after {
    left: 0;
    right: 0;
    z-index: -1;
    background: linear-gradient(to right, var(--surface-card) calc(100% - 1rem), transparent);
    pointer-events: none;
  }

  .ssec-table[data-pinned-start] :is(th, td):first-child:not([colspan])::before {
    right: 100%;
    z-index: -1;
    width: var(--table-bleed, 0rem);
    background: var(--surface-card);
  }

  .ssec-table tr[data-dimmed] {
    --text-primary: var(--text-tertiary);
    --text-secondary: var(--text-tertiary);
    color: var(--text-tertiary);
  }

  @media (pointer: coarse) {
    .ssec-table th,
    .ssec-table td {
      padding-block: 0.75rem;
    }
  }

  @media (min-width: 640px) {
    .ssec-table-host {
      --table-bleed: var(--card-pad, 24px);
    }
  }

  @keyframes ssec-spin {
    to {
      transform: rotate(360deg);
    }
  }

  .ssec-spinner {
    display: inline-block;
    width: 0.85em;
    height: 0.85em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: var(--radius-pill);
    animation: ssec-spin 0.6s linear infinite;
  }

  @media (prefers-reduced-motion: reduce) {
    .ssec-spinner {
      border-right-color: currentColor;
      opacity: 0.55;
    }
  }

  .ssec-invoice-document address {
    font-style: normal;
  }

  @media print {
    .ssec-topbar,
    .ssec-announce,
    .ssec-skip-link,
    .ssec-shell-sidebar,
    .ssec-toast-region,
    .ssec-verify-notice,
    .ssec-invoice-toolbar {
      display: none !important;
    }

    div:has(> .ssec-shell-sidebar) {
      display: block !important;
    }

    section:has(.ssec-invoice-document) {
      max-width: none !important;
      padding: 0 !important;
    }

    .ssec-card.ssec-invoice-document {
      margin: 0 !important;
      padding: 0;
      border: 0;
      box-shadow: none;
      background: transparent;
    }
  }

  html[data-js] [data-reveal] {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 560ms var(--ease-out), transform 560ms var(--ease-out);
    transition-delay: var(--reveal-delay, 0ms);
  }

  html[data-js] [data-reveal][data-visible] {
    opacity: 1;
    transform: none;
  }

  dialog[data-dialog] {
    max-height: calc(100dvh - 2rem);
    opacity: 0;
    transform: translateY(8px) scale(0.98);
    transition:
      opacity var(--dur-base),
      transform var(--dur-base),
      overlay var(--dur-base) allow-discrete,
      display var(--dur-base) allow-discrete;
  }

  dialog[data-dialog][open] {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  dialog[data-drawer] {
    max-height: 100dvh;
    transform: translateX(-100%);
    transition:
      transform var(--dur-base),
      overlay var(--dur-base) allow-discrete,
      display var(--dur-base) allow-discrete;
  }

  dialog[data-drawer][open] {
    transform: translateX(0);
  }

  dialog[data-drawer][data-side="end"] {
    transform: translateX(100%);
  }

  dialog[data-drawer][data-side="end"][open] {
    transform: translateX(0);
  }

  dialog[data-dialog]::backdrop,
  dialog[data-drawer]::backdrop {
    background: var(--backdrop);
    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    opacity: 0;
    transition:
      opacity var(--dur-base),
      overlay var(--dur-base) allow-discrete,
      display var(--dur-base) allow-discrete;
  }

  dialog[data-dialog][open]::backdrop,
  dialog[data-drawer][open]::backdrop {
    opacity: 1;
  }

  details[data-mobile-nav] > summary::-webkit-details-marker {
    display: none;
  }

  dialog[data-drawer] .ssec-shell-nav-link {
    min-height: 44px;
  }

  [data-action="copy-text"][data-copied]::after {
    content: "Copied";
    position: absolute;
    inset-inline-end: 0;
    bottom: calc(100% + 0.25rem);
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-sm);
    background-color: var(--text-primary);
    color: var(--surface-card);
    font-size: var(--text-label);
    line-height: 1rem;
    white-space: nowrap;
  }

  @starting-style {
    dialog[data-dialog][open] {
      opacity: 0;
      transform: translateY(8px) scale(0.98);
    }

    dialog[data-drawer][open] {
      transform: translateX(-100%);
    }

    dialog[data-drawer][data-side="end"][open] {
      transform: translateX(100%);
    }

    dialog[data-dialog][open]::backdrop,
    dialog[data-drawer][open]::backdrop {
      opacity: 0;
    }
  }

  .ssec-faq-chevron {
    transition: transform var(--dur-base);
  }

  details[open] .ssec-faq-chevron {
    transform: rotate(180deg);
  }

  .ssec-rail-node {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 0 0 22px;
    font-size: var(--text-small);
    font-weight: 500;
    color: var(--text-tertiary);
    transition: color var(--dur-base);
  }

  .ssec-rail-node::before,
  .ssec-rail-node::after {
    content: "";
    position: absolute;
    left: 5px;
    width: 1px;
    background: var(--border-medium);
    transition: background var(--dur-base);
  }

  .ssec-rail-node::before {
    top: 0;
    height: 50%;
  }

  .ssec-rail-node::after {
    top: 50%;
    bottom: 0;
  }

  .ssec-rail-node:first-child::before,
  .ssec-rail-node:last-child::after {
    display: none;
  }

  .ssec-rail-dot {
    position: absolute;
    left: 0;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    border: 1px solid var(--border-strong);
    background: var(--surface-base);
    transition: border-color var(--dur-base), background var(--dur-base), box-shadow var(--dur-base);
    z-index: 1;
  }

  .ssec-rail-node:hover {
    color: var(--text-secondary);
  }

  .ssec-rail-node[data-active] {
    color: var(--text-primary);
  }

  .ssec-rail-node[data-active] .ssec-rail-dot {
    border-color: var(--accent);
    background: var(--accent);
    box-shadow: 0 0 10px var(--glow-color);
  }

  .ssec-rail-node[data-active]::before {
    background: var(--accent-line);
  }

  .ssec-toc-title {
    color: var(--text-tertiary);
  }

  .ssec-toc-link {
    display: flex;
    align-items: center;
    min-height: 44px;
    color: var(--text-secondary);
    font-size: var(--text-small);
    line-height: var(--lh-small);
    text-decoration: none;
    transition: color var(--dur-fast), border-color var(--dur-fast);
  }

  .ssec-prose {
    color: var(--text-secondary);
    font-size: var(--text-body);
    line-height: 1.7;
    max-width: var(--measure);
    overflow-wrap: break-word;
  }

  .ssec-prose > * + * {
    margin-top: 1.25em;
  }

  .ssec-prose h2 {
    font-family: var(--font-display);
    font-stretch: var(--font-display-stretch);
    font-weight: var(--weight-display);
    font-size: 1.75rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--text-primary);
    margin-top: 2em;
    margin-bottom: 0.6em;
    scroll-margin-top: 6rem;
    text-wrap: balance;
  }

  .ssec-prose h3 {
    font-family: var(--font-sans);
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--text-primary);
    margin-top: 1.6em;
    margin-bottom: 0.4em;
    scroll-margin-top: 6rem;
  }

  .ssec-prose h4 {
    font-family: var(--font-sans);
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--text-primary);
    margin-top: 1.4em;
    margin-bottom: 0.3em;
  }

  .ssec-prose p {
    margin: 0;
    text-wrap: pretty;
  }

  .ssec-prose-compact {
    font-size: var(--text-ui);
    line-height: 1.65;
  }

  .ssec-prose-compact > * + * {
    margin-top: 1em;
  }

  .ssec-prose-compact h2 {
    font-size: 1.15rem;
    margin-top: 1.6em;
    margin-bottom: 0.45em;
    scroll-margin-top: 1rem;
  }

  .ssec-prose a {
    color: var(--accent);
    font-weight: 500;
    overflow-wrap: anywhere;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    text-decoration-color: var(--accent-line);
    transition: color var(--dur-fast), text-decoration-color var(--dur-fast);
  }

  .ssec-prose a:hover {
    color: var(--accent-hover);
    text-decoration-color: currentColor;
  }

  .ssec-prose strong {
    color: var(--text-primary);
    font-weight: 600;
  }

  .ssec-prose em {
    font-style: italic;
  }

  .ssec-prose ul,
  .ssec-prose ol {
    margin: 0;
    padding-left: 1.5em;
  }

  .ssec-prose ul > li {
    list-style: disc;
  }

  .ssec-prose ol > li {
    list-style: decimal;
  }

  .ssec-prose li {
    margin-top: 0.5em;
  }

  .ssec-prose li::marker {
    color: var(--text-tertiary);
  }

  .ssec-prose > :is(p, ul, ol) + :is(p, ul, ol) {
    margin-top: 1.25em;
  }

  .ssec-prose-compact > :is(p, ul, ol) + :is(p, ul, ol) {
    margin-top: 1em;
  }

  .ssec-prose blockquote {
    margin: 0;
    padding: 0.75em 1.1em;
    border-left: 2px solid var(--accent-line);
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    background: var(--surface-sunken);
    color: var(--text-secondary);
  }

  .ssec-prose blockquote p {
    margin: 0;
  }

  .ssec-prose :not(pre) > code {
    font-family: var(--font-mono);
    overflow-wrap: anywhere;
    font-size: 0.85em;
    padding: 0.12em 0.4em;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-xs);
    background: var(--surface-sunken);
    color: var(--text-primary);
  }

  .ssec-prose pre {
    color-scheme: dark;
    print-color-adjust: exact;
    margin: 0;
    padding: 1.1em 1.25em;
    overflow-x: auto;
    border: 1px solid var(--chamber-line-faint);
    border-radius: var(--radius-md);
    background: var(--surface-chamber);
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    line-height: 1.6;
    color: #e6eaf2;
  }

  .ssec-prose img {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
  }

  .ssec-prose hr {
    border: none;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--accent-line) 20%, var(--accent-line) 80%, transparent);
  }

  .ssec-prose table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    font-size: var(--text-small);
  }

  .ssec-prose th,
  .ssec-prose td {
    padding: 0.6em 0.85em;
    border: 1px solid var(--border-subtle);
    text-align: left;
    vertical-align: top;
  }

  .ssec-prose th {
    background: var(--surface-sunken);
    color: var(--text-primary);
    font-weight: 600;
  }

  .ssec-prose pre .keyword {
    color: #9db0ff;
    font-weight: 500;
  }

  .ssec-prose pre .string,
  .ssec-prose pre .htmlAttributeValue,
  .ssec-prose pre .xmlAttributeValue {
    color: #7dd8a5;
  }

  .ssec-prose pre .comment,
  .ssec-prose pre .htmlComment,
  .ssec-prose pre .xmlComment {
    color: var(--text-tertiary);
    font-style: italic;
  }

  .ssec-prose pre .preprocessorKeyword {
    color: #efc24c;
  }

  .ssec-prose pre .htmlElementName,
  .ssec-prose pre .xmlName,
  .ssec-prose pre .sqlSystemFunction {
    color: var(--accent);
  }

  .ssec-prose pre .htmlAttributeName,
  .ssec-prose pre .xmlAttribute {
    color: #efc24c;
  }

  .ssec-prose pre .htmlTagDelimiter,
  .ssec-prose pre .htmlOperator,
  .ssec-prose pre .htmlEntity,
  .ssec-prose pre .xmlDelimiter {
    color: var(--text-tertiary);
  }

  .ssec-prose pre .number {
    color: #ff9d4d;
  }

  .ssec-code-block {
    position: relative;
  }

  .ssec-prose .ssec-code-block > pre {
    padding-top: 2.8rem;
  }

  .ssec-code-copy {
    color-scheme: dark;
    print-color-adjust: exact;
    position: absolute;
    top: 0.65rem;
    right: 0.65rem;
    min-width: 3.7rem;
    min-height: 1.8rem;
    padding: 0.25rem 0.55rem;
    border: 1px solid var(--chamber-line-medium);
    border-radius: var(--radius-xs);
    background: var(--surface-chamber-raised);
    font-family: var(--font-mono);
    font-size: var(--text-label);
    font-weight: 500;
    color: var(--text-secondary);
    cursor: pointer;
    transition: border-color var(--dur-fast), background var(--dur-fast), color var(--dur-fast);
  }

  .ssec-code-copy::after {
    content: "";
    position: absolute;
    inset: -0.5rem;
  }

  .ssec-code-copy:hover,
  .ssec-code-copy:focus-visible,
  .ssec-code-copy[data-copied] {
    border-color: var(--accent-line);
    color: #ffffff;
  }

  .ssec-row-action {
    white-space: nowrap;
    font-size: var(--text-small);
    line-height: 1.25rem;
    font-weight: 500;
    color: var(--text-secondary);
  }

  .ssec-row-action:hover:not(:disabled) {
    color: var(--text-primary);
  }

  .ssec-row-action[data-tone="danger"] {
    color: var(--danger);
  }

  .ssec-notice {
    border: 1px solid var(--notice-border, var(--border-medium));
    background: var(--notice-bg, transparent);
    color: var(--notice-text, var(--text-tertiary));
  }

  .ssec-notice[data-tone="success"] {
    --notice-border: color-mix(in srgb, var(--success) 40%, transparent);
    --notice-bg: var(--success-surface);
    --notice-text: var(--success);
  }

  .ssec-notice[data-tone="warning"] {
    --notice-border: color-mix(in srgb, var(--warning) 40%, transparent);
    --notice-bg: var(--warning-surface);
    --notice-text: var(--warning);
  }

  .ssec-notice[data-tone="danger"] {
    --notice-border: color-mix(in srgb, var(--danger) 40%, transparent);
    --notice-bg: var(--danger-surface);
    --notice-text: var(--danger);
  }

  .ssec-notice[data-tone="accent"] {
    --notice-border: var(--accent-line);
    --notice-bg: var(--accent-tint);
    --notice-text: var(--accent);
  }

  .ssec-shell-nav-badge {
    background-color: var(--accent);
  }

  .ssec-shell-nav-badge[data-tone="danger"] {
    background-color: var(--danger);
  }

  .ssec-shell-nav-badge[data-tone="warning"] {
    background-color: var(--warning);
  }

  .ssec-shell-nav-only-mini {
    display: none;
  }

  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-only-wide {
    display: none;
  }

  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-only-mini {
    display: initial;
  }

  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-sidebar-head,
  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-link,
  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-toggle {
    justify-content: center;
    padding-inline: 0;
  }

  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  :root[data-nav="mini"] .ssec-shell-sidebar .ssec-shell-nav-badge {
    position: absolute;
    right: -0.125rem;
    top: -0.125rem;
  }

  .ssec-activity-dot {
    background: var(--border-medium);
  }

  .ssec-activity-dot[data-tone="support"] {
    background: var(--warning);
  }

  .ssec-activity-dot[data-tone="accounts"] {
    background: var(--accent);
  }

  .ssec-activity-dot[data-tone="billing"] {
    background: var(--success);
  }

  .ssec-activity-dot[data-tone="security"] {
    background: var(--danger);
  }

  .ssec-chart-legend {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 1rem;
    font-size: var(--text-label);
    color: var(--text-secondary);
  }

  .ssec-chart-key {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
  }

  .ssec-chart-swatch {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 2px;
    background: var(--chart-series-1);
  }

  .ssec-chart-swatch[data-series="2"] {
    background: var(--chart-series-2);
  }

  .ssec-chart-swatch[data-level] {
    box-shadow: inset 0 0 0 1px var(--chart-scale-4);
  }

  .ssec-chart-swatch[data-level="1"] {
    background: var(--chart-scale-1);
  }

  .ssec-chart-swatch[data-level="2"] {
    background: var(--chart-scale-2);
  }

  .ssec-chart-swatch[data-level="3"] {
    background: var(--chart-scale-3);
  }

  .ssec-chart-swatch[data-level="4"] {
    background: var(--chart-scale-4);
  }

  .ssec-chart-tip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.125rem 0.5rem;
    max-width: 100%;
    border: 1px solid var(--border-medium);
    border-radius: var(--radius-sm);
    background: var(--surface-overlay);
    box-shadow: var(--elev-2);
    padding: 0.25rem 0.5rem;
    font-size: var(--text-label);
    color: var(--text-secondary);
  }

  @media (prefers-reduced-motion: reduce) {
    .ssec-hero-stage .ssec-chamber[data-tilt] {
      transform: none;
    }

    .ssec-ion-line[data-travel]::after {
      display: none;
    }

    .ssec-scene-toggle {
      display: none;
    }
  }
}

@keyframes ion-travel {
  to {
    left: 100%;
  }
}

@keyframes chamber-rise {
  from {
    opacity: 0;
    transform: translateY(28px) rotateX(12deg);
  }

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

@keyframes chamber-rise-flat {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}
