/* Discovery uses the approved blue/white workspace; other views retain their incumbent layout. */
.keyword-search { padding-block: 24px; }
.keyword-search form { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; }
.keyword-search form > div { display: grid; gap: 6px; }
.keyword-search .keyword-query { flex: 1 1 280px; }
.keyword-search label { color: var(--ink); font-weight: 600; }
.keyword-search input, .keyword-search select { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--paper-strong); color: var(--ink); font: inherit; }
.keyword-search input::placeholder { color: var(--ink-soft); }
.keyword-search input { caret-color: var(--coral); }
.keyword-search button { min-height: 44px; }
.keyword-search :focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }
.keyword-search > p { color: var(--ink-soft); margin: 10px 0 0; max-width: 70ch; }
.keyword-search > p:empty { display: none; }
#keywordSearchResults { margin: 16px 0 0; padding: 0; list-style: none; }
#keywordSearchResults li { padding: 16px 0; border-top: 1px solid var(--line); }
#keywordSearchResults button { padding: 0; border: 0; background: transparent; color: var(--coral-dark); font: inherit; font-weight: 600; text-align: left; text-decoration: underline; text-underline-offset: .2em; cursor: pointer; overflow-wrap: anywhere; }
#keywordSearchResults p { margin: 6px 0 0; color: var(--ink-soft); max-width: 70ch; overflow-wrap: anywhere; }
@media (max-width: 600px) { .keyword-search form > div { width: 100%; } .keyword-search .keyword-query { flex-basis: 100%; } }
:root {
      --paper: #f6f9fd;
      --paper-strong: #ffffff;
      --paper-soft: #eef4fb;
      --paper-muted: #fafbfd;
      --ink: #10233f;
      --ink-soft: #52647a;
      --ink-muted: #5f7086;
      --line: #dde6f0;
      --line-strong: #7d94ae;
      --coral: #245cf5;
      --coral-dark: #1e4ed8;
      --coral-soft: #edf3ff;
      --teal: #0b6e68;
      --teal-soft: #e7f8f5;
      --mustard: #c48a18;
      --mustard-soft: #fff4ce;
      --white: #ffffff;
      --danger: #b42318;
      --shadow: 0 24px 64px -38px rgba(16, 35, 63, 0.24);
      --sans: "Segoe UI Variable Text", "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei UI", "PingFang SC", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      --serif: var(--sans);
    }

    * { box-sizing: border-box; }

    html {
      min-width: 320px;
      scroll-behavior: smooth;
      background: var(--paper);
      scrollbar-color: var(--coral) var(--paper-soft);
      scrollbar-width: thin;
    }

    ::-webkit-scrollbar { width: 10px; height: 10px; }
    ::-webkit-scrollbar-track { background: var(--paper-soft); }
    ::-webkit-scrollbar-thumb { border: 2px solid var(--paper-soft); background: var(--coral); }

    body {
      margin: 0;
      min-height: 100dvh;
      color: var(--ink);
      background:
        radial-gradient(circle at 84% 2%, rgba(36, 92, 245, 0.12), transparent 27rem),
        radial-gradient(circle at 8% 18%, rgba(101, 230, 212, 0.18), transparent 25rem),
        var(--paper);
      font-family: var(--sans);
      font-size: 16px;
      font-weight: 400;
      line-height: 1.55;
      caret-color: var(--coral);
    }

    ::selection { color: var(--white); background: var(--coral); }

    :focus-visible {
      outline: 3px solid var(--white);
      outline-offset: 2px;
      box-shadow: 0 0 0 7px var(--ink);
    }

    button, select { font: inherit; }

    button {
      min-height: 44px;
      border: 0;
      cursor: pointer;
    }

    button:disabled {
      cursor: not-allowed;
      opacity: 0.48;
    }

    a { color: inherit; }

    .skip-link {
      position: fixed;
      z-index: 100;
      top: 10px;
      left: 10px;
      padding: 10px 14px;
      color: var(--white);
      background: var(--ink);
      transform: translateY(-160%);
    }

    .skip-link:focus { transform: translateY(0); }

    /* Header matches the homepage: brand, the four primary views, then account links. */
    .site-header {
      position: sticky;
      z-index: 20;
      top: 0;
      display: flex;
      align-items: center;
      gap: 40px;
      min-height: 72px;
      padding: 12px max(20px, calc((100vw - 1280px) / 2));
      border-bottom: 1px solid #f0f2f6;
      background: rgba(255, 255, 255, 0.94);
      backdrop-filter: blur(18px) saturate(150%);
      -webkit-backdrop-filter: blur(18px) saturate(150%);
    }

    .brand {
      flex: none;
      color: #1d54ed;
      font-family: var(--sans);
      font-size: 26px;
      font-weight: 800;
      text-decoration: none;
    }

    .header-actions {
      display: flex;
      flex: none;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-end;
      gap: 4px;
      margin-left: auto;
    }

    .header-link {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      padding: 0 10px;
      color: #606a7c;
      font-size: 14px;
      text-decoration: none;
      white-space: nowrap;
    }

    .header-link:hover { color: var(--coral); }

    .login {
      display: inline-flex;
      align-items: center;
      min-height: 44px;
      margin-left: 6px;
      padding: 0 22px;
      border-radius: 24px;
      color: var(--white);
      background: #172135;
      font-size: 14px;
      text-decoration: none;
      white-space: nowrap;
    }

    .header-link[hidden],
    .login[hidden] { display: none; }

    .pill,
    .chip {
      display: inline-flex;
      align-items: center;
      min-height: 28px;
      padding: 4px 10px;
      border: 1px solid currentColor;
      border-radius: 999px;
      font-size: 12px;
      font-weight: 600;
      line-height: 1.2;
    }

    button[hidden] { display: none; }
    .demand-page-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 16px 20px; border-top: 1px solid var(--line); }
    .demand-page-controls[hidden] { display: none; }
    .demand-page-controls p { flex-basis: 100%; margin: 0; color: var(--ink-soft); }

    .boundary-strip {
      padding: 9px 20px;
      border-bottom: 1px solid #cae8e3;
      color: var(--ink);
      background: var(--teal-soft);
      text-align: center;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.02em;
    }

    .primary-navigation { min-width: 0; }

    .primary-tabs {
      display: flex;
      align-items: stretch;
      gap: 8px;
    }

    .view-tab {
      position: relative;
      min-height: 44px;
      padding: 10px 12px;
      color: #606a7c;
      background: transparent;
      font-size: 14px;
      font-weight: 600;
      white-space: nowrap;
    }

    .view-tab::after {
      position: absolute;
      right: 12px;
      bottom: 0;
      left: 12px;
      height: 2px;
      background: transparent;
      content: "";
    }

    .view-tab:hover { color: var(--coral); }
    .view-tab[aria-selected="true"] { color: var(--ink); }
    .view-tab[aria-selected="true"]::after { background: var(--coral); }

    /* Adult-scope boundary stays complete; it reads as a quiet note like the homepage footer line. */
    .site-boundary {
      padding: 12px max(20px, calc((100vw - 1280px) / 2)) 0;
      color: #788396;
      font-size: 12px;
      line-height: 1.7;
      text-align: center;
    }

    .site-boundary p { margin: 0; }

    .view-panel[hidden] { display: none; }

    .shell {
      width: min(1280px, calc(100% - 40px));
      margin: 0 auto;
    }

    .hero {
      display: grid;
      grid-template-columns: minmax(210px, 0.42fr) minmax(0, 1.58fr);
      gap: clamp(26px, 3vw, 42px);
      align-items: start;
      padding: clamp(24px, 4vw, 48px) 0 48px;
    }

    .hero-copy {
      position: sticky;
      top: 104px;
      padding: 18px 0 0 18px;
      border-left: 1px solid var(--line-strong);
    }

    h1, h2, h3, p { margin-top: 0; }

    h1, h2, h3 {
      font-family: var(--serif);
      font-weight: 700;
      text-wrap: balance;
    }

    h1 {
      max-width: 10ch;
      margin-bottom: 24px;
      font-size: clamp(38px, 3.8vw, 50px);
      font-weight: 700;
      line-height: 0.98;
      letter-spacing: -0.015em;
    }

    .hero-copy > p {
      max-width: 38ch;
      margin-bottom: 20px;
      color: var(--ink-soft);
      font-size: 15px;
    }

    .primary-button,
    .secondary-button,
    .quiet-button,
    .pool-tab,
    .control-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      border: 1px solid transparent;
      border-radius: 12px;
      padding: 10px 16px;
      font-weight: 600;
      text-decoration: none;
      transition: transform 160ms ease, background-color 160ms ease, color 160ms ease, border-color 160ms ease;
    }

    .primary-button { color: var(--white); background: var(--coral); }
    .primary-button:hover { background: var(--coral-dark); transform: translateY(-1px); }
    .secondary-button { color: var(--white); background: var(--ink); }
    .secondary-button:hover { background: #173d6c; transform: translateY(-1px); }
    .quiet-button, .control-button { color: var(--ink); border-color: var(--line-strong); background: var(--paper-strong); }
    .quiet-button:hover, .control-button:hover { color: var(--coral-dark); border-color: var(--coral); background: var(--coral-soft); }
    .primary-button:active,
    .secondary-button:active,
    .quiet-button:active,
    .control-button:active,
    .pool-tab:active,
    .display-tab:active { transform: scale(0.985); }

    .hero-facts {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1px;
      margin: 24px 0 0;
      border-top: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      background: transparent;
    }

    .hero-facts div { min-width: 0; padding: 13px 8px; background: transparent; }
    .hero-facts div + div { border-left: 1px solid var(--line); }
    .hero-facts dt { margin-bottom: 2px; font-family: var(--sans); font-size: 24px; font-weight: 700; line-height: 1; }
    .hero-facts dd { margin: 0; color: var(--ink-soft); font-size: 11px; }
    .hero-facts, .batch-progress, .catalog-meta { font-variant-numeric: tabular-nums; }

    .catalog-shell {
      padding: clamp(42px, 6vw, 78px) 0 72px;
    }

    .view-intro {
      display: grid;
      grid-template-columns: minmax(0, 1.3fr) minmax(270px, 0.7fr);
      gap: clamp(28px, 5vw, 72px);
      align-items: end;
      margin-bottom: 34px;
      padding-bottom: 28px;
      border-bottom: 1px solid var(--line);
    }

    .view-intro h1 {
      max-width: 15ch;
      margin-bottom: 14px;
      font-size: clamp(38px, 5vw, 64px);
      line-height: 0.98;
      letter-spacing: -0.015em;
    }

    .view-intro p {
      max-width: 62ch;
      margin-bottom: 0;
      color: var(--ink-soft);
    }

    .view-intro-aside {
      padding: 18px 20px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--white);
    }

    .view-intro-aside strong {
      display: block;
      margin-bottom: 6px;
      font-family: var(--serif);
      font-size: 22px;
    }

    .view-intro-aside p { font-size: 13px; }

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

    .catalog-card {
      grid-column: span 6;
      display: flex;
      min-height: 330px;
      flex-direction: column;
      padding: 24px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: var(--paper-strong);
      box-shadow: 0 16px 38px -34px rgba(16, 35, 63, 0.45);
    }

    .catalog-card:nth-child(4n + 1) { background: var(--white); }

    .catalog-card h3 {
      max-width: 18ch;
      margin: 16px 0 10px;
      font-size: clamp(25px, 3vw, 34px);
      line-height: 1.08;
    }

    .catalog-card > p { color: var(--ink-soft); }

    .catalog-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 16px;
      margin: 0;
      color: var(--ink-soft);
      font-size: 12px;
    }

    .catalog-meta span + span { padding-left: 16px; border-left: 1px solid var(--line); }

    .catalog-card-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: auto;
      padding-top: 20px;
      border-top: 1px solid var(--line);
    }

    .price-stamp {
      color: var(--ink);
      font-family: var(--serif);
      font-size: 21px;
      font-weight: 700;
      white-space: nowrap;
    }

    .price-stamp--paid { color: var(--danger); }

    .creator-callout {
      display: grid;
      grid-template-columns: 1.3fr 0.7fr;
      gap: 28px;
      align-items: center;
      margin-top: 26px;
      padding: clamp(24px, 4vw, 40px);
      border: 1px solid var(--ink);
      border-radius: 22px;
      background: var(--ink);
      color: var(--paper-strong);
    }

    .creator-callout h3 { margin-bottom: 10px; font-size: clamp(28px, 3.4vw, 44px); }
    .creator-callout p { max-width: 60ch; margin-bottom: 0; color: #d7e3df; }
    .creator-callout-actions { text-align: right; }
    .creator-callout .primary-button { white-space: nowrap; }

    .split-note {
      display: block;
      margin-top: 10px;
      color: #d7e3df;
      font-size: 12px;
    }

    .tool-grid .catalog-card { grid-column: span 4; min-height: 300px; }

    .tool-output {
      margin: 16px 0 20px;
      padding: 14px 16px;
      border-top: 1px solid var(--teal);
      border-bottom: 1px solid var(--teal);
      color: var(--ink);
      background: var(--teal-soft);
      font-size: 13px;
      font-weight: 600;
    }

    .preview-list {
      margin: 18px 0 0;
      padding-left: 20px;
      color: var(--ink-soft);
    }

    .preview-list li + li { margin-top: 8px; }

    .finder {
      min-width: 0;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 24px;
      background: var(--white);
      box-shadow: var(--shadow);
    }

    .finder-top {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 18px;
      padding: 14px 16px;
      border-bottom: 1px solid var(--line);
      background: linear-gradient(110deg, #ffffff 0%, #f5f9ff 100%);
    }

    .pool-tabs {
      display: inline-grid;
      grid-template-columns: 1fr 1fr;
      gap: 4px;
      padding: 4px;
      border: 1px solid var(--line);
      border-radius: 13px;
      background: var(--paper-soft);
    }

    .pool-tab {
      min-width: 132px;
      color: var(--ink-soft);
      background: transparent;
    }

    .pool-tab[aria-selected="true"] { color: var(--white); background: var(--coral); }

    .display-tools {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 12px;
      min-width: 0;
    }

    .display-tabs {
      display: inline-flex;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--paper-soft);
    }

    .display-tab {
      min-height: 36px;
      padding: 7px 12px;
      border-radius: 7px;
      color: var(--ink-soft);
      background: transparent;
      font-size: 12px;
      font-weight: 600;
    }

    .display-tab[aria-selected="true"] {
      color: var(--white);
      background: var(--coral);
    }

    .sort-field {
      display: flex;
      align-items: center;
      gap: 7px;
      color: var(--ink-soft);
      font-size: 12px;
      font-weight: 600;
    }

    .sort-field select {
      width: auto;
      min-height: 36px;
      padding-block: 6px;
      font-size: 12px;
    }

    .finder-label {
      grid-column: 1 / -1;
      margin: 0;
      color: var(--ink-soft);
      font-size: 13px;
      text-align: left;
    }

    .route-guide {
      position: relative;
      display: flex;
      gap: 0;
      padding: 12px 20px;
      border-bottom: 1px solid var(--line);
      background: var(--paper-muted);
    }

    .route-guide::before { display: none; }

    .route-stop {
      position: relative;
      z-index: 1;
      display: flex;
      flex: 1;
      align-items: center;
      justify-content: flex-start;
      gap: 6px;
      min-width: 0;
      text-align: left;
    }

    .route-stop + .route-stop::before {
      margin: 0 10px 0 4px;
      color: var(--line-strong);
      content: "→";
    }

    .route-node {
      display: none;
    }

    .route-stop[data-complete="true"] .route-label,
    .route-stop[data-complete="true"] .route-value { color: var(--coral-dark); }

    .route-label { color: var(--ink); font-size: 12px; font-weight: 600; }
    .route-value {
      max-width: 18ch;
      overflow: hidden;
      color: var(--ink-soft);
      font-size: 11px;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .filters {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
      gap: 10px;
      padding: 12px 16px;
      border-bottom: 1px solid var(--line);
      background: var(--paper-soft);
    }

    .pool-tabs[hidden] { display: none; }
    .finder[data-pool="requests"] .display-tools { grid-column: 1 / -1; margin-top: 0; }

    .filter-field { min-width: 0; }
    .filter-field label { display: block; margin-bottom: 5px; color: var(--ink-soft); font-size: 12px; font-weight: 600; }
    .filter-field[hidden], .organization-level-filter[hidden] { display: none; }
    .organization-level-filter {
      display: grid;
      gap: 7px;
      min-width: 0;
      margin: 0;
      padding: 0;
      border: 0;
    }
    .organization-level-filter legend { color: var(--ink-soft); font-size: 12px; font-weight: 600; }
    .organization-level-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .organization-level-option {
      display: flex;
      min-height: 44px;
      align-items: center;
      gap: 7px;
      padding: 8px 10px;
      border: 1px solid var(--line-strong);
      border-radius: 12px;
      color: var(--ink);
      background: var(--white);
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
    }
    .organization-level-option input { width: 18px; height: 18px; margin: 0; accent-color: var(--coral); }
    .organization-level-help { margin: 0; color: var(--ink-soft); font-size: 11px; line-height: 1.55; }
    .region-cascade {
      display: grid;
      grid-column: 1 / -1;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      min-width: 0;
      margin: 0;
      padding: 0;
      border: 0;
    }
    .region-cascade legend { margin-bottom: 5px; color: var(--ink-soft); font-size: 12px; font-weight: 600; }

    select {
      width: 100%;
      min-height: 44px;
      padding: 9px 34px 9px 11px;
      border: 1px solid var(--line-strong);
      border-radius: 12px;
      color: var(--ink);
      background: var(--white);
    }

    select:disabled { color: var(--ink-muted); background: var(--paper-muted); }

    .reset-wrap { display: flex; align-items: end; }
    #resetFilters { width: 100%; white-space: nowrap; }

    .local-import {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px 18px;
      align-items: center;
      padding: 12px 20px;
      border-bottom: 1px solid var(--line);
      background: var(--paper-muted);
    }

    .local-import strong { display: block; font-size: 13px; }
    .local-import[hidden] { display: none; }
    .local-import span, .import-status { color: var(--ink-soft); font-size: 11px; }
    .local-import input { min-height: 44px; max-width: 270px; font-size: 12px; }
    .local-import input::file-selector-button {
      min-height: 36px;
      margin-right: 10px;
      padding: 7px 11px;
      border: 1px solid var(--line-strong);
      border-radius: 9px;
      color: var(--ink);
      background: var(--white);
      font: inherit;
      font-weight: 600;
      cursor: pointer;
    }
    .import-status { grid-column: 1 / -1; margin: 0; }
    .import-status[data-state="success"] { color: var(--teal); font-weight: 600; }
    .import-status[data-state="error"] { color: var(--danger); font-weight: 600; }
    .local-review { grid-column: 1 / -1; padding: 12px 14px; border: 1px solid #d8b36a; border-radius: 10px; background: #fff8e8; color: var(--ink); font-size: 12px; }
    .local-review[hidden] { display: none; }
    .local-review img { width: 44px; height: 44px; margin-right: 10px; border-radius: 50%; object-fit: cover; vertical-align: middle; }

    .result-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      min-height: 44px;
      padding: 8px 16px;
      border-bottom: 1px solid var(--line);
      background: var(--white);
    }

    .result-line p { margin: 0; font-size: 13px; }
    #resultSummary { font-weight: 600; }
    #selectedFilters { color: var(--ink-soft); text-align: right; }

    .flow-stage {
      position: relative;
      padding: 20px;
      background: linear-gradient(145deg, #edf5ff 0%, #edfafa 100%);
    }

    #cardMount {
      position: relative;
      padding: 14px;
      border-radius: 20px;
      background: transparent;
      box-shadow: none;
    }

    #cardMount::before {
      display: none;
    }

    .profile-card {
      position: relative;
      min-height: 352px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 20px;
      background: var(--white);
      box-shadow: 0 18px 44px -34px rgba(16, 35, 63, 0.42);
    }

    .profile-card::before {
      position: absolute;
      top: 0;
      right: 18px;
      left: 18px;
      height: 1px;
      background: linear-gradient(90deg, var(--coral), #35c7d0 72%, #65e6d4);
      content: "";
    }

    .profile-card.theme-ink::before,
    .profile-card.theme-ocean::before,
    .profile-card.theme-sunset::before { background: linear-gradient(90deg, var(--coral), #35c7d0 72%, #65e6d4); }

    .card-body {
      display: grid;
      grid-template-columns: 96px minmax(0, 1fr);
      gap: 22px;
      padding: 26px 26px 22px;
    }

    .profile-mark {
      display: grid;
      place-items: center;
      align-self: start;
      aspect-ratio: 1;
      border: 0;
      border-radius: 14px;
      color: var(--paper-strong);
      background: var(--coral);
      font-family: var(--sans);
      font-size: 28px;
      font-weight: 700;
      letter-spacing: 0.02em;
    }

    .profile-mark.request { color: var(--ink); background: #65e6d4; }
    .profile-avatar { display: block; width: 96px; align-self: start; aspect-ratio: 1; border-radius: 14px; object-fit: cover; }

    .card-kinds { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 11px; }
    .pill { color: var(--coral-dark); border-color: #b8cdfd; background: var(--coral-soft); }
    .pill--quiet { color: var(--ink-soft); background: var(--paper); }
    .pill--a4b { color: var(--white); border-color: var(--coral); background: var(--coral); }

    .card-title-row {
      display: flex;
      align-items: start;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 12px;
    }

    .card-title-row h2 { margin: 0; font-size: clamp(25px, 3vw, 34px); line-height: 1.08; }
    .region-stamp { flex: 0 0 auto; padding: 6px 9px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink-soft); background: var(--paper-muted); font-size: 12px; font-weight: 600; }
    .summary { max-width: 58ch; margin-bottom: 16px; color: var(--ink-soft); }
    .subject-list { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 17px; }
    .chip { color: var(--ink); border-color: var(--line); background: var(--paper-muted); font-weight: 600; }

    .card-meta {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin: 0;
    }

    .card-meta div { padding-top: 10px; border-top: 1px solid var(--line); }
    .card-meta dt { color: var(--ink-soft); font-size: 11px; font-weight: 600; }
    .card-meta dd { margin: 3px 0 0; font-size: 13px; font-weight: 600; }

    .promotion-note {
      margin: 16px 0 0;
      padding: 9px 11px;
      border: 1px solid var(--mustard);
      color: #614c1d;
      background: var(--mustard-soft);
      font-size: 12px;
      font-weight: 700;
    }

    .flow-wall {
      position: relative;
      min-height: 600px;
      max-height: 660px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: linear-gradient(145deg, #e9f3ff 0%, #e9f8f7 100%);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.64);
    }

    .flow-wall-head {
      position: relative;
      z-index: 2;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      min-height: 54px;
      padding: 10px 14px;
      border-bottom: 1px solid var(--line);
      background: rgba(255, 255, 255, 0.94);
    }

    .flow-wall-head strong { font-size: 14px; }
    .flow-wall-head span { color: var(--ink-soft); font-size: 11px; text-align: right; }

    .flow-lanes {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      height: 606px;
      overflow: hidden;
      padding: 12px;
    }

    .flow-lane { min-width: 0; overflow: hidden; }
    .flow-lane-track { display: flex; flex-direction: column; will-change: transform; }
    .flow-lane-group { display: grid; gap: 12px; padding-bottom: 12px; }

    .flow-card {
      position: relative;
      display: flex;
      min-height: 188px;
      flex-direction: column;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: 16px;
      color: var(--ink);
      background: var(--white);
      box-shadow: 0 12px 28px -26px rgba(16, 35, 63, 0.5);
    }
    .card-body > div, .detail-grid > div { min-width: 0; overflow-wrap: anywhere; }
    .region-stamp { max-width: 100%; overflow-wrap: anywhere; }
    .dialog-body { overflow-wrap: anywhere; }

    .flow-card:focus-within { border-color: var(--coral); }
    .flow-card--promoted {
      min-height: 238px;
      border-color: #c18e45;
      background: #fffaf0;
      box-shadow: 0 12px 28px rgba(189, 145, 65, 0.22);
    }

    .flow-card--promoted .flow-card-mark { background: #725718; }

    .flow-card-ad {
      align-self: flex-start;
      margin-bottom: 10px;
      padding: 3px 7px;
      border: 1px solid #a97931;
      color: #694a17;
      background: var(--mustard-soft);
      font-size: 10px;
      font-weight: 600;
    }

    .flow-card-top { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
    .flow-card-mark {
      display: grid;
      width: 42px;
      height: 42px;
      flex: 0 0 auto;
      place-items: center;
      color: var(--white);
      border-radius: 11px;
      background: var(--coral);
      font-family: var(--sans);
      font-size: 13px;
      font-weight: 700;
    }

    .flow-card-region { color: var(--ink-soft); font-size: 10px; text-align: right; }
    .flow-card h3 { margin: 13px 0 7px; font-size: 19px; line-height: 1.14; }
    .flow-card p { margin-bottom: 12px; color: var(--ink-soft); font-size: 12px; }
    .flow-card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
    .flow-card-meta span {
      padding: 3px 7px;
      border: 1px solid var(--line);
      color: var(--ink-soft);
      background: #f7fbff;
      font-size: 10px;
    }

    .flow-card button {
      align-self: flex-start;
      min-height: 34px;
      margin-top: 12px;
      padding: 6px 10px;
      border: 1px solid var(--ink);
      border-radius: 8px;
      color: var(--ink);
      background: transparent;
      font-size: 11px;
      font-weight: 600;
    }

    .flow-card button:hover { color: var(--white); background: var(--ink); }

    #wallMount[hidden], #cardMount[hidden] { display: none; }

    @media (prefers-reduced-motion: no-preference) {
      .flow-lane-track {
        animation: flow-down var(--flow-duration, 58s) linear infinite;
      }

      .flow-wall[data-paused="true"] .flow-lane-track,
      .flow-wall:hover .flow-lane-track,
      .flow-wall:focus-within .flow-lane-track {
        animation-play-state: paused;
      }
    }

    @keyframes flow-down {
      from { transform: translateY(calc(-50% - 6px)); }
      to { transform: translateY(0); }
    }

    .finder[data-display-mode="wall"] #cardMount,
    .finder[data-display-mode="wall"] #completionNote,
    .finder[data-display-mode="wall"] #cardActions,
    .finder[data-display-mode="wall"] .batch-progress,
    .finder[data-display-mode="wall"] #previousCard,
    .finder[data-display-mode="wall"] #nextCard { display: none; }

    .finder[data-display-mode="wall"] .flow-controls {
      grid-template-columns: minmax(180px, 260px);
      justify-content: end;
    }

    .completion-note {
      margin: 14px 20px 0;
      padding: 13px 14px;
      border: 1px solid var(--teal);
      color: var(--ink);
      background: var(--teal-soft);
      text-align: center;
      font-size: 13px;
      font-weight: 600;
    }

    .empty-state {
      display: grid;
      min-height: 352px;
      place-items: center;
      padding: 34px;
      border: 1px dashed var(--ink-soft);
      background: var(--white);
      text-align: center;
    }

    .empty-state h2 { margin-bottom: 8px; font-size: 30px; }
    .empty-state p { max-width: 38ch; margin-bottom: 18px; color: var(--ink-soft); }
    .empty-state p.empty-next-label { margin: 6px auto 10px; font-size: 13px; }
    .empty-next { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 14px; }
    /* With no public entries at all, card controls have nothing to act on. */
    .finder[data-pool-empty="true"] :is(#cardActions, .discovery-unavailable, #flowControls) { display: none; }
    @media (max-width: 620px) {
      .empty-state { min-height: 0; padding: 28px 18px; }
      .empty-state h2 { font-size: 24px; }
      /* Nothing to filter yet: fold the filter toolbar so the empty state is reachable without a long scroll. */
      .finder[data-pool-empty="true"] :is(.display-tools, #sortDisclosure, .route-guide, .organization-filter-toggle) { display: none; }
    }

    .card-actions {
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 0 20px 12px;
      background: var(--white);
    }

    .favorite-note {
      flex: 1;
      margin: 0 0 0 4px;
      color: var(--ink-soft);
      font-size: 11px;
    }

    .flow-controls {
      display: grid;
      grid-template-columns: auto 1fr auto auto;
      align-items: center;
      gap: 10px;
      padding: 12px 20px 20px;
      background: var(--white);
    }

    .batch-progress { min-width: 0; }
    .batch-progress p { margin: 0 0 6px; color: var(--ink-soft); font-size: 12px; }
    .progress-track { height: 6px; overflow: hidden; background: var(--paper-soft); }
    .progress-bar { width: 100%; height: 100%; background: var(--coral); transform: scaleX(0); transform-origin: left; transition: transform 220ms ease; }

    .below-grid {
      display: grid;
      grid-template-columns: 1.15fr 0.85fr;
      gap: 24px;
      padding-bottom: 28px;
    }

    .principle-card,
    .disclosure-card {
      border: 1px solid var(--line);
      border-radius: 22px;
      background: var(--paper-strong);
    }
    .flow-card-avatar { display: block; width: 42px; height: 42px; border-radius: 10px; object-fit: cover; }

    .principle-card, .disclosure-card { padding: clamp(24px, 4vw, 42px); }
    .principle-card h2, .disclosure-card h2 { margin-bottom: 12px; font-size: clamp(27px, 3.5vw, 42px); line-height: 1.06; }
    .principle-card p, .disclosure-card p { max-width: 56ch; color: var(--ink-soft); }

    .privacy-list {
      display: grid;
      gap: 12px;
      margin: 24px 0 0;
      padding: 0;
      list-style: none;
    }

    .privacy-list li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; align-items: start; }
    .privacy-list strong { display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid #b8cdfd; border-radius: 9px; color: var(--coral-dark); background: #edf3ff; font-family: var(--sans); }
    .privacy-list span { color: var(--ink-soft); font-size: 14px; }

    .ad-sample { margin-top: 25px; border: 1px solid var(--mustard); background: var(--mustard-soft); }
    .ad-label { padding: 8px 12px; color: var(--white); background: #725718; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; }
    .ad-content { padding: 18px; }
    .ad-content h3 { margin-bottom: 7px; font-size: 23px; }
    .ad-content p { margin: 0; color: #5d4a20; font-size: 13px; }

    .comparison-workbench {
      margin: 28px auto 64px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: 24px;
      background: linear-gradient(155deg, #ffffff 0%, #f8fbff 52%, #eef9ff 100%);
    }

    .favorite-bench { padding: clamp(24px, 4vw, 42px); }
    .favorite-bench-head { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 18px; }
    .favorite-bench-copy h2 { margin-bottom: 8px; font-size: clamp(28px, 3.5vw, 44px); line-height: 1.04; }
    .favorite-bench-copy p { max-width: 58ch; margin: 0; color: var(--ink-soft); }
    .favorite-bench-controls { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; }
    .favorite-count {
      min-width: 92px;
      padding: 10px 14px;
      border: 1px solid #bfd2f4;
      border-radius: 999px;
      color: var(--coral-dark);
      background: #edf4ff;
      text-align: center;
      font-size: 13px;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
    }

    .favorite-orbit {
      --orbit-edge: clamp(310px, 50vw, 700px);
      --orbit-near: clamp(180px, 28vw, 390px);
      position: relative;
      isolation: isolate;
      height: 310px;
      overflow: hidden;
      border-radius: 20px;
      background:
        radial-gradient(ellipse 44% 34% at 50% 76%, rgba(101, 230, 212, 0.22), transparent 72%),
        radial-gradient(ellipse 70% 68% at 50% 48%, rgba(36, 92, 245, 0.10), transparent 76%),
        #f7fbff;
      perspective: 1200px;
      perspective-origin: 50% 42%;
    }

    .favorite-orbit::before,
    .favorite-orbit::after {
      position: absolute;
      z-index: 4;
      top: -24%;
      bottom: -24%;
      width: 18%;
      border-radius: 50%;
      background: #f7fbff;
      content: "";
      pointer-events: none;
      transition: opacity 180ms ease;
    }

    .favorite-orbit::before { left: -13%; box-shadow: 20px 0 54px rgba(36, 92, 245, 0.08); }
    .favorite-orbit::after { right: -13%; box-shadow: -20px 0 54px rgba(36, 92, 245, 0.08); }

    .favorite-orbit-track {
      position: relative;
      height: 100%;
      transform-style: preserve-3d;
    }

    .favorite-orbit-item {
      position: absolute;
      top: 50%;
      left: 50%;
      width: clamp(238px, 27vw, 326px);
      height: 196px;
      opacity: 0;
      transform-style: preserve-3d;
      will-change: transform, opacity, clip-path;
    }

    .favorite-orbit-card {
      scroll-margin: 8px;
      display: grid;
      grid-template-rows: auto auto 1fr auto;
      gap: 8px;
      width: 100%;
      height: 100%;
      padding: 18px;
      overflow: hidden;
      border: 1px solid #cbd9e9;
      border-radius: 18px;
      color: var(--ink);
      background: rgba(255, 255, 255, 0.97);
      text-align: left;
      cursor: pointer;
    }

    .favorite-orbit-card:hover { border-color: var(--coral); }
    .favorite-orbit-card[aria-pressed="true"] { border-color: var(--coral); box-shadow: inset 0 0 0 2px rgba(36, 92, 245, 0.18); }
    .favorite-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .favorite-card-kind { color: var(--coral-dark); font-size: 11px; font-weight: 600; }
    .favorite-card-disclosure { display: inline-block; max-width: 190px; padding: 4px 7px; overflow: hidden; border-radius: 999px; color: #725718; background: var(--mustard-soft); font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
    .favorite-orbit-card strong { overflow: hidden; font-size: 21px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
    .favorite-card-summary {
      display: -webkit-box;
      overflow: hidden;
      color: var(--ink-soft);
      font-size: 13px;
      line-height: 1.45;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }
    .favorite-card-meta { display: flex; flex-wrap: wrap; gap: 6px; color: var(--ink-soft); font-size: 11px; }
    .favorite-card-meta span { padding: 4px 7px; border-radius: 7px; background: var(--paper-soft); }
    .favorite-card-avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
    .detail-avatar { display: block; width: 88px; height: 88px; margin: 0 0 16px; border-radius: 14px; object-fit: cover; }

    .favorite-orbit[data-layout="orbit"] .favorite-orbit-item {
      animation: favorite-card-orbit var(--favorite-duration) linear infinite;
      animation-delay: var(--favorite-delay);
    }

    .favorite-orbit[data-layout="orbit"]:hover .favorite-orbit-item,
    .favorite-orbit[data-layout="orbit"]:focus-within .favorite-orbit-item,
    .favorite-orbit[data-paused="true"] .favorite-orbit-item { animation-play-state: paused; }

    .favorite-orbit[data-layout="static"] { overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; }
    .favorite-orbit[data-layout="static"]::before, .favorite-orbit[data-layout="static"]::after { opacity: 0; }
    .favorite-orbit[data-layout="static"] .favorite-orbit-track {
      display: flex;
      width: max-content;
      min-width: 100%;
      align-items: center;
      justify-content: center;
      gap: 14px;
      padding: 24px;
    }
    .favorite-orbit[data-layout="static"] .favorite-orbit-item {
      position: relative;
      top: auto;
      left: auto;
      flex: 0 0 clamp(238px, 27vw, 326px);
      opacity: 1;
      transform: none;
      clip-path: none;
      scroll-snap-align: center;
      will-change: auto;
    }

    .favorite-orbit:has(.favorite-orbit-card:focus-visible) {
      overflow-x: auto;
      overscroll-behavior-inline: contain;
      scroll-snap-type: none;
    }
    .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible)::before,
    .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible)::after { opacity: 0; }
    .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible) .favorite-orbit-track {
      display: flex;
      width: max-content;
      min-width: 100%;
      align-items: center;
      gap: 14px;
      padding: 24px;
    }
    .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible) .favorite-orbit-item {
      position: relative;
      top: auto;
      left: auto;
      flex: 0 0 clamp(238px, 27vw, 326px);
      opacity: 1;
      transform: none;
      clip-path: none;
      animation: none;
      scroll-snap-align: center;
      will-change: auto;
    }

    @keyframes favorite-card-orbit {
      0% {
        opacity: 0;
        transform: translate3d(calc(-50% + var(--orbit-edge)), -30%, -150px) scale(0.56) rotateY(-66deg);
        clip-path: inset(16% 29% 16% 29% round 50%);
      }
      14% {
        opacity: 0.22;
        transform: translate3d(calc(-50% + var(--orbit-edge)), -34%, -120px) scale(0.64) rotateY(-54deg);
        clip-path: inset(12% 24% 12% 24% round 50%);
      }
      32% {
        opacity: 0.68;
        transform: translate3d(calc(-50% + var(--orbit-near)), -45%, -55px) scale(0.84) rotateY(-26deg);
        clip-path: inset(5% 10% 5% 10% round 46% 18px 18px 46%);
      }
      50% {
        opacity: 1;
        transform: translate3d(-50%, -56%, 70px) scale(1);
        clip-path: inset(0 round 18px);
      }
      68% {
        opacity: 0.62;
        transform: translate3d(calc(-50% - var(--orbit-near)), -45%, -55px) scale(0.84) rotateY(26deg);
        clip-path: inset(5% 10% 5% 10% round 18px 46% 46% 18px);
      }
      86% {
        opacity: 0.18;
        transform: translate3d(calc(-50% - var(--orbit-edge)), -34%, -120px) scale(0.64) rotateY(54deg);
        clip-path: inset(12% 24% 12% 24% round 50%);
      }
      100% {
        opacity: 0;
        transform: translate3d(calc(-50% - var(--orbit-edge)), -30%, -150px) scale(0.56) rotateY(66deg);
        clip-path: inset(16% 29% 16% 29% round 50%);
      }
    }

    .favorite-rail-empty {
      position: absolute;
      inset: 0;
      display: grid;
      padding: 24px;
      place-items: center;
      color: var(--ink-soft);
      text-align: center;
    }
    .favorite-rail-empty strong { display: block; margin-bottom: 7px; color: var(--ink); font-size: 22px; }
    .favorite-rail-empty span { display: block; max-width: 40ch; font-size: 13px; }

    .match-mirror {
      padding: clamp(26px, 4vw, 46px);
      border-top: 1px solid var(--line);
      background: rgba(255, 255, 255, 0.76);
    }
    .match-mirror-empty { display: grid; min-height: 250px; place-items: center; text-align: center; }
    .match-mirror-empty h3 { max-width: 16ch; margin: 0 auto 12px; font-size: clamp(32px, 5vw, 58px); line-height: 0.98; letter-spacing: -0.015em; }
    .match-mirror-empty p { max-width: 48ch; margin: 0 auto; color: var(--ink-soft); }
    .match-mirror-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
    .match-mirror-head h3 { margin: 4px 0 0; font-size: clamp(26px, 3vw, 38px); line-height: 1.05; }
    .match-mirror-head h3 + .favorite-card-disclosure { margin-top: 9px; }
    .match-mirror-head p { max-width: 42ch; margin: 0; color: var(--ink-soft); font-size: 13px; }
    .match-mirror-label { color: var(--coral-dark); font-size: 12px; font-weight: 600; }
    .match-grid { border-top: 1px solid var(--line); }
    .match-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      gap: 18px;
      align-items: center;
      padding: 16px 0;
      border-bottom: 1px solid var(--line);
    }
    .match-side { min-width: 0; }
    .match-side span { display: block; margin-bottom: 3px; color: var(--ink-soft); font-size: 11px; font-weight: 600; }
    .match-side strong { display: block; overflow-wrap: anywhere; font-size: 15px; }
    .match-target { text-align: right; }
    .match-verdict { min-width: 72px; padding: 6px 9px; border-radius: 999px; text-align: center; font-size: 11px; font-weight: 600; }
    .match-verdict[data-state="match"] { color: var(--teal); background: var(--teal-soft); }
    .match-verdict[data-state="check"] { color: #725718; background: var(--mustard-soft); }
    .match-verdict[data-state="unset"] { color: var(--ink-soft); background: var(--paper-soft); }
    .match-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 22px; }
    .comparison-footnote { margin: 18px 0 0; color: var(--ink-soft); font-size: 11px; text-align: center; }

    .site-footer {
      display: flex;
      justify-content: space-between;
      gap: 24px;
      padding: 26px max(20px, calc((100vw - 1280px) / 2));
      border-top: 1px solid var(--line);
      color: var(--ink-soft);
      background: rgba(255, 255, 255, 0.72);
      font-size: 12px;
    }

    dialog {
      width: min(620px, calc(100% - 32px));
      max-height: min(82dvh, 760px);
      overflow: auto;
      padding: 0;
      border: 1px solid var(--line-strong);
      border-radius: 20px;
      color: var(--ink);
      background: var(--paper-strong);
      box-shadow: var(--shadow);
    }

    dialog::backdrop { background: rgba(16, 35, 63, 0.68); }
    .dialog-head { display: flex; align-items: start; justify-content: space-between; gap: 18px; padding: 22px 24px 14px; border-bottom: 1px solid var(--line); }
    .dialog-head h2 { margin: 0; font-size: 30px; }
    .dialog-close { min-width: 44px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); background: var(--white); font-weight: 600; }
    .dialog-body { padding: 22px 24px 26px; }
    .dialog-body > p { color: var(--ink-soft); }
    .dialog-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
    .role-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 20px; }
    .role-button { min-height: 122px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: var(--white); text-align: left; }
    .role-button:hover { border-color: var(--teal); background: var(--teal-soft); }
    .role-button strong { display: block; margin-bottom: 6px; font-family: var(--serif); font-size: 22px; }
    .role-button span { color: var(--ink-soft); font-size: 13px; }
    .local-proof { margin: 18px 0 0; padding: 12px 14px; border: 1px solid var(--teal); background: var(--teal-soft); font-size: 13px; font-weight: 600; }
    .detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; }
    .detail-grid div { padding: 12px; border: 1px solid var(--line); background: var(--white); }
    .detail-grid dt { color: var(--ink-soft); font-size: 11px; font-weight: 600; }
    .detail-grid dd { margin: 4px 0 0; font-weight: 600; }
    .contract-line { padding: 11px 13px; border: 1px solid var(--coral); color: var(--danger); background: #fae3dc; font-size: 12px; }
    .contract-line code { font-weight: 600; }

    .toast {
      position: fixed;
      z-index: 80;
      right: 20px;
      bottom: 20px;
      max-width: min(380px, calc(100% - 40px));
      padding: 12px 16px;
      border: 1px solid var(--ink);
      color: var(--white);
      background: var(--ink);
      box-shadow: var(--shadow);
      opacity: 0;
      transform: translateY(12px);
      pointer-events: none;
      transition: opacity 160ms ease, transform 160ms ease;
    }

    .toast.is-visible { opacity: 1; transform: translateY(0); }

    @media (min-width: 1081px) {
      .filters { grid-template-columns: repeat(7, minmax(0, 1fr)); }
      .region-cascade { grid-column: span 3; }
      .local-import { grid-template-columns: minmax(260px, 0.85fr) minmax(270px, 1fr) auto; padding-block: 9px; }
      .local-import > div { grid-column: 1; grid-row: 1; }
      .local-import input { grid-column: 3; grid-row: 1; }
      .local-import .import-status { grid-column: 2; grid-row: 1; align-self: center; }
    }

    @media (max-width: 1080px) {
      .catalog-card, .tool-grid .catalog-card { grid-column: span 6; }
      .hero { grid-template-columns: 1fr; }
      .hero-copy { position: static; display: grid; grid-template-columns: 1fr auto; gap: 0 28px; align-items: end; padding: 18px 0 0; border-top: 4px solid var(--coral); border-left: 0; }
      .hero-copy h1, .hero-copy > p { grid-column: 1; }
      .hero-copy .primary-button { grid-column: 2; grid-row: 1 / span 2; align-self: end; }
      .hero-facts { grid-column: 1 / -1; }
      h1 { max-width: 13ch; }
      .finder-top { grid-template-columns: auto 1fr; }
      .finder-label { grid-column: 1 / -1; text-align: left; }
    }

    @media (max-width: 820px) {
      .shell { width: min(100% - 24px, 720px); }
      .site-header { flex-wrap: wrap; gap: 0 12px; padding: 10px 14px 0; }
      .primary-navigation { order: 3; flex-basis: 100%; }
      .primary-tabs { gap: 0; }
      .view-tab { flex: 1; min-width: 0; padding-inline: 4px; }
      .view-tab::after { right: 8px; left: 8px; }
      .navigation-note { display: none; }
      .hero { padding-top: 28px; }
      .hero-copy { display: block; }
      .hero-copy .primary-button { margin-top: 0; }
      .filters { grid-template-columns: 1fr 1fr; }
      .region-cascade { grid-template-columns: 1fr 1fr; }
      .region-cascade .filter-field:last-child { grid-column: 1 / -1; }
      .reset-wrap { grid-column: 1 / -1; }
      .below-grid { grid-template-columns: 1fr; }
      .favorite-bench-head, .match-mirror-head { align-items: start; flex-direction: column; }
      .view-intro { grid-template-columns: 1fr; }
      .creator-callout { grid-template-columns: 1fr; }
      .creator-callout-actions { text-align: left; }
      .flow-lanes {
        grid-template-columns: repeat(3, minmax(260px, 1fr));
        overflow-x: auto;
        scroll-snap-type: x proximity;
      }
      .flow-lane { scroll-snap-align: start; }
    }

    @media (max-width: 620px) {
      .boundary-strip { padding-inline: 14px; }
      .site-boundary { padding-inline: 14px; text-align: left; }
      .brand { font-size: 23px; }
      .header-link { padding-inline: 6px; font-size: 13px; }
      .login { margin-left: 2px; padding-inline: 16px; font-size: 13px; }
      .view-tab { font-size: 13px; }
      .site-boundary .toast {
        position: static;
        max-width: none;
        max-height: 0;
        margin: 0 12px;
        overflow: hidden;
        padding-block: 0;
        border-width: 0;
        text-align: center;
        transform: none;
        transition: opacity 160ms ease;
      }
      .site-boundary .toast.is-visible {
        max-height: 84px;
        margin-bottom: 10px;
        padding: 10px 12px;
        border-width: 1px;
      }
      h1 { margin-bottom: 16px; font-size: 34px; letter-spacing: -0.015em; }
      .hero-copy > p { font-size: 15px; }
      .hero-facts { display: none; }
      .hero-facts dd { font-size: 10px; }
      .finder { margin-inline: 0; border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
      .finder-top { display: block; padding: 14px 16px; }
      .pool-tabs { width: 100%; }
      .pool-tab { min-width: 0; }
      .display-tools { display: grid; grid-template-columns: 1fr; gap: 9px; margin-top: 10px; }
      .display-tabs { width: 100%; }
      .display-tab { flex: 1; }
      .sort-field { justify-content: space-between; }
      .sort-field select { flex: 1; }
      .display-tab,
      .sort-field select,
      .flow-card button { min-height: 44px; }
      .finder-label { margin-top: 9px; text-align: left; }
      .route-guide { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; padding: 10px 16px; }
      .route-guide::before { display: none; }
      .route-stop { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 6px; justify-items: start; padding: 7px 0; text-align: left; }
      .route-stop + .route-stop::before { display: none; }
      .route-value { max-width: 100%; }
      .filters { gap: 9px; padding: 14px 16px; }
      .region-cascade { grid-template-columns: 1fr; }
      .region-cascade .filter-field:last-child { grid-column: auto; }
      .local-import { grid-template-columns: 1fr; padding-inline: 16px; }
      .local-import input { width: 100%; min-width: 0; max-width: 100%; }
      .import-status { grid-column: 1; }
      .result-line { display: block; padding-inline: 16px; }
      #selectedFilters { margin-top: 2px; text-align: left; }
      .flow-stage { padding: 16px; }
      #cardMount { padding: 10px; }
      .profile-card { min-height: 0; }
      .card-body { grid-template-columns: 56px minmax(0, 1fr); gap: 14px; padding: 18px 16px; }
      .card-body > div:last-child { min-width: 0; }
      .profile-mark { font-size: 19px; }
      .profile-avatar { width: 56px; }
      .card-title-row { display: block; }
      .region-stamp { display: inline-block; margin-top: 8px; }
      .card-meta { grid-template-columns: 1fr; }
      .card-meta div { display: grid; grid-template-columns: 76px 1fr; gap: 10px; }
      .card-meta dd { margin-top: 0; }
      .card-actions { display: grid; grid-template-columns: 1fr 1fr; padding-inline: 16px; }
      .card-actions .primary-button { grid-column: 1 / -1; }
      .favorite-note { grid-column: 1 / -1; margin: 0; }
      .flow-controls { grid-template-columns: 1fr 1fr; padding-inline: 16px; }
      .batch-progress { grid-column: 1 / -1; grid-row: 1; }
      #toggleAutoplay { grid-column: 1 / -1; }
      .finder[data-display-mode="wall"] .flow-controls { grid-template-columns: 1fr; }
      .flow-wall { min-height: 540px; max-height: 540px; }
      .flow-lanes {
        grid-template-columns: none;
        grid-auto-columns: minmax(250px, 82vw);
        grid-auto-flow: column;
        height: 486px;
        overscroll-behavior-inline: contain;
      }
      .flow-wall-head { align-items: start; flex-direction: column; gap: 2px; }
      .flow-wall-head span { text-align: left; }
      .comparison-workbench { margin-bottom: 42px; border-radius: 20px; }
      .favorite-bench, .match-mirror { padding: 22px 16px; }
      .favorite-bench-head { gap: 16px; }
      .favorite-bench-controls { width: 100%; flex-wrap: wrap; justify-content: space-between; }
      .favorite-orbit {
        --orbit-edge: 78vw;
        --orbit-near: 30vw;
        height: 276px;
        border-radius: 16px;
      }
      .favorite-orbit-item { width: min(72vw, 282px); height: 190px; }
      .favorite-orbit[data-layout="static"] .favorite-orbit-track,
      .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible) .favorite-orbit-track { justify-content: start; padding-inline: 18px; }
      .favorite-orbit[data-layout="static"] .favorite-orbit-item,
      .favorite-orbit[data-layout="orbit"]:has(.favorite-orbit-card:focus-visible) .favorite-orbit-item { flex-basis: min(72vw, 282px); }
      .match-mirror-empty { min-height: 220px; }
      .match-mirror-head { gap: 10px; }
      .match-row { grid-template-columns: 1fr 1fr; gap: 10px 14px; }
      .match-verdict { grid-column: 1 / -1; grid-row: 1; justify-self: start; }
      .match-source { grid-column: 1; grid-row: 2; }
      .match-target { grid-column: 2; grid-row: 2; }
      .match-actions { display: grid; grid-template-columns: 1fr; }
      .match-actions button { width: 100%; }
      .role-choice, .detail-grid { grid-template-columns: 1fr; }
      .catalog-shell { padding-top: 36px; }
      .catalog-grid { display: block; }
      .catalog-card { min-height: 0; margin-bottom: 14px; padding: 20px; }
      .catalog-card-footer { align-items: stretch; flex-direction: column; }
      .catalog-card-footer button { width: 100%; }
      .site-footer { display: block; }
      .site-footer p:last-child { margin-bottom: 0; }
    }

    /* B1 v0.7.0-rc.1: truthful loading states and the independent organization pool. */
    .page-loader {
      position: fixed;
      inset: 118px 0 0;
      z-index: 40;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(246, 249, 253, 0.96);
    }
    .page-loader[hidden] { display: none; }
    .page-loader-card {
      width: min(440px, 100%);
      padding: 30px;
      border: 1px solid var(--line);
      background: var(--paper-strong);
      box-shadow: var(--shadow);
      text-align: center;
    }
    .page-loader-mark {
      width: 46px;
      height: 46px;
      margin: 0 auto 18px;
      border: 7px solid var(--paper-soft);
      border-top-color: var(--coral);
      border-right-color: var(--teal);
      border-radius: 50%;
    }
    .page-loader h2 { margin: 0 0 8px; font-size: 24px; }
    .page-loader p { margin: 0; color: var(--ink-soft); }
    .page-loader .secondary-button { margin-top: 20px; }

    .loading-spinner {
      display: inline-block;
      width: 18px;
      height: 18px;
      flex: 0 0 18px;
      border: 2px solid rgba(255, 255, 255, 0.52);
      border-top-color: currentColor;
      border-radius: 50%;
      vertical-align: -4px;
    }
    .read-local-card { min-width: 164px; }
    .read-local-card .loading-spinner { margin-right: 8px; }
    .visually-hidden-file {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      min-height: 1px !important;
      margin: -1px !important;
      padding: 0 !important;
      overflow: hidden !important;
      clip: rect(0 0 0 0) !important;
      white-space: nowrap !important;
      border: 0 !important;
    }
    .import-skeleton {
      position: relative;
      min-height: 146px;
      overflow: hidden;
      display: grid;
      grid-template-columns: 72px 1fr;
      gap: 16px;
      padding: 18px;
      border: 1px solid var(--line);
      background: var(--paper-strong);
    }
    .skeleton-block { border-radius: 8px; background: var(--paper-soft); }
    .skeleton-avatar { width: 72px; height: 72px; }
    .skeleton-lines { display: grid; align-content: start; gap: 10px; }
    .skeleton-line { height: 14px; }
    .skeleton-line:nth-child(1) { width: 38%; }
    .skeleton-line:nth-child(2) { width: 84%; }
    .skeleton-line:nth-child(3) { width: 64%; }
    .skeleton-shimmer {
      position: absolute;
      inset: 0;
      transform: translateX(-110%);
      background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.72) 48%, transparent 100%);
      will-change: transform;
      pointer-events: none;
    }
    .import-result-card { padding: 16px 18px; border: 1px solid var(--line); background: var(--paper-strong); }
    .import-result-card strong { display: block; margin-bottom: 6px; }
    .import-result-card[data-state="success"] { border-color: #9bdcd2; background: var(--teal-soft); }
    .import-result-card[data-state="error"] { border-color: #e4a5a0; background: #fff5f4; }

    .batch-progress[role="progressbar"] { outline: none; }
    .circular-progress { display: none; width: 56px; height: 56px; position: relative; }
    .circular-progress svg { width: 56px; height: 56px; transform: rotate(-90deg); }
    .circular-progress circle { fill: none; stroke-width: 5; }
    .circular-progress .circle-track { stroke: var(--paper-soft); }
    .circular-progress .circle-value { stroke: var(--coral); stroke-linecap: round; }
    .circular-progress-label {
      position: absolute;
      inset: 0;
      display: grid;
      place-items: center;
      color: var(--ink);
      font-size: 11px;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
    }

    .organization-filter-toggle { display: none; }
    .finder[data-pool="organizations"] {
      display: grid;
      grid-template-columns: 260px minmax(0, 1fr);
      align-items: start;
    }
    .finder[data-pool="organizations"] .finder-top,
    .finder[data-pool="organizations"] .route-guide { grid-column: 1 / -1; }
    .finder[data-pool="organizations"] .filters {
      grid-column: 1;
      grid-row: 3 / span 4;
      display: grid;
      grid-template-columns: 1fr;
      align-content: start;
      border-right: 1px solid var(--line);
      border-bottom: 0;
    }
    .finder[data-pool="organizations"] .filters > * { grid-column: 1; }
    .finder[data-pool="organizations"] .organization-level-options { grid-template-columns: 1fr; }
    .finder[data-pool="organizations"] .region-cascade { grid-template-columns: 1fr; }
    .finder[data-pool="organizations"] .local-import { display: none; }
    .finder[data-pool="organizations"] .result-line { grid-column: 2; grid-row: 3; }
    .finder[data-pool="organizations"] .flow-stage { grid-column: 2; grid-row: 4; }
    .finder[data-pool="organizations"] .card-actions { grid-column: 2; grid-row: 5; }
    .finder[data-pool="organizations"] .flow-controls { grid-column: 2; grid-row: 6; }
    .profile-mark.organization { color: var(--ink); background: var(--teal-soft); border-color: #9bdcd2; }
    .organization-status {
      margin: 14px 0 0;
      padding: 12px 14px;
      border: 1px solid #9bdcd2;
      background: var(--teal-soft);
      color: var(--mint-ink, var(--teal));
      font-size: 12px;
      line-height: 1.7;
    }
    .organization-detail-section { margin-top: 18px; }
    .organization-detail-section h4 { margin: 0 0 8px; font-size: 14px; }
    .organization-detail-section p { margin: 0; color: var(--ink-soft); }

    @media (max-width: 620px) {
      .page-loader { inset: 104px 0 0; padding: 16px; }
      .page-loader-card { padding: 24px 18px; }
      .progress-track { display: none; }
      .flow-controls .batch-progress { grid-column: 1 / 3; }
      .flow-controls .circular-progress { display: block; grid-column: 3; justify-self: end; }
      .finder[data-pool="organizations"] { display: block; }
      .finder[data-pool="organizations"] .organization-filter-toggle { display: inline-flex; margin: 12px 16px; }
      .finder[data-pool="organizations"][data-org-filters-open="false"] .filters { display: none; }
      .finder[data-pool="organizations"] .filters { border-right: 0; border-bottom: 1px solid var(--line); }
      .finder[data-pool="organizations"] .organization-level-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .import-skeleton { grid-template-columns: 56px 1fr; }
      .skeleton-avatar { width: 56px; height: 56px; }
    }

    @media (max-width: 390px) {
      .card-body { grid-template-columns: minmax(0, 1fr); }
      .profile-mark { width: 56px; }
      .filters { grid-template-columns: minmax(0, 1fr); }
      .demand-page-controls button { width: 100%; }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
      }

      .flow-wall { max-height: none; }
      .flow-lanes { height: auto; max-height: 640px; overflow: auto; align-items: start; }
      .flow-lane-track { transform: none !important; will-change: auto; }
      .flow-lane-group[aria-hidden="true"] { display: none; }
      .favorite-orbit {
        height: auto;
        min-height: 250px;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x proximity;
      }
      .favorite-orbit::before, .favorite-orbit::after { display: none; }
      .favorite-orbit-track {
        display: flex;
        width: max-content;
        min-width: 100%;
        min-height: 250px;
        align-items: center;
        gap: 14px;
        padding: 24px;
      }
      .favorite-orbit-item,
      .favorite-orbit[data-layout="orbit"] .favorite-orbit-item {
        position: relative;
        top: auto;
        left: auto;
        flex: 0 0 clamp(238px, 72vw, 326px);
        opacity: 1;
        transform: none;
        clip-path: none;
        animation: none;
        scroll-snap-align: center;
        will-change: auto;
      }
      .loading-spinner { transform: none !important; }
      .skeleton-shimmer { display: none; }
    }

    /* Approved discovery workspace only; experience/tools are not reskinned. */
    body[data-surface="discovery"] { background: #fcfdff; color: #071b49; }
    body[data-surface="discovery"] [hidden] { display: none !important; }
    body[data-surface="discovery"] .shell { width: min(1400px, calc(100% - 80px)); }
    body[data-surface="discovery"] .site-header { position: relative; background: #fff; backdrop-filter: none; }
    body[data-surface="discovery"] #directoryStatus { background: #eff4fc; color: #334968; font-size: 12px; }
    body[data-surface="discovery"] .hero { display: block; padding-top: 36px; }
    body[data-surface="discovery"] .hero-copy { position: static; top: auto; display: grid; grid-template-columns: 1fr auto; gap: 12px 28px; margin-bottom: 34px; padding: 0; }
    body[data-surface="discovery"] .hero-copy h1 { max-width: none; font-size: clamp(26px, 3vw, 36px); letter-spacing: -.03em; grid-column: 1; margin: 0; }
    body[data-surface="discovery"] .hero-copy p { max-width: 75ch; font-size: 14px; margin: 0; grid-column: 1; }
    body[data-surface="discovery"] #openPublish { grid-column: 2; grid-row: 1 / 3; align-self: center; }
    body[data-surface="discovery"] .finder { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 0 40px; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
    body[data-surface="discovery"] .finder > * { min-width: 0; grid-column: 2; }
    body[data-surface="discovery"] .finder-top { grid-row: 1; padding: 0 0 18px; background: transparent; }
    body[data-surface="discovery"] .finder .filters { grid-column: 1; grid-row: 1 / span 9; display: flex; flex-direction: column; gap: 18px; align-self: start; padding: 0 26px 0 0; border: 0; border-right: 1px solid #e1e9f3; background: transparent; }
    /* The organization desktop layout keeps the filter rail below the shared header. */
    body[data-surface="discovery"] .finder[data-pool="organizations"] .filters { grid-row: 3 / span 4; }
    .filter-completion { width: 100%; padding-top: 24px; border-top: 1px solid #e1e9f3; text-align: center; }
    .filter-completion h2 { margin: 0 0 16px; color: #071b49; font-size: 16px; }
    .filter-completion-ring { width: 160px; max-width: 100%; aspect-ratio: 1; position: relative; margin-inline: auto; }
    .filter-completion-ring svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
    .filter-completion-ring circle { fill: none; stroke-width: 9; }
    .filter-completion-track { stroke: #e4ecfa; }
    .filter-completion-value { stroke: #2458f5; stroke-linecap: round; }
    .filter-completion-number { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 4px; font-variant-numeric: tabular-nums; }
    .filter-completion-number strong { font-size: 32px; line-height: 1.2; color: #071b49; }
    .filter-completion-number span, .filter-completion > p { color: #52658a; font-size: 12px; }
    .filter-completion-items { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 8px; padding: 0; margin: 20px 0 12px; list-style: none; text-align: left; }
    .filter-completion-items li { color: #52658a; font-size: 12px; display: flex; align-items: center; gap: 6px; }
    .filter-completion-items li::before { content: ""; width: 8px; height: 8px; flex: 0 0 auto; border: 1px solid #8195b8; border-radius: 50%; }
    .filter-completion-items li[data-selected="true"] { color: #1645bf; font-weight: 600; }
    .filter-completion-items li[data-selected="true"]::before { border-color: #2458f5; background: #2458f5; }
    .filter-completion > p { margin: 0; }
    body[data-surface="discovery"] .region-cascade { display: grid; grid-template-columns: 1fr; gap: 18px; padding: 0; border: 0; }
    body[data-surface="discovery"] .region-cascade legend { margin-bottom: 12px; font-size: 14px; }
    body[data-surface="discovery"] .filter-field label { font-size: 14px; color: #334968; }
    body[data-surface="discovery"] .filters select,
    body[data-surface="discovery"] .sort-field select { width: 100%; min-height: 44px; padding: 9px; border: 1px solid #c8d5e6; border-radius: 8px; background: #fff; color: #334968; }
    body[data-surface="discovery"] .organization-level-options { grid-template-columns: 1fr; }
    body[data-surface="discovery"] .route-guide { grid-row: 2; background: transparent; padding: 14px 0; }
    body[data-surface="discovery"] .result-line { grid-row: 3; padding: 14px 0; }
    body[data-surface="discovery"] .flow-stage { grid-row: 4; padding: 24px 0 0; background: transparent; }
    body[data-surface="discovery"] #cardMount { padding: 22px 0 0; border-radius: 0; }
    body[data-surface="discovery"] #cardMount:has(.profile-card)::before { display: block; position: absolute; content: ""; inset: 7px 18px 22px; border-radius: 14px; background: #e5edfc; transform: translateY(var(--stack-y, 0px)) rotate(-2deg); opacity: var(--stack-opacity, 1); }
    body[data-surface="discovery"] #cardMount > [data-outgoing-card] { position: absolute; top: 22px; left: 0; width: 100%; pointer-events: none; z-index: 1; }
    body[data-surface="discovery"] .profile-card { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); min-height: 397px; border: 0; border-radius: 14px; background: #eef5ff; box-shadow: 0 18px 36px -28px #164bdb66; }
    body[data-surface="discovery"] .profile-card::before { display: none; }
    body[data-surface="discovery"] .profile-card::after { content: "个性贴纸\A暂未开放"; white-space: pre-line; display: grid; place-content: center; padding: 24px; background: #e4f3ff; color: #1250d9; font-size: clamp(22px, 2.5vw, 38px); font-weight: 700; line-height: 1.5; }
    body[data-surface="discovery"] .card-body { display: block; padding: 28px; min-width: 0; }
    body[data-surface="discovery"] .profile-mark,
    body[data-surface="discovery"] .profile-avatar { width: 44px; height: 44px; margin-bottom: 18px; border-radius: 50%; font-size: 14px; }
    body[data-surface="discovery"] .card-title-row { display: block; }
    body[data-surface="discovery"] .card-title-row h2 { font-size: 27px; overflow-wrap: anywhere; }
    body[data-surface="discovery"] .summary { font-size: 16px; overflow-wrap: anywhere; }
    body[data-surface="discovery"] .card-meta { grid-template-columns: 1fr; gap: 9px; }
    body[data-surface="discovery"] .card-meta div { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 7px; }
    body[data-surface="discovery"] .card-meta dt,
    body[data-surface="discovery"] .card-meta dd { font-size: 14px; margin: 0; }
    body[data-surface="discovery"] .card-actions { grid-row: 5; flex-wrap: wrap; padding-inline: 0; background: transparent; }
    body[data-surface="discovery"] .flow-controls { grid-row: 6; padding-inline: 0; }
    body[data-surface="discovery"] .demand-page-controls { grid-row: 7; }
    body[data-surface="discovery"] .discovery-unavailable { grid-row: 8; color: #52658a; font-size: 14px; border-top: 1px solid #e4ecf7; padding-top: 16px; }
    body[data-surface="discovery"] .local-import { grid-row: 9; margin-top: 20px; border: 1px solid #e4ecf7; border-radius: 12px; background: #fff; }
    body[data-surface="discovery"] .resume-invite { grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 28px; }
    .resume-invite-copy h2 { margin: 0 0 10px; font-size: 22px; line-height: 1.4; }
    .resume-invite-copy p { max-width: 65ch; font-size: 14px; line-height: 1.8; color: #52658a; }
    .resume-invite .resume-invite-note { margin-bottom: 0; font-size: 13px; }
    .resume-steps { display: flex; flex-wrap: wrap; gap: 8px 28px; padding-left: 20px; margin-block: 18px; font-size: 14px; }
    .resume-invite > a { justify-self: end; white-space: nowrap; }
    @media (max-width: 760px) {
      body[data-surface="discovery"] .resume-invite { grid-template-columns: minmax(0, 1fr); padding: 24px 18px; gap: 16px; }
      .resume-invite > a { justify-self: stretch; text-align: center; }
    }
    body[data-surface="discovery"] .organization-filter-toggle { display: none; }
    body[data-surface="discovery"] .flow-lanes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    body[data-surface="discovery"] .comparison-workbench { margin-top: 40px; }
    .favorite-session { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 14px 20px; border-bottom: 1px solid var(--line); }
    .favorite-session p { flex: 1 1 280px; color: #334968; margin: 0; font-size: 14px; }
    .favorite-session a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
    .favorite-unavailable { position: relative; padding: 20px; flex: 0 0 250px; background: #f0f4fa; border-radius: 12px; }
    .favorite-orbit:has(.favorite-unavailable) .favorite-orbit-track { display: flex; flex-wrap: wrap; gap: 16px; height: auto; padding: 20px; }
    .favorite-orbit:has(.favorite-unavailable) .favorite-orbit-item { position: static; animation: none; transform: none; opacity: 1; flex: 0 1 300px; }
    @media (max-width: 900px) {
      body[data-surface="discovery"] .shell { width: calc(100% - 40px); }
      body[data-surface="discovery"] .finder { grid-template-columns: 190px minmax(0, 1fr); gap: 0 24px; }
      body[data-surface="discovery"] .profile-card { grid-template-columns: 1fr; }
      body[data-surface="discovery"] .profile-card::after { min-height: 150px; font-size: 26px; }
      body[data-surface="discovery"] .hero-copy { display: block; }
      body[data-surface="discovery"] .hero-copy p { margin: 12px 0; }
    }
    @media (max-width: 700px) {
      body[data-surface="discovery"] .hero { padding-top: 25px; }
      body[data-surface="discovery"] .finder { display: flex; flex-direction: column; gap: 12px; }
      body[data-surface="discovery"] .finder-top { order: 0; display: flex; flex-wrap: wrap; gap: 14px; }
      body[data-surface="discovery"] .route-guide { order: 1; width: 100%; }
      body[data-surface="discovery"] .organization-filter-toggle { display: block; order: 2; }
      body[data-surface="discovery"] .finder .filters { display: none; order: 3; width: 100%; padding: 16px; border: 1px solid #e1e9f3; border-radius: 12px; }
      body[data-surface="discovery"] .result-line { order: 4; }
      body[data-surface="discovery"] .flow-stage { order: 5; width: 100%; }
      body[data-surface="discovery"] .card-actions { order: 6; }
      body[data-surface="discovery"] .flow-controls { order: 7; display: flex; flex-wrap: wrap; gap: 12px; }
      body[data-surface="discovery"] .demand-page-controls { order: 8; }
      body[data-surface="discovery"] .discovery-unavailable { order: 9; }
      body[data-surface="discovery"] .local-import { order: 10; }
      body[data-surface="discovery"] .finder select { font-size: 16px; }
      body[data-surface="discovery"] .flow-lanes {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-auto-columns: auto;
        grid-auto-flow: row;
        overflow-x: hidden;
      }
      body[data-surface="discovery"] .card-body { padding: 22px; }
      body[data-surface="discovery"] .display-tools { flex-wrap: wrap; }
      body[data-surface="discovery"] .card-title-row h2 { font-size: 24px; }
      body[data-surface="discovery"] .below-grid { grid-template-columns: 1fr; }
    }

    #discoveryFilterDialog { width: 100%; max-width: none; max-height: 92dvh; margin: auto 0 0; border-radius: 20px 20px 0 0; }
    #discoveryFilterDialog[open] { display: flex; flex-direction: column; overflow: hidden; }
    #discoveryFilterDialog .dialog-head { flex: none; padding: 20px; }
    #discoveryFilterDialog .dialog-head h2 { font-size: 24px; }
    #discoveryFilterDialog .dialog-body { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 20px; }
    #discoveryFilterDialog .filters { display: flex; flex-direction: column; gap: 18px; padding: 0; border: 0; background: transparent; }
    #discoveryFilterDialog select { font-size: 16px; }
    #discoveryFilterDialog .filter-sheet-actions { flex: none; padding: 16px 20px max(16px, env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
    #discoveryFilterDialog .primary-button { width: 100%; }
/* Approved experience categories and tool shelf; deliberately isolated from discovery. */
:is(#experiencesView, #toolsView, .editorial-dialog) { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; color: #173250; }
:is(#experiencesView, #toolsView) { background: #fff; min-height: 65vh; }
:is(#experiencesView, #toolsView, .editorial-dialog) [hidden] { display: none !important; }
:is(#experiencesView, #toolsView) .editorial-shell { max-width: 1380px; padding: 40px 36px 52px; }
:is(#experiencesView, #toolsView, .editorial-dialog) :is(h1,h2,h3) { font-family: inherit; letter-spacing: -.025em; text-wrap: balance; }
.editorial-heading { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-bottom: 24px; }
.editorial-heading h1 { margin: 0; font-size: 46px; line-height: 1.25; }
.editorial-heading p { margin: 14px 0 0; max-width: 65ch; color: #526079; }
.editorial-search { display: flex; flex-direction: column; gap: 5px; width: 330px; flex-shrink: 0; font-size: 14px; color: #526079; }
.editorial-search input { width: 100%; min-height: 48px; border: 1px solid #d6dcec; border-radius: 12px; background: #f5f5fb; color: #28243c; padding: 11px 15px; font: inherit; font-size: 16px; caret-color: #44328a; }
.editorial-search input::placeholder { color: #626579; }
.editorial-notice, .editorial-count { font-size: 14px; color: #526079; line-height: 1.8; }
.editorial-count { margin: 12px 0 20px; font-variant-numeric: tabular-nums; }
.editorial-button { min-height: 44px; min-width: 44px; padding: 10px 16px; background: #f4f6fc; border: 1px solid #cbd5e6; border-radius: 9px; color: #30476a; font: inherit; font-size: 14px; cursor: pointer; }
.editorial-button:hover:not(:disabled) { background: #e9edf8; }
.editorial-button:disabled { opacity: .6; cursor: default; }
:is(#experiencesView, #toolsView, .editorial-dialog) :is(button,a,input):focus-visible { outline: 3px solid #5653cb; outline-offset: 5px; }
:is(#experiencesView, #toolsView, .editorial-dialog) ::selection { background: #dedbff; color: #28243c; }
#experienceBack { margin-bottom: 18px; }
#experienceHeading:focus { outline: none; }
#experienceMount { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.experience-category { --art: #6660da; --art-ink: #403178; display: block; padding: 24px; border-radius: 30px; color: #30215f; background: #efeeff; text-decoration: none; transition: transform .2s; }
.experience-category:hover { transform: translateY(-4px); }
.experience-category h2 { font-size: 24px; margin: 22px 0 9px; }
.experience-category p { margin: 0 0 12px; font-size: 16px; color: #514177; line-height: 1.7; }
.experience-category small { color: #514177; font-size: 14px; }
.experience-art { height: 210px; border-radius: 12px; position: relative; overflow: hidden; display: grid; place-items: center; background: var(--art); }
.experience-art::before { content: ""; position: absolute; inset: -70px; background: repeating-radial-gradient(circle at center, transparent 0 32px, #ffffff40 33px 64px); }
.experience-art > span { width: 150px; height: 150px; display: grid; place-items: center; border-radius: 50%; background: white; z-index: 1; }
.experience-art svg { width: 64px; height: 64px; stroke: var(--art-ink); stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.experience-language { --art: #cf79bd; --art-ink: #78225e; }
.experience-language .experience-art::before { background: repeating-linear-gradient(-20deg, transparent 0 48px, #ffffff40 49px 94px); }
.experience-career { --art: #80c898; --art-ink: #305d40; }
.experience-career .experience-art::before { background: linear-gradient(90deg,#346c4930 2px,transparent 2px), linear-gradient(#346c4930 2px,transparent 2px); background-size: 36px 36px; }
.experience-reading { --art: #efa657; --art-ink: #88553a; }
.experience-reading .experience-art::before { background: repeating-linear-gradient(0deg,transparent 0 25px,#ffffff40 26px 45px); transform: rotate(-15deg); }
.experience-time { --art: #9daeed; --art-ink: #2e408c; }
.experience-time .experience-art::before { background: radial-gradient(#344cba 2px,transparent 3px); background-size: 20px 20px; }
.experience-review { --art: #d9857f; --art-ink: #7d302b; }
.experience-review .experience-art::before { background: repeating-linear-gradient(90deg,transparent 0 45px,#ffffff40 46px 90px); }
#experiencesView.experience-listing .editorial-heading { flex-direction: column; text-align: center; gap: 24px; }
#experiencesView.experience-listing h1 { font-size: 54px; }
#experiencesView.experience-listing :is(.editorial-notice,.editorial-count) { text-align: center; }
#experiencesView.experience-listing #experienceMount { display: block; columns: 4; column-gap: 25px; }
.experience-story { display: inline-flex; flex-direction: column; justify-content: space-between; width: 100%; min-height: 400px; break-inside: avoid; margin-bottom: 25px; padding: 28px; border-radius: 22px; background: #f2f6fc; color: #365d96; }
.experience-story:nth-child(4n+2), .experience-story:nth-child(4n+3) { background: #fff; border: 1px solid #e1e6ee; }
.experience-story:nth-child(8n+1) { min-height: 450px; }
.experience-story:nth-child(8n+2) { min-height: 290px; }
.experience-story:nth-child(8n+3) { min-height: 320px; }
.experience-story:nth-child(8n+4) { min-height: 420px; }
.experience-story:nth-child(8n+5) { min-height: 390px; }
.experience-story:nth-child(8n+6) { min-height: 350px; }
.experience-story:nth-child(8n+7) { min-height: 440px; }
.experience-story:nth-child(8n) { min-height: 300px; }
.experience-story h2 { font-size: 27px; line-height: 1.45; font-weight: 500; margin: 28px 0 16px; }
.experience-story p { line-height: 1.8; margin: 0 0 14px; }
.experience-byline, .experience-story footer { font-size: 14px; color: #52657d; }
.editorial-empty { text-align: center; padding: 64px 20px; color: #526079; }
.editorial-empty h2 { font-size: 24px; color: #173250; }
#experiencesView .creator-callout { margin-top: 36px; background: #f7f7fc; border-color: #e1e6ee; }
#experiencesView .creator-callout h3 { font-size: 24px; color: #173250; }
#experiencesView .creator-callout :is(p, .split-note) { color: #526079; }
#experienceDialog { width: min(830px, calc(100% - 30px)); max-height: calc(100dvh - 40px); border: 0; background: #fff; }
#experienceDialog .dialog-head { padding: 30px 40px 18px; }
#experienceDialog .dialog-close { flex: 0 0 auto; white-space: nowrap; }
#experienceDialog .dialog-head h2 { line-height: 1.4; font-size: 32px; }
#experienceDialog .dialog-body { padding: 16px 40px 36px; font-size: 16px; line-height: 1.9; }
.editorial-dialog .detail-grid { grid-template-columns: 1fr; }
.editorial-dialog .detail-grid div { border: 0; padding: 8px 0; background: transparent; }
.editorial-dialog .detail-grid dt { font-size: 14px; }
.editorial-dialog .local-proof { background: #f1f5fa; border: 0; color: #36516d; font-size: 14px; font-weight: 400; }
.editorial-feedback { margin-top: 30px; border-top: 1px solid #e1e6ee; padding-top: 22px; }
#toolsView { background: #f6f9ff; }
#toolsView h1 { font-size: 34px; }
.editorial-categories { display: flex; gap: 8px; flex-wrap: wrap; margin: 20px 0; }
.editorial-categories [aria-pressed="true"] { color: #fff; background: #183e6a; border-color: #183e6a; }
.tool-shelf-room { padding: 0 28px; background: radial-gradient(ellipse at 50% 48%,#fff 10%,#eef4fb 75%); }
#toolMount { display: grid; grid-template-columns: repeat(20,minmax(0,1fr)); gap: 28px 0; position: relative; padding: 34px 0 12px; scrollbar-color: #7e96b0 #edf4fc; }
.shelf-tool { grid-column: span 4; min-width: 0; text-align: center; position: relative; }
.shelf-tool:nth-child(-n+4) { grid-column: span 5; }
.shelf-tool::after { content: ""; position: absolute; top: 200px; height: 11px; background: #d7e2ef; box-shadow: 0 9px 12px -5px #17325038; inset-inline: -1px; pointer-events: none; }
.tool-book-button { display: block; position: relative; z-index: 1; margin: 0 auto; width: 154px; height: 196px; padding: 0; border: 0; background: none; color: #173250; cursor: pointer; perspective: 900px; }
.tool-book { display: block; width: 100%; height: 100%; transform: rotateY(-9deg) rotateZ(-1deg); transform-origin: 50% 100%; transition: transform .2s; box-shadow: 8px 10px 17px -6px #17325050; }
.tool-book-button:hover .tool-book { transform: translateY(-6px) rotateY(-5deg); }
.tool-book-button.tool-source-hidden { visibility: hidden; }
.tool-cover { position: relative; height: 100%; padding: 15px 12px; overflow: hidden; background: #ecf2f6; display: flex; flex-direction: column; justify-content: space-between; text-align: left; color: #173250; }
.tool-cover::after { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: #17325012; }
.tool-cover-1 { background: #eef1ed; }
.tool-cover-2 { background: #f4eee7; }
.tool-cover svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.tool-cover > :not(svg) { z-index: 1; position: relative; }
.tool-cover strong { font-size: 24px; line-height: 1.35; margin-top: -25px; max-width: 6em; font-weight: 500; }
.tool-cover-brand, .tool-cover-note { font-size: 10px; color: #465d78; }
.tool-caption { padding: 22px 8px 4px; }
.tool-caption h2 { font-size: 16px; margin: 0 0 4px; }
.tool-caption p { font-size: 14px; margin: 3px 0; color: #526079; }
.tool-browse-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 22px; }
.tool-browse-controls .editorial-count { margin: 0 auto 0 0; }
.tool-pagination { display: flex; gap: 14px; align-items: center; font-variant-numeric: tabular-nums; }
.tool-scroll-controls { display: none; }
#toolDialog { width: min(1280px,calc(100% - 36px)); max-height: calc(100dvh - 30px); background: #eef4fbef; border: 0; padding: 4px; box-shadow: none; }
#toolDialog::backdrop { background: rgba(232,241,251,.32); backdrop-filter: blur(.6px); }
#toolDialog .dialog-head { border: 0; padding: 12px 16px 0; align-items: center; }
#toolDialog .dialog-head h2 { font-size: 18px; margin: 0; }
#toolDialog .dialog-body { padding: 12px 20px 30px; }
.tool-detail-layout { display: grid; grid-template-columns: .8fr 1fr 1.22fr; gap: 28px; align-items: center; }
.tool-tagline h3 { font-size: 34px; line-height: 1.35; margin: 0 0 18px; }
.tool-tagline p { font-size: 16px; line-height: 1.9; }
.tool-tagline small { font-size: 14px; color: #526079; }
.tool-detail-visual { display: grid; justify-items: center; gap: 24px; perspective: 1000px; padding: 30px 0; }
.tool-hero { width: 225px; height: 300px; }
.tool-model { width: 225px; height: 300px; position: relative; transform-style: preserve-3d; transition: transform .65s cubic-bezier(.76,0,.24,1); }
.tool-model.flipped { transform: rotateY(180deg); }
body.content-motion-paused :is(#experiencesView, #toolsView, .editorial-dialog) * { transition: none !important; }
.tool-face { position: absolute; inset: 0; backface-visibility: hidden; box-shadow: 14px 18px 30px -14px #17325070; }
.tool-model .tool-cover { padding: 24px 20px; }
.tool-model .tool-cover strong { font-size: 32px; }
.tool-back { transform: rotateY(180deg); background: #e7eef6; padding: 22px; font-size: 16px; text-align: left; }
.tool-back h3 { font-size: 24px; line-height: 1.4; }
.tool-back :is(p,small) { font-size: 14px; line-height: 1.7; }
.tool-detail-copy { background: rgba(255,255,255,.88); padding: 24px; border-radius: 15px; box-shadow: 0 18px 48px -22px #21365140; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
.tool-detail-copy h3 { font-size: 18px; margin: 20px 0 10px; }
.tool-detail-copy h3:first-child { margin-top: 0; }
.tool-detail-copy .preview-list { padding-inline-start: 22px; }
@media (max-width: 1050px) {
  #experiencesView.experience-listing #experienceMount { columns: 3; }
  .experience-art { height: 170px; }
  .experience-art > span { width: 125px; height: 125px; }
  .tool-detail-layout { grid-template-columns: 1fr 1fr; }
  .tool-tagline { grid-column: 1 / -1; }
}
@media (max-width: 700px) {
  :is(#experiencesView, #toolsView) .editorial-shell { padding: 28px 20px 38px; }
  .editorial-heading { display: block; }
  .editorial-heading h1 { font-size: 36px; }
  .editorial-search { width: 100%; margin-top: 22px; }
  #toolsView > .editorial-shell > a.editorial-button[href="/author"] { display: inline-block; max-width: 100%; margin-block: 8px; }
  #experienceMount { grid-template-columns: 1fr; gap: 22px; }
  .experience-art { height: 210px; }
  .experience-art > span { width: 150px; height: 150px; }
  #experiencesView.experience-listing #experienceMount { columns: 1; }
  #experiencesView.experience-listing h1 { font-size: 40px; }
  .experience-listing .experience-story:nth-child(n) { min-height: 260px; }
  #experienceDialog :is(.dialog-head,.dialog-body) { padding-inline: 22px; }
  #experienceDialog .dialog-head h2 { font-size: 26px; }
  .tool-shelf-room { padding: 0; margin-inline: -20px; }
  #toolMount { display: flex; gap: 28px; overflow-x: auto; padding: 32px 60px 16px; scroll-snap-type: x proximity; scroll-padding-inline: 60px; }
  #toolMount:focus-within { scroll-snap-type: none; }
  .shelf-tool { flex: 0 0 224px; scroll-snap-align: center; }
  .shelf-tool::after { top: 284px; }
  .tool-book-button { width: 215px; height: 280px; }
  .tool-cover { padding: 23px 19px; }
  .tool-cover strong { font-size: 30px; }
  .tool-cover-brand,.tool-cover-note { font-size: 12px; }
  .tool-scroll-controls { display: flex; gap: 12px; }
  .tool-pagination { width: 100%; justify-content: space-between; }
  .tool-detail-layout { grid-template-columns: 1fr; gap: 4px; }
  .tool-tagline h3 { font-size: 29px; }
  .tool-hero, .tool-model { width: 195px; height: 270px; }
  .tool-model .tool-cover strong { font-size: 29px; }
  .tool-detail-copy { padding: 22px; }
  #toolDialog { width: calc(100% - 22px); background: rgba(255,255,255,.94); }
  #toolDialog .dialog-body { padding-inline: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(#experiencesView, #toolsView, .editorial-dialog) * { transition: none !important; scroll-behavior: auto !important; }
}

.content-derived-image { display:block; max-width:100%; height:auto; object-fit:contain; }
.tool-cover-image, .tool-model .tool-cover-image { padding:0; }
.tool-cover-image .content-derived-image { width:100%; height:100%; object-fit:contain; background:#fff; }
