/* =========================================================================
   FOOD & DRINK — the owner's Dining mock, ported verbatim by
   scripts/build_food_sheet.py. DO NOT hand-edit the scoped block: edit
   specimens/dining-mock/index.html (or the transformer) and rebuild.
   ========================================================================= */

/* Compact chrome — the entertainment page's numbers, CSS-only, on
   donor-identical markup. */
.foodlight .band.utility { height: 30px; }
.foodlight .brand-band.small { height: 58px; }
.foodlight .brand-band.small .wordmark { width: 290px; }
.foodlight nav.sections { height: 32px; }


    .foodsheet{--ink:#090909;--muted:#565656;--line:#d9d9d7;--red:#b62d0e;--blue:#0d43de;--paper:#fff;}
    .foodsheet *{box-sizing:border-box}
    .foodsheet{scroll-behavior:smooth}
    .foodsheet{margin:0;padding-bottom:68px;border-top:6px solid var(--ink);background:var(--paper);color:var(--ink);font-family:"Source Serif 4",Georgia,serif;-webkit-font-smoothing:antialiased}
    .foodsheet button, .foodsheet input{font:inherit}
    .foodsheet button, .foodsheet a{color:inherit}
    .foodsheet img{display:block;max-width:100%}
    .foodsheet .page-width{width:min(1280px,calc(100% - 32px));margin-inline:auto}
    .foodsheet .sans{font-family:"Inter",Arial,Helvetica,sans-serif}
    .foodsheet .eyebrow{font-family:"Inter",Arial,Helvetica,sans-serif;font-size:10px;line-height:1.1;font-weight:700;letter-spacing:.025em;text-transform:uppercase;color:var(--red)}
    .foodsheet .meta{font-family:"Inter",Arial,Helvetica,sans-serif;font-size:8px;line-height:1.35;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
    .foodsheet .muted{color:var(--muted)}
    .foodsheet .hairline{border-color:var(--line)}
    .foodsheet .arrow{font-family:"Inter",Arial,Helvetica,sans-serif;color:var(--red);font-size:17px;line-height:1}
    .foodsheet .section-head{height:29px;display:flex;align-items:center;justify-content:space-between;gap:12px}
    .foodsheet .section-link{border:0;background:transparent;cursor:pointer;font:9px "Inter",Arial,Helvetica,sans-serif;white-space:nowrap}
    .foodsheet .section-link .arrow{margin-left:9px}
    .foodsheet .serif-title{font-family:"Source Serif 4",Georgia,serif}
    .foodsheet .utility{height:40px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font:700 10px "Inter",Arial,Helvetica,sans-serif;letter-spacing:.045em;text-transform:uppercase}
    .foodsheet .utility-left, .foodsheet .utility-right{display:flex;align-items:center;height:100%}
    .foodsheet .utility-left span{padding:0 22px;border-right:1px solid var(--line)}
    .foodsheet .utility-left span:first-child{padding-left:0}
    .foodsheet .utility-left span:last-child{border-right:0}
    .foodsheet .utility-right a, .foodsheet .utility-right button{margin-left:24px;text-decoration:none;border:0;background:transparent;padding:0;cursor:pointer}
    .foodsheet .masthead{height:98px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center}
    .foodsheet .masthead img{width:710px;max-width:72%;height:auto}
    .foodsheet .main-nav{height:34px;border-bottom:1px solid var(--line);display:flex;align-items:stretch;justify-content:center;gap:0;white-space:nowrap;overflow-x:auto;scrollbar-width:none}
    .foodsheet .main-nav::-webkit-scrollbar{display:none}
    .foodsheet .main-nav button{position:relative;height:34px;padding:0 22px;border:0;background:none;cursor:pointer;font:700 10px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase}
    .foodsheet .main-nav button.active{color:var(--blue)}
    .foodsheet .main-nav button.active:after{content:"";position:absolute;left:13px;right:13px;bottom:0;height:2px;background:var(--blue)}
    .foodsheet .latest{height:43px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden;white-space:nowrap}
    .foodsheet .latest-label{font:700 10px "Inter",Arial,Helvetica,sans-serif;color:var(--blue);text-transform:uppercase;padding-right:16px}
    .foodsheet .latest-time{font:700 9px "Inter",Arial,Helvetica,sans-serif;border-left:1px solid var(--line);border-right:1px solid var(--line);padding:0 17px}
    .foodsheet .latest-story{font-size:12px;margin-left:17px;overflow:hidden;text-overflow:ellipsis}
    .foodsheet .latest-story .arrow{margin-left:13px;color:var(--blue)}
    .foodsheet .mobile-menu, .foodsheet .mobile-search{display:none}

    .foodsheet .hero-grid{display:grid;grid-template-columns:50% 29% 21%;height:289px;border-bottom:1px solid var(--line)}
    .foodsheet .lead-story{position:relative;overflow:hidden;color:white;cursor:pointer}
    .foodsheet .lead-story>img{width:100%;height:100%;object-fit:cover}
    .foodsheet .lead-story:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.77) 0%,rgba(0,0,0,.48) 39%,rgba(0,0,0,.05) 72%)}
    .foodsheet .lead-copy{position:absolute;z-index:2;left:23px;top:27px;width:385px}
    .foodsheet .lead-badge{display:inline-block;background:var(--red);padding:5px 9px 4px;font:700 9px "Inter",Arial,Helvetica,sans-serif;letter-spacing:.03em;text-transform:uppercase}
    .foodsheet .lead-copy h1{margin:34px 0 13px;font-size:35px;line-height:1.03;font-weight:400;letter-spacing:-.025em}
    .foodsheet .lead-copy .deck{width:330px;font-size:13px;line-height:1.55}
    .foodsheet .lead-copy .meta{position:absolute;top:245px;width:390px;color:white;font-size:7px}
    .foodsheet .interview{border-left:1px solid var(--line);border-right:1px solid var(--line);display:grid;grid-template-columns:55% 45%;min-width:0}
    .foodsheet .interview-copy{padding:19px 19px 12px;min-width:0}
    .foodsheet .interview-copy h2{font-size:24px;line-height:1.05;font-weight:400;margin:14px 0 14px;letter-spacing:-.02em}
    .foodsheet .interview-copy p{font-size:11px;line-height:1.55;margin:0;color:#242424}
    .foodsheet .interview-copy .meta{margin-top:27px;font-size:7px;line-height:1.7}
    .foodsheet .interview-photo{overflow:hidden}
    .foodsheet .interview-photo img{height:100%;width:100%;object-fit:cover}
    .foodsheet .opening{padding:17px 17px 0;overflow:hidden}
    .foodsheet .opening-header{height:24px;display:flex;justify-content:space-between;align-items:flex-start}
    .foodsheet .tracker-list{height:244px}
    .foodsheet .tracker-row{display:grid;grid-template-columns:97px 1fr;gap:12px;min-height:76px;padding:8px 0;border-bottom:1px solid var(--line);cursor:pointer}
    .foodsheet .tracker-row:last-child{border-bottom:0}
    .foodsheet .tracker-row img{width:97px;height:65px;object-fit:cover}
    .foodsheet .tracker-kicker{font:700 7px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;color:var(--red);margin:1px 0 3px}
    .foodsheet .tracker-row h3{font-size:11px;line-height:1.15;font-weight:400;margin:0 0 3px;text-transform:uppercase}
    .foodsheet .tracker-row p{font-size:8px;line-height:1.35;margin:0;color:#303030}

    .foodsheet .discovery{display:grid;grid-template-columns:50% 28% 22%;height:177px;margin-top:17px;border-bottom:1px solid var(--line)}
    .foodsheet .guides{padding-right:18px}
    .foodsheet .guide-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
    .foodsheet .guide-card{cursor:pointer;min-width:0}
    .foodsheet .guide-card img{width:100%;height:74px;object-fit:cover;margin-bottom:8px}
    .foodsheet .guide-card .eyebrow{font-size:8px;color:var(--blue);margin-bottom:6px}
    .foodsheet .guide-card h3{font-size:9px;line-height:1.35;font-weight:400;margin:0}
    .foodsheet .weekend{border-left:1px solid var(--line);padding:0 17px;min-width:0}
    .foodsheet .day-tabs{height:39px;display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin:0 0 8px}
    .foodsheet .day-tabs button{border:1px solid #e5e5e5;background:#fff;font:700 7px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;line-height:1.5;cursor:pointer}
    .foodsheet .day-tabs button.active{background:#151515;color:#fff;border-color:#151515}
    .foodsheet .weekend-feature{display:grid;grid-template-columns:109px 1fr;gap:13px;min-width:0}
    .foodsheet .weekend-feature img{width:109px;height:89px;object-fit:cover}
    .foodsheet .weekend-feature .eyebrow{font-size:8px;margin:2px 0 7px}
    .foodsheet .weekend-feature h3{font-size:14px;line-height:1.23;font-weight:400;margin:0 0 7px}
    .foodsheet .weekend-feature .detail{font:8px "Inter",Arial,Helvetica,sans-serif;margin-bottom:8px}
    .foodsheet .map-card{border-left:1px solid var(--line);padding-left:12px;overflow:hidden;cursor:pointer}
    .foodsheet .map-card img{width:100%;height:160px;object-fit:fill}

    .foodsheet .rankings{display:grid;grid-template-columns:50% 50%;height:178px;margin-top:17px;border-bottom:1px solid var(--line)}
    .foodsheet .best-dishes{padding-right:18px}
    .foodsheet .dish-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
    .foodsheet .dish-card{position:relative;min-width:0;cursor:pointer;display:grid;grid-template-columns:26px 1fr;column-gap:7px;align-items:start}
    .foodsheet .dish-number{grid-column:1;font:700 9px "Inter",Arial,Helvetica,sans-serif;letter-spacing:.03em;color:var(--red);padding-top:6px;border-top:1px solid var(--red)}
    .foodsheet .dish-card img{grid-column:2;height:65px;width:100%;object-fit:cover;margin-bottom:8px}
    .foodsheet .dish-card h3{grid-column:1/-1;font-size:9px;line-height:1.25;font-weight:400;margin:0 0 4px;min-height:23px}
    .foodsheet .dish-card p{grid-column:1/-1;font:8px "Inter",Arial,Helvetica,sans-serif;line-height:1.3;margin:0;color:#333;min-height:21px}
    .foodsheet .reservations{border-left:1px solid var(--line);padding-left:20px}
    .foodsheet .reservation-heading .head-left{display:flex;align-items:center;gap:12px}
    .foodsheet .reservation-heading .sub{font-size:9px;color:#333}
    .foodsheet .reservation-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .foodsheet .reservation{cursor:pointer;min-width:0}
    .foodsheet .reservation img{height:69px;width:100%;object-fit:cover;margin-bottom:7px}
    .foodsheet .reservation h3{font-size:9px;font-weight:400;margin:0 0 3px}
    .foodsheet .reservation p{font:7.5px "Inter",Arial,Helvetica,sans-serif;line-height:1.45;margin:0;color:#333}
    .foodsheet .reservation .time{margin-top:3px;color:#111;font-weight:700}

    .foodsheet .promo-strip{height:101px;margin-top:14px;border:1px solid var(--line);display:grid;grid-template-columns:26% repeat(3,1fr)}
    .foodsheet .newsletter-mini{padding:16px 15px 12px;border-right:1px solid var(--line)}
    .foodsheet .newsletter-mini p{font-size:9px;line-height:1.4;margin:6px 0 12px;color:#333}
    .foodsheet .inline-form{display:flex;gap:7px}
    .foodsheet .inline-form input{height:26px;min-width:0;flex:1;border:1px solid #bfc1c1;padding:0 9px;font-size:8px;outline:none}
    .foodsheet .inline-form input:focus{border-color:#111}
    .foodsheet .subscribe-btn{height:26px;border:0;background:var(--red);color:#fff;padding:0 15px;font:700 7px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.03em;cursor:pointer}
    .foodsheet .promo-story{display:grid;grid-template-columns:118px 1fr;gap:13px;padding:14px 12px;border-right:1px solid var(--line);cursor:pointer;min-width:0}
    .foodsheet .promo-story:last-child{border-right:0}
    .foodsheet .promo-story img{height:73px;width:118px;object-fit:cover}
    .foodsheet .promo-story h3{font-size:12px;line-height:1.25;font-weight:400;margin:6px 0 8px}
    .foodsheet .promo-story .meta{font-size:6.5px;color:#333}

    .foodsheet .desk-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:17px;border-bottom:1px solid var(--line)}
    .foodsheet .desk-column{padding:0 14px 9px;border-right:1px solid var(--line);min-width:0}
    .foodsheet .desk-column:first-child{padding-left:0}
    .foodsheet .desk-column:last-child{border-right:0;padding-right:0}
    .foodsheet .column-head{height:31px;display:flex;justify-content:space-between;align-items:flex-start}
    .foodsheet .column-head .section-link{font-size:8px;margin-top:-2px}
    .foodsheet .story-row{height:100px;display:grid;grid-template-columns:132px 1fr;gap:12px;padding:0 0 12px;cursor:pointer;min-width:0}
    .foodsheet .story-row img{width:132px;height:80px;object-fit:cover}
    .foodsheet .story-copy{min-width:0;padding-top:1px}
    .foodsheet .story-row h3{font-size:12px;line-height:1.35;font-weight:400;margin:0 0 8px}
    .foodsheet .story-row .meta{font-size:6.5px;color:#343434;line-height:1.6}
    .foodsheet .review-kicker{font:700 6.5px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;color:var(--red);margin:0 0 3px}
    .foodsheet .stars{color:var(--red);font:10px "Inter",Arial,Helvetica,sans-serif;letter-spacing:1px;margin:1px 0 4px}

    .foodsheet .feature-band{height:221px;margin-top:16px;border:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}
    .foodsheet .feature-card{display:grid;grid-template-columns:56% 44%;padding:10px;border-right:1px solid var(--line);min-width:0;cursor:pointer}
    .foodsheet .feature-card:last-child{border-right:0}
    .foodsheet .feature-copy{padding:3px 11px 0 1px;display:flex;flex-direction:column;min-width:0}
    .foodsheet .feature-copy h3{font-size:17px;line-height:1.2;font-weight:400;margin:12px 0 12px}
    .foodsheet .feature-copy p{font-size:10px;line-height:1.55;margin:0;color:#282828}
    .foodsheet .feature-copy .meta{font-size:6.5px;margin-top:auto;margin-bottom:5px;color:#333}
    .foodsheet .feature-card img{width:100%;height:199px;object-fit:cover}

    .foodsheet .newsletter-banner{height:158px;margin-top:14px;border:1px solid var(--line);position:relative;overflow:hidden}
    .foodsheet .newsletter-banner>img{position:absolute;right:11px;top:19px;width:58%;height:121px;object-fit:cover;z-index:0}
    .foodsheet .newsletter-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fff 41%,rgba(255,255,255,.88) 48%,rgba(255,255,255,0) 66%);pointer-events:none}
    .foodsheet .newsletter-copy{position:relative;z-index:1;padding:29px 24px;width:52%}
    .foodsheet .newsletter-copy h2{font:700 11px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;letter-spacing:.04em;margin:0 0 8px}
    .foodsheet .newsletter-copy p{font-size:9px;margin:0 0 17px}
    .foodsheet .newsletter-copy .inline-form{width:330px}

    .foodsheet footer{height:239px;margin-top:17px;border-top:1px solid var(--line);padding-top:23px}
    .foodsheet .footer-grid{display:grid;grid-template-columns:290px repeat(4,1fr) 170px;gap:28px}
    .foodsheet .footer-brand{border-right:1px solid var(--line);min-height:149px;padding:0 28px 0 12px}
    .foodsheet .brand-line{display:flex;align-items:center;gap:16px}
    .foodsheet .brand-line img{width:51px;height:auto}
    .foodsheet .brand-line h3{font-size:16px;margin:0 0 3px;font-weight:400}
    .foodsheet .brand-line p{font-size:8px;margin:0;color:#333}
    .foodsheet .socials{display:flex;gap:24px;margin-top:23px;padding-left:2px}
    .foodsheet .socials a{font:19px "Inter",Arial,sans-serif;text-decoration:none}
    .foodsheet .footer-col h4{font:700 7px "Inter",Arial,Helvetica,sans-serif;text-transform:uppercase;margin:1px 0 17px}
    .foodsheet .footer-col a{display:block;text-decoration:none;font-size:9px;line-height:2.35}
    .foodsheet .copyright{font-size:9px;line-height:1.45;color:#444;padding-top:1px}

    .foodsheet .modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.65);display:none;align-items:center;justify-content:center;padding:20px}
    .foodsheet .modal-backdrop.open{display:flex}
    .foodsheet .modal{width:min(620px,100%);background:#fff;border-top:5px solid #111;padding:24px;box-shadow:0 18px 70px rgba(0,0,0,.3);position:relative}
    .foodsheet .modal h2{font-size:27px;font-weight:400;margin:4px 0 10px}
    .foodsheet .modal p{font-size:12px;line-height:1.55;margin:0 0 16px}
    .foodsheet .modal img{width:100%;max-height:360px;object-fit:cover}
    .foodsheet .modal-close{position:absolute;right:14px;top:12px;border:0;background:none;font:25px "Inter",Arial,sans-serif;cursor:pointer}
    .foodsheet .toast{position:fixed;z-index:60;right:20px;bottom:20px;background:#111;color:#fff;padding:14px 18px;font:11px "Inter",Arial,sans-serif;transform:translateY(80px);opacity:0;transition:.25s;pointer-events:none}
    .foodsheet .toast.show{transform:none;opacity:1}

    @media(max-width:1050px){
      .foodsheet .main-nav button{padding-inline:14px}.foodsheet .hero-grid{grid-template-columns:56% 44%;height:auto}.foodsheet .lead-story{height:320px}.foodsheet .interview{height:320px;border-right:0}.foodsheet .opening{grid-column:1/-1;height:auto;border-top:1px solid var(--line)}.foodsheet .tracker-list{height:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.foodsheet .tracker-row{grid-template-columns:100px 1fr}.foodsheet .discovery{grid-template-columns:60% 40%;height:auto}.foodsheet .map-card{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);padding:12px 0}.foodsheet .map-card img{height:auto}.foodsheet .rankings{height:auto}.foodsheet .promo-strip{height:auto;grid-template-columns:1fr 1fr}.foodsheet .newsletter-mini{grid-row:span 2}.foodsheet .promo-story{border-top:1px solid var(--line)}.foodsheet .desk-grid{grid-template-columns:1fr 1fr}.foodsheet .desk-column:nth-child(2){border-right:0}.foodsheet .feature-band{height:auto;grid-template-columns:1fr 1fr}.foodsheet .feature-card{height:221px}.foodsheet .footer-grid{grid-template-columns:240px repeat(3,1fr)}.foodsheet .footer-col.legal{display:none}.foodsheet .copyright{grid-column:4}}
    @media(max-width:700px){
      .foodsheet{border-top-width:4px;padding-bottom:0}.foodsheet .page-width{width:min(100% - 22px,1280px)}.foodsheet .utility{height:35px}.foodsheet .utility-left span:not(:first-child), .foodsheet .utility-right a{display:none}.foodsheet .utility-left span{font-size:8px;border:0}.foodsheet .utility-right button{margin-left:14px}.foodsheet .mobile-menu{display:block!important;font-size:15px}.foodsheet .masthead{height:72px}.foodsheet .masthead img{max-width:94%;width:410px}.foodsheet .main-nav{justify-content:flex-start}.foodsheet .main-nav button{padding-inline:13px;font-size:9px}.foodsheet .latest{height:39px;justify-content:flex-start}.foodsheet .latest-label{padding-left:3px}.foodsheet .latest-time{padding-inline:10px}.foodsheet .latest-story{font-size:10px}.foodsheet .hero-grid{display:block;border-bottom:0}.foodsheet .lead-story{height:338px}.foodsheet .lead-copy{left:18px;top:22px;width:86%}.foodsheet .lead-copy h1{font-size:34px;margin-top:40px}.foodsheet .lead-copy .deck{font-size:12px;width:90%}.foodsheet .lead-copy .meta{top:267px}.foodsheet .interview{height:330px;border:1px solid var(--line);border-top:0;grid-template-columns:54% 46%}.foodsheet .interview-copy{padding:17px 14px}.foodsheet .interview-copy h2{font-size:22px}.foodsheet .opening{border:1px solid var(--line);border-top:0;padding-bottom:8px}.foodsheet .tracker-list{display:block}.foodsheet .tracker-row{grid-template-columns:112px 1fr}.foodsheet .discovery{display:block;height:auto;margin-top:13px;border:0}.foodsheet .guides{padding:0}.foodsheet .guide-grid{overflow-x:auto;grid-template-columns:repeat(5,140px);padding-bottom:12px}.foodsheet .guide-card img{height:88px}.foodsheet .weekend{border:1px solid var(--line);padding:0 12px 12px}.foodsheet .map-card{border:1px solid var(--line);margin-top:12px;padding:0}.foodsheet .rankings{display:block;height:auto;margin-top:13px;border:0}.foodsheet .best-dishes{padding:0 0 12px;border-bottom:1px solid var(--line)}.foodsheet .dish-grid{overflow-x:auto;grid-template-columns:repeat(5,125px);padding-bottom:8px}.foodsheet .dish-card img{height:79px}.foodsheet .reservations{border:0;padding:8px 0 12px}.foodsheet .reservation-grid{grid-template-columns:1fr 1fr}.foodsheet .reservation img{height:94px}.foodsheet .promo-strip{display:block}.foodsheet .newsletter-mini, .foodsheet .promo-story{border-right:0;border-bottom:1px solid var(--line)}.foodsheet .promo-story{grid-template-columns:125px 1fr}.foodsheet .desk-grid{display:block}.foodsheet .desk-column, .foodsheet .desk-column:first-child, .foodsheet .desk-column:last-child{padding:13px 0;border-right:0;border-bottom:1px solid var(--line)}.foodsheet .story-row{height:94px;grid-template-columns:130px 1fr}.foodsheet .feature-band{display:block;height:auto}.foodsheet .feature-card{height:221px;border-right:0;border-bottom:1px solid var(--line);grid-template-columns:55% 45%}.foodsheet .feature-card:last-child{border-bottom:0}.foodsheet .newsletter-banner{height:210px}.foodsheet .newsletter-banner>img{width:100%;height:105px;left:0;right:0;top:auto;bottom:0}.foodsheet .newsletter-banner:after{background:linear-gradient(180deg,#fff 0%,#fff 52%,rgba(255,255,255,.8) 68%,rgba(255,255,255,0) 92%)}.foodsheet .newsletter-copy{width:100%;padding:22px 16px}.foodsheet .newsletter-copy .inline-form{width:100%}.foodsheet footer{height:auto;padding-bottom:40px}.foodsheet .footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.foodsheet .footer-brand{grid-column:1/-1;border-right:0;border-bottom:1px solid var(--line);padding:0 0 20px;min-height:0}.foodsheet .footer-col.legal{display:block}.foodsheet .copyright{grid-column:1/-1}.foodsheet .mobile-search{display:none;position:absolute;z-index:15;top:39px;right:11px;width:calc(100% - 22px);height:48px;padding:7px;background:#fff;border:1px solid var(--line)}.foodsheet .mobile-search.open{display:block}.foodsheet .mobile-search input{width:100%;height:32px;border:1px solid #aaa;padding:0 10px;font:12px "Inter",Arial,sans-serif}
    }
  
/* ---- full bleed, the entertainment sheet's terms (owner,
   2026-08-14: 'take up the whole width like the entertainment page').
   The sheet's frame comes off so the desk owns the screen; the mock's
   own column cap rises from 1280 to 1720 (the number
   .entdesk .page-wrap uses) so the design breathes into the space
   instead of sitting as a 1280px island in a white field. ---- */
.foodlight { max-width: none; border-radius: 0; box-shadow: none; }
.foodsheet .page-width { width: min(1720px, calc(100% - 48px)); }
@media (max-width: 700px) {
  .foodsheet .page-width { width: min(1720px, calc(100% - 22px)); }
}

/* ---- what the widening cost, and the repair (owner, 2026-08-14:
   'the design is a little off', with a screenshot of the hero sitting
   on top of the guides strip).
   The widening above shipped on the claim that every proportion in
   the mock is fr- or percent-based. It is not. The mock is a 1280px
   drawing with pixel heights baked into its rows, and .hero-grid's
   height:289px is the worst of them: at a 1232px column the lead
   photo's own aspect happens to produce 289px, so the number read
   like a layout when it was a coincidence. Widen the column to 1720
   and the photo wants 394px while the row still reserves 289 --
   .lead-story is a grid item, so the extra 105px does not clip, it
   paints over the guides strip and the weekend tabs underneath.
   Two more rows were left half-empty by the same move: the interview
   byline and the opening tracker both filled their columns at 1280
   only because the columns were short.
   None of this restyles the mock. Each rule restates a proportion
   the mock already had, in a form that survives a wider column. The
   guard is the mock's own design width: at 1280 and below -- mobile
   included -- nothing in the block below applies, and those widths
   render exactly as they did before this change. Above it the
   repairs come in from a zero delta, so there is no step at the
   breakpoint. (The .lead-copy reset that follows is the one rule
   here that is deliberately NOT guarded -- see its own note.) ---- */

/* ---- one leak, at every width. styles.css carries an UNSCOPED
   .lead-copy (min-height:313px; display:flex) for the front page's
   hero, and the mock uses the same class name. The mock never
   declares display on .lead-copy, so the house rule wins by default
   and blockifies its children: 'CRITIC'S PICK' stops being an 84px
   pill and stretches into a 385px red slab, and the copy block
   claims 313px it does not use. The specimen at
   specimens/dining-mock/index.html renders the pill; the shipped
   page did not. This restores the mock's own defaults -- it is
   fidelity to the drawing, not a change to it, which is why it is
   not width-guarded. (Four more class names collide the same way --
   .eyebrow, .meta, .latest, .latest-label -- but only this one
   currently does visible damage.) ---- */
.foodsheet .lead-copy { display: block; min-height: 0; padding: 0; }
@media (min-width: 1281px) {
  /* the row's height is the lead photo's own ratio -- 616x289, the
     mock's own numbers -- so it stays a real height at any width */
  .foodsheet .hero-grid { height: auto; }
  .foodsheet .lead-story { aspect-ratio: 616 / 289; }
  /* the byline's top:245px is the drawing's stand-in for 'bottom':
     it sat 7px off the foot of a 289px photo. Say bottom, so it
     keeps sitting there instead of floating mid-photo. */
  .foodsheet .lead-copy { bottom: 7px; }
  .foodsheet .lead-copy .meta { top: auto; bottom: 0; }
  /* hold the interview byline at the foot of its column, where the
     mock's copy landed it when the column was short */
  .foodsheet .interview-copy { display: flex; flex-direction: column; }
  .foodsheet .interview-copy .meta { margin-top: auto; }
  /* three tracker rows sharing the column, not stacked at the top
     over 108px of white */
  .foodsheet .opening { display: flex; flex-direction: column; }
  .foodsheet .tracker-list { height: auto; flex: 1; display: grid;
    grid-template-rows: repeat(3, 1fr); }
  .foodsheet .tracker-row { align-content: center; }
  /* The opening tracker at the column's scale (owner, 2026-08-14:
     'does that area seem too small, the text and photos?'). It did:
     the column grew 1.36x and its furniture did not, so the thumb
     fell from 37.5% of the column to 27.5% and the type from
     4.25% to 3.12%. The track goes to a percentage -- 97/225 of
     the row -- so it is 97px at the mock's column and grows with
     it. The type follows the same curve: each size is the mock's
     px times (column / 1232), written as calc so it is exact at
     1280 and caps when the column caps at 1720. The photos behind
     this slot are the generated 1200x800 art, so they sharpen as
     they grow. */
  .foodsheet .tracker-row { grid-template-columns: 43.111% 1fr; }
  .foodsheet .tracker-row img { width: 100%; height: auto;
    aspect-ratio: 97 / 65; }
  .foodsheet .tracker-row h3 {
    font-size: clamp(11px, calc(0.89286vw - 0.42857px), 15.36px); }
  .foodsheet .tracker-row p {
    font-size: clamp(8px, calc(0.64935vw - 0.31169px), 11.17px); }
  .foodsheet .tracker-kicker {
    font-size: clamp(7px, calc(0.56818vw - 0.27273px), 9.77px); }
  /* The map keeps the whole cell (owner: 'slightly not wide
     enough'). Filling the card's real height instead of a fixed
     160px cuts the stretch the widening caused from 1.42x to
     1.23x. It cannot be made sharp here: the source is the mock's
     own 200x123 panel and every pixel past that is invention. This
     slot wants a re-cut asset, not a CSS rule. */
  .foodsheet .map-card img { height: 100%; }
}

.foodsheet .sheet-colophon { max-width: 1720px; margin: 0 auto; padding: 10px 16px 0; text-align: right; font: 8px 'Inter', Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #9a9a96; }
.foodsheet .latest-label a { text-decoration: none; color: inherit; }

/* The house tail below the sheet: the desk's real stories, plate
   and switcher — standing site furniture, not the owner's design. */
.food-tail { max-width: 1720px; margin: 0 auto; padding: 22px 16px 10px; }
.food-tail-links { font: 700 9px 'Inter', Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 10px; }
.food-tail-links a { color: #444; text-decoration: none; }
.food-tail-file { list-style: none; margin: 0 0 6px; padding: 0; columns: 2; column-gap: 40px; }
.food-tail-file li { font: 11px/1.9 'Source Serif 4', Georgia, serif; break-inside: avoid; }
.food-tail-file .file-date { font: 700 8px 'Inter', Arial, sans-serif; letter-spacing: .05em; color: #8a8a86; margin-right: 6px; text-transform: uppercase; }
.food-tail-file a { color: #222; text-decoration: none; }
.food-tail-file a:hover { text-decoration: underline; }

/* The Globe's display face on the mock's headline slots. */
.foodsheet h1, .foodsheet h2, .foodsheet h3, .foodsheet .modal h2 { font-family: "Playfair Display", Georgia, serif; }

/* ---- THE TYPE FLOOR (2026-08-16). This sheet has no zoom, so
   these declared sizes are what a reader actually gets. 6.5px was
   the smallest type on the site. Relative order is preserved. ---- */
.foodlight .foodsheet .meta { font-size: 9.5px; }          /* 6.5 */
.foodlight .foodsheet .review-kicker { font-size: 9.5px; } /* 6.5 */
.foodlight .foodsheet .muted { font-size: 10px; }          /* 7   */
.foodlight .foodsheet .subscribe-btn { font-size: 10px; }  /* 7   */
.foodlight .foodsheet .tracker-kicker { font-size: 10px; } /* 7.9 */
.foodlight .foodsheet .time { font-size: 10.5px; }         /* 7.5 */
.foodlight .foodsheet .eyebrow { font-size: 10.5px; }      /* 8   */
.foodlight .foodsheet .detail { font-size: 10.5px; }       /* 8   */
.foodlight .foodsheet .sheet-colophon { font-size: 9.5px; color: #6a6a66; }
.foodlight .food-tail-file .file-date { font-size: 9.5px; color: #6a6a66; }
.foodlight .foodsheet .latest-time, .foodlight .foodsheet .lead-badge { font-size: 10.5px; }
.foodlight .foodsheet .dish-card p, .foodlight .foodsheet .guide-card p,
.foodlight .foodsheet .reservation p
  { font-size: 9.5px; }
/* the headlines, to the 13px floor */
.foodlight .foodsheet .guide-name, .foodlight .foodsheet .dish-name,
.foodlight .foodsheet .latest-story h3, .foodlight .foodsheet .tracker-name,
.foodlight .foodsheet .review-name { font-size: 13.5px; line-height: 1.24; }

/* ---- THE PHONE. Two grids ran off the edge and were CLIPPED
   rather than scrollable (body carries overflow-x: clip), so the
   neighbourhood guides lost cards four and five and Best Dishes
   stopped after 03 — with nothing to say they existed. They stack
   instead. ---- */
@media (max-width: 700px) {
  .foodlight .foodsheet .latest-story, .foodlight .foodsheet .lead-story,
  .foodlight .foodsheet .guide-grid, .foodlight .foodsheet .dish-grid {
    grid-template-columns: minmax(0, 1fr); }
  /* The lead's meta line carries a hard width:390px from the
     mock, which overran a 390px phone by the width of its own
     inset. It was invisible only because the card clipped it. */
  .foodlight .foodsheet .lead-copy .meta { width: auto; max-width: 100%; }
  .foodlight .foodsheet .meta, .foodlight .foodsheet .review-kicker { font-size: 11px; }
  .foodlight .foodsheet .muted, .foodlight .foodsheet .time, .foodlight .foodsheet .eyebrow,
  .foodlight .foodsheet .detail, .foodlight .foodsheet .tracker-kicker { font-size: 12px; }
  .foodlight .foodsheet .guide-name, .foodlight .foodsheet .dish-name,
  .foodlight .foodsheet .latest-story h3, .foodlight .foodsheet .tracker-name,
  .foodlight .foodsheet .review-name { font-size: 16px; }
}