/* DAF site-wide CSS.
   Moved out of the Webflow site head 2026-08-01: that box was at 46,244 of a
   ~50,000 character ceiling, and this was 33,689 of it. Inline CSS also ships
   with every HTML response and is never cached; as a stylesheet it downloads
   once and is reused across pages.
   Served by supabase/functions/daf-styles. Built by widgets-src/build.mjs.
   ORDER MATTERS: the <link> must sit exactly where the <style> block was, so
   these overrides still land after Webflow's own stylesheet. */
img{border-radius:0 !important}
.w-dyn-empty{display:none !important}
.daf-body-text::before{display:none !important}
.daf-body-text::after{display:none !important}
.daf-body-text .w-richtext::before{content:none !important;display:none !important}
.daf-body-text .w-richtext::after{content:none !important;display:none !important}
.daf-body-text .w-richtext::first-letter,
.daf-body-text .w-richtext > p:first-of-type::first-letter,
.daf-body-text .w-richtext > *:first-child::first-letter,
.daf-body-text > div > .daf-body-lg::first-letter,
.daf-body-text > div > p:first-of-type::first-letter,
.daf-body-text > p:first-of-type::first-letter,
.daf-identity__body > p:first-of-type::first-letter,
.daf-identity__body > .w-richtext > p:first-of-type::first-letter,
.daf-identity__body.w-richtext::first-letter,
.daf-identity__body::first-letter{float:left;font-family:Georgia,"Times New Roman",serif;font-size:3.4em;line-height:0.8;padding-right:8px;padding-top:4px;font-weight:700;color:#FC5761}
.top-section.daf-restaurant-hero{position:relative !important;background:#2a2725 center/cover no-repeat}
.top-section.daf-restaurant-hero::after{content:'' !important;position:absolute !important;bottom:0 !important;left:0 !important;width:100% !important;height:60% !important;background:linear-gradient(to top,rgba(0,0,0,0.55) 0%,transparent 100%) !important;pointer-events:none !important;z-index:1 !important}
.top-section.daf-restaurant-hero .div-block-4.daf-hero-text{position:relative !important;z-index:2 !important}
.hero-big-wrapper{position:absolute !important;top:0 !important;left:0 !important;width:100% !important;height:100% !important;overflow:hidden !important;z-index:0 !important;opacity:1 !important;visibility:visible !important}
.daf-contact-phone:not([href]),.daf-contact-phone[href=""],.daf-contact-phone[href="#"]{display:none !important}
.daf-contact-web:not([href]),.daf-contact-web[href=""],.daf-contact-web[href="#"]{display:none !important}
.daf-contact-address:not([href]),.daf-contact-address[href=""],.daf-contact-address[href="#"]{display:none !important}
.daf-detail-row:has(.w-dyn-empty){display:none !important}
.daf-sidebar-card:has(.w-dyn-empty):not(:has(.w-dyn-item)){display:none !important}
.daf-detail-label{text-transform:none !important;letter-spacing:0.04em !important}
.daf-info-hours{overflow:visible !important;max-height:none !important;display:block !important}
.daf-info-hours *{visibility:visible !important}
.footer-form-section.new-footer{display:flex !important;opacity:1 !important}
.footer-form-section.new-footer .footer-form---content-left{opacity:1 !important}
.footer-form-section.new-footer input[type="email"]{background:#212124 !important;border:1px solid rgba(255,255,255,0.12) !important;border-radius:0 !important;color:#f5f0eb !important;padding:9px 14px 9px 40px !important;transition:border-color 0.2s ease !important}
.footer-form-section.new-footer input[type="email"]::placeholder{color:#6a6560 !important}
.footer-form-section.new-footer input[type="email"]:focus{border-color:#FC5761 !important;outline:none !important}
.footer-form-section.new-footer input[type="submit"]{height:auto !important;line-height:1.125em !important;-webkit-appearance:none !important;appearance:none !important;font-family:inherit !important;border:1px solid rgba(255,255,255,0.2) !important}
.footer-form-section.new-footer input[type="submit"]:hover{border-color:#FC5761 !important}
.w-form-done,.w-form-fail{background:transparent !important;border:none !important;padding:16px 0 !important;margin:0 !important;text-align:center !important}
.w-form-done > div,.w-form-fail > div{background:transparent !important;border:none !important;color:inherit !important;display:block !important;min-height:0 !important;padding:0 !important}
.w-form-done h1,.w-form-done h2,.w-form-done h3,.w-form-done h4,.w-form-done h5,.w-form-done h6{color:#FC5761 !important;font-size:26px !important;font-weight:700 !important;text-transform:none !important;letter-spacing:normal !important;border:none !important;padding:0 !important;margin:0 0 6px 0 !important;line-height:1.2 !important}
.w-form-done div,.w-form-done p{color:#f5f0eb !important;font-size:18px !important;line-height:1.4 !important;margin:0 !important}
.w-form-fail,.w-form-fail div,.w-form-fail p{color:#FC5761 !important;font-size:16px !important;line-height:1.4 !important}
.daf-pill-box:has(.w-form-done[style*="block"]) > h1,.daf-pill-box:has(.w-form-done[style*="block"]) > h2,.daf-pill-box:has(.w-form-done[style*="block"]) > h3,.daf-pill-box:has(.w-form-done[style*="block"]) > h4,.daf-pill-box:has(.w-form-done[style*="block"]) .w-form > form,.daf-pill-box:has(.w-form-fail[style*="block"]) > h1,.daf-pill-box:has(.w-form-fail[style*="block"]) > h2,.daf-pill-box:has(.w-form-fail[style*="block"]) > h3,.daf-pill-box:has(.w-form-fail[style*="block"]) > h4{display:none !important}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px #212124 inset !important;-webkit-text-fill-color:#f5f0eb !important;caret-color:#f5f0eb !important;transition:background-color 5000s ease-in-out 0s !important}
.footer-form-section.new-footer .icon-inside-input{filter:brightness(0) invert(1) opacity(0.4) !important;left:14px !important;width:16px !important;height:16px !important}
.footer-tagline-span{padding-left:0 !important}
.divider-short{background:rgba(255,255,255,0.08) !important;height:1px !important;margin:0 !important;max-width:100% !important}
.footer-bottom{border-top-color:rgba(255,255,255,0.08) !important;background-color:#1a1a1c !important}
.btn-primary.bg-secondary-2.more-hover{background-color:rgba(0,0,0,0.5) !important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:center !important;background-size:24px 24px !important;backdrop-filter:blur(12px) !important;-webkit-backdrop-filter:blur(12px) !important;border:1px solid rgba(255,255,255,0.15) !important;border-radius:6px !important;width:52px !important;height:52px !important;overflow:hidden !important;font-size:0 !important;color:transparent !important;padding:0 !important}
.btn-primary.bg-secondary-2.more-hover:hover{background-color:rgba(252,87,97,0.3) !important;background-size:20px 20px !important;border-color:rgba(252,87,97,0.5) !important}
.badge-primary.page-section-link-badge{background-color:transparent !important;background:transparent !important;border:1px solid rgba(255,255,255,0.2) !important;color:#e8e4de !important;font-size:13px !important;font-weight:600 !important;letter-spacing:1.04px !important;text-transform:uppercase !important}
.badge-primary.page-section-link-badge:hover{border-color:#FC5761 !important;color:#FC5761 !important;background-color:transparent !important}
.w-richtext a{color:#FC5761 !important;text-decoration:none !important}
.w-richtext a:hover{text-decoration:underline !important}
@media screen and (max-width:991px){
  .footer-form-section.new-footer .footer-form---content-left,.footer-form-section.new-footer .footer-form---content-right{text-align:left !important;width:100% !important}
  .footer-form-section.new-footer .footer-form---content-right{max-width:100% !important}
  .footer-form-section.new-footer .input-and-btn-container,.footer-form-section.new-footer .input-and-btn-container.gap-column-16px{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:stretch !important;width:100% !important;max-width:100% !important;gap:8px !important}
  .footer-form-section.new-footer .position-relative---z-index-1.flex-horizontal.width-100{flex:1 1 0% !important;min-width:0 !important;width:auto !important}
  .footer-form-section.new-footer input[type="email"]{width:100% !important;min-width:0 !important;height:48px !important}
  .footer-form-section.new-footer input[type="submit"]{flex-shrink:0 !important;height:48px !important;white-space:nowrap !important}
  .footer-form-section.new-footer .footer-form---content-left{margin-bottom:8px !important}
  .footer-form-section.new-footer{gap:16px !important}
  .footer-tagline-span{grid-column:1 / 2 !important;width:auto !important;align-self:start !important}
  .grid-4-columns.footer-pages-grid > div:not(.footer-tagline-span):not(.hidden-code){text-align:right !important;justify-self:end !important}
}
@media screen and (max-width:767px){.daf-body-text{margin-bottom:20px !important}}
/* Restaurant detail editorial column, phones. Lived only in the R2 page template
   until 2026-08-01; folded in here when those templates switched to this stylesheet,
   otherwise the two-column editorial layout would not collapse on mobile. */
@media screen and (max-width:767px){.daf-editorial-grid{grid-template-columns:minmax(0,1fr)!important}}
.w-lightbox-close{width:44px !important;height:44px !important;border:1px solid rgba(255,255,255,0.2) !important;border-radius:6px !important;background-color:rgba(0,0,0,0.4) !important;color:#f5f0eb !important;top:16px !important;right:16px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;backdrop-filter:blur(4px) !important;-webkit-backdrop-filter:blur(4px) !important;transition:border-color .15s,color .15s,background-color .15s !important}
.w-lightbox-close:hover{border-color:#FC5761 !important;color:#FC5761 !important;background-color:rgba(252,87,97,0.1) !important}
.w-lightbox-close:focus,.w-lightbox-close:focus-visible{outline:none !important;box-shadow:0 0 0 2px rgba(252,87,97,0.5) !important}
.w-lightbox-control:focus,.w-lightbox-control:focus-visible{outline:none !important}
.w-lightbox-arrow:focus,.w-lightbox-arrow:focus-visible{outline:none !important}
.daf-city-picker{position:relative;display:inline-flex;align-items:center;font-family:'Thicccboi',system-ui,-apple-system,sans-serif}
.daf-city-picker[hidden]{display:none !important}
.daf-city-picker__btn{display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:color .15s ease;user-select:none;font-size:17px;font-weight:600;letter-spacing:-0.17px;line-height:26px;color:#f5f0eb}
.daf-city-picker__btn > div{display:inline-block}
/* Account nav control — labeled "Account ▾" / "Sign in", matched to .header-nav-link type (17/600/-0.17px), styled in the head so it's final at first paint (no layout jump). */
#daf-nav-signin{font-family:'Thicccboi',system-ui,-apple-system,sans-serif;font-size:17px !important;font-weight:600 !important;letter-spacing:-0.17px !important;line-height:26px !important;color:#FC5761 !important;text-decoration:none;border:0 !important;background:none !important;padding:0 !important;text-transform:none !important}
#daf-nav-signin:hover{color:#ff7e86}
#daf-acct{display:inline-flex;align-items:center;gap:5px;background:none;border:0;padding:0;cursor:pointer;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;font-size:17px !important;font-weight:600 !important;letter-spacing:-0.17px !important;line-height:26px !important;color:#FC5761 !important}
#daf-acct .ava{display:none !important}
#daf-acct > svg{display:none !important}
#daf-acct::before{content:"My Sh*t"}
#daf-acct::after{content:'';display:inline-block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.7;transition:transform .15s ease,opacity .15s ease;margin-left:1px}
#daf-acct:hover,#daf-acct[aria-expanded="true"]{color:#ff7e86}
#daf-acct[aria-expanded="true"]::after{transform:rotate(180deg);opacity:1}
@media (max-width:767px){#daf-nav-auth{margin-left:0 !important}#daf-acct{padding-left:0 !important}}
/* (Contact-form opt-in checkbox styling lives in Webflow on the "DAF Optin Check" class —
   native checkbox + accent-color:#FC5761, matching the account opt-in. No CSS needed here.) */
.daf-city-picker__btn::after{content:'';display:inline-block;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.7;transition:transform .15s ease,opacity .15s ease}
.daf-city-picker__btn:hover{color:#FC5761}
.daf-city-picker__btn:hover::after{opacity:1}
.daf-city-picker__btn[aria-expanded="true"]{color:#FC5761}
.daf-city-picker__btn[aria-expanded="true"]::after{transform:rotate(180deg);opacity:1}
.daf-city-picker__menu{position:absolute;top:calc(100% + 14px);right:0;left:auto;z-index:200;background:#1a1a1c;border:1px solid rgba(255,255,255,0.12);border-radius:8px;box-shadow:0 16px 48px rgba(0,0,0,0.55);width:520px;max-width:calc(100vw - 32px);padding:8px 0;display:none;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;text-transform:none;letter-spacing:0;column-count:3;column-gap:0}
.daf-city-picker__menu.is-open{display:block;animation:daf-picker-fade .15s ease-out}
@keyframes daf-picker-fade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.daf-city-picker__menu a{display:flex;align-items:center;padding:10px 20px;color:rgba(245,240,235,.6);font-size:14px;font-weight:500;text-decoration:none;transition:background .12s ease,color .12s ease;break-inside:avoid}
.daf-city-picker__menu a:hover{background:rgba(252,87,97,0.08);color:#FC5761}
.daf-city-picker__menu a.is-current{color:#FC5761;font-weight:700}
.daf-city-picker__menu a.is-reset{column-span:all;color:rgba(245,240,235,0.6);font-size:13px;font-weight:500;border-bottom:1px solid rgba(255,255,255,0.08);margin-bottom:4px;padding-bottom:10px}
.daf-city-picker__menu a.is-reset:hover{color:#FC5761;background:rgba(252,87,97,0.06)}
/* Tablet (768-1100): keep the desktop dropdown but drop to 2 cols and anchor left so it can't run off-screen. Below 768 the nav collapses to the hamburger (Webflow "Phone L and below", 2026-07-24). */
@media (min-width:768px) and (max-width:1100px){.daf-city-picker__menu{left:0;right:auto;column-count:2;width:min(400px,calc(100vw - 24px))}}
@media (max-width:767px){
  .daf-city-picker{display:block;width:100%;position:relative}
  .daf-city-picker__btn{display:flex;width:100%}
  .daf-city-picker__menu.is-open{position:static;width:auto;max-width:none;display:grid;grid-template-columns:1fr 1fr;column-gap:8px;background:transparent;border:none;border-radius:0;box-shadow:none;padding:4px 0 8px 16px}
  .daf-city-picker__menu a{padding:8px 0}
  .daf-city-picker__menu a.is-reset{grid-column:1/-1;border-bottom-color:rgba(255,255,255,0.06);padding-left:0}
}
/* Mobile nav — account (last item) becomes its own region pinned to the bottom of the full-height menu (2026-07-25). Tokens: BG Base #1a1a1c, divider Neutral/300 #2a2725, Text Faded label. */
@media (max-width:767px){
  #daf-nav-menu>li:last-child{margin-top:auto;margin-left:-22px;margin-right:-22px;margin-bottom:0;width:calc(100% + 44px);box-sizing:border-box;padding:16px 22px 24px;background:#1a1a1c;border-top:1px solid #2a2725}
  #daf-nav-menu>li:last-child::before{content:"Your account";display:block;font-size:10px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:rgba(245,240,235,.5);padding-bottom:8px}
}
.daf-back-to-top{position:fixed;bottom:24px;right:24px;width:44px;height:44px;background:#1a1a1c;color:#FC5761;border:1px solid #FC5761;border-radius:50%;display:none;align-items:center;justify-content:center;cursor:pointer;z-index:100;transition:background .15s,color .15s;padding:0}
.daf-back-to-top.is-visible{display:inline-flex}
.daf-back-to-top:hover{background:#FC5761;color:#fff}
.daf-back-to-top svg{width:20px;height:20px}
.daf-card{position:relative;overflow:hidden;background:#2a2725;box-shadow:0 1px 3px rgba(0,0,0,0.2),0 6px 24px rgba(0,0,0,0.25);transition:box-shadow 0.25s ease,transform 0.25s ease;text-decoration:none;color:inherit;display:block}
.daf-card:hover{transform:translateY(-3px);box-shadow:0 4px 8px rgba(0,0,0,0.3),0 14px 36px rgba(0,0,0,0.4)}
@media (hover:none){.daf-card:hover{transform:none;box-shadow:0 1px 3px rgba(0,0,0,0.2),0 6px 24px rgba(0,0,0,0.25)}.daf-card:active{transform:scale(0.98);filter:brightness(1.05)}}
.daf-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;transition:transform 0.3s ease,filter 0.3s ease}
.daf-card:hover .daf-card__img{transform:scale(1.02);filter:brightness(1.08)}
.daf-card::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.1) 60%,rgba(0,0,0,0) 100%);pointer-events:none}
.daf-card__content{position:absolute;bottom:0;left:0;right:0;padding:30px 16px 14px;z-index:1;color:#fff;pointer-events:none}
.daf-card__name{margin:0;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;font-size:22px;font-weight:700;line-height:1.15;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,0.6);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.daf-card__meta{margin:4px 0 0;font-size:14px;line-height:1.4;color:rgba(255,255,255,0.85);text-shadow:0 1px 2px rgba(0,0,0,0.5);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.daf-card__rating-pill{display:inline-flex;align-items:center;gap:7px;margin-top:8px;padding:4px 10px 4px 8px;border-radius:20px;background:rgba(0,0,0,0.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,0.08)}
.daf-card__rating-dots{display:flex;align-items:center;gap:4px}
.daf-card__rating-dot{width:8px;height:8px;border-radius:50%;background-color:rgba(255,255,255,0.2);flex-shrink:0}
.daf-card__rating-label{font-size:16px;font-weight:700;line-height:1;letter-spacing:0.3px;text-shadow:0 1px 4px rgba(0,0,0,0.6)}
.daf-card__city-tag{display:block;margin:0 0 8px;padding:0;background:transparent;border:none;color:#FC5761;font-size:18px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;line-height:1;text-shadow:0 1px 3px rgba(0,0,0,0.6)}
.daf-card .daf-card__city-tag{font-size:14px;letter-spacing:1px;margin-bottom:4px;text-shadow:0 1px 2px rgba(0,0,0,0.5)}
@media (max-width:767px){.daf-card__city-tag{font-size:15px;letter-spacing:1.2px}}
.daf-card--skeleton{background:linear-gradient(90deg,#2a2725 0%,#3a3530 50%,#2a2725 100%);background-size:200% 100%;animation:daf-skeleton-shimmer 1.5s linear infinite}
.daf-card--skeleton::after{display:none}
@keyframes daf-skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.daf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.daf-grid > .daf-card:not(.daf-card--hero){aspect-ratio:2/1;height:auto}
@media (max-width:991px){.daf-grid{grid-template-columns:repeat(2,1fr)}}/* 2-column cards: 30vw ≈ 1.5:1 landscape (these are half-width, so kept taller than the 1-col cards; the full-width hero is already taller than them on tablet, so no need to match it here) instead of the fixed 280px that goes squarish at iPad-portrait widths */
@media (max-width:767px){.daf-grid{grid-template-columns:1fr}}/* single-column cards at 50vw = same height as the hero (also 50vw) so a card never sits taller than the hero on phones; ~1.8:1 landscape, and keeps the shared card/hero image crop consistent */
.daf-card--hero{display:block;width:100%;height:clamp(320px,45vw,480px);grid-column:1 / -1}
.daf-card--hero .daf-card__name{font-size:clamp(28px,4.5vw,52px);line-height:1.05;letter-spacing:-0.01em;-webkit-line-clamp:3}
.daf-card--hero .daf-card__summary{font-size:clamp(14px,1.4vw,18px);-webkit-line-clamp:3;margin-top:8px}
.daf-card--hero .daf-card__content{padding:48px 28px 28px}
@media (max-width:767px){.daf-card--hero{height:clamp(360px,80vw,440px)}.daf-card--hero .daf-card__content{padding:36px 18px 18px}}
.daf-mounts-wrapper{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"toggle search sort" "controls controls controls" "app app app" "map map map";column-gap:12px;row-gap:12px;align-items:center;margin:16px 0 0}
#daf-restaurants-toggle,#daf-guides-toggle{grid-area:toggle}
#daf-restaurants-search,#daf-guides-search{grid-area:search}
#daf-restaurants-sort,#daf-guides-sort{grid-area:sort}
#daf-restaurants-controls,#daf-guides-controls{grid-area:controls}
#daf-restaurants-app,#daf-guides-app,#daf-collections-app,#daf-account-app,#daf-accept-app{grid-area:app}
#daf-restaurants-map{grid-area:map}
@media (max-width:767px){.daf-mounts-wrapper{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"toggle toggle" "search sort" "controls controls" "app app" "map map";column-gap:8px;row-gap:10px;margin:12px 0 0}}
/* About "Let's Talk" contact form: stack Name / Email / message into one full-width column on mobile. Webflow's .w-layout-grid resolves its tracks so stubbornly that grid-template-columns won't override (even !important), so switch the layout model to a flex column instead — the combo selector (.grid-2-columns-2.form, 0-2-0) wins on `display` cleanly, and the grid's row-gap carries over to flex. */
@media (max-width:767px){.grid-2-columns-2.form{display:flex;flex-direction:column;align-items:stretch}}
.daf-search,.daf-view-toggle,.daf-sort-btn{height:40px;box-sizing:border-box;border:1px solid rgba(255,255,255,0.12);border-radius:6px;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;transition:border-color .15s ease,color .15s ease,background-color .15s ease}
.daf-search__input{font-family:'Thicccboi',system-ui,-apple-system,sans-serif}
.daf-view-toggle{display:inline-flex;align-items:center;overflow:hidden;background:transparent;padding:0}
.daf-view-toggle button{height:100%;padding:0 14px;gap:7px;border:none;background:transparent;color:#8a8580;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s ease,color .15s ease}
.daf-view-toggle__lbl{font-size:13px;font-weight:600;letter-spacing:0.3px;line-height:1}
.daf-view-toggle button:not(:first-child){border-left:1px solid rgba(255,255,255,0.12)}
.daf-view-toggle button:hover{color:#f5f0eb}
.daf-view-toggle button.is-active{background:#FC5761;color:#fff}
.daf-view-toggle button svg{width:18px;height:18px}
.daf-sort-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;background:transparent;color:#f5f0eb;cursor:pointer;position:relative;padding:0}
.daf-sort-btn:hover,.daf-sort-btn.is-active{border-color:#FC5761;color:#FC5761}
.daf-sort-btn.is-active::after{content:"";position:absolute;top:6px;right:6px;width:6px;height:6px;border-radius:50%;background:#FC5761}
.daf-sort-btn svg{width:16px;height:16px}
.daf-sort-menu{position:absolute;z-index:200;background:#1a1a1c;border:1px solid rgba(255,255,255,0.12);border-radius:8px;box-shadow:0 12px 36px rgba(0,0,0,0.45);min-width:200px;padding:6px 0;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;display:none}
.daf-sort-menu.is-open{display:block}
.daf-sort-menu__option{display:flex;align-items:center;padding:9px 14px;color:#f5f0eb;font-size:13px;cursor:pointer;transition:background .1s ease}
.daf-sort-menu__option:hover{background:rgba(252,87,97,0.08)}
.daf-sort-menu__option.is-active{color:#FC5761;font-weight:600}
.daf-controls{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 16px 4px 0;margin:0;font-family:'Thicccboi',system-ui,-apple-system,sans-serif}
.daf-controls::-webkit-scrollbar{display:none}
.daf-cat-pills{display:inline-flex;flex-wrap:nowrap;gap:8px;align-items:center;flex-shrink:0}
/* THE CONTROL SYSTEM (John 2026-08-16). One button: square, neutral outline, coral ONLY on
   hover or when selected. 48 on phones because this file is MOBILE-FIRST and these were 30px —
   under Apple's 44 and Material's 48 touch minimums; 40 on desktop, where a mouse doesn't need
   48 and six 48s under a 48px search bar is too much chrome above the restaurants. The
   breakpoint is INVERTED from what it used to be (30 phone / 40 desktop), which gave the
   smaller target to the less precise input. Full system + the class map: the
   daf-control-system artifact. */
.daf-filter-btn,.daf-cat-pill{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:48px;padding:0 16px;border:1px solid rgba(255,255,255,0.25);border-radius:0;background:transparent;color:#f5f0eb;font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;cursor:pointer;user-select:none;white-space:nowrap;flex-shrink:0;transition:border-color .15s ease,color .15s ease,background-color .15s ease}
.daf-filter-btn:hover,.daf-cat-pill:hover{border-color:#FC5761;color:#FC5761;background:transparent}
.daf-filter-btn[aria-expanded="true"]{background:#FC5761;color:#1a1a1c;border-color:#FC5761}
.daf-filter-btn[aria-expanded="true"]:hover{background:#FC5761;color:#1a1a1c}
.daf-cat-pill.is-active{background:#FC5761;color:#1a1a1c;border-color:#FC5761}
.daf-cat-pill.is-active::before{content:"\2713";margin-right:5px;font-weight:700}
.daf-cat-pill.is-active:hover{background:#FC5761;color:#1a1a1c;border-color:#FC5761}
.daf-filter-btn__count{margin-left:4px;font-size:11px;font-weight:700;opacity:0.85}
.daf-filter-btn__count::before{content:'·';margin-right:4px;opacity:0.6}
.daf-filter-btn__caret{width:9px;height:9px;opacity:0.75}
@media (min-width:768px){
  .daf-search,.daf-view-toggle,.daf-sort-btn{height:48px}
  .daf-search__input{height:40px;font-size:16px}
  .daf-filter-btn,.daf-cat-pill{height:40px}
  .daf-filter-btn__caret{width:11px;height:11px}
}
.daf-restaurant-hero[data-daf-hero],
.daf-restaurant-hero:has([data-daf-hero-img]){position:relative !important;overflow:hidden !important;background:#2a2725 !important;height:clamp(190px,50vw,820px) !important;min-height:0 !important}
.daf-restaurant-hero[data-daf-hero]::after,
.daf-restaurant-hero:has([data-daf-hero-img])::after{display:none !important}
[data-daf-hero-img]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:1}
.daf-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[data-daf="skip-link"]{position:absolute;top:-60px;left:16px;z-index:9999;background:#FC5761;color:#fff;padding:10px 18px;font-size:14px;font-weight:700;letter-spacing:0.5px;text-decoration:none;border-radius:0 0 6px 6px;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;transition:top 0.15s ease;text-transform:uppercase}
[data-daf="skip-link"]:focus{top:0;outline:2px solid #fff;outline-offset:-4px}
.daf-filter-panel{position:absolute;z-index:100;background:#1a1a1c;border:1px solid rgba(255,255,255,0.12);border-radius:8px;box-shadow:0 12px 36px rgba(0,0,0,0.45);min-width:220px;max-height:60vh;overflow-y:auto;padding:8px 0;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;display:none}
.daf-filter-panel.is-open{display:block}
.daf-filter-panel__option{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;color:rgba(245,240,235,.6);font-size:14px;font-weight:500;transition:background 0.1s,color 0.1s}
.daf-filter-panel__option:hover{background:rgba(252,87,97,0.08);color:#FC5761}
.daf-filter-panel__option:has(.daf-filter-panel__cb:checked){color:#FC5761}
.daf-filter-panel__cb{width:14px;height:14px;accent-color:#FC5761;cursor:pointer}
.daf-filter-panel__btn{display:block;width:100%;padding:8px 14px;background:none;border:none;color:rgba(245,240,235,.6);font:inherit;font-size:14px;font-weight:500;text-align:left;cursor:pointer;border-radius:4px;transition:background 0.1s,color 0.1s}
.daf-filter-panel__btn:hover{background:rgba(252,87,97,0.08);color:#FC5761}
.daf-filter-panel__btn.is-current{color:#FC5761;font-weight:700;background:rgba(252,87,97,0.06)}
.daf-chip--switch{cursor:pointer;padding-right:10px}
.daf-chip--switch:hover{background:rgba(252,87,97,0.18)}
.daf-chip__caret{font-size:9px;margin-left:4px;color:#FC5761}
.daf-search{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:#212124;width:100%;padding:5px 10px;box-sizing:border-box;position:relative}
.daf-search::-webkit-scrollbar{display:none}
.daf-search:focus-within{border-color:#FC5761;box-shadow:0 0 0 3px rgba(252,87,97,0.15)}
.daf-search__input{flex:1 0 100px;min-width:100px;border:none;outline:none;box-shadow:none;height:32px;margin:0;font-size:16px;font-weight:500;background:transparent;color:#f5f0eb;padding:0 4px 0 28px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FC5761' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");background-position:left 4px center;background-size:16px;background-repeat:no-repeat;-webkit-appearance:none;appearance:none;font-family:inherit}
.daf-search__input::placeholder{color:#6a6560;font-weight:400}
.daf-chip{display:inline-flex;align-items:center;gap:4px;height:26px;padding:0 4px 0 10px;border-radius:13px;background:rgba(252,87,97,0.12);border:1px solid rgba(252,87,97,0.3);color:#FC5761;font-size:14px;font-weight:600;line-height:1;white-space:nowrap;user-select:none;flex-shrink:0;max-width:180px;animation:daf-chip-in 0.18s cubic-bezier(0.2,0.7,0.4,1)}
.daf-chip__val{overflow:hidden;text-overflow:ellipsis;color:#FC5761;font-weight:600;letter-spacing:0.1px}
@keyframes daf-chip-in{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}
.daf-chip__x{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;border-radius:50%;margin-left:2px;transition:background 0.15s}
.daf-chip__x:hover{background:rgba(252,87,97,0.2)}
.daf-chip__x svg{width:10px;height:10px;color:#FC5761}
.daf-suggest{position:absolute;left:0;right:0;top:calc(100% + 6px);background:#1a1a1c;border:1px solid rgba(255,255,255,0.12);border-radius:8px;box-shadow:0 12px 36px rgba(0,0,0,0.45);max-height:480px;overflow-y:auto;z-index:200;display:none;font-family:system-ui,-apple-system,sans-serif}
.daf-suggest.is-open{display:block}
.daf-suggest__bar{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,0.06);font-size:12px;color:#8a8580}
.daf-suggest__bar strong{color:#f5f0eb;font-weight:600}
.daf-suggest__bar a{color:#FC5761;cursor:pointer;text-decoration:underline;text-underline-offset:2px;font-weight:600}
.daf-suggest__bar a:hover{text-decoration:none}
.daf-suggest__cols{display:grid;grid-template-columns:1.5fr 1fr;gap:0}
.daf-suggest__col{padding:4px 0 8px;min-width:0}
.daf-suggest__col + .daf-suggest__col{border-left:1px solid rgba(255,255,255,0.06)}
.daf-suggest__col__title{padding:10px 14px 6px;font-size:11px;font-weight:700;letter-spacing:1.2px;color:#8a8580;text-transform:uppercase;border-bottom:1px solid rgba(255,255,255,0.04);margin-bottom:4px}
.daf-suggest__item{display:flex;align-items:center;gap:10px;padding:8px 14px;cursor:pointer;transition:background 0.1s,color 0.1s;color:rgba(245,240,235,.6);font-size:14px;font-weight:500;min-width:0;text-decoration:none}
.daf-suggest__item:hover,.daf-suggest__item.is-active{background:rgba(252,87,97,0.08);color:#FC5761}
.daf-suggest__item.is-selected{color:#8a8580;cursor:default;background:transparent !important}
.daf-suggest__item__label{flex:1 1 auto;overflow:hidden;white-space:normal;word-wrap:break-word;line-height:1.2}
.daf-suggest__hint{padding:18px 16px;color:#8a8580;font-size:13px;line-height:1.5}
.daf-suggest__hint__title{color:#f5f0eb;font-weight:600;font-size:14px;margin-bottom:6px}
.daf-suggest__empty{padding:24px 14px;color:#8a8580;font-size:13px;text-align:center;line-height:1.5;grid-column:1 / -1}
.daf-suggest__empty strong{color:#f5f0eb;display:block;margin-bottom:4px;font-size:14px}
.daf-suggest__item__meta{font-size:12px;color:#6a6560;line-height:1.3}
.daf-clear-inline{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;background:transparent;border:none;color:#8a8580;font-size:11.5px;font-weight:600;letter-spacing:0.3px;cursor:pointer;white-space:nowrap;margin-left:4px;flex-shrink:0;font-family:'Thicccboi',system-ui,-apple-system,sans-serif;transition:color .15s ease}
.daf-clear-inline:hover{color:#FC5761}
.daf-clear-inline svg{width:12px;height:12px}
.daf-identity__meta > *{display:inline-block;margin:0}
.daf-identity__meta > *:empty{display:none}
.daf-identity__meta > *+*::before{content:'·';margin:0 10px;color:rgba(255,255,255,0.25)}
.daf-identity__meta a{color:inherit;text-decoration:none}
.daf-identity__meta a:hover{color:#FC5761}
/* Mobile: tighten meta tracking + separator so the stat line (e.g. "18 Cities · 159 Spots · 17 Guides") stays on one line on phones. Pairs with the "Spots" label (shorter than "Restaurants") in the count builders below. Applies to all .daf-identity__meta uses for consistency. */
@media (max-width:767px){.daf-identity__meta{letter-spacing:1.4px;column-gap:8px}.daf-identity__meta > *+*::before{margin:0 6px}}
.daf-identity__body.w-richtext::before,
.daf-identity__body.w-richtext::after{content:none;display:none}
.daf-identity__body p+p{margin-top:16px}
.daf-identity__short::after{content:'';display:block;width:48px;height:1px;background:#FC5761;margin-top:14px}
.daf-identity > *:last-child{margin-bottom:0}
.top-section.daf-restaurant-hero:has(> img){position:relative;overflow:hidden;height:clamp(190px,50vw,820px);min-height:0;background:#2a2725}
.top-section.daf-restaurant-hero > img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:1}
/* Catch-all hero height — every hero template shares .top-section.daf-restaurant-hero, so this is the single height authority and also covers CMS-nested heroes (e.g. guide detail) that the structure-specific rules above don't match. */
.top-section.daf-restaurant-hero{height:clamp(190px,50vw,820px) !important;min-height:0 !important}
/* ===== DAF AUTH STATE — Header sign-in/out toggle ===== */
body:not(.is-signed-in) [data-auth-state="signed-in"] { display: none !important; }
body.is-signed-in [data-auth-state="signed-out"] { display: none !important; }

/* ── One ask per page, not two (John 2026-08-15) ───────────────────────────────
   A signed-out visitor got two identical RATE IT buttons about a screen apart on
   mobile: the on-record CTA under the judgement, and the editor opener in The
   Regulars. Same label, same job, different widths — it read as a bug.
     signed out -> the on-record line is the ask (it carries the roles-ladder copy)
     signed in  -> the editor in The Regulars is the ask
   Gated on html.is-signed-in, which the site head sets SYNCHRONOUSLY from
   localStorage before first paint. body.is-signed-in is only set at
   DOMContentLoaded, so using it here would flash the wrong control. */
/* Both carry body.daf-jdp purely for WEIGHT — (0,3,2) beats any body.daf-jdp rule
   appended later in this file, which is exactly how these two got overridden once.
   Scoping costs nothing: no daf-jd- class exists outside the restaurant page. */
html:not(.is-signed-in) body.daf-jdp .daf-jd-youedit { display: none; }
html.is-signed-in body.daf-jdp .daf-jd-onrecord { display: none; }
/* "Browse by city" footer block (/restaurants, /guides): 38 city links joined by
   middle dots with no spaces, so the browser sees one unbreakable ~1,374px word and
   the page scrolls sideways on phones (321px of overflow at a 500px viewport).
   Flex items give it break opportunities between links. 2026-08-01. */
section[aria-label="Browse by city"] p{display:flex;flex-wrap:wrap;justify-content:center;row-gap:4px}
/* The "Browse by city" heading states the obvious above a row of city names, so
   hide it. The section keeps aria-label="Browse by city", so screen readers still
   get the name and nothing is lost from the HTML. 2026-08-01. */
section[aria-label="Browse by city"] h2{display:none}
/* In map view the back-to-top button sits exactly on top of the map's "near me"
   control (both fixed/anchored bottom-right) and blocks it on phones between roughly
   425-600px of scroll. The map is the content here, so hide it. 2026-08-01. */
body.daf-map-active .daf-back-to-top{display:none}

/* Rating dots - ONE definition (2026-08-06). The 5-dot strip is emitted by the worker
   (regular profiles, city boards, beef) and by widgets (dashboard). CSS for it previously
   lived ONLY in dashboard.js and scoped to .dct inside the worker, so surfaces like
   /regulars/{handle} had markup with no matching rule. Defined here so every surface
   matches; --daf-dot-color carries the tier colour from ledger.rating_scale via the RPCs. */
.daf-dots{display:inline-flex;gap:4px;align-items:center}
.daf-dots>span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,0.12);flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,0.06)}
.daf-dots>span.is-filled{background:var(--daf-dot-color,#FC5761);box-shadow:0 0 0 1px rgba(0,0,0,0.15) inset}


/* ==========================================================================
   JUDGEMENT BLOCK — moved into the repo 2026-08-15.

   These rules lived ONLY in an inline <style id="daf-jd-css"> inside the R2
   template templates/restaurant.html (mirrored, stale-by-default, at
   webflow-snapshot/R2-templates-restaurant.html and
   webflow-snapshot/pages/tpl-restaurants.footer.html). Nothing in CI built
   them, nothing in CI watched them, and drift-check.yml never saw them —
   which is why every fix to the RATE IT button and the judgement layout
   "reverted": the next template re-upload simply restored the old copy.

   They now live here, in the stylesheet CI already builds and deploys
   (widgets-src/site.css -> supabase/functions/daf-styles). The worker strips
   the inline <style id="daf-jd-css"> from the template on every request
   (see 'style#daf-jd-css' in cloudflare/worker-daf-pages/worker.js), so this
   file is the only copy that reaches a browser even if the R2 template is
   re-snapshotted from Webflow with the old block still in it.

   Copied VERBATIM from the live template (md5 e53e3de5..., 7,259 bytes) so
   the move is provably a no-op. Change the rules AFTER the move is verified,
   never in the same step.
   ========================================================================== */

body.daf-jdp .daf-tab-nav-1{display:none!important}
body.daf-jdp .daf-editorial-left>.daf-tab-pane{display:none!important}
body.daf-jdp .daf-tab-pane.is-yourtake.daf-jd-open{display:block!important}
body.daf-jdp #daf-jd-about .daf-body-text.is-about{display:block!important}
.daf-jd-voice{margin-top:30px;scroll-margin-top:70px}
.daf-jd-vhead{display:flex;align-items:baseline;gap:12px;border-bottom:2px solid #FC5761;padding-bottom:8px;margin-bottom:16px}
.daf-jd-vhead .vn{font-family:Georgia,'Times New Roman',serif;font-size:22px;font-weight:700;color:#f2ede4}
.daf-jd-vhead .vs{font-size:11px;color:#7d7a74;letter-spacing:1px}
.daf-jd-rationale{font-family:Georgia,'Times New Roman',serif;font-size:17px;line-height:1.55;color:#e9e3d8}
.daf-jd-nopecall{font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.55;color:#eae4da;margin:0 0 22px}
.daf-jd-rationale.is-cont::first-letter{float:none;font-size:inherit;color:inherit;padding:0;font-weight:inherit;line-height:inherit}
.daf-jd-rationale:not(.is-cont)::first-letter,.daf-jd-nopecall::first-letter{float:left;font-family:Georgia,'Times New Roman',serif;font-size:56px;line-height:44px;padding:4px 10px 0 0;color:#FC5761;font-weight:700}
.daf-jd-onrecord{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.09);margin-top:20px;padding-top:14px}
.daf-jd-onrecord .oq{font-size:13.5px;color:#ccc7bf}
.daf-jd-onrecord .oq b{color:#f5f0eb}
.daf-jd-ratebtn{display:inline-block;border:1px solid #FC5761;color:#FC5761;font-size:11px;font-weight:800;letter-spacing:1.5px;padding:10px 18px;text-transform:uppercase;text-decoration:none}
.daf-jd-ratebtn:hover{background:rgba(252,87,97,.08)}
@media (max-width:700px){.daf-jd-onrecord .daf-jd-ratebtn{width:100%;text-align:center;box-sizing:border-box}}
/* evidence block — left-rule on EVERY card: gray for scores, coral for Nope */
.daf-jd-ev{margin-top:24px;border-left:2px solid rgba(255,255,255,.15);padding-left:20px}
.daf-jd-evhead-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 2px}
.daf-jd-evlabel{font-size:11px;letter-spacing:2px;color:#FC5761;font-weight:700}
.daf-jd-evtier{letter-spacing:2px;font-size:13px;white-space:nowrap}
.daf-jd-evtier .tn{font-size:11px;font-weight:800;letter-spacing:1px;color:#f2ede4;text-transform:uppercase}
.daf-jd-evrow{display:flex;gap:12px;padding:9px 0;border-top:1px solid #3a3a3e;font-size:13.5px;align-items:baseline;color:#ddd8cf}
.daf-jd-evrow .cls{color:#7d7a74;font-size:10px;letter-spacing:1px;width:74px;flex-shrink:0;font-weight:700}
.daf-jd-evrow b{color:#f2ede4;font-weight:700}
.daf-jd-evrow .yrs{color:#7d7a74;font-size:11.5px;margin-left:auto;flex-shrink:0;padding-left:10px}
.daf-jd-evrow.is-punch{border-top:1px solid rgba(252,87,97,.28);border-bottom:1px solid rgba(252,87,97,.28);margin:2px 0}
.daf-jd-evrow.is-punch .cls{color:#FC5761}
.daf-jd-evrow.is-punch .txt{font-family:Georgia,'Times New Roman',serif;font-size:17px;color:#f4eee4;line-height:1.35}
.daf-jd-evrow.is-punch .txt b{color:#FC5761;font-weight:700}
.daf-jd-more{font-size:12.5px;color:#FC5761;cursor:pointer;margin-top:11px;display:inline-block}
.daf-jd-redirect{background:#242427;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px 22px 10px;margin-top:20px}
.daf-jd-redirect .rh{display:flex;align-items:baseline;gap:10px;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#FC5761;font-weight:700;margin:0 0 16px}
.daf-jd-redirect .rh .sub{font-size:11px;font-weight:600;letter-spacing:.3px;text-transform:none;color:#7d7a74}
.daf-jd-alt{display:flex;align-items:stretch;border-radius:10px;overflow:hidden;margin-bottom:12px;background:#1e1e21;border:1px solid rgba(255,255,255,.05);text-decoration:none;transition:border-color .15s}
.daf-jd-alt:hover{border-color:rgba(255,255,255,.22)}
.daf-jd-alt .thumb{width:100px;flex-shrink:0;background-size:cover;background-position:center;background-color:#2a2a2d}
.daf-jd-alt .cardbody{padding:12px 16px;display:flex;flex-direction:column;justify-content:center;gap:4px}
.daf-jd-alt .an{font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:700;color:#f2ede4}
.daf-jd-alt .meta{font-size:11.5px;color:#7d7a74}
.daf-jd-alt .at{font-size:10.5px;letter-spacing:1px;margin-top:1px}
.daf-jd-alt .at .tn{font-weight:800;margin-left:6px}
.daf-jd-verdict{font-family:Georgia,'Times New Roman',serif;font-size:20px;line-height:1.45;color:#f2ede4}
.daf-jd-verdict .crowdsay{font-weight:700}
.daf-jd-verdict .arg{font-size:15px;color:#b9b4ac;font-style:italic}
.daf-jd-strip{display:flex;height:7px;border-radius:6px;overflow:hidden;background:#2b2b2e;margin:16px 0 8px;gap:2px}
.daf-jd-seg{height:100%;border-radius:2px;min-width:3px}
.daf-jd-scap{font-size:12px;color:#8a8580}
.daf-jd-scap b{color:#b9b4ac;font-weight:700}
.daf-jd-scap .you{color:#d9a441;font-weight:700}
.daf-jd-sect{font-size:11px;letter-spacing:2px;color:#FC5761;font-weight:700;margin:22px 0 4px}
.daf-jd-take{border-top:1px solid #3a3a3e;padding:13px 0}
.daf-jd-who{font-size:11.5px;color:#7d7a74}.daf-jd-who b{color:#b9b4ac}
.daf-jd-txt{font-size:14px;margin-top:3px;color:#ddd8cf}
.daf-jd-resp{font-size:11.5px;color:#7d7a74;margin-top:4px}.daf-jd-resp span{color:#FC5761}
.daf-jd-cta{display:inline-block;border:1px solid #FC5761;color:#FC5761;padding:12px 22px;font-size:12px;font-weight:800;letter-spacing:2px;cursor:pointer;margin-top:18px;transition:background-color .15s}
.daf-jd-cta:hover{background:rgba(252,87,97,.07)}
.daf-jd-youedit{margin-top:24px}
.daf-jd-lead-hook{font-family:Georgia,'Times New Roman',serif;font-size:21px;color:#f2ede4;margin:0 0 6px}
.daf-jd-lead-sub{font-size:15px;line-height:1.5;color:#b9b4ac;margin:0 0 4px}
.daf-jd-invite{border:1px solid rgba(255,255,255,0.09);border-radius:12px;padding:24px 26px;transition:border-color .15s}
.daf-jd-invite:hover{border-color:#FC5761}
.daf-jd-invite .hook{font-family:Georgia,'Times New Roman',serif;font-size:21px;color:#f2ede4;margin:0 0 6px}
.daf-jd-invite .sub{font-size:15px;line-height:1.5;color:#b9b4ac;margin:0 0 18px}
.daf-jd-invite .daf-jd-cta{margin-top:0} body.daf-jdp #daf-jd-about{margin-bottom:6px} body.daf-jdp #daf-jd-about .daf-body-text.is-about{font-size:16.5px!important;line-height:1.62!important;color:#cfc9bf!important} body.daf-jdp #daf-jd-about .daf-body-text.is-about .w-richtext::first-letter,body.daf-jdp #daf-jd-about .daf-body-text.is-about .w-richtext>p:first-of-type::first-letter{float:none!important;font-size:inherit!important;color:inherit!important;padding:0!important;font-weight:inherit!important;line-height:inherit!important} body.daf-jdp #daf-jd-crowd{border-top:1px solid #34343a;padding-top:32px;margin-top:38px} body.daf-jdp .daf-jd-evhead-row{display:block!important;padding-left:0!important;margin:36px 0 18px!important} body.daf-jdp .daf-jd-strip{height:8px!important;border-radius:5px;overflow:hidden;margin:10px 0 12px} body.daf-jdp .daf-jd-ev .daf-jd-evrow{transition:background-color .15s} body.daf-jdp .daf-jd-ev .daf-jd-evrow:hover{background-color:rgba(255,255,255,0.03)} body.daf-jdp .daf-jd-ev .daf-jd-evtier{display:block!important;text-align:left;margin:0 0 14px}


/* ── RATE IT is a standard action-bar box (John 2026-08-15) ────────────────────
   "rate it button isn't full width anymore and it's not using our standard button
   format. we fixed this and it reverted." The revert is answered by the block above
   (CI owns these rules now); this is the fix itself.

   The format is not copied from a spec, it is measured off .djw-been on the live
   page: 48px tall, 1px rgba(255,255,255,.25) outline, transparent fill, square
   corners, 13px/700, 1px letter-spacing, uppercase, coral border+text on hover.
   Full width because it is the only ask in its section.

   SCOPED body.daf-jdp (0,2,1) on purpose. The verbatim rules above are unscoped, so
   while the R2 template's inline <style id="daf-jd-css"> still ships it outranks
   them on source order and would win. This lands the moment daf-styles deploys,
   whether or not the worker-side strip has shipped yet.

   Both classes get one rule. .daf-jd-ratebtn is the signed-out ask; .daf-jd-cta is
   only rendered on the jdReady === false fallback path, where the template's inline
   builder still runs — rare, but it must not be the one ugly button on the site. */
body.daf-jdp .daf-jd-ratebtn,
body.daf-jdp .daf-jd-cta{display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;height:48px;padding:0 18px;margin-top:16px;border:1px solid rgba(255,255,255,0.25);border-radius:0;background:transparent;color:#f5f0eb;font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:border-color .15s,color .15s}
body.daf-jdp .daf-jd-ratebtn:hover,
body.daf-jdp .daf-jd-cta:hover{border-color:#FC5761;color:#FC5761;background:transparent}
/* The signed-out ask wrapper. It was a divider row under Our Judgement with the button
   floated to its right; it is the body of its own section now and holds nothing but the
   full-width button, so the divider and its spacing come off. (The .oq rules in the
   block above style the copy line that used to sit here — dead as of 2026-08-15, kept
   only because they would matter again if the inline block were ever restored.)

   DECLARES NO `display`, DELIBERATELY. It said display:block for about ten minutes on
   2026-08-15 and that shipped a real bug: at (0,2,1) it TIED with the html.is-signed-in
   hide rule above and won on source order alone, being appended later in this file.
   Signed-in visitors got the sign-in ask AND their own open rating form, stacked. Leave
   `display` to the one rule whose whole job is switching it. */
body.daf-jdp .daf-jd-onrecord{border-top:0;margin-top:0;padding-top:0}

/* ── Your Rating: signed in means the form is already open ─────────────────────
   John 2026-08-15: "The Regulars needs its own space and once you are logged in you
   shouldn't have to click Rate it again to open it up - stupid."

   BOTH states ship in the same bytes and CSS picks one. The page is edge-cached
   900s, so rendering either state conditionally would serve one visitor's auth
   state to everyone behind that cache entry. html.is-signed-in is set synchronously
   from localStorage in the site head, before first paint, so there is no flash.

   The two switches themselves are the "one ask per page" rules further up
   (html:not(.is-signed-in) .daf-jd-youedit and html.is-signed-in .daf-jd-onrecord).
   They are unchanged — both controls simply live in this section now instead of in
   two different ones. This rule is the only new behaviour: open, not just visible. */
body.daf-jdp #daf-jd-yourating{border-top:1px solid #34343a;padding-top:32px;margin-top:38px}
html.is-signed-in body.daf-jdp #daf-jd-yourating .daf-tab-pane.is-yourtake{display:block!important}

/* ============================================================================
   SKELETON — ONE primitive, site-wide (2026-08-16)
   Was: .dap-skl declared privately inside account-profile.js, and nothing at all
   in dashboard or the regulars directory — which is exactly why those two read as
   "delayed". They were not slower; they rendered NOTHING until data landed, so the
   wait had no shape. A skeleton does not make a page faster, it makes the wait
   legible and stops the layout jumping when content arrives.
   Use .daf-skl on an element already sized by its real class, or with a modifier.
   ============================================================================ */
.daf-skl{display:block;border-radius:6px;background:#212124;opacity:.55}
.daf-skl--lbl{width:90px;height:12px;margin-bottom:8px}
.daf-skl--inp{height:42px}
.daf-skl--line{height:14px}
.daf-skl--title{height:26px;width:180px}

/* ============================================================================
   PAGE SHELL — one gutter, one section-title rank (2026-08-16)

   THE GUTTER. Measured across the site: every page computes a 73px content edge
   because .daf-container is capped at 1400px and centred inside a 1497px window.
   /account was the exception at 24px — its container resolved to max-width:none, so
   the whole page ran ~50px wider than every other page and nothing lined up with the
   nav above it. The rule below states the cap the rest of the site already had; on
   every page except /account it computes to exactly what was already there.
   Two classes deep so it wins on specificity regardless of stylesheet order.

   THE SECTION TITLE. The same visual rank was three different things: collections
   .dc-bandtitle (h2, 22px), account .dap/.dac h3 (24px), dashboard .ddb-sect (a DIV
   at 26px — so a screen reader found no heading on that page at all). One primitive
   now owns the typography. Each place keeps its own MARGINS, deliberately: vertical
   rhythm differs by context and folding it in here would move spacing on three pages
   at once for no stated reason.
   ============================================================================ */
.page-wrapper .daf-container{max-width:1400px;margin-left:auto;margin-right:auto}

.daf-bandtitle{font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:700;letter-spacing:0;text-transform:none;color:#f5f0eb;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.daf-bandtitle .hint{font-family:'Thicccboi',system-ui,-apple-system,sans-serif;font-size:11.5px;font-weight:600;letter-spacing:.3px;text-transform:none;color:#7d7a74}

/* ============================================================================
   .daf-panel — THE PANEL. One treatment, one definition.

   By 2026-08-21 the same idea existed four times with three different values:
   .daf-roles and .daf-door on the home page (.14 / .03), the About counts box
   (.14 border, NO fill), the Regulars signed-out banner (.12 / .025), and a new
   scale card (.12 / .03). John: "lets be consistent everywhere ... needs to be
   more universal for those elements." The home page's values won.

   USE IT BY ADDING THE CLASS, not by retyping the values: an element wears
   `daf-panel` plus its own class for whatever is specific to it (padding, type,
   layout). Anything that declares its own border/radius/background here is a
   fifth variant waiting to drift.

   This file is loaded from the site head, so a widget or SSR stylesheet later in
   the document will beat it on a tie — which is why the consumers below drop
   these three properties entirely rather than restating them.
   ============================================================================ */
.daf-panel{border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(255,255,255,.03)}

/* ============================================================================
   RECRUITMENT COPY IS FOR PEOPLE BEING RECRUITED (John 2026-08-21).

   The home page's roles card sells the thing you already have: "Sign up free
   and rate the places you actually eat", "Your first rating starts the record"
   — read by a member with a handle and five spots. Its Get started button is a
   hardcoded href="/signin?next=%2Fregulars", so clicking it signed in bounced
   through /signin's "SIGNING YOU IN… one sec" screen before landing. The flash
   WAS the redirect.

   Same rule, same mechanism as the two others settled today: the footer VIP
   block and the Regulars ladder. html.is-signed-in is set by the head script
   synchronously before first paint, so a member never sees any of them flicker.

   The three stat tiles below the card (Cities / Guides / Nope List) are not
   recruitment and deliberately stay.
   ============================================================================ */
html.is-signed-in .daf-roles{display:none}

/* ============================================================================
   THE FILTER BAR SITS TOO FAR BELOW THE HEADLINE ON A PHONE (John 2026-08-21:
   "looks good on desktop just mobile a little extra space").

   Measured at a 500px viewport: 53px between the coral rule under the tagline
   and the first control. It comes from .daf-container's own margin-top:32px
   inside the filter section — the same 32px that reads as proportionate across
   a 1400px page and as dead air across 390px.

   Scoped to .section.filter-section so the sitewide .daf-container is untouched,
   and inside max-width:767px so desktop keeps the spacing John says is right.
   ============================================================================ */
@media screen and (max-width:767px){
  .section.filter-section .daf-container{margin-top:12px}
}

/* ===========================================================================
   THE HOUSE BUTTON, DEFINED WHERE IT CANNOT BE OPTIMISED AWAY (2026-08-27)

   Webflow now ships a PER-PAGE optimised stylesheet
   (daf-b4d622.webflow.<pageId>.<hash>.opt.min.css) containing only the classes
   some element on that page actually uses. Markup we inject with JavaScript is
   invisible to that optimiser -- it reads the Designer tree, not the runtime
   DOM. So an injected button carrying `btn-pmary-2 bg-secondary-2 daf-pink-btn`
   is styled only for as long as some UNRELATED Designer element on the same
   page happens to wear the same classes and keep them in the payload.

   That is exactly how it broke. The home page's roles-strip CTA is injected by
   the page head code. The only element on Home carrying that combo was the
   submit button of the retired VIP newsletter form -- so deleting that dead
   form took the button styling with it, and the CTA fell back to Webflow's
   default `.w-button` blue. The classes were still on the element; the rules
   were gone from the page. Nothing referenced the dependency, so nothing warned.

   daf-styles loads on every page, after Webflow's stylesheet, and is not
   page-optimised. Defining the button here makes injected buttons independent
   of what the Designer happens to contain. Values copied verbatim from the
   published rules (read off /about, which still had them), so pages that get
   both definitions render identically.

   IF THE BUTTON IS RESTYLED IN THE DESIGNER, THIS BLOCK MUST BE UPDATED TO
   MATCH. That is the cost of this fix, and it is the smaller cost.
   =========================================================================== */
.btn-pmary-2 {
  color: #e8e4de; text-align: center; letter-spacing: .08em; text-transform: uppercase;
  background-color: transparent; border: 1px solid rgba(255,255,255,.2); border-radius: 0;
  justify-content: center; padding: 9px 16px; font-size: 11px; font-weight: 600;
  line-height: 1.125em; text-decoration: none;
  transition: border-color .3s, background-color .3s, transform .3s, color .3s;
}
.btn-pmary-2:hover { color: #FC5761; background-color: transparent; border-color: #FC5761; }
.btn-pmary-2.bg-secondary-2 { background-color: #FC5761; border-color: #FC5761; }
.btn-pmary-2.bg-secondary-2:hover { background-color: #111828; border-color: #111828; }
.btn-pmary-2.bg-secondary-2.daf-pink-btn {
  color: #e8e4de; letter-spacing: .88px; text-transform: uppercase;
  background-color: transparent; border-width: 1px; border-color: rgba(255,255,255,.2);
  border-radius: 0; justify-content: center; align-items: center; min-height: 48px;
  padding: 9px 16px; font-size: 11px; font-weight: 600; display: inline-flex;
}
.btn-pmary-2.bg-secondary-2.daf-pink-btn:hover { color: #FC5761; border-color: #FC5761; background-color: transparent; }
.btn-pmary-2.bg-secondary-2.daf-pink-btn.wide {
  justify-content: center; align-items: center; height: 48px; min-height: 48px; display: inline-flex;
}