/* Layout adapters only: all shared visual values live in design-system.css. */
.ds-public :is(.header-inner,.footer-inner) { min-height: 64px; }
.ds-public .site-header { border-bottom-color: var(--ui-border); background: var(--ui-background); }
.ds-public .site-footer { border-top-color: var(--ui-border); background: var(--ui-background); }
.ds-public .brand { color: var(--ui-foreground); font-size: 15px; letter-spacing: -.02em; }
.ds-public :is(.hero-subtitle,.home-subtitle) { color: var(--ui-muted-foreground); letter-spacing: -.02em; }
.ds-public :is(.hero-description,.project-url,.projects p,.stat-card dd,.skill-group h3,.cta-copy p) { color: var(--ui-muted-foreground); }
.ds-public .hero { grid-template-columns: minmax(0,1.1fr) minmax(510px,1fr); gap: 48px; padding-block: 64px 48px; }
.ds-public h1 { font-size: clamp(36px,4.4vw,60px); line-height: 1.1; }
.ds-public .hero-description { font-size: 16px; line-height: 1.6; }
.ds-public .stats { gap: 12px; }
.ds-public .stat-card { min-height: 168px; padding: 24px; }
.ds-public .stat-card > svg { stroke: var(--ui-muted-foreground); width: 20px; height: 20px; }
.ds-public .stat-card dt { font-size: 24px; line-height: 1.25; white-space: normal; }
.ds-public .stat-card-wide dt { font-size: 16px; line-height: 1.4; letter-spacing: -.02em; }
.ds-public .stat-card dd { font-size: 12px; line-height: 1.4; }
.ds-public .section { padding-block: 28px; }
.ds-public h2 { font-size: 20px; line-height: 1.4; }
.ds-public .specializations li { padding: 20px; border-color: var(--ui-border); border-radius: var(--ui-radius-xl); color: var(--ui-foreground); background: var(--ui-card); box-shadow: var(--ui-shadow-sm); font-weight: 500; }
.ds-public .specializations li:hover { background: var(--ui-muted); border-color: var(--ui-border); }
.ds-public .specializations svg { stroke: var(--ui-muted-foreground); width: 20px; height: 20px; }
.ds-public .skills-panel { gap: 24px 32px; padding: 24px; }
.ds-public .skill-group span { min-height: 26px; padding: 3px 8px; border-color: var(--ui-border); border-radius: var(--ui-radius-sm); color: var(--ui-secondary-foreground); background: var(--ui-secondary); font-size: 12px; }
.ds-public .projects { border-radius: var(--ui-radius-xl); }
.ds-public .projects li { min-height: 60px; padding: 16px 20px; color: var(--ui-muted-foreground); font-size: 13px; }
.ds-public .projects li:hover { background: var(--ui-muted); }
.ds-public :is(.project-name,.project-number,.projects time) { color: var(--ui-foreground); }
.ds-public .cta-section { border-color: var(--ui-border); border-radius: var(--ui-radius-xl); background: var(--ui-muted); }
.ds-public :is(.cta-icon,.nav-icon) { border-color: var(--ui-border); border-radius: var(--ui-radius-lg); color: var(--ui-foreground); }
.ds-public .cta-icon svg { stroke: var(--ui-foreground); }
.ds-public .home-card { padding: 40px; }
.ds-public .home-card h1 { font-size: clamp(40px,5vw,64px); line-height: 1.1; }
.ds-public .home-subtitle { font-size: 22px; }
.ds-public .nav-card:hover { background: var(--ui-muted); border-color: var(--ui-border); }
.ds-public .error-code { color: var(--ui-foreground); }
.ds-public :is(.illustration-browser,.illustration-search,.illustration-square,.illustration-path,.illustration-dash) { stroke: var(--ui-border); }
.ds-public :is(.illustration-dot,.illustration-pixels) { fill: var(--ui-border); }
@media(max-width:1180px) { .ds-public .hero { grid-template-columns: 1fr; gap: 32px; } .ds-public .stats { max-width: 720px; } }
@media(max-width:800px) { .ds-public .hero { padding-block: 40px 28px; } .ds-public .projects li { background: var(--ui-card); } }
@media(max-width:520px) {
  .ds-public .hero { padding-top: 32px; } .ds-public h1 { font-size: 36px; }
  .ds-public .stats { max-width: none; } .ds-public .stat-card { min-height: 136px; padding: 20px; }
  .ds-public .stat-card-wide { min-height: 120px; } .ds-public .specializations li { padding: 16px; }
  .ds-public .skills-panel { padding: 20px; } .ds-public .home-card { padding: 28px 24px; }
  .ds-public .home-card h1 { font-size: 40px; } .ds-public .home-subtitle { font-size: 20px; }
}

