/* Restaurant menu - printed-menu typography (system serif for headings,
   dotted price leaders) in the elegant layout; a denser two-column grid in
   the compact one. Dietary badges carry an icon AND a text abbreviation. */
.rm { display: grid; gap: 14px; min-width: 0; --rm-serif: Georgia, Cambria, "Times New Roman", "Noto Serif", serif; }
.rm-head { text-align: center; padding-bottom: 10px; border-bottom: 1px solid var(--e-line); }
.rm-title { margin: 0; font-family: var(--rm-serif); font-size: 1.6em; font-weight: 700; letter-spacing: .01em; overflow-wrap: anywhere; }
.rm-sub { margin: 2px 0 0; font-size: .86em; color: var(--e-ink-3); font-style: italic; }
.rm-chips { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.rm-chip {
    font: inherit; font-size: .82em; font-weight: 600; cursor: pointer; min-height: 40px; padding: 4px 14px; border-radius: 999px;
    color: var(--e-ink-2); background: var(--e-surface); border: 1px solid var(--e-line);
}
.rm-chip:hover { border-color: var(--e-accent); color: var(--e-accent-fg); }
.rm-chip:focus-visible, .rm-sec-title:focus-visible { outline: 2px solid var(--e-focus); outline-offset: 2px; }
.rm-find { gap: 4px; }
.rm-count { margin: -6px 0 0; font-size: .82em; color: var(--e-ink-3); }
.rm-count:empty { display: none; }
.rm-body { display: grid; gap: 18px; }
.rm-sec { display: grid; gap: 6px; scroll-margin-top: 8px; }
.rm-sec-title {
    margin: 0; display: flex; align-items: center; gap: 10px; font-family: var(--rm-serif); font-size: 1.12em; font-weight: 700;
    text-transform: uppercase; letter-spacing: .12em; color: var(--e-accent-fg);
}
.rm-sec-title::after { content: ""; flex: 1; height: 1px; background: var(--e-line); }
.rm-note { margin: -2px 0 2px; font-size: .82em; color: var(--e-ink-3); font-style: italic; }
.rm-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.rm-item { display: grid; gap: 3px; min-width: 0; }
.rm-top { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.rm-name { font-weight: 650; font-size: 1em; overflow-wrap: anywhere; }
.rm-is-pick .rm-name { color: var(--e-ink); }
.rm-dots { flex: 1 1 12px; min-width: 12px; border-bottom: 2px dotted var(--e-line-strong); transform: translateY(-4px); }
.rm-price { flex: none; display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 4px; font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; max-width: 60%; }
.rm-pv { white-space: nowrap; }
.rm-vl { font-weight: 500; color: var(--e-ink-2); font-size: .9em; }
.rm-slash { margin-right: 4px; color: var(--e-ink-3); font-weight: 400; }
.rm-desc { margin: 0; font-size: .87em; color: var(--e-ink-2); overflow-wrap: anywhere; }
.rm-tags { display: flex; flex-wrap: wrap; gap: 4px; }

.rm-tag {
    --t: #15803d; display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px 1px 5px; border-radius: 999px; font-size: .72em; font-weight: 750; letter-spacing: .03em;
    color: var(--t); background: color-mix(in srgb, var(--t) 11%, var(--e-bg)); border: 1px solid color-mix(in srgb, var(--t) 30%, transparent); line-height: 1.5;
}
.rm-tag svg { width: 13px; height: 13px; flex: none; }
.rm-t-v { --t: #2f7d32; }
.rm-t-vg { --t: #116149; }
.rm-t-gf { --t: #92510b; }
.rm-t-df { --t: #1d5fa8; }
.rm-t-n { --t: #7a4a22; }
.rm-t-s { --t: #b42318; }
.rm-t-pick { --t: #8a5a00; }
.rm-t-x { --t: var(--e-ink-3); text-transform: uppercase; }
html[data-theme="dark"] .rm-t-v { --t: #86d38a; }
html[data-theme="dark"] .rm-t-vg { --t: #5fd4a8; }
html[data-theme="dark"] .rm-t-gf { --t: #f5bd6b; }
html[data-theme="dark"] .rm-t-df { --t: #8cbcf5; }
html[data-theme="dark"] .rm-t-n { --t: #dcae84; }
html[data-theme="dark"] .rm-t-s { --t: #fca5a5; }
html[data-theme="dark"] .rm-t-pick { --t: #f7cf63; }
@media (prefers-color-scheme: dark) {
    html[data-theme="auto"] .rm-t-v { --t: #86d38a; }
    html[data-theme="auto"] .rm-t-vg { --t: #5fd4a8; }
    html[data-theme="auto"] .rm-t-gf { --t: #f5bd6b; }
    html[data-theme="auto"] .rm-t-df { --t: #8cbcf5; }
    html[data-theme="auto"] .rm-t-n { --t: #dcae84; }
    html[data-theme="auto"] .rm-t-s { --t: #fca5a5; }
    html[data-theme="auto"] .rm-t-pick { --t: #f7cf63; }
}

.rm-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-top: 10px; border-top: 1px solid var(--e-line); font-size: .84em; color: var(--e-ink-2); }
.rm-key { display: inline-flex; align-items: center; gap: 6px; }
.rm-fine { margin: -6px 0 0; font-size: .76em; color: var(--e-ink-3); }
.rm-allergen { margin: 0; padding: 10px 12px; border-radius: var(--e-radius-sm); background: var(--e-surface); border: 1px solid var(--e-line); border-left: 3px solid var(--e-warn); font-size: .85em; color: var(--e-ink-2); }
.rm-allergen strong { color: var(--e-ink); }

/* compact: sans headings, tighter, two columns when there is room */
.rm-compact { gap: 10px; }
.rm-compact .rm-head { text-align: left; }
.rm-compact .rm-title, .rm-compact .rm-sec-title { font-family: var(--e-font); }
.rm-compact .rm-title { font-size: 1.25em; }
.rm-compact .rm-sec-title { font-size: .86em; letter-spacing: .08em; }
.rm-compact .rm-items { gap: 8px; }
.rm-compact .rm-dots { border-bottom-style: solid; border-bottom-width: 1px; opacity: .6; }
.rm-compact .rm-body { gap: 12px; }
@media (min-width: 620px) {
    .rm-compact .rm-body { grid-template-columns: 1fr 1fr; column-gap: 28px; align-items: start; }
}
html[data-compact="1"] .rm-desc { font-size: .82em; }
@media (max-width: 360px) {
    .rm-title { font-size: 1.3em; }
    .rm-top { flex-wrap: wrap; }
    .rm-dots { display: none; }
    .rm-price { max-width: 100%; margin-left: auto; }
}