:root {
  color-scheme: light; --text: #242c27; --bg: #f6f5f0; --muted: #70756f; --line: #dedfd7;
  --green: #28523d; --brand-dot: #63826b; --surface: #eeeee7; --selected-text: #fff; --filter-bg: #fff;
  --quiet: #858a82; --star: #a0803e; --star-fill: #c8a55c; --diet-text: #3f6649; --diet-bg: #e7ede2;
  --error-bg: #f3e9df; --error-text: #785332;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  color-scheme: dark; --text: #e0e5df; --bg: #191e1b; --muted: #a4aea4; --line: #343d35;
  --green: #91b89a; --brand-dot: #91b89a; --surface: #252e27; --selected-text: #152219; --filter-bg: #2b362e;
  --quiet: #8a948b; --star: #d6b776; --star-fill: #d6b776; --diet-text: #abd3ac; --diet-bg: #293d2d;
  --error-bg: #3b2d22; --error-text: #e4bc95;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark; --text: #e0e5df; --bg: #191e1b; --muted: #a4aea4; --line: #343d35;
  --green: #91b89a; --brand-dot: #91b89a; --surface: #252e27; --selected-text: #152219; --filter-bg: #2b362e;
  --quiet: #8a948b; --star: #d6b776; --star-fill: #d6b776; --diet-text: #abd3ac; --diet-bg: #293d2d;
  --error-bg: #3b2d22; --error-text: #e4bc95;
}
:root { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; color: var(--text); background: var(--bg); font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button { font: inherit; color: inherit; cursor: pointer; }
a { color: var(--green); }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 2px solid var(--green); outline-offset: 4px; }
.shell { max-width: 760px; margin: auto; padding: 0 20px; }
.masthead { display: flex; align-items: center; justify-content: space-between; min-height: 83px; border-bottom: 1px solid var(--line); }
.wordmark { font-size: 29px; font-weight: 750; letter-spacing: -1.5px; text-decoration: none; color: var(--text); }
.wordmark span { color: var(--brand-dot); }
.location { max-width: 210px; text-align: right; line-height: 1.6; font-size: 12px; color: var(--muted); }
.intro { padding: 31px 0 25px; }
h1 { margin: 0 0 8px; font-size: 29px; line-height: 1.15; font-weight: 650; letter-spacing: -1px; }
.intro p { margin: 0; font-size: 14px; color: var(--muted); }
.days { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--surface); }
.day { border: 0; background: transparent; padding: 12px 5px; min-height: 66px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 13px; }
.day + .day { border-left: 1px solid var(--line); }
.day span { font-size: 11px; opacity: .7; }
.day[aria-pressed='true'] { background: var(--green); color: var(--selected-text); }
.toolbar { display: flex; align-items: flex-start; justify-content: space-between; padding: 20px 0 10px; gap: 10px; }
.universities { display: flex; flex-wrap: wrap; gap: 4px; }
.filter { min-height: 40px; padding: 7px 13px; border: 1px solid transparent; border-radius: 5px; background: transparent; font-size: 13px; color: var(--muted); }
.filter[aria-pressed='true'] { background: var(--filter-bg); border-color: var(--line); color: var(--text); font-weight: 600; }


.results-line { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 6px 0 20px; color: var(--muted); font-size: 12px; }
.results-line p { margin: 0; }
#full-date { white-space: nowrap; }
.group { margin: 0 0 27px; }
.group-heading { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 12px; font-weight: 650; letter-spacing: .7px; text-transform: uppercase; }
.group-heading span { letter-spacing: 0; font-size: 11px; font-weight: 400; color: var(--muted); }
.cafeteria { position: relative; border-top: 1px solid var(--line); }
.cafeteria:last-child { border-bottom: 1px solid var(--line); }
.cafeteria summary { min-height: 79px; display: flex; align-items: center; gap: 12px; padding: 15px 58px 15px 2px; cursor: pointer; list-style: none; }
.cafeteria summary::-webkit-details-marker { display: none; }
.cafeteria summary::before { content: ''; width: 6px; height: 6px; flex-shrink: 0; border-right: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); transform: rotate(-45deg); transition: transform .15s; margin-right: 3px; }
.cafeteria details[open] > summary::before { transform: rotate(45deg); }
.cafeteria-name { display: block; font-size: 16px; font-weight: 600; line-height: 1.3; }
.cafeteria-meta { display: block; font-size: 12px; color: var(--muted); margin-top: 5px; }
.favorite { position: absolute; right: 0; top: 17px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: transparent; color: var(--quiet); }
.favorite svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.5; fill: none; }
.favorite[aria-pressed='true'] { color: var(--star); }
.favorite[aria-pressed='true'] svg { fill: var(--star-fill); stroke: var(--star); }
.unavailable { color: var(--quiet); }
.unavailable .cafeteria-meta, .unavailable .favorite { color: var(--quiet); }
.unavailable .cafeteria-name { font-weight: 450; }
.menu-list { list-style: none; padding: 0 0 0 19px; margin: 0; }
.menu { padding: 19px 0; border-top: 1px solid var(--line); }
.menu-top { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.menu-copy { flex: 1; min-width: 0; }
.menu-category { margin: 0 0 7px; color: var(--muted); font-size: 11px; letter-spacing: .35px; }
h3 { font-size: 16px; line-height: 1.4; font-weight: 600; margin: 0 0 6px; }
.description { font-size: 13px; line-height: 1.6; color: var(--muted); margin: 0; }
.menu-photo { width: 82px; height: 82px; border-radius: 5px; object-fit: cover; background: var(--surface); }
.menu-bottom { margin-top: 13px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.price { font-size: 13px; font-weight: 600; }
.price small { font-size: 11px; font-weight: 400; margin-left: 5px; color: var(--muted); }
.diet { font-size: 11px; color: var(--diet-text); background: var(--diet-bg); padding: 3px 7px; border-radius: 3px; }
.menu-info { margin-top: 11px; font-size: 12px; color: var(--muted); }
.menu-info summary { display: block; min-height: 32px; padding: 7px 0; font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
.menu-info summary::before { display: none; }
.menu-info p { line-height: 1.6; margin: 6px 0; }
.empty { color: var(--muted); font-size: 13px; padding: 0 0 18px 19px; }
.error { background: var(--error-bg); color: var(--error-text); padding: 13px; border-radius: 5px; font-size: 13px; line-height: 1.5; margin-bottom: 16px; }
.error details { margin-top: 7px; font-size: 11px; overflow-wrap: anywhere; }
.storage-note { font-size: 12px; padding: 9px 0; color: var(--error-text); }
.skeleton { height: 79px; border-top: 1px solid var(--line); display: flex; align-items: center; }
.skeleton::after { content: ''; height: 12px; width: 48%; background: var(--surface); border-radius: 3px; }
footer { padding: 20px 0 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.6; }
footer p { margin: 0 0 4px; }
@media (min-width: 600px) { .shell { padding: 0 32px; } .masthead { min-height: 100px; } .intro { padding-top: 42px; } h1 { font-size: 36px; } .day { font-size: 14px; } .menu-photo { width: 112px; height: 96px; } .menu-list { padding-left: 24px; } }
@media (max-width: 360px) { .shell { padding: 0 14px; } h1 { font-size: 27px; }  .results-line { font-size: 11px; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }



/* Compact overview: keep controls tappable and menu text readable. */
.shell { max-width: 880px; padding: 0 16px; }
.masthead { min-height: 48px; margin-bottom: 10px; }
.masthead h1 { margin: 0; line-height: 1; font-size: inherit; }
.wordmark { font-size: 23px; letter-spacing: -1px; }
.location { font-size: 10px; max-width: 230px; }
.day { min-height: 44px; padding: 6px 4px; gap: 2px; font-size: 12px; }
.day span { font-size: 10px; }
.days { border-radius: 5px; }
.toolbar { padding: 6px 0 0; gap: 4px; }
.universities { gap: 0; }
.filter { min-height: 44px; padding: 5px 9px; font-size: 12px; }

.results-line { padding: 2px 0 10px; font-size: 11px; }
.group { margin-bottom: 16px; }
.group-heading { margin-bottom: 4px; font-size: 11px; }
.cafeteria summary { min-height: 48px; align-items: flex-start; padding: 10px 42px 10px 0; gap: 8px; }
.cafeteria summary::before { margin-top: 5px; }
.cafeteria summary > div { flex: 1; min-width: 0; }
.cafeteria-name { display: inline; font-size: 14px; line-height: 1.4; }
.cafeteria-meta { display: inline; margin: 0 0 0 7px; font-size: 10px; }
.favorite { top: 1px; right: -6px; }
.favorite svg { width: 18px; height: 18px; }
.menu-overview { display: grid; gap: 7px; margin-top: 8px; }
.menu-preview { display: grid; gap: 2px; }
.preview-name { font-size: 12px; line-height: 1.4; font-weight: 450; overflow-wrap: anywhere; }
.preview-time { font-size: 10px; color: var(--muted); }
.cafeteria details[open] > summary .menu-overview { display: none; }
.prices { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 3px 10px; font-size: 11px; line-height: 1.6; font-variant-numeric: tabular-nums; }
.price-entry { display: inline-flex; gap: 4px; white-space: nowrap; }
.price-currency, .price-label { color: var(--muted); font-size: 10px; font-weight: 400; }
.price-entry strong { font-weight: 550; }
.menu-list { padding-left: 14px; }
.menu { padding: 10px 0; }
.menu-top { gap: 10px; }
.menu-category { margin-bottom: 3px; font-size: 10px; }
h3 { font-size: 14px; line-height: 1.35; margin-bottom: 4px; }
.description { font-size: 12px; line-height: 1.5; }
.menu-photo { width: 64px; height: 64px; border-radius: 4px; }
.menu-bottom { margin-top: 6px; gap: 6px 10px; }
.diet { padding: 1px 5px; font-size: 10px; }
.menu-info { margin-top: 3px; }
.menu-info summary { min-height: 32px; padding: 5px 0; font-size: 10px; }
.empty { font-size: 12px; padding: 0 0 10px 14px; }
.skeleton { height: 48px; }
footer { padding: 12px 0 18px; font-size: 10px; }
@media (min-width: 600px) {
  .shell { padding: 0 24px; }
  .menu-preview { grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; align-items: baseline; }
  .menu-preview .prices { justify-content: flex-end; }
  .menu-photo { width: 72px; height: 64px; }
}

.theme-control { display: flex; align-items: center; gap: 6px; margin-left: auto; color: var(--muted); font-size: 11px; }
.theme-control select { font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 4px; min-height: 36px; padding: 4px; }
.theme-control select:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.masthead { gap: 12px; }
.masthead .location { display: none; }
@media (min-width: 600px) { .masthead .location { display: block; } }
.install-button { border: 1px solid var(--line); background: var(--surface); border-radius: 4px; padding: 6px 9px; min-height: 36px; font-size: 11px; white-space: nowrap; }
.install-button[hidden] { display: none; }
dialog { max-width: min(400px, calc(100% - 32px)); padding: 22px; color: var(--text); background: var(--bg); border: 1px solid var(--line); border-radius: 8px; }
dialog::backdrop { background: rgb(0 0 0 / .45); }
dialog h2 { font-size: 18px; margin: 0 0 12px; }
dialog p { font-size: 14px; line-height: 1.6; }
dialog button { min-height: 44px; padding: 8px 16px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); }
@media (max-width: 360px) { .theme-control { font-size: 0; } .theme-control select { font-size: 11px; } }