/* Fishing: preserve field-guide hierarchy and sticky offsets, remove the separate palette. */
.ds-guide {
  --guide-bg: var(--ui-background); --guide-surface: var(--ui-card); --guide-ink: var(--ui-foreground);
  --guide-muted: var(--ui-muted-foreground); --guide-line: var(--ui-border);
  --guide-blue: var(--ui-primary); --guide-green: var(--ui-primary);
  --guide-blue-soft: var(--ui-muted); --guide-green-soft: var(--ui-muted);
  --guide-amber: var(--ui-foreground); --guide-amber-soft: var(--ui-muted);
  --guide-danger: var(--ui-destructive); --guide-danger-soft: var(--ui-muted);
  --header-height: 64px; --nav-height: 52px;
}
.ds-guide .guide-nav { background: var(--ui-background); }
.ds-guide .guide-nav a { min-height: 40px; border-radius: var(--ui-radius-md); color: var(--ui-muted-foreground); font-weight: 500; }
.ds-guide .guide-nav a:hover { background: var(--ui-muted); border-color: transparent; }
.ds-guide .guide-nav a[aria-current=true] { background: var(--ui-primary); color: var(--ui-primary-foreground); }
.ds-guide .hero h1 { font-size: clamp(36px,6vw,60px); line-height: 1.1; }
.ds-guide :is(.section-heading h2,.final-card h2) { font-size: clamp(28px,5vw,36px); line-height: 1.2; }
.ds-guide :is(.section-card,.no-bite) { border-radius: var(--ui-radius-xl); box-shadow: var(--ui-shadow-sm); background: var(--ui-card); border-color: var(--ui-border); }
.ds-guide :is(.water-card,.structure-grid article,.species-grid article,.rule-grid article,.retrieve-list article) { border-radius: var(--ui-radius-lg); border-color: var(--ui-border); background: var(--ui-card); }
.ds-guide :is(.fact,.sequence,.retrieve-steps,.split-notes div,.species-pattern,.priority-line,.river-context,.map-example) { border-color: var(--ui-border); background: var(--ui-muted); border-radius: var(--ui-radius-lg); }
.ds-guide .water-card-main { background: var(--ui-card); border-color: var(--ui-primary); }
.ds-guide :is(.section-kicker,.water-priority,.map-example span,.troubleshooting span,.priority-line,.sequence i,.retrieve-steps i,.priority-line span) { color: var(--ui-muted-foreground); }
.ds-guide :is(.section-block > p,.section-card > p,.river-context p,.structure-grid p,.species-grid p,.rule-grid p) { color: var(--ui-muted-foreground); }
.ds-guide :is(.badge-blue,.badge-green,.badge-amber) { border-color: var(--ui-border); color: var(--ui-secondary-foreground); background: var(--ui-secondary); }
.ds-guide :is(.callout-primary,.callout-neutral,.callout-warning) { color: var(--ui-foreground); background: var(--ui-card); border-color: var(--ui-border); border-radius: var(--ui-radius-lg); }
.ds-guide .callout-warning { border-left: 3px solid var(--ui-destructive); }
.ds-guide .callout-warning > svg { color: var(--ui-destructive); }
.ds-guide .no-bite { border-left: 3px solid var(--ui-primary); }
.ds-guide :is(.troubleshooting,.troubleshooting li) { border-color: var(--ui-border); }
.ds-guide .trouble-success strong { color: var(--ui-foreground); }
.ds-guide :is(.principle,.lesson,.rules-result,.final-card,.current-border) { color: var(--ui-primary-foreground); background: var(--ui-primary); border-radius: var(--ui-radius-xl); }
.ds-guide :is(.principle span,.principle p,.lesson p,.rules-result p,.current-border p,.final-card .section-kicker,.summary-grid span,.summary-grid p,.timer-leave .timer-unit,.timer-leave p) { color: var(--ui-primary-foreground); }
.ds-guide :is(.principle strong,.lesson strong,.rules-result strong,.final-card h2) { color: var(--ui-primary-foreground); }
.ds-guide .final-card .button { color: var(--ui-primary); background: var(--ui-primary-foreground); border-color: transparent; }
.ds-guide .final-card .button:hover { background: var(--ui-secondary); }
.ds-guide .spot-timer li::before,.ds-guide .day-timeline::before { background: var(--ui-border); }
.ds-guide .timer-leave::before { background: var(--ui-ring); }
.ds-guide .day-timeline li::before { box-shadow: 0 0 0 1px var(--ui-ring); }
.ds-guide .desktop-toc a { color: var(--ui-muted-foreground); font-size: 13px; }
.ds-guide .desktop-toc a:is(:hover,[aria-current=true]) { color: var(--ui-foreground); background: var(--ui-muted); }
.ds-guide .footer-top:hover { background: var(--ui-muted); }
.ds-guide :is(.water-card,.species-grid article,.rules-section,.rule-grid article,.limits,.subheading,.final-card) { scroll-margin-top: calc(var(--header-height) + var(--nav-height) + 20px); }

