/* Theme colors are explicit so recipe artwork and printable exports stay natural. */
:root {--canvas:#eeeee4;--theme-light-card:#faf9f2;color-scheme:light}
body {background:var(--canvas)}
.topbar {background:rgba(238,238,228,.96)}
.discover-intro {background:#e4ebdc;border-color:#d4dfcc}
.discover-page .recipe-card {background:var(--theme-light-card)}

html[data-theme="dark"] {
  color-scheme:dark;
  --canvas:#1b2d24;--white:#263c30;--ink:#edece0;--ink-2:#cedbcb;--muted:#b1c1ac;
  --line:#4a6350;--dark:#284e38;--dark-2:#1b3526;--deep:#203c2c;--moss:#9bc59b;
  --sage:#b6cba9;--leaf:#9fc79c;--orange:#efba91;--papaya:#efba91;--peach:#493b2c;
  --butter:#302f22;--mint:#243c2b;--cream:#242c22;--soil:#e4b792;--rose:#dfad87;
  --theme-surface:#263c30;--theme-raised:#304936;--theme-subtle:#21382b;--theme-text:#edece0;
  --theme-muted:#b1c1ac;--theme-line:#4a6350;--theme-accent:#efba91;--theme-green:#9fc99e;
  --shadow:0 12px 45px #0003;
  --atlas-filter-button-bg:#b8d2a5;--atlas-filter-button-text:#163022;--atlas-filter-button-hover:#c9dfb9;
  --atlas-filter-surface:#263c30;--atlas-filter-border:#668164;--atlas-filter-label:#cedbc6;
  --atlas-filter-active-bg:#efba91;--atlas-filter-active-text:#253a2a;
  scrollbar-color:#627a60 #1b2d24;
}
html[data-theme="dark"] body {background:var(--canvas);color:var(--theme-text)}
html[data-theme="dark"] ::selection {background:#efba91;color:#172a1f}
html[data-theme="dark"] .workspace {background:var(--canvas)}
html[data-theme="dark"] .page {color:var(--theme-text)}
html[data-theme="dark"] :is(.page,.modal) :is(h1,h2,h3,h4,.serif,strong,b,.recipe-card h3,.map-card-title strong) {color:var(--theme-text)}
html[data-theme="dark"] :is(.page,.modal) :is(p,small,.muted,.sub,.tinycaps,.hint,.panel-sub,.card-overline,.card-overline span,.card-content p,.avatarline,.author-link,.recipe-subtitle,.recipe-description,.author-row,.qitem span,.field label,.editor-intro,.preview-body>p,.preview-diff small,.footer,.discover-results-count,.discover-demo-note,.cooks-scope-note,.cook-stats,.cook-joined,.cook-trending,.cook-no-recipes,.cook-person small,.cook-specialties,.profile-bio,.similar-limit,.similar-status,.similar-item small,.similar-review-list small,.activity-time,.activity-feed-count,.activity-people-copy,.map-author-name,.map-version,.map-label,.flavor-caption,.atlas-filter-summary,.atlas-budget-note,.atlas-show,.atlas-pan-hint,.explorer-current,.lineage-breadcrumb,.lab-chart-footer,.lab-sort-label,.lab-list-summary,.lab-pagination>span,.passport-stamp,.passport-title p,.passport-panel p) {color:var(--theme-muted)}
html[data-theme="dark"] :is(.page,.modal) :is(.text-link,.backline,.cook-person strong,.recipe-jump,.atlas-disclosure>summary,.explorer-help>summary,.explorer-recipe-choices>summary,.cooks-how>summary,.activity-examples>summary,.activity-primary,.social-action,.author-link,.spotlight-author button,.timeline-item button,.lineage-breadcrumb button,.map-lab-link) {color:var(--theme-green)}
html[data-theme="dark"] :is(.page,.modal) :is(h1 em,h2 em,h3 em,.living-sheet-kicker,.insight-panel-label,.atlas-quick-lenses>span,.passport-bigflower) {color:var(--theme-accent)}
html[data-theme="dark"] :is(.page,.modal) :is(.recipe-card,.stat,.panel,.diff-summary,.diff-group,.edit-panel,.preview-card,.activity-card,.feed-card,.side-people,.cook-tile,.profile-banner,.discussion,.branch-spotlight,.branch-context,.tree-info,.tree-guide,.insight-panel,.lab-chart-card,.lab-selection,.lab-version-list,.living-log-entry,.living-taste-card,.showdown-card,.showdown-analysis,.passport-panel,.experience-feature,.atlas-filter-panel,.atlas-disclosure,.atlas-proposals,.atlas-chart-box,.atlas-leaders,.cooks-empty,.similar-item,.account-choice) {background:var(--theme-surface);border-color:var(--theme-line);box-shadow:0 6px 24px #00000016}
html[data-theme="dark"] :is(.page,.modal) :is(.discover-intro,.people-summary,.join-banner,.feed-prompt,.lab-cover,.lab-lineage-cta,.feature-strip,.pulse,.living-logs-hero,.passport-hero,.passport-encourage,.tip-box,.more-bar,.notice,.activity-scope,.activity-examples,.cooks-quiet,.editor-similar,.similar-review-list>div,.scale-note,.lab-filter-note,.dna-footnote,.atlas-decision,.atlas-real-note) {background:var(--theme-raised)!important;border-color:var(--theme-line);color:var(--theme-muted)}
html[data-theme="dark"] :is(.page,.modal) :is(.discover-intro p,.discover-intro .tinycaps,.feed-prompt p,.atlas-decision p,.atlas-real-note strong,.community-head p,.activity-scope strong,.scale-note,.dna-footnote strong) {color:var(--theme-muted)}
html[data-theme="dark"] :is(.page,.modal) :is(.stat strong,.quickstats strong,.inglabel strong,.family-stat-grid strong,.lab-selection-stats strong,.lab-version-drift,.passport-stats strong,.living-log-stats strong,.atlas-metrics strong,.activity-action>strong,.activity-change>p) {color:var(--theme-text)}
html[data-theme="dark"] :is(.page,.modal) :is(.lab-summary-row>div,.family-stat-grid>div,.living-log-stats>div,.passport-stats>div,.atlas-metrics>div,.atlas-field,.atlas-explain-steps>div,.showdown-diff-line.different,.showdown-versus,.outcome-choice span,.log-traits span,.taste-bar:hover,.taste-bar.active,.account-creation,.empty-state,.empty-icon,.living-empty,.taste-empty,.empty-taste) {background:var(--theme-raised);border-color:var(--theme-line);color:var(--theme-muted)}
html[data-theme="dark"] .topbar {background:rgba(27,45,36,.97);border-color:var(--theme-line)}
html[data-theme="dark"] :is(.crumb,.crumb strong,.mobile-brand) {color:var(--theme-text)}
html[data-theme="dark"] .sidebar {background:linear-gradient(165deg,#254e37,#1b3526);border-color:#334d39;box-shadow:5px 0 30px #0002}
html[data-theme="dark"] .sidebar .sidebar-note {background:#283c2c!important;border-color:#4d6147!important;color:var(--theme-text)}
html[data-theme="dark"] .sidebar .sidebar-note :is(h4,p,.text-link,button) {color:var(--theme-text)!important}
html[data-theme="dark"] .sidebar .sidebar-note .leaf {background:#38513a!important;color:#e8bb95!important}
html[data-theme="dark"] .sidebar .navbutton.active {background:#e5b28a;border-color:#edc7a2;color:#203b29}
html[data-theme="dark"] .sidebar .navbutton.active svg {color:#203b29}
html[data-theme="dark"] :is(.topbar .search,.discover-search,.cooks-search,.atlas-search,.search-wrap,.sort-wrap,.keycap,.icon-btn,.map-tool-btn) {background:var(--theme-surface);border-color:var(--theme-line);color:var(--theme-muted)}
html[data-theme="dark"] :is(.page,.modal,.topbar) :is(input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),textarea,select) {background:var(--theme-subtle);border-color:#496149;color:var(--theme-text);caret-color:var(--theme-accent)}
html[data-theme="dark"] :is(.topbar .search,.discover-search,.cooks-search,.atlas-search) input {background:transparent}
html[data-theme="dark"] :is(.page,.modal,.topbar) :is(input,textarea)::placeholder {color:#a3b39f;opacity:1}
html[data-theme="dark"] :is(.page,.modal) :is(.field label,.living-note-label,.cuisine-editor-label,.cooks-sort-label,.cooks-filter-row>label,.living-field-heading,.atlas-field>span,.lab-sort-label,.discover-sort>label) {color:var(--theme-muted)}
html[data-theme="dark"] :is(.page,.modal) :is(input[type="range"],input[type="checkbox"],input[type="radio"]) {accent-color:#efba91}
html[data-theme="dark"] :is(.page,.modal,.topbar) .btn.primary {background:#a8cba0;color:#193522;border-color:#a8cba0;box-shadow:0 5px 12px #0002}
html[data-theme="dark"] :is(.page,.modal,.topbar) .btn.primary:hover {background:#bddab5;border-color:#bddab5;color:#132d1d}
html[data-theme="dark"] :is(.page,.modal) :is(.btn.light,.btn.soft,.btn.following,.small-icon,.root-picker button,.cover-option,.map-tool-btn,.atlas-pill,.chip,.filter-chip,.lab-tag,.pill-switch button,.taste-bar,.lineage-breadcrumb button) {background:var(--theme-surface);border-color:#4c644b;color:#cedecc}
html[data-theme="dark"] :is(.page,.modal) :is(.btn.light:hover,.btn.soft:hover,.small-icon:hover,.root-picker button:hover,.map-tool-btn:hover,.chip:hover,.atlas-pill:hover,.atlas-disclosure>summary:hover,.account-choice:hover,.lab-version:hover,.passport-recipe:hover) {background:#304936;border-color:#728c69;color:var(--theme-text)}
html[data-theme="dark"] :is(.page,.modal) :is(.btn.orange,.btn.apricot,.atlas-quick-lenses>button,.map-diff-tag,.activity-result,.outcome-chip,.cook-interests>span,.cook-origin.is-example,.atlas-sample-label,.showdown-count,.showdown-diff-line button,.showdown-step button) {background:#483a2c;border-color:#765f45;color:#f2c7a2}
html[data-theme="dark"] :is(.page,.modal) :is(.chip.active,.chip.selected,.filter-chip.active,.atlas-pill.is-active,.root-picker button.active,.pill-switch button.active,.log-traits input:checked+span,.account-choice.current,.lineage-breadcrumb button.active) {background:#a6c99e!important;border-color:#a6c99e!important;color:#173322!important}
html[data-theme="dark"] :is(.page,.modal) :is(.tag,.stat-icon,.cook-origin:not(.is-example),.activity-origin,.atlas-drift-pill,.card-drift,.step-number,.step-editor-num,.diffpill,.empty-icon,.showdown-count,.living-taste-count,.log-traits span,.living-log-tags span,.path-node) {background:#2d4531;border-color:#4e694b;color:#cee1c5}
html[data-theme="dark"] .page :is(.cook-origin,.cook-interests>span) {color:#eac7a0}
html[data-theme="dark"] .page .cook-origin:not(.is-example) {color:#cee1c5}
html[data-theme="dark"] .page :is(.tag.warm,.tag.warm svg,.discover-branch-icon,.experience-feature-icon,.atlas-demo-icon,.atlas-burst) {background:#483a2c;color:#efc49b}
html[data-theme="dark"] .page .mini-pill,html[data-theme="dark"] .page .photo-credit {background:#172b21e8;color:#dce8d5;border-color:#53694c}
html[data-theme="dark"] .page .save-circle {background:#172b21ef;color:#d7e8cf;border-color:#496343}
html[data-theme="dark"] .page .save-circle.saved {background:#efba91!important;color:#233c29!important}
html[data-theme="dark"] .page :is(.recipe-card .card-image,.recipe-photo,.lab-selection-photo,.map-card-top>img) {background:#263b2b}
html[data-theme="dark"] .page :is(.recipe-card .card-bottom,.ingredient-item,.step-item,.quickstats,.timeline-item,.comment,.cook-stats,.cook-covers,.activity-actions,.activity-recipe,.activity-change,.map-card-bottom,.map-commit,.map-tip,.lab-chart-footer,.lab-selection-stats,.lab-version,.discover-explorer-link,.cooks-filter-row,.cooks-how,.footer,.tabs,.atlas-filter-footer,.atlas-disclosure[open]>summary,.atlas-proposals-head,.atlas-proposal,.atlas-leaders button) {border-color:var(--theme-line)}
html[data-theme="dark"] .page :is(.tabs button,.tabs button.active) {color:#b4c7ad}
html[data-theme="dark"] .page .tabs button.active {color:var(--theme-accent);border-bottom-color:var(--theme-accent)}
html[data-theme="dark"] .page :is(.ingredient-item,.inglabel,.step-item p,.lab-version-title span,.spotlight-copy>p,.spotlight-author,.lineage-breadcrumb,.map-diff-line,.map-original-desc,.map-tip,.map-commit>strong,.atlas-proposal p,.atlas-proposal small,.atlas-no-proposals,.atlas-hist-row span,.atlas-hist-row b,.atlas-leaders p,.atlas-leaders small,.atlas-quick-lenses>span,.atlas-metrics small,.atlas-metrics span,.atlas-field small,.atlas-filter-details>summary>span,.explorer-help p,.atlas-pan-hint,.lab-selection-stats small,.lab-selection-stats>div:first-child>span,.lab-byline,.lab-axis,.lab-version-title strong) {color:var(--theme-muted)}
html[data-theme="dark"] .page .ingredient-item .tick {border-color:#73906c}
html[data-theme="dark"] .page .ingredient-item.checked .tick {background:#a6c99e;color:#193522}
html[data-theme="dark"] .page .ingredient-item.checked .inglabel {color:#8a9e83}
html[data-theme="dark"] .page .outcome-choice input:checked+span {background:#354c31;border-color:#a6c99e;box-shadow:0 0 0 3px #69845a44}
html[data-theme="dark"] .page .recipe-support-actions .btn {background:transparent;color:var(--theme-muted)}
html[data-theme="dark"] .page .recipe-support-actions .btn:hover {background:#304936;color:var(--theme-text)}
html[data-theme="dark"] .page .recipe-support-actions .btn.loved {background:#483a2c;color:#efc49b}
html[data-theme="dark"] .page :is(.lab-version.active,.lab-pinned) {background:#2c4330;border-color:#718966}
html[data-theme="dark"] .page :is(.dna-track,.lab-version-meter,.taste-bar-track,.atlas-hist-rail,.cook-progress,.cook-progress>span) {background:#354735}
html[data-theme="dark"] .page :is(.lab-version-meter>div,.taste-bar-track i,.atlas-hist-rail i) {background:linear-gradient(90deg,#719e70,#c3bd8e)}
html[data-theme="dark"] .page .dna-donut {--ring:#b8d0a0}
html[data-theme="dark"] .page .dna-donut.is-large {--ring:#efba91}
html[data-theme="dark"] .page .dna-score {color:var(--theme-text)}
html[data-theme="dark"] .page .lab-axis {fill:var(--theme-muted)}
html[data-theme="dark"] .page .lab-gridline {stroke:#3d5140}
html[data-theme="dark"] .page .lab-link {stroke:#6f9272}
html[data-theme="dark"] .page .lab-dot {fill:#9ac293;stroke:#263c30}
html[data-theme="dark"] .page .lab-point.active .lab-dot {fill:#efba91;stroke:#5d6245}
html[data-theme="dark"] .page .atlas-shell .tree-board {background-color:#14251b;background-image:radial-gradient(#36503b 1px,transparent 1px);border-color:#4a6348;scrollbar-color:#71886a #14251b}
html[data-theme="dark"] .page .atlas-shell .atlas-tree-card {background:#22382a;border-color:#57704f}
html[data-theme="dark"] .page .atlas-shell .atlas-tree-card.selected {background:#304330;border-color:#efba91!important;box-shadow:0 0 0 3px #efba913b,0 8px 22px #0004!important}
html[data-theme="dark"] .page .atlas-tree-card.selected .atlas-drift-pill {background:#4b3e2b;border-color:#9a7d56;color:#f3cba7}
html[data-theme="dark"] .page :is(.atlas-map-toolbar,.map-toolbar) {background:#243a2a;border-color:#4b6249;color:var(--theme-muted)}
html[data-theme="dark"] .page .atlas-shell .tree-lines path {stroke:#7b9b78}
html[data-theme="dark"] .page .atlas-shell .tree-lines path.context-line {stroke:#536e51}
html[data-theme="dark"] .page .atlas-shell .tree-lines path.highlight {stroke:#efba91}
html[data-theme="dark"] .page .atlas-gap-label {fill:#efc39b;stroke:#14251b}
html[data-theme="dark"] .page :is(.atlas-reading-guide,.atlas-example li,.atlas-example button) {background:transparent;border-color:var(--theme-line);color:var(--theme-muted)}
html[data-theme="dark"] .page .atlas-collab {background:#1d3b29;color:var(--theme-text)}
html[data-theme="dark"] .page .atlas-collab h3 {color:var(--theme-text)}
html[data-theme="dark"] .page .atlas-hidden-forks {background:#b38259;border-color:#22382a;color:white}
html[data-theme="dark"] :is(.page,.modal) :is(.atlas-explain-steps strong,.outcome-choice span strong,.similar-item strong,.similar-review-list strong,.cooks-empty h2,.passport-recipe strong,.passport-panel strong) {color:var(--theme-text)}
html[data-theme="dark"] .modal-overlay {background:#020b07b8}
html[data-theme="dark"] .modal {background:#263c30;border:1px solid #4a6247;color:var(--theme-text);box-shadow:0 25px 80px #0007}
html[data-theme="dark"] :is(.modal .cook-focus,.modal .account-creation,.modal .account-choice,.modal .similar-preview-content,.modal .similar-review-list>div) {border-color:var(--theme-line)}
html[data-theme="dark"] .modal :is(.account-choice,.account-creation,.similar-review-list>div) {background:#304936}
html[data-theme="dark"] .modal :is(.cook-focus p,.living-sheet-copy,.living-note-label,.living-field-heading,.living-privacy-note,.accounts-disclaimer,.account-choice small,.similar-limit,.hint) {color:var(--theme-muted)}
html[data-theme="dark"] .modal .living-photo-upload {color:#c4d9b9;border-color:#68865d}
html[data-theme="dark"] #toast {background:#34543b;border-color:#7b9b6e;color:#f2eddf}
html[data-theme="dark"] .mobile-bottom-nav {background:#17281e;border-color:#40563f;box-shadow:0 -8px 20px #0003}
html[data-theme="dark"] .mobile-bottom-nav button {color:#b1c7aa}
html[data-theme="dark"] .mobile-bottom-nav button.active {background:#423c2a;color:#f0c49b}
html[data-theme="dark"] body :is(button,a,input,textarea,select,[tabindex]):focus-visible {outline-color:#efba91!important}
html[data-theme="dark"] :is(.topbar .search,.discover-search,.cooks-search,.atlas-search):focus-within {outline-color:#b8d2a5;box-shadow:0 0 0 3px #8db18433}
/* A recipe sheet is an export artifact: keep the page and its ink-friendly print colors light. */
html[data-theme="dark"] .recipe-reader {color-scheme:light;background:#f2f0e9;color:#243f30}
html[data-theme="dark"] .recipe-reader .recipe-sheet {background:#fffef9;color:#243f30}
@media print {html[data-theme="dark"] .recipe-reader {background:white!important}}
/* The theme switch stays visible on small screens, next to the cook profile. */
.theme-toggle {display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;height:40px;padding:8px;border:1px solid #c9d5c0;border-radius:11px;background:#faf9f2;color:#375d40;cursor:pointer}
.theme-toggle:hover {background:#e6ebdd;border-color:#8fa584}
html[data-theme="dark"] .theme-toggle {background:#263b2b;border-color:#607856;color:#efc49b}
html[data-theme="dark"] .theme-toggle:hover {background:#35513a;border-color:#a0ba88}
@media(max-width:700px){.theme-toggle {width:36px;height:36px;min-width:36px;padding:8px}.topbar .top-right {gap:6px}}
/* Let search and breadcrumb share the remaining width when another tool is present. */
.topbar {gap:16px}
.topbar .top-left {flex:0 1 auto;min-width:0}
.topbar .top-left .crumb {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar .top-right {flex:1;justify-content:flex-end;min-width:0}
.topbar .search {flex:1 1 240px;max-width:320px;width:auto;min-width:0}
.topbar .new-recipe,.topbar .icon-btn,.topbar .top-avatar {flex:none}
@media(max-width:700px){.topbar{gap:10px}.topbar .top-left{flex:none}.topbar .search{flex:1 1 0;max-width:none}}
html[data-theme="dark"] .page .footer>span {color:var(--theme-muted)}
html[data-theme="dark"] .page .atlas-compact .atlas-filter-details>.atlas-filter-toggle {background:var(--atlas-filter-button-bg);color:var(--atlas-filter-button-text);border-color:var(--atlas-filter-border)}
html[data-theme="dark"] .page .atlas-compact .atlas-filter-details>.atlas-filter-toggle:hover {background:var(--atlas-filter-button-hover);color:var(--atlas-filter-button-text)}
html[data-theme="dark"] .page .atlas-compact .atlas-filter-details>.atlas-filter-toggle>span {color:inherit}
html[data-theme="dark"] .page .atlas-compact .atlas-filter-details>.atlas-filter-toggle>.atlas-filter-count {background:var(--atlas-filter-active-bg);color:var(--atlas-filter-active-text)}
html[data-theme="dark"] :is(.page,.modal) .outcome-choice input:checked+span {background:#354c31;border-color:#a6c99e;box-shadow:0 0 0 3px #69845a44}
html[data-theme="dark"] .page :is(.root-picker button.active,.chip.active,.atlas-pill.is-active) :is(span,small,strong) {color:inherit}
html[data-theme="dark"] .modal.accounts-dialog .account-choice.current {background:#354e35!important;border-color:#9bc58b!important;color:var(--theme-text)!important}
html[data-theme="dark"] .recipe-reader :is(button,a,select):focus-visible {outline-color:#315e42!important}
/* Keep supporting text readable on the dimmer light-theme hero surface. */
html:not([data-theme="dark"]) body .page .discover-intro :is(p,.tinycaps) {color:#526750}
/* Headings and the compact Explorer toolbar belong to the page canvas. */
html[data-theme="dark"] .page :is(.page-head:not(.page-banner),.community-head:not(.page-banner),.atlas-compact .atlas-filter-panel) {background:transparent;box-shadow:none}
html[data-theme="dark"] .page .explorer-recipe-picker {color:var(--theme-muted)}
html[data-theme="dark"] .page .ingredient-board {background:var(--theme-subtle);border-color:var(--theme-line)}
html[data-theme="dark"] .page .ingredient-version {background:var(--theme-surface);border-color:var(--theme-line);color:var(--theme-text)}
html[data-theme="dark"] .page .ingredient-version:hover {border-color:#91b381}
html[data-theme="dark"] .page .ingredient-version.selected {border-color:var(--theme-accent);box-shadow:0 0 0 2px #efba9140}
html[data-theme="dark"] .page :is(.ingredient-view-note,.ingredient-version-copy small,.ingredient-change-lines,.ingredient-change-score,.ingredient-empty) {color:var(--theme-muted)}
html[data-theme="dark"] .page .ingredient-group>h2>span {background:var(--theme-raised);color:var(--theme-muted)}
html[data-theme="dark"] .page .ingredient-parent {border-color:var(--theme-line)}
html[data-theme="dark"] :is(.topbar .search,.discover-search,.cooks-search,.atlas-search) input {background:transparent!important}

/* Apricot marks the current choice and a few cooking details against the greens. */
:root {
  --highlight-fill:#f4c69f;--highlight-hover:#f8d5b5;--highlight-ink:#503522;
  --highlight-soft:#fff0df;--highlight-edge:#ce9263;--highlight-label:#8b4b28;
}
html[data-theme="dark"] {
  --highlight-fill:#edba94;--highlight-hover:#f4cdab;--highlight-ink:#233a2b;
  --highlight-soft:#443a2d;--highlight-edge:#b88c65;--highlight-label:#efba91;
}
html[data-theme] body .page .explorer-views>.btn.primary {
  background:var(--highlight-fill);border-color:var(--highlight-edge);color:var(--highlight-ink);
  box-shadow:0 3px 10px #b3703520;
}
html[data-theme] body .page .explorer-views>.btn.primary:hover {background:var(--highlight-hover);color:var(--highlight-ink)}
html[data-theme] body :is(
  .sidebar .navbutton.active,
  .mobile-bottom-nav button.active,
  .page .tabs>button.active,
  .page .explorer-views>.btn[aria-current="page"],
  .page .chip.active,.page .chip.selected,.page .filter-chip.active,
  .page .pill-switch>button.active,.page .atlas-pill.is-active,
  .page .explorer-picker-categories>button[aria-pressed="true"],
  .page .taste-bar.active
) {
  background:var(--highlight-fill)!important;border-color:var(--highlight-edge)!important;color:var(--highlight-ink)!important;
}
html[data-theme] body :is(.sidebar .navbutton.active,.mobile-bottom-nav button.active,.page .taste-bar.active) :is(svg,span,strong,small) {color:inherit!important}
/* Give recipe tabs the same filled selection without changing size on selection. */
.page .tabs {gap:8px;padding:4px 3px 8px}
.page .tabs>button {min-height:44px;padding:10px 12px;border:1px solid transparent;border-radius:9px}
html[data-theme] body .page .explorer-recipe-picker .explorer-picker-label {color:var(--highlight-label)}
html[data-theme] body .page .explorer-recipe-picker>summary {border-left:3px solid var(--highlight-edge)}
html[data-theme] body .page .explorer-recipe-picker .explorer-picker-option.is-current {
  background:var(--highlight-soft);border-color:var(--highlight-edge);
}
html[data-theme] body .page .explorer-recipe-picker .explorer-picker-check {
  background:var(--highlight-fill);color:var(--highlight-ink);
}
.page .discover-intro {box-shadow:inset 3px 0 0 var(--highlight-edge)}
.page .discover-intro>img {border-color:var(--highlight-edge);box-shadow:0 8px 22px #c17b3820}
.page .discover-intro .text-link>svg {color:var(--highlight-label)}
.page .step-item .step-number {background:var(--highlight-soft);color:var(--highlight-label);border:1px solid var(--highlight-edge)}
html[data-theme="dark"] body .page .step-item .step-number {background:var(--highlight-soft);color:var(--highlight-label);border-color:var(--highlight-edge)}
html[data-theme] .page .tag.warm {background:var(--highlight-soft);border-color:var(--highlight-edge);color:var(--highlight-label)}
html[data-theme] .page .tag.warm svg {background:transparent;color:inherit}

/* Tabs share a width within their group; longer groups scroll on small screens. */
html body .page :is(.tabs,.discover-categories,.cooks-scopes,.ingredient-type-filters,.explorer-picker-categories,.atlas-presets) {
  display:grid;grid-auto-flow:column;grid-auto-columns:var(--tab-width,112px);grid-template-columns:none;
  align-items:stretch;gap:8px;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;
  padding-top:4px;padding-bottom:8px;scrollbar-width:thin;overscroll-behavior-x:contain;
}
html body .page :is(.tabs,.discover-categories,.cooks-scopes,.ingredient-type-filters,.explorer-picker-categories,.atlas-presets)>button {
  display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-width:0;min-height:44px;
  white-space:normal;overflow-wrap:anywhere;text-align:center;line-height:1.4;transform:none!important;
}
html body .page .tabs {--tab-width:200px}
html body .page .discover-categories {--tab-width:104px}
html body .page .cooks-scopes {--tab-width:128px}
html body .page .ingredient-type-filters {--tab-width:216px}
html body .page .explorer-picker-categories {--tab-width:100px}
html body .page .atlas-presets {--tab-width:216px}
html body .page .explorer-topline .explorer-views {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,510px);max-width:100%;gap:8px;
}
html body .page .explorer-topline .explorer-views>button {min-width:0;width:100%;min-height:44px;justify-content:center;white-space:normal;text-align:center;line-height:1.4}
html body .page .activity-filters {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,420px);gap:4px}
html body .page .activity-filters>button {width:100%;min-width:0;min-height:44px;white-space:normal;overflow-wrap:anywhere;transform:none!important}
html body .page .taste-bar {min-height:44px}
html[data-theme="dark"] .page .activity-recipe {background:var(--theme-subtle);border-color:var(--theme-line)}
html[data-theme] body .activity-page .activity-filters {background:transparent;border:0;padding:0;box-shadow:none}
html[data-theme] body .activity-page .activity-filters>button {color:var(--ink-2)}
html[data-theme="dark"] .page :is(.following-recipes-heading p,.following-recipe-count,.following-pagination>span) {color:var(--theme-muted)}
@media(max-width:640px){html body .page .explorer-topline .explorer-views {width:100%;gap:6px}}

/* One tab style across page views and collection filters. Layout stays local to
   each group so long labels and narrow screens keep their existing behavior. */
:root {--tab-radius:10px;--tab-height:48px;--tab-surface:#fffef8;--tab-edge:#d3dfce;--tab-copy:#526b55;--tab-hover:#fff0df}
html[data-theme="dark"] {--tab-surface:var(--theme-surface);--tab-edge:var(--theme-line);--tab-copy:var(--theme-muted);--tab-hover:#354c38}
html[data-theme] body .page :is(.tabs,.discover-categories,.cooks-scopes,.ingredient-type-filters,.explorer-picker-categories,.atlas-presets,.explorer-views,.activity-filters,.cookbook-tabs,.cookbook-scope,.cloud-auth-tabs)>button {
  display:flex;align-items:center;justify-content:center;gap:6px;min-height:var(--tab-height);
  padding:8px 12px;border:1px solid var(--tab-edge);border-radius:var(--tab-radius);
  background:var(--tab-surface);color:var(--tab-copy);font:800 11px/1.35 var(--sans,system-ui,sans-serif);
  text-align:center;white-space:normal;overflow-wrap:anywhere;box-shadow:none;transform:none!important;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}
html[data-theme] body .page :is(.tabs,.discover-categories,.cooks-scopes,.ingredient-type-filters,.explorer-picker-categories,.atlas-presets,.explorer-views,.activity-filters,.cookbook-tabs,.cookbook-scope,.cloud-auth-tabs)>button:hover {
  background:var(--tab-hover);border-color:var(--highlight-edge);box-shadow:none;
}
html[data-theme] body .page :is(.tabs,.discover-categories,.cooks-scopes,.ingredient-type-filters,.explorer-picker-categories,.atlas-presets,.explorer-views,.activity-filters,.cookbook-tabs,.cookbook-scope,.cloud-auth-tabs)>button:is(.active,.selected,.is-active,[aria-current="page"],[aria-pressed="true"]) {
  background:var(--highlight-fill)!important;border-color:var(--highlight-edge)!important;color:var(--highlight-ink)!important;
}
html[data-theme] body .page .cookbook-tabs {padding:4px 0 8px;border:0;border-radius:0;background:transparent;gap:8px}
@media(max-width:600px){html[data-theme] body .page :is(.explorer-views,.cookbook-tabs,.cookbook-scope,.cloud-auth-tabs)>button {padding-inline:5px}}

/* Kitchen shortcuts have their own wrapping row, keeping recipe actions usable. */
html body .page .kitchen-tools{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px;min-width:0}
html body .page .kitchen-tools .btn{min-width:0;white-space:normal;min-height:48px}
/* Every navigation item remains reachable as the tool collection grows. */
html body .sidebar{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
html body .sidebar>.nav,html body .sidebar>.sidebar-bottom{flex-shrink:0}
/* The old drawer breakpoint preceded the phone footer, leaving tablets without
   navigation. Keep the same five destinations available throughout that gap. */
@media(min-width:701px) and (max-width:850px){
  html body .shell .sidebar{display:none}
  html body .workspace{padding-bottom:90px}
  html body .mobile-bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;z-index:40;bottom:0;left:0;right:0;gap:6px;padding:7px 12px max(7px,env(safe-area-inset-bottom));background:var(--theme-surface,#fffefa);border-top:1px solid var(--theme-line,#d3dfce);box-shadow:0 -6px 25px #203b2512}
  html body .mobile-bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:48px;padding:7px 10px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--theme-muted,#526b55);font:700 10px/1.3 var(--sans,system-ui,sans-serif)}
  html body .mobile-bottom-nav button.active{background:var(--highlight-fill,#f4c69f);border-color:var(--highlight-edge,#c3936e);color:var(--highlight-ink,#263b2d)}
}
