/* Local fonts and artwork keep every appearance available offline. */
:root {
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-heading: Georgia, "Times New Roman", serif;
  --heading-weight: 700;
  --header-bg: rgba(7,51,40,.96);
  --header-ink: #fff;
  --header-muted: #cbdad3;
  --header-mark: #d5e69d;
  --header-line: rgba(255,255,255,.28);
  --header-button-bg: #d7e69f;
  --header-button-ink: #153b2e;
  --hero-bg: linear-gradient(115deg,#0b4b3a 0%,#173f33 58%,#455f42 100%);
  --hero-ink: #fff;
  --hero-muted: #e0ebe5;
  --hero-accent: #d5e69d;
  --stat-bg: rgba(255,255,255,.1);
  --stat-line: rgba(255,255,255,.12);
  --stat-number: #eef6d5;
  --stat-label: #c8d9d0;
  --input-bg: #fff;
  --input-line: #cdd8cf;
  --chip-ink: #3b584a;
  --copy: #44534b;
  --image-bg: #dfe8de;
  --gallery-bg: #e3eadf;
  --photo-bg: #d6dfd4;
  --photo-muted: #4d6154;
  --score-bg: rgba(9,56,43,.9);
  --note-bg: #edf4ea;
  --warning-line: #ecd7ad;
  --upload-bg: #f7faf5;
  --focus: #758f3c;
  --card-radius: 17px;
  --hero-radius: 24px;
  --card-shadow: 0 8px 24px rgba(20,54,42,.06);
  --viewer-bg: #07130f;
  --viewer-panel: #0d2018;
  --viewer-line: #55675a;
  --viewer-button: #213a2c;
  --viewer-hover: #35563f;
  --viewer-muted: #bdcec2;
  --viewer-link: #d6e7a0;
  color-scheme: light;
}

:root[data-theme="earth"] {
  --forest: #85513e; --forest-dark: #5b382b; --moss: #796545; --leaf: #b49b69;
  --paper: #f5efe5; --panel: #fffcf6; --ink: #3b332b; --muted: #786958;
  --line: #e0d5c5; --soft: #efe5d6; --warn: #faf0d8; --danger: #943d37;
  --shadow: 0 14px 38px rgba(91,63,36,.09); --radius: 16px;
  --heading-weight: 400;
  --header-bg: #40362d; --header-ink: #fff6e8; --header-muted: #ddceba;
  --header-mark: #dfc59d; --header-line: #81725f;
  --header-button-bg: #ecdbc0; --header-button-ink: #503b2b;
  --hero-bg: linear-gradient(115deg,#ede1d1 0%,#eee2d2 60%,#e1d0b7 100%);
  --hero-ink: #403228; --hero-muted: #6f5948; --hero-accent: #85513e;
  --stat-bg: transparent; --stat-line: #c7b499; --stat-number: #774333; --stat-label: #6e5c49;
  --input-bg: #fffcf7; --input-line: #dacbb9; --chip-ink: #6e5942; --copy: #625141;
  --image-bg: #e5ddcd; --gallery-bg: #e9dfce; --photo-bg: #ded2bf; --photo-muted: #6d5a46;
  --score-bg: rgba(82,53,37,.9); --note-bg: #eee8d9; --warning-line: #dfca9c;
  --upload-bg: #f8f2e8; --focus: #9a654c; --card-radius: 14px; --hero-radius: 18px;
  --card-shadow: 0 5px 20px rgba(91,63,36,.05);
  --viewer-bg: #1b1713; --viewer-panel: #29221b; --viewer-line: #7b6c58;
  --viewer-button: #4c3c2e; --viewer-hover: #66513d; --viewer-muted: #dccbb5; --viewer-link: #ecd5a6;
}

:root[data-theme="natural"] {
  --forest: #3d5546; --forest-dark: #2e3c32; --moss: #596b58; --leaf: #aeb698;
  --paper: #f5f5f0; --panel: #fcfcf8; --ink: #252e27; --muted: #616a60;
  --line: #d7ddd1; --soft: #e6eadf; --warn: #f5f0df; --danger: #933e37;
  --shadow: 0 8px 24px rgba(45,58,45,.05); --radius: 8px;
  --font-heading: var(--font-body); --heading-weight: 600;
  --header-bg: #fafbf7; --header-ink: #29372e; --header-muted: #616e60;
  --header-mark: #53694b; --header-line: #cbd3c5;
  --header-button-bg: #3d5546; --header-button-ink: #fff;
  --hero-bg: #e4e8dc; --hero-ink: #27382d; --hero-muted: #52624e; --hero-accent: #536649;
  --stat-bg: transparent; --stat-line: #bac5b0; --stat-number: #334b3b; --stat-label: #58684e;
  --input-bg: #fff; --input-line: #d2dacb; --chip-ink: #4a5b42; --copy: #53604f;
  --image-bg: #e1e6db; --gallery-bg: #e8ebe3; --photo-bg: #dce2d7; --photo-muted: #56654e;
  --score-bg: rgba(34,47,37,.9); --note-bg: #e8ece2; --warning-line: #dfd5b7;
  --upload-bg: #f0f3eb; --focus: #58724d; --card-radius: 8px; --hero-radius: 8px;
  --card-shadow: none;
  --viewer-bg: #151915; --viewer-panel: #212820; --viewer-line: #68735f;
  --viewer-button: #364231; --viewer-hover: #4c5c44; --viewer-muted: #c6cdbd; --viewer-link: #d7e3c1;
}

:root[data-theme="meadow"] {
  --forest: #42614b; --forest-dark: #314839; --moss: #62734e; --leaf: #a7b789;
  --paper: #faf7ee; --panel: #fffdf7; --ink: #354638; --muted: #66715e;
  --line: #dde2cc; --soft: #eaf0df; --warn: #fcf0db; --danger: #963e4a;
  --shadow: 0 12px 30px rgba(87,107,70,.09); --radius: 24px;
  --font-body: "Trebuchet MS", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-heading: Georgia, "Times New Roman", serif; --heading-weight: 400;
  --header-bg: #fffdf4; --header-ink: #344e3c; --header-muted: #68765d;
  --header-mark: #796b83; --header-line: #d2d9c1;
  --header-button-bg: #4c6753; --header-button-ink: #fff;
  --hero-bg: linear-gradient(118deg,#e5edda 0%,#f2efdf 70%,#f3e4e7 100%);
  --hero-ink: #36503b; --hero-muted: #586950; --hero-accent: #5b7152;
  --stat-bg: rgba(255,253,247,.7); --stat-line: #d4dcc4; --stat-number: #526b46; --stat-label: #596c4e;
  --input-bg: #fffef9; --input-line: #d3dcc5; --chip-ink: #526447; --copy: #58654e;
  --image-bg: #e5e9d8; --gallery-bg: #eaf0df; --photo-bg: #dee5d1; --photo-muted: #5b6b50;
  --score-bg: rgba(67,89,62,.92); --note-bg: #eee7f0; --warning-line: #e4d3ad;
  --upload-bg: #f2f5e9; --focus: #81728e; --card-radius: 24px; --hero-radius: 32px 52px 32px 32px;
  --card-shadow: 0 5px 18px rgba(87,107,70,.06);
  --viewer-bg: #1a2019; --viewer-panel: #283025; --viewer-line: #7b8870;
  --viewer-button: #42513b; --viewer-hover: #5d6e55; --viewer-muted: #cbd7bd; --viewer-link: #e6d8ee;
}

/* Shared controls follow the same palette on lists, plant pages and editors. */
body { font-family: var(--font-body); }
.appHeader { background: var(--header-bg); color: var(--header-ink); }
.brand { color: var(--header-ink); }
.brandMark { color: var(--header-mark); border-color: var(--header-line); }
.brand small { color: var(--header-muted); }
.brand strong, .intro h1, .plantCard h2, .detailBody h1, .sectionTitle,
.editorHeader h1, .formSection h2, .guide h1, .guideCard h2, .viewerHeading strong {
  font-family: var(--font-heading); font-weight: var(--heading-weight);
}
.brand strong { font-weight: 700; }
.appHeader .btn.primary { background: var(--header-button-bg); color: var(--header-button-ink); border-color: var(--header-button-bg); }
.appHeader .btn.secondary { color: var(--header-ink); border-color: var(--header-line); }
.intro { background: var(--hero-bg); color: var(--hero-ink); border-radius: var(--hero-radius); }
.intro::after { pointer-events: none; }
.intro p { color: var(--hero-muted); }
.eyebrow { color: var(--forest); }
.intro .eyebrow { color: var(--hero-accent); }
.searchField { background: var(--input-bg); border-color: var(--input-line); }
.searchField:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
.filters select, .formGrid input, .formGrid select, .formGrid textarea, .btn, .pageBtn { background: var(--input-bg); }
.btn.primary, .pageBtn.active { background: var(--forest); }
.plantCard { border-radius: var(--card-radius); box-shadow: var(--card-shadow); }
.imageButton { background: var(--image-bg); }
.scoreBadge { background: var(--score-bg); }
.chip { color: var(--chip-ink); }
.galleryPane { background: var(--gallery-bg); }
.photoStage, .mainPhoto, .thumb { background: var(--photo-bg); }
.photoMeta, .galleryMessage, .galleryHelp { color: var(--photo-muted); }
.lead, .careCard p { color: var(--copy); }
.careCard { background: var(--panel); }
.safetyCard { background: var(--warn); border-color: var(--warning-line); }
.companionNote { background: var(--note-bg); color: var(--copy); }
.companionTag { border-color: var(--line); background: var(--panel); }
.formGrid label { color: var(--muted); }
.uploadBox { background: var(--upload-bg); border-color: var(--moss); }
.uploadItem { background: var(--image-bg); }
.detailBreadcrumb span { border-color: var(--line); }
.empty { border-color: var(--moss); }
.toast { background: var(--forest-dark); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible { outline-color: var(--focus); }
.photoViewer { background: var(--viewer-bg); }
.viewerHeader, .viewerFooter { background: var(--viewer-panel); border-color: var(--viewer-line); }
.viewerCounter, .viewerFooter { color: var(--viewer-muted); }
.viewerFooter a { color: var(--viewer-link); }
.photoViewer button { background: var(--viewer-button); border-color: var(--viewer-line); }
.photoViewer button:hover, .photoArrow:hover { background: var(--viewer-hover); }
.photoViewer .viewerArrow { background: var(--viewer-button); }
.viewerError { background: var(--viewer-panel); }

/* Földközel: a quiet, warm editorial style with generous serif headings. */
[data-theme="earth"] .intro { border: 1px solid #dac7ad; box-shadow: none; }
[data-theme="earth"] .intro h1 { letter-spacing: -.03em; line-height: 1.08; }
[data-theme="earth"] .intro::after { border-color: rgba(145,103,66,.07); }
[data-theme="earth"] .plantCard h2 { font-size: 23px; }
[data-theme="earth"] .cardBody { padding: 18px; }
[data-theme="earth"] .cardFooter { padding-top: 12px; }
[data-theme="earth"] .careCard { border-radius: 12px; }
[data-theme="earth"] .sectionTitle { border-bottom: 1px solid var(--line); padding-bottom: 12px; }
[data-theme="earth"] .plantPage .galleryPane { border: 1px solid #dacbb8; border-radius: 16px; }

/* Natúr: restrained geometry, clear typography, fewer visual containers. */
[data-theme="natural"] .appHeader { box-shadow: none; border-bottom: 1px solid var(--line); }
[data-theme="natural"] .brand strong { font-size: 20px; font-weight: 600; letter-spacing: -.03em; }
[data-theme="natural"] .brandMark { border-radius: 8px; }
[data-theme="natural"] .intro { box-shadow: none; padding-top: 40px; padding-bottom: 40px; }
[data-theme="natural"] .intro::after { display: none; }
[data-theme="natural"] .intro h1 { font-weight: 500; letter-spacing: -.05em; line-height: 1.06; }
[data-theme="natural"] .eyebrow { font-size: 11px; letter-spacing: .16em; }
[data-theme="natural"] .controlPanel { box-shadow: none; }
[data-theme="natural"] .btn, [data-theme="natural"] .filters select,
[data-theme="natural"] .searchField, [data-theme="natural"] .pageBtn { border-radius: 6px; }
[data-theme="natural"] .plantCard { background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; overflow: visible; }
[data-theme="natural"] .plantCard:hover { transform: none; box-shadow: none; }
[data-theme="natural"] .imageButton { border-radius: 8px; overflow: hidden; }
[data-theme="natural"] .cardBody { padding: 16px 0; }
[data-theme="natural"] .plantCard h2 { letter-spacing: -.025em; font-size: 20px; line-height: 1.25; }
[data-theme="natural"] .chip { border-radius: 4px; }
[data-theme="natural"] .cardFooter { border: 0; padding-top: 4px; }
[data-theme="natural"] .plantPage .galleryPane { border-radius: 10px; box-shadow: none; }
[data-theme="natural"] .plantPage .detailBody h1 { font-weight: 500; letter-spacing: -.04em; }
[data-theme="natural"] .sectionTitle { font-size: 22px; letter-spacing: -.025em; }
[data-theme="natural"] .careGrid { gap: 16px; }
[data-theme="natural"] .careCard { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; padding: 14px 0; background: transparent; }
[data-theme="natural"] .careCard.safetyCard { background: var(--warn); border: 1px solid var(--warning-line); border-radius: 6px; padding: 14px; }
[data-theme="natural"] .companionTag { border-radius: 6px; }

/* Mesekert: soft shapes, pastel accents and small, unobtrusive garden icons. */
[data-theme="meadow"] .appHeader { border-bottom: 1px solid var(--line); box-shadow: 0 4px 18px rgba(86,106,67,.04); }
[data-theme="meadow"] .brandMark { border-radius: 14px 20px 14px 20px; background: #eee6f1; border-color: #d9cfe0; }
[data-theme="meadow"] .intro { border: 1px solid #dce2cb; box-shadow: none; }
[data-theme="meadow"] .intro::after { display: none; }
[data-theme="meadow"] .intro .eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; letter-spacing: .11em; }
[data-theme="meadow"] .intro .eyebrow::before { content: ""; display: inline-block; flex: 0 0 27px; height: 29px; background: url("assets/mushroom.svg") center/contain no-repeat; }
[data-theme="meadow"] .intro h1 { letter-spacing: -.025em; line-height: 1.1; }
[data-theme="meadow"] .intro h1::after { content: ""; display: inline-block; width: .85em; height: .85em; margin-left: .2em; background: url("assets/butterfly.svg") center/contain no-repeat; transform: rotate(12deg); }
[data-theme="meadow"] .btn { border-radius: 16px; }
[data-theme="meadow"] .plantCard:nth-child(3n+1) { border-radius: 24px 24px 24px 10px; }
[data-theme="meadow"] .plantCard:nth-child(3n+2) { border-color: #e3d9e6; border-radius: 24px 10px 24px 24px; }
[data-theme="meadow"] .plantCard:nth-child(3n+3) { border-color: #e8dccb; }
[data-theme="meadow"] .plantCard h2 { font-size: 23px; }
[data-theme="meadow"] .cardBody { padding: 17px; }
[data-theme="meadow"] .plantPage .galleryPane { border-radius: 26px 26px 26px 12px; border: 1px solid var(--line); }
[data-theme="meadow"] .careCard { border-radius: 18px; }
[data-theme="meadow"] .sectionTitle { display: flex; align-items: center; gap: 9px; }
[data-theme="meadow"] .sectionTitle:nth-of-type(2)::before { content: ""; flex: 0 0 27px; height: 30px; background: url("assets/mushroom.svg") center/contain no-repeat; }
[data-theme="meadow"] .sectionTitle:nth-of-type(3)::after { content: ""; flex: 0 0 30px; height: 30px; background: url("assets/butterfly.svg") center/contain no-repeat; transform: rotate(-10deg); }
[data-theme="meadow"] .companionNote { border-left-color: #bba8c8; }

@media (max-width: 760px) {
  [data-theme="natural"] .intro { padding: 26px 24px; }
  [data-theme="earth"] .cardBody, [data-theme="meadow"] .cardBody { padding: 14px; }
  [data-theme="earth"] .plantCard h2, [data-theme="meadow"] .plantCard h2 { font-size: 21px; }
}
@media (max-width: 480px) {
  [data-theme="meadow"] .intro { padding: 22px 20px; border-radius: 24px 36px 24px 24px; }
  [data-theme="meadow"] .intro .eyebrow { font-size: 9px; letter-spacing: .05em; gap: 6px; }
  [data-theme="meadow"] .intro .eyebrow::before { flex-basis: 23px; height: 25px; }
}