/* Public shells — mist/forest brand continuity and readability (spec docs/tasks/2026-10-26_shells-brand-continuity.md; the
   audit row for these pages in production-adoption/authorized-frontend-outcome-audit.md; founder register :130, slice 2).
   Consumers: exactly the eleven documents that carry body.public-shell with one of body.public-shell-methodology, -privacy,
   -login, -templates, -404 (methodology, privacy and templates in en, zh, zh-hk; login; 404). Every selector starts with one of
   those body scopes; no global selector and no !important. Colours come only from the public-tool aliases in tokens.css (slice 1's
   aliases of the home palette; the shells are their second consumer). Semantic colours (risk borders, the privacy contact panel's
   red-tinted border, the methodology veto stage's risk border), focus rings, selection, input focus and the CV document preview
   (cv-application-layout.css) are not touched (tests/public_tool_surfaces.roles.json, roles RETAIN-*). */

/* ===== 1. Ground and chrome ===================================================================== */
body.public-shell { background-color: var(--paper-public-tool-base); }
/* the pill and the menu glyph exist in the markup of methodology and privacy only (markup census, spec S3); tokens.css paints
   the pill context-free, so its forest border is context-free here too (slice 1, design review 6 P1) */
body.public-shell-methodology .scan-pill, body.public-shell-privacy .scan-pill{ background-color: var(--accent-public-tool-signal); color: var(--ink-public-tool); }
body.public-shell-methodology .scan-pill,
body.public-shell-privacy .scan-pill { border-color: transparent; }
@media (hover: hover) and (pointer: fine) {
  body.public-shell-methodology .scan-pill:hover, body.public-shell-privacy .scan-pill:hover{ background-color: var(--accent-public-tool-hover); color: var(--ink-public-tool); }
}

/* ===== 2. Methodology: notes, stages, tiers, lists ============================================= */
body.public-shell-methodology .architecture-note,
body.public-shell-methodology .stage.veto,
body.public-shell-methodology .tldr { background-color: var(--paper-public-tool-wash); }
body.public-shell-methodology .stage { background-color: var(--paper-public-tool-surface); }
body.public-shell-methodology .stage::before { background-color: var(--paper-public-tool-wash); color: var(--ink-public-tool); }
body.public-shell-methodology .tldr { border-color: var(--ink-public-tool); }
body.public-shell-methodology .tier .name { color: var(--ink-public-tool); }
body.public-shell-methodology .check-list li::before { background-color: var(--ink-public-tool); }

/* ===== 3. Privacy: policy lists, links, the contact panel ======================================= */
body.public-shell-privacy .policy-section li::before { background-color: var(--ink-public-tool); }
body.public-shell-privacy .policy-section a,
body.public-shell-privacy .contact-panel a { color: var(--ink-public-tool); }
body.public-shell-privacy .contact-panel { background-color: var(--paper-public-tool-wash); }
/* the privacy summary panel's own tint tokens (--privacy-tldr-border/-fill, literal tints of the accent hue) are declared family
   roots, so this recolour is enumerated like the others */
body.public-shell-privacy .tldr { background-color: var(--paper-public-tool-wash); border-color: var(--ink-public-tool); }

/* ===== 4. Login: kickers, the ledger, the two buttons (primary enabled only; the secondary keeps its outline form) ===== */
body.public-shell-login .source-label,
body.public-shell-login .section-kicker,
body.public-shell-login .ledger-item strong { color: var(--ink-public-tool); }
body.public-shell-login .ledger-item { background-color: var(--paper-public-tool-surface); }
body.public-shell-login .btn.btn-secondary { color: var(--ink-public-tool); border-color: var(--ink-public-tool); }
body.public-shell-login .btn:not(.btn-secondary):not(:disabled):not([aria-disabled="true"]) { background-color: var(--accent-public-tool-signal); color: var(--ink-public-tool); }
@media (hover: hover) and (pointer: fine) {
  body.public-shell-login .btn:not(.btn-secondary):not(:disabled):not([aria-disabled="true"]):hover { background-color: var(--accent-public-tool-hover); color: var(--ink-public-tool); }
}

/* ===== 5. Templates: the gallery shell, cards and choices (the CV document preview is untouched) ====== */
body.public-shell-templates a, body.public-shell-templates .eyebrow, body.public-shell-templates .gallery-track-line button, body.public-shell-templates .style-tag, body.public-shell-templates .next-step #choice-status, body.public-shell-templates .secondary-button{ color: var(--ink-public-tool); }
body.public-shell-templates .journey { border-left-color: var(--ink-public-tool); }
body.public-shell-templates .template-card,
body.public-shell-templates .next-step { background-color: var(--paper-public-tool-surface); }
body.public-shell-templates .template-card.is-selected { border-color: var(--ink-public-tool); box-shadow: var(--mode-public-tool-selected-shadow); }
body.public-shell-templates .card-actions button { background-color: var(--paper-public-tool-surface); color: var(--ink-public-tool); }
body.public-shell-templates .card-actions button[aria-pressed="true"] { background-color: var(--ink-public-tool); border-color: var(--ink-public-tool); color: var(--paper-public-tool-surface); }
body.public-shell-templates .primary-button:not(:disabled):not([aria-disabled="true"]) { background-color: var(--accent-public-tool-signal); color: var(--ink-public-tool); }
@media (hover: hover) and (pointer: fine) {
  body.public-shell-templates .card-actions button:not([aria-pressed="true"]):not(:disabled):hover { background-color: var(--paper-public-tool-wash); }
  body.public-shell-templates .primary-button:not(:disabled):not([aria-disabled="true"]):hover { background-color: var(--accent-public-tool-hover); color: var(--ink-public-tool); }
}

/* ===== 6. 404: the one action ================================================================== */
body.public-shell-404 a.primary { background-color: var(--accent-public-tool-signal); border-color: transparent; color: var(--ink-public-tool); }
@media (hover: hover) and (pointer: fine) {
  body.public-shell-404 a.primary:hover { background-color: var(--accent-public-tool-hover); color: var(--ink-public-tool); }
}
body.public-shell-methodology .tier .name,
body.public-shell-methodology .stage::before,
body.public-shell-login .source-label,
body.public-shell-login .section-kicker,
body.public-shell-login .ledger-item strong,
body.public-shell-templates .eyebrow,
body.public-shell-templates .style-tag { font-size: var(--text-public-tool-ui); line-height: var(--leading-legacy-09); font-family: var(--font-body); font-weight: 500; letter-spacing: normal; text-transform: none; }
body.public-shell-templates .journey li, body.public-shell-templates .gallery-facts, body.public-shell-templates .card-actions button, body.public-shell-templates .primary-button, body.public-shell-templates .secondary-button{ font-size: var(--text-public-tool-ui); }

/* ===== 8. Broad decorative boundaries softened (privacy's policy rules only, matrix-gated; stage borders, the tldr border,
   the templates header rule, card borders, the ledger list and the contact panel stay) ===== */
body.public-shell-privacy .policy-section { border-bottom-width: 0; }