/* Small overrides on top of Pico. Keep this file short. */

/* Theme tweaks. Pico applies dark mode via `:root:not([data-theme])` inside a
   prefers-color-scheme query, so match that specificity to override its variables. */
/* Flat 17px base at every width (Pico steps the root size up per breakpoint; `html:root`
   outranks those queries). Headings are rem multiples so they follow the base. */
html:root { --pico-font-size: 106.25%; }
h1, h2, h3, h4, h5, h6 { --pico-font-weight: 300; }
h1 { --pico-font-size: 2.6rem; --pico-typography-spacing-top: 3.5rem; }
h2 { --pico-font-size: 2rem; --pico-typography-spacing-top: 3rem; }
h3 { --pico-font-size: 1.6rem; --pico-typography-spacing-top: 2.4rem; }
h4 { --pico-font-size: 1.3rem; --pico-typography-spacing-top: 2rem; }
[data-theme=dark] { --pico-background-color: #1f2020; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme=light]) { --pico-background-color: #1f2020; }
}

/* Pill buttons: Pico's buttons read --pico-border-radius, so redefine it on buttons only
   (the root value still shapes inputs, cards, and dropdowns). */
button, [role="button"], [type="submit"], [type="button"], [type="reset"], summary[role="button"] { --pico-border-radius: 999px; }

.brand { text-decoration: none; }

.recipe-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--pico-spacing);
}
/* Cards sit flat on the page: no background, shadow, or inner padding; only the image is rounded. */
.recipe-card { margin: 0; padding: 0; background: transparent; box-shadow: none; }
.recipe-card > a { display: block; color: inherit; text-decoration: none; }
.recipe-card img, .placeholder-image { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; border-radius: var(--pico-border-radius); }
.placeholder-image { background: var(--pico-muted-border-color); }
.recipe-card h3 { margin: 0; padding: 0.75rem 0 0.25rem; font-size: 1.05rem; }
.recipe-card .meta { padding: 0 0 0.5rem; }

.meta { color: var(--pico-muted-color); font-size: 0.9rem; }
.meta span + span:not(.import-method)::before { content: " · "; }
.import-method {
  display: inline-block;
  padding: 0 0.4em;
  border-radius: 0.3em;
  background: var(--pico-muted-border-color);
  margin-left: 0.5em;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.actions { display: flex; gap: 0.5rem; align-items: center; }
.actions form { margin: 0; }
.actions a[role="button"], .actions button { margin-bottom: 0; }
/* Save/Cancel on long forms stay pinned to the bottom of the window until the form's own end
   scrolls into view (sticky is bounded by the form, and the bar is its last child). */
.sticky-actions {
  position: sticky; bottom: 0; z-index: 2;
  margin-top: var(--pico-spacing); padding: 0.75rem 0;
  background: var(--pico-background-color); border-top: 1px solid var(--pico-muted-border-color);
}

.recipe { padding: 0; background: transparent; box-shadow: none; }
.recipe > header, .recipe > footer { margin: 0; padding: 0; background: transparent; border: 0; }
.recipe > header { margin-bottom: var(--pico-spacing); }
.recipe hgroup > h1 { margin-bottom: 1.2rem; }  /* Pico's hgroup zeroes child margins; match its specificity */
.recipe > footer { margin-top: var(--pico-spacing); }
.recipe .hero { width: 100%; max-height: 420px; object-fit: cover; border-radius: var(--pico-border-radius); margin-bottom: var(--pico-spacing); }
.recipe-body { display: grid; grid-template-columns: minmax(260px, 2fr) 3fr; gap: calc(var(--pico-spacing) * 3); margin-top: var(--pico-spacing); }
@media (max-width: 768px) { .recipe-body { grid-template-columns: 1fr; } }
/* Ingredients: one grid for the whole list so the amount column lines up across sections */
.ingredient-grid { display: grid; grid-template-columns: max-content 1fr; column-gap: 1.75rem; row-gap: 0.85rem; align-items: baseline; }
.section-label { margin: 0.6rem 0 0.15rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pico-color); }
.ingredient-grid .section-label { grid-column: 1 / -1; }
.ingredient-grid .section-label:first-child { margin-top: 0; }
.steps .section-label { margin: 0 0 0.9rem; padding-bottom: 0.3rem;}
.steps .step-list + .section-label { margin-top: 0.4rem; }
.ingredient-grid .amt { font-weight: 600; white-space: nowrap; }
.ingredient-grid .what { min-width: 0; }
/* Steps: 'STEP n' label above each step */
.step-list { list-style: none; padding: 0; margin: 0; counter-reset: step; }
.step-list li { counter-increment: step; margin-bottom: 1.6rem; line-height: 1.6; }
.step-list li p { margin: 0 0 0.6rem; }
.step-list li p:last-child { margin-bottom: 0; }
.step-list li::before { content: "Step " counter(step); display: block; margin-bottom: 0.4rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }

.errors { border-left: 4px solid var(--pico-del-color); }
.errors ul { margin: 0; }

/* Parse preview / correction table */
.parse-preview summary { cursor: pointer; font-weight: 600; }
.parse-summary .hint { display: block; font-size: 0.85em; }
.table-scroll { overflow-x: auto; }
.parse-table { font-size: 0.9rem; }
.parse-table td, .parse-table th { padding: 0.35rem 0.5rem; vertical-align: top; }
.parse-table td.raw { font-family: inherit; max-width: 22rem; }
.parse-table td.note { color: var(--pico-muted-color); }
.parse-table tr.needs-review td.raw { border-left: 3px solid var(--pico-mark-background-color, #fde68a); }
.parse-table tr.preview td { color: var(--pico-muted-color); }
.parse-meta { white-space: nowrap; }
.source { font-size: 0.75em; text-transform: uppercase; letter-spacing: 0.04em; padding: 0 0.35em; border-radius: 0.3em; background: var(--pico-muted-border-color); }
.source-manual { background: var(--pico-ins-color); color: #fff; }
.source-none { background: var(--pico-del-color); color: #fff; }
.conf { font-size: 0.8em; color: var(--pico-muted-color); margin-left: 0.25em; }
.flag { color: #b45309; margin-left: 0.25em; }
.row-actions { white-space: nowrap; }
.row-actions button { padding: 0.15rem 0.5rem; font-size: 0.8rem; margin: 0; width: auto; }
.parse-edit label { font-size: 0.85rem; margin-bottom: 0; }
.parse-edit input { margin-bottom: 0.5rem; }
.parse-edit .actions button { width: auto; margin-bottom: 0; }

/* Import */
.draft-notice { border-left: 4px solid var(--pico-primary); }
.draft-notice ul { margin: 0.5rem 0 0; }
.photo-preview { max-width: 320px; max-height: 220px; object-fit: cover; border-radius: var(--pico-border-radius); display: block; margin-bottom: 0.5rem; }
fieldset.photo { margin-bottom: var(--pico-spacing); }

/* Tags */
.tag-chips { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.25rem 0 0.5rem; }
.tag-chips.small { margin: 0; padding: 0 0 0.5rem; }
.tag-chip {
  display: inline-flex; align-items: center; gap: 0.3em;
  padding: 0.1em 0.6em; border-radius: 999px; font-size: 0.8rem; line-height: 1.6;
  color: inherit; text-decoration: none; cursor: pointer;  /* inherit, not --pico-color: links redefine that to blue */
  /* Monochrome: a faint tint of the text colour, so it reads the same in light and dark. */
  background: color-mix(in srgb, currentColor 10%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 14%, transparent);
}
.tag-chip:hover { background: color-mix(in srgb, currentColor 18%, transparent); }
.tag-chip small { opacity: 0.65; font-size: 0.75em; text-transform: uppercase; letter-spacing: 0.04em; }
.tag-chip .count { opacity: 0.6; font-size: 0.85em; }
.tag-chip button { all: unset; cursor: pointer; padding: 0 0.2em; opacity: 0.6; }
.tag-chip button:hover { opacity: 1; }
.tag-chip.active, .tag-chip.active:hover { border-color: var(--pico-primary); background: var(--pico-primary); color: var(--pico-primary-inverse); }
.tag-chip.new-tag em { font-style: normal; opacity: 0.7; font-size: 0.8em; }
.tag-add { display: grid; grid-template-columns: 8rem 1fr auto; gap: 0.5rem; align-items: start; }
.tag-add select, .tag-add input, .tag-add button { margin-bottom: 0.25rem; }
.tag-editor small { display: block; }

/* Search */
.search-form [role=search] { margin-bottom: 0.25rem; }
.search-mode { display: inline-flex; align-items: center; margin: 0 0 0.5rem 0.25rem; font-size: 0.9rem; color: var(--pico-muted-color); }
.search-mode input[role=switch] { margin-right: 0.35rem; }
.facet-bar { display: flex; flex-direction: column; gap: 0.25rem; margin-bottom: var(--pico-spacing); }
.facet { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.facet-name { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--pico-muted-color); width: 5.5rem; }
.results-summary a { margin-left: 0.25em; }
.rating { color: #b45309; }
.not-cooked { opacity: 0.6; }

/* Grocery basket */
.basket-btn { margin: 0; display: inline; }
.basket-btn button { width: auto; margin: 0; }
#basket-count:empty { display: none; }
.basket-panel, .basket-add-panel { margin-bottom: calc(var(--pico-spacing) * 1.5); }
.basket-panel h2, .basket-add-panel h2 { font-size: 1.1rem; }
.basket-list, .basket-results { list-style: none; padding: 0; margin: 0 0 0.75rem; }
.basket-list li, .basket-results li { display: flex; align-items: center; gap: 0.75rem; padding: 0.35rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.basket-list li a, .basket-results li a { flex: 1; }
.basket-list .remove, .basket-results .add { width: auto; margin: 0; padding: 0.1rem 0.6rem; font-size: 0.85rem; }
.basket-results .added { white-space: nowrap; }
#basket .actions a, #basket .actions button { width: auto; }
.grocery-header .actions { flex-wrap: wrap; }
.grocery-header .actions button, .grocery-header .actions a { width: auto; }
.show-sources { margin: 0; display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.9rem; }
.grocery { columns: 2; column-gap: 3rem; }
@media (max-width: 768px) { .grocery { columns: 1; } }
.aisle { break-inside: avoid; margin-bottom: var(--pico-spacing); }
.aisle h2 { font-size: 1rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--pico-muted-color); border-bottom: 1px solid var(--pico-muted-border-color); margin-bottom: 0.5rem; }
.aisle ul { list-style: none; padding: 0; }
.aisle > ul > li { padding: 0.15rem 0; }
.aisle .item { font-weight: 600; }
.aisle .from { font-size: 0.8rem; }
.sources { margin: 0.1rem 0 0.4rem 1rem; font-size: 0.85rem; }
.sources li { padding: 0; }

/* Inline confirmation (no window.confirm: embedded browsers suppress native dialogs) */
details.confirm { position: relative; margin: 0; }
details.confirm > summary { list-style: none; display: inline-block; width: auto; margin: 0; }
details.confirm > summary::-webkit-details-marker { display: none; }
details.confirm > summary::after { display: none; }  /* Pico's chevron */
details.confirm[open] > summary { opacity: 0.6; }
.confirm-body {
  position: absolute; z-index: 10; top: calc(100% + 0.4rem); left: 0; min-width: 22rem;
  display: flex; flex-direction: column; gap: 0.5rem; margin: 0;
  padding: 0.75rem 1rem; border-radius: var(--pico-border-radius);
  background: var(--pico-card-background-color); border: 1px solid var(--pico-muted-border-color);
  box-shadow: var(--pico-card-box-shadow);
}
.confirm-body button { width: auto; margin: 0; align-self: flex-start; }

/* Settings */
form.inline { margin: 0; display: inline; }
button.small, [role="button"].small, summary.small { padding: 0.15rem 0.6rem; font-size: 0.8rem; width: auto; margin: 0; }
.howto { margin-top: var(--pico-spacing); }

/* Form busy state (see js/app.js) */
.is-submitting { pointer-events: none; opacity: 0.75; }

/* Recipe links in text */
.recipe-link { text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 0.15em; }
.recipe-link.missing { text-decoration-style: wavy; text-decoration-color: var(--pico-del-color); cursor: help; }
.link-helper { margin-bottom: var(--pico-spacing); }

/* Books */
.book-switcher { margin: 0; }
.book-switcher summary { margin: 0; padding: 0.35rem 0.75rem; font-weight: 600; }
.book-switcher ul { min-width: 12rem; }
.book-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--pico-spacing); margin-bottom: calc(var(--pico-spacing) * 2); }
.book-card { margin: 0; padding: 0; overflow: hidden; }
.book-card > a { display: block; color: inherit; text-decoration: none; }
.book-card img, .book-placeholder { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.book-placeholder { display: flex; align-items: center; justify-content: center; font-size: 3rem; font-weight: 700; color: var(--pico-muted-color); }
.book-card h3 { margin: 0; padding: 0.75rem 1rem 0.25rem; font-size: 1.05rem; }
.book-card .meta { padding: 0 1rem 0.75rem; }
.inline-select { display: flex; gap: 0.5rem; align-items: end; margin: 0; }
.inline-select label { margin: 0; flex: 1; }
.inline-select select { margin: 0; }
.inline-select button { width: auto; margin: 0; }
.book-actions .confirm-body { min-width: 24rem; }

/* Cook log */
.recipe-footer { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; align-items: center; margin-top: var(--pico-spacing); }
.recipe-footer.meta span + span:not(.import-method)::before { content: none; }
.cook-log { margin-top: calc(var(--pico-spacing) * 2); padding-top: var(--pico-spacing); border-top: 1px solid var(--pico-muted-border-color); }
.cook-log h2 { font-size: 1.2rem; margin-bottom: 0.25rem; }
/* "Add note" folds the form away; the summary is the button, the chevron is dropped. */
details.add-note { margin: 0; }
details.add-note > summary { list-style: none; display: inline-block; width: auto; margin: 0; }
details.add-note > summary::-webkit-details-marker { display: none; }
details.add-note > summary::after { display: none; }
details.add-note[open] > summary { display: none; }
.cook-form .grid { align-items: center; }
.cook-form input[type=date] { margin-bottom: 0; }
.stars { margin: 0; padding: 0; }
.cook-entries { list-style: none; padding: 0; margin: 0 0 var(--pico-spacing); }
.cook-entry { list-style: none; padding: 0.6rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.cook-entry::marker { content: ""; }
.cook-entry-head { display: flex; gap: 0.75rem; align-items: center; flex-wrap: wrap; }
.cook-date { font-weight: 600; }
.cook-entry-actions { margin-left: auto; display: inline-flex; gap: 0.35rem; align-items: center; }
.cook-entry-actions details.confirm { display: inline-block; }
.cook-notes { margin: 0.35rem 0 0; }
.cook-form h3 { font-size: 1rem; margin-bottom: 0.5rem; }
.cook-form button[type=submit] { width: auto; }
.stars legend { font-size: 0.875rem; margin-bottom: 0.25rem; }
.star-input { display: inline-flex; flex-direction: row-reverse; gap: 0.1em; font-size: 1.8rem; line-height: 1; }
.star-input input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.star-input label { cursor: pointer; color: var(--pico-muted-border-color); margin: 0; }
.star-input [type=radio] ~ label:not(:last-of-type) { margin-inline-end: 0; }  /* beat Pico on specificity, margin only */
.star-input input:checked ~ label, .star-input label:hover, .star-input label:hover ~ label { color: #f59e0b; }
.star-input input:focus-visible + label { outline: 2px solid var(--pico-primary); border-radius: 3px; }
.shelf { margin-bottom: calc(var(--pico-spacing) * 1.5); }
.shelf h2 { font-size: 1.1rem; margin-bottom: 0.1rem; }
.shelf .recipe-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }

/* Icons */
.icon { vertical-align: -0.18em; flex-shrink: 0; }
.with-icon { display: inline-flex; align-items: center; gap: 0.4em; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; padding: 0.4rem 0.55rem; line-height: 1; }
.icon-button.small { padding: 0.25rem 0.4rem; }
nav .icon-button { padding: 0.35rem 0.6rem; }
nav .icon-link { display: inline-flex; align-items: center; }
.flag .icon { color: #b45309; }

/* Add-a-recipe tabs */
.tabs { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; }
.tabs > input[type=radio] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.tabs > label, .tabs > .tab-link { margin: 0; padding: 0.4rem 0.9rem; border-radius: 999px; border: 1px solid var(--pico-muted-border-color); cursor: pointer; font-weight: 600; text-decoration: none; color: var(--pico-color); }
.tabs > input:checked + label { background: var(--pico-primary); border-color: var(--pico-primary); color: var(--pico-primary-inverse); }
.tabs > input:focus-visible + label { outline: 2px solid var(--pico-primary); outline-offset: 2px; }
.tabs > .tab-error, .tabs > .tab-panel { flex-basis: 100%; }
.tabs > .tab-panel { display: none; margin-top: var(--pico-spacing); }
#tab-link:checked ~ #panel-link, #tab-text:checked ~ #panel-text, #tab-photo:checked ~ #panel-photo { display: block; }
.tab-error { margin-top: var(--pico-spacing); margin-bottom: 0; }

/* Week planner */
.plan-layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(240px, 1fr); gap: calc(var(--pico-spacing) * 2); }
@media (max-width: 900px) { .plan-layout { grid-template-columns: 1fr; } }
.plan-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: var(--pico-spacing); }
.week-nav { display: flex; align-items: center; gap: 0.6rem; }
.week-nav h1 { font-size: 1.3rem; margin: 0; }
.week-nav [role=button].small { padding: 0.1rem 0.7rem; }
.plan-header [role=button] { width: auto; margin: 0; }
.week-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0.5rem; }
@media (max-width: 1100px) { .week-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 760px) { .week-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .week-grid { grid-template-columns: 1fr; } }
.day { --day-radius: var(--pico-border-radius); border: 1px solid var(--pico-muted-border-color); border-radius: var(--day-radius); min-height: 9rem; display: flex; flex-direction: column; background: var(--pico-card-background-color); }
.day.is-today { border-color: var(--pico-primary); }
.day.is-selected .day-head { background: var(--pico-primary); color: var(--pico-primary-inverse); }
.day.drag-over { outline: 2px dashed var(--pico-primary); outline-offset: -2px; }
.day-head { all: unset; cursor: pointer; display: flex; justify-content: space-between; align-items: baseline; padding: 0.4rem 0.6rem; border-bottom: 1px solid var(--pico-muted-border-color); border-radius: var(--day-radius) var(--day-radius) 0 0; font-size: 0.85rem; }
.day-head:focus-visible { outline: 2px solid var(--pico-primary); }
.day-name { font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.day-date { opacity: 0.7; }
.day-entries { list-style: none; margin: 0; padding: 0.4rem; display: flex; flex-direction: column; gap: 0.35rem; flex: 1; }
.plan-entry { display: flex; align-items: center; gap: 0.3rem; padding: 0.35rem 0.5rem; border-radius: var(--pico-border-radius); background: var(--pico-background-color); border: 1px solid var(--pico-muted-border-color); cursor: grab; font-size: 0.9rem; }
.plan-entry a { flex: 1; min-width: 0; overflow-wrap: break-word; }
.plan-entry .remove { padding: 0.1rem 0.3rem; }
.plan-side h2 { font-size: 1.1rem; }
.plan-results { list-style: none; padding: 0; margin: 0; }
.plan-result { display: flex; align-items: center; gap: 0.5rem; padding: 0.4rem 0; border-bottom: 1px solid var(--pico-muted-border-color); cursor: grab; }
.plan-result .title { flex: 1; }
.plan-result .add { margin: 0; padding: 0.15rem 0.6rem; font-size: 0.8rem; width: auto; }

/* Cook mode */
body.cook-mode { font-size: 1.25rem; }
.cook-bar { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 1rem; padding: 0.6rem 1.2rem; background: var(--pico-background-color); border-bottom: 1px solid var(--pico-muted-border-color); }
.cook-bar h1 { font-size: 1.2rem; margin: 0; flex: 1; min-width: 0; }
.cook-bar .meta { font-size: 0.8rem; white-space: nowrap; }
.cook-body { max-width: 62rem; margin: 0 auto; padding: 1.2rem; }
.cook-ingredients { margin-bottom: 1.5rem; }
.cook-ingredients summary { font-weight: 700; cursor: pointer; }
.cook-ingredients .ingredient-grid { margin-top: 0.75rem; font-size: 1.1rem; }
.cook-list li { margin-bottom: 1rem; }
.cook-list li::before { font-size: 0.9rem; }
/* `all: unset` leaves custom properties alone, so undo Pico's button ones by hand: --pico-color
   (the inner <p>s would otherwise paint in the button's inverse colour, white on white in light
   mode) and our pill radius, read here through the list's own variable. */
.cook-list { --step-radius: var(--pico-border-radius); }
.step-toggle { all: unset; --pico-color: inherit; display: block; width: 100%; cursor: pointer; padding: 0.6rem 0.9rem; border-radius: var(--step-radius); border: 1px solid var(--pico-muted-border-color); line-height: 1.55; }
.step-toggle:focus-visible { outline: 2px solid var(--pico-primary); }
.step-toggle p { margin: 0 0 0.6rem; }
.step-toggle p:last-child { margin-bottom: 0; }
.cook-step.is-done .step-toggle { opacity: 0.45; text-decoration: line-through; }
.cook-reset button { width: auto; }
@media (min-width: 900px) {
  .cook-body { display: grid; grid-template-columns: minmax(16rem, 1fr) 2fr; gap: 2.5rem; align-items: start; }
  .cook-ingredients { position: sticky; top: 4rem; }
}

/* Tag management */
.facet-group { margin-bottom: calc(var(--pico-spacing) * 1.25); }
.facet-group-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.25rem; }
.facet-group-head h2 { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--pico-muted-color); margin: 0; }
.rename-facet .confirm-body { min-width: 18rem; }
.rename-facet input { margin: 0; }
.tag-table { margin: 0; }
.tag-table td { padding: 0.3rem 0.5rem; vertical-align: middle; }
.tag-table td.pick { width: 2rem; }
.tag-table td.pick input { margin: 0; }
.tag-table td.count { white-space: nowrap; width: 7rem; }
.tag-table tr.unused td { opacity: 0.6; }
.actions-cell { display: flex; gap: 0.35rem; align-items: center; flex-wrap: wrap; }
.actions-cell input[type=text] { width: 11rem; margin: 0; padding: 0.2rem 0.5rem; font-size: 0.85rem; }
.actions-cell select { width: auto; margin: 0; padding: 0.2rem 1.8rem 0.2rem 0.5rem; font-size: 0.85rem; }
.actions-cell button { margin: 0; }
.merge-bar { margin-top: var(--pico-spacing); padding-top: var(--pico-spacing); border-top: 1px solid var(--pico-muted-border-color); }
.merge-bar h2 { font-size: 1rem; }
.manage-tags { margin: 0.25rem 0 0; }

/* Login: a narrow column; the username field exists only so password managers file the entry. */
.login { max-width: 22rem; padding-top: 18vh; }
.login h1 { margin-top: 0; }
.login button { width: 100%; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }