.dining-intro { display: flex; gap: 2rem; align-items: end; justify-content: space-between; border-bottom: 3px double var(--ink); padding-bottom: 1rem; margin-bottom: 1.3rem; }
.dining-intro .kicker { text-transform: uppercase; letter-spacing: .14em; font-size: .75rem; color: var(--red-ink); font-weight: 700; }
.dining-intro h1 { margin: .2rem 0; }
.dining-intro p { max-width: 42rem; }
.dining-filters { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: .8rem; align-items: end; margin-bottom: 1rem; }
.dining-filters label { display: grid; gap: .25rem; font-size: .9rem; }
.dining-filters input, .dining-filters select { width: 100%; min-height: 44px; background: var(--paper-2); color: var(--ink); border: 1px solid var(--line); padding: .5rem; font: inherit; }
.dining-filters .open-filter { display: flex; align-items: center; gap: .4rem; min-height: 44px; }
.dining-filters input[type=checkbox] { width: 20px; min-height: 20px; }
#restaurant-map { height: 320px; border: 1px solid var(--ink); margin: .75rem 0 1.5rem; isolation: isolate; }
.dining-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; align-items: start; }
.restaurant-card { scroll-margin-top: 130px; min-width: 0; }
.restaurant-card:target { outline: 3px solid var(--red); outline-offset: 4px; }
.restaurant-card h2 { margin: .3rem 0; }
.restaurant-card .eyebrow { font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.restaurant-card .dining-status { font-weight: 700; }
.dining-status.is-open { color: var(--good-ink); }
.dining-status.is-unknown { color: var(--warn-ink); }
.dining-items { border-top: 1px solid var(--line); margin-top: 1rem; }
.dining-items h3 { margin-bottom: .4rem; }
.dining-items ul { list-style: none; padding: 0; margin: 0; }
.dining-items li { margin-bottom: .8rem; }
.dining-items li > .muted, .dining-items strong { display: block; }
.dining-items li p { margin: .2rem 0; }
.dining-hours dl { display: grid; grid-template-columns: auto 1fr; gap: .2rem 1rem; font-size: .9rem; }
.dining-hours dd { margin: 0; }
.dining-links { overflow-wrap: anywhere; }
.dining-footnote { border-top: 1px solid var(--line); margin-top: 2rem; padding-top: 1rem; }
@media(max-width: 950px) { .dining-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dining-filters { grid-template-columns: 1fr 1fr; } }
@media(max-width: 600px) { .dining-grid { grid-template-columns: 1fr; } .dining-intro { display: block; } #restaurant-map { height: 260px; } .dining-filters { grid-template-columns: 1fr; } }

.venue-visit { margin: 1rem 0; border-top: 1px solid var(--rule, #aaa); padding-top: .75rem; }
.venue-visit summary { cursor: pointer; font-weight: bold; }
.venue-costs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin: .75rem 0; }
.venue-costs input { width: 100%; min-width: 0; }
.venue-public-average { border-top: 1px dotted var(--rule, #aaa); padding-top: .5rem; }
.venue-tabs { margin: 1rem 0; }
[hidden] { display: none !important; }
.venue-costs label { display: grid; gap: .25rem; min-width: 0; }
.venue-costs input { min-height: 44px; font: inherit; font-size: 17px; padding: .5rem; color: var(--ink); background: var(--paper-2); border: 1px solid var(--line); }
[data-visit-stamp] { display: grid; justify-items: center; overflow: hidden; padding: 1.2rem; }
[data-visit-stamp] .stamp { width: min(180px, 100%); }

/* Compact restaurant previews, with a full visit tucked inside. */
.restaurant-card.card { padding: 0; border: 1px solid var(--line); border-radius: 18px; background: #f5e9da; background: color-mix(in srgb, var(--paper) 82%, #e6b789); box-shadow: 0 3px 0 rgb(70 45 25 / 7%); overflow: hidden; }
.restaurant-card:nth-child(3n + 2) { background: #eaf0e3; background: color-mix(in srgb, var(--paper) 82%, #a9bf93); }
.restaurant-card:nth-child(3n + 3) { background: #f4e5e3; background: color-mix(in srgb, var(--paper) 82%, #dba7a1); }
.restaurant-summary { display: block; padding: 1rem 1.1rem .75rem; cursor: pointer; list-style: none; }
.restaurant-summary::-webkit-details-marker { display: none; }
.restaurant-summary:focus-visible { outline: 3px solid var(--red-ink); outline-offset: -4px; border-radius: 18px; }
.restaurant-summary:hover { background: rgb(255 255 255 / 15%); }
.restaurant-summary h2 { font-size: 1.3rem; line-height: 1.15; margin: .35rem 0 .55rem; }
.restaurant-summary .eyebrow { display: block; font-size: .67rem; }
.restaurant-summary .dining-status { display: inline-block; font-size: .75rem; border-radius: 20px; padding: .2rem .5rem; background: rgb(255 255 255 / 45%); }
.restaurant-facts { display: grid; gap: .55rem; margin: .8rem 0; font-size: .82rem; line-height: 1.4; }
.restaurant-facts > span { display: grid; grid-template-columns: 5.8rem minmax(0, 1fr); gap: .4rem; }
.restaurant-label { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding-top: .1rem; }
.restaurant-expand-hint { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding-top: .65rem; font-size: .75rem; font-weight: 700; }
.restaurant-chevron { font-size: 1.1rem; transition: transform .15s; }
.restaurant-expand[open] > summary .restaurant-chevron { transform: rotate(45deg); }
.restaurant-expand:not([open]) .when-open, .restaurant-expand[open] .when-closed { display: none; }
.restaurant-body { border-top: 1px solid var(--line); padding: .75rem 1.1rem 1.1rem; background: rgb(255 255 255 / 25%); overflow-wrap: anywhere; }
.restaurant-body .restaurant-address { margin-top: 0; }
.restaurant-body .dining-items { margin-top: .5rem; }
.restaurant-body .venue-costs { gap: .5rem; }
@media (prefers-reduced-motion: reduce) { .restaurant-chevron { transition: none; } }

.dining-add-restaurant { margin: 1rem 0; padding: .8rem 1rem; border: 1px dashed var(--line); border-radius: 14px; background: var(--paper-2); }
.dining-contribute { margin: .8rem 0; }
.dining-contribute summary { cursor: pointer; font-weight: 700; font-size: .85rem; }
.dining-contribution-form { display: grid; gap: .7rem; margin-top: .8rem; }
.dining-contribution-fields { display: grid; gap: .7rem; }
.dining-contribution-form label { display: grid; gap: .25rem; font-size: .8rem; }
.dining-contribution-form input, .dining-contribution-form textarea, .dining-contribution-form select { width: 100%; min-width: 0; min-height: 44px; border: 1px solid var(--line); padding: .5rem; font: inherit; font-size: 16px; color: var(--ink); background: var(--paper-2); }
.dining-contribution-form .btn { justify-self: start; }
.dining-more { display: block; margin: 1.5rem auto; }