/* Access forms use the same card/input/button system; auth logic is not touched. */
body.ds-auth { min-height: 100dvh; background: var(--ui-muted); background-image: none; }
.ds-auth .card { padding: 32px; }
.ds-auth .top { margin-bottom: 28px; }
.ds-auth .site { font: 600 14px/1.4 var(--ui-font-sans); letter-spacing: -.02em; }
.ds-auth h1 { font-size: 30px; line-height: 1.2; }
.ds-auth .project { border-color: var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-muted); }
.ds-auth :is(.prepared,p,.project small) { color: var(--ui-muted-foreground); }
.ds-auth .client-brand { border-color: var(--ui-border); color: var(--ui-foreground); }
.ds-auth .client-brand strong { font-family: var(--ui-font-sans); }
.ds-auth .field input { height: 48px; font: 500 20px/1 var(--ui-font-mono); }
.ds-auth .button { width: 100%; min-height: 44px; }
.ds-auth .error { color: var(--ui-destructive); }
@media(max-width:520px) { .ds-auth .card { padding: 24px; } .ds-auth h1 { font-size: 26px; } }

/* One reusable chrome for both vanilla and React client reports, including versions. */
.ds-client {
  --ds-client-header-height: 104px;
  --site-header-height: var(--ds-client-header-height);
  --sticky-header-height: var(--ds-client-header-height);
  --project-sticky-header-height: var(--ds-client-header-height);
}
body.ds-client { padding-top: var(--ds-client-header-height); }
.ds-chrome-ready :is(.project-header,.site-header-shell,.ds-legacy-header):not(.ds-client-header),
.ds-chrome-ready .layout > .sidebar:not(.ds-project-sidebar),
.ds-chrome-ready :is(.breadcrumbs,.crumbs):not(.ds-breadcrumbs) { display: none; }
.ds-client-header { position: fixed; inset: 0 0 auto; height: auto; z-index: 65; color: var(--ui-foreground); background: var(--ui-background); border-bottom: 1px solid var(--ui-border); backdrop-filter: none; }
.ds-client-header .ds-header-inner { width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: 28px; display: flex; align-items: center; gap: 20px; }
.ds-client-header .ds-site-row { height: 56px; }
.ds-site-brand { color: var(--ui-foreground); font-size: 15px; font-weight: 600; letter-spacing: -.02em; text-decoration: none; }
.ds-header-note { color: var(--ui-muted-foreground); font-size: 13px; }
.ds-client-header .ds-project-row { min-height: 48px; border-top: 1px solid var(--ui-border); }
.ds-project-row .ds-header-inner { min-height: 48px; gap: 12px; }
.ds-project-name { margin-right: auto; font-size: 14px; font-weight: 500; }
body.ds-client .ds-version-select { min-height: 36px; max-width: 160px; padding-block: 5px; font-size: 13px; }
.ds-client-header .ds-header-actions { display: flex; gap: 8px; }
.ds-client-header .ds-header-actions .button { min-height: 36px; padding: 7px 12px; font-size: 13px; }
.ds-client .layout { grid-template-columns: 235px minmax(0,1fr); gap: 48px; max-width: 1440px; padding: 28px; }
.ds-client .layout > main { grid-column: 2; max-width: 1080px; width: 100%; min-width: 0; }
.ds-client .ds-project-sidebar { position: sticky; top: calc(var(--ds-client-header-height) + 24px); left: auto; height: auto; max-height: calc(100dvh - var(--ds-client-header-height) - 48px); padding: 0; overflow-y: auto; }
.ds-toc-label { margin: 0 10px 12px; color: var(--ui-muted-foreground); font-size: 12px; font-weight: 500; }
.ds-project-toc { display: flex; flex-direction: column; gap: 2px; }
.ds-project-toc a { display: block; padding: 8px 10px; border-radius: var(--ui-radius-sm); color: var(--ui-muted-foreground); font-size: 14px; line-height: 1.4; text-decoration: none; }
.ds-project-toc a:hover,.ds-project-toc a[aria-current=location] { color: var(--ui-foreground); background: var(--ui-muted); }
.ds-project-toc a[aria-current=location] { font-weight: 500; }
.ds-client .ds-breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 4px 0 28px; padding: 0; color: var(--ui-muted-foreground); font-size: 14px; line-height: 1.5; }
.ds-breadcrumbs a { color: var(--ui-muted-foreground); text-decoration: none; }
.ds-breadcrumbs a:hover { color: var(--ui-foreground); }
.ds-breadcrumbs [aria-current=page] { color: var(--ui-foreground); }
.ds-breadcrumbs .ds-crumb-separator { width: 14px; height: 14px; flex: none; color: var(--ui-muted-foreground); }
.ds-client :is(section[id],main [id]) { scroll-margin-top: calc(var(--ds-client-header-height) + 24px); }
html:has(body.ds-client) { scroll-padding-top: 0; }
.ds-client .hero,.ds-client .tz-hero { padding: 20px 0 48px; }
.ds-client :is(.hero h1,.tz-hero h1) { max-width: 900px; font-size: clamp(36px,4.5vw,60px); line-height: 1.1; }
.ds-client :is(.section-head h2,h2) { font-size: clamp(28px,3vw,36px); line-height: 1.2; }
.ds-client :is(.lead,.lead-sm) { color: var(--ui-muted-foreground); font-size: 18px; line-height: 1.6; }
.ds-client :is(.callout,.note,.info-callout,.designer-note,.chip-panel) { border-color: var(--ui-border); border-radius: var(--ui-radius-lg); color: var(--ui-foreground); background: var(--ui-muted); }
.ds-client :is(.keyword-panel,.intent-panel) i { color: var(--ui-secondary-foreground); background: var(--ui-background); border-radius: var(--ui-radius-sm); }
.ds-client :is(.metrics,.tree,.prototype,.needed) { border-color: var(--ui-border); border-radius: var(--ui-radius-xl); }
.ds-client :is(.metrics b,.metrics strong) { font-weight: 600; }
.ds-client :is(.flow article,.route-grid article,.insights article,.waves article,.delivery-cta,.client-task,.revision-item) { border-color: var(--ui-border); border-radius: var(--ui-radius-xl); background: var(--ui-card); box-shadow: var(--ui-shadow-sm); }
.ds-client .featured { background: var(--ui-card); }
.ds-client .card-grid,.ds-client .file-grid,.ds-client .quick-grid { gap: 16px; }
.ds-client :is(.card,.file-card) { display: flex; flex-direction: column; }
.ds-client :is(.card,.file-card) > :is(.actions,.button,.text-link) { margin-top: auto; }
.ds-client footer { border-color: var(--ui-border); }
.ds-sheet { position: fixed; inset: 0; z-index: 180; padding: 0; background: rgb(0 0 0 / .5); }
.ds-sheet[hidden] { display: none; }
.ds-sheet-panel { margin-left: auto; width: min(400px,100%); height: 100dvh; overflow-y: auto; padding: 24px; background: var(--ui-background); box-shadow: -8px 0 24px rgb(0 0 0 / .1); }
.ds-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.ds-sheet-head strong { font-weight: 600; font-size: 16px; }
.ds-sheet .ds-project-toc a { min-height: 44px; padding: 12px; }
.ds-sheet-close { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-md); color: var(--ui-foreground); background: var(--ui-background); cursor: pointer; font-size: 24px; }
@media(max-width:960px) { .ds-client .layout { display: block; } .ds-client .ds-project-sidebar { display: none; } }
@media(max-width:900px) { .ds-client .metrics > :last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media(max-width:700px) {
  .ds-client { --ds-client-header-height: 144px; }
  .ds-client-header .ds-header-inner { padding-inline: 16px; }
  .ds-client-header .ds-project-row .ds-header-inner { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px 12px; padding-block: 8px; }
  .ds-project-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .ds-client-header .ds-header-actions { grid-column: 1 / -1; }
  .ds-client-header .ds-header-actions .button { flex: 1; min-height: 40px; }
  .ds-client .layout { padding: 24px 16px; }
  .ds-client .card-grid,.ds-client .file-grid,.ds-client .quick-grid { grid-template-columns: 1fr; }
  .ds-client .ds-breadcrumbs { margin-bottom: 24px; font-size: 13px; }
  .ds-client .hero h1 { font-size: 36px; }
  .ds-header-note { display: none; }
}