/* ===== Option B · "The Daily Bird" — editorial, cream, menu-first (mobile-first) ===== */
:root{--paper:#f3eee6;--paper2:#ebe3d6;--ink:#141110;--ink2:#2a2320;--mut:#6b6056;--amber:#c97b06;--amber2:#f5a524;--hot:#c0301a;--line:rgba(20,17,16,.14);
  --serif:"Fraunces",Georgia,serif;--sans:"Inter",system-ui,sans-serif;--mono:"Space Mono",ui-monospace,monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;padding-bottom:84px}
a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:.95;margin:0;letter-spacing:-.02em}
h1 em,h2 em{font-style:italic;font-weight:400;color:var(--amber)}
.wrap{width:min(1180px,100% - 40px);margin:0 auto}
.kick{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--mut)}
.rule{height:1px;background:var(--ink);opacity:.9}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 22px;border-radius:999px;font-weight:700;font-size:14px;letter-spacing:.04em;text-transform:uppercase;border:1.5px solid var(--ink);transition:transform .2s,background .2s,color .2s;white-space:nowrap;cursor:pointer;font-family:inherit}
.btn.a{background:var(--ink);color:var(--paper)}.btn.a:hover{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.btn.g{background:transparent;color:var(--ink)}.btn.g:hover{background:var(--ink);color:var(--paper)}
.btn.amb{background:var(--amber2);border-color:var(--amber2);color:var(--ink)}

/* masthead */
.mast{position:sticky;top:0;z-index:40;background:rgba(243,238,230,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.mast .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px}
.mast .logo img{height:22px;width:auto;filter:invert(1)}
.mast nav{display:none;gap:26px;font-size:14px;font-weight:600}
.mast nav a:hover{color:var(--amber)}
.mast .date{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
@media (min-width:900px){.mast nav{display:flex}.mast .date{display:block}}

/* hero */
.hero{padding:34px 0 10px}
.hero .top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.hero h1{font-size:clamp(50px,11.5vw,150px);margin:22px 0 18px;max-width:14ch}
.hero .lead{font-size:18px;max-width:46ch;color:var(--ink2);margin:0 0 20px}
.hero .cta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:26px}
.hero .duo{display:grid;gap:14px}
.hero figure{margin:0;position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/5;background:var(--ink)}
.hero figure img{width:100%;height:100%;object-fit:cover}
.hero figcaption{position:absolute;left:14px;bottom:12px;font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--paper)}
.ticket{border:1.5px solid var(--ink);border-radius:18px;padding:18px 20px;background:var(--paper2);display:grid;gap:10px;align-content:start}
.ticket .kick{color:var(--amber)}
.ticket h3{font-size:28px}
.ticket dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:14px}
.ticket dt{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);padding-top:2px}
.ticket dd{margin:0;font-weight:600}
.ticket .open{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.ticket .open i{width:8px;height:8px;border-radius:50%;background:#2e9a4b;box-shadow:0 0 0 4px rgba(46,154,75,.2)}
@media (min-width:900px){.hero{padding:54px 0 20px}.hero .grid{display:grid;grid-template-columns:1.25fr .9fr;gap:40px;align-items:end}.hero .duo{grid-template-columns:1fr 1fr}.hero h1{font-size:clamp(70px,8.6vw,150px)}}

/* section heads */
.sec{padding:64px 0}
.sec .head{display:grid;gap:12px;margin-bottom:28px}
.sec .head h2{font-size:clamp(40px,8vw,88px)}
.sec .head p{color:var(--mut);max-width:52ch;margin:0}
@media (min-width:900px){.sec{padding:96px 0}.sec .head{grid-template-columns:1fr 1fr;align-items:end}.sec .head p{justify-self:end;text-align:right}}

/* menu board */
.board{border-top:2px solid var(--ink)}
.board .item{display:grid;grid-template-columns:1fr auto;gap:4px 18px;padding:18px 0;border-bottom:1px solid var(--line);align-items:baseline}
.board .item h3{font-family:var(--serif);font-size:26px;font-weight:600}
.board .item .price{font-family:var(--serif);font-size:26px;font-style:italic;color:var(--amber)}
.board .item p{grid-column:1/-1;margin:0;color:var(--mut);font-size:15px;max-width:60ch}
.board .item .tags{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:4px 8px;color:var(--mut)}
.tag.hot{color:var(--hot);border-color:rgba(192,48,26,.35)}
.board .item.featured h3:after{content:"★ Star plate";font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-left:10px;vertical-align:middle;font-style:normal}
.menu-foot{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:22px}
.menu-foot .kick{max-width:60ch}
@media (min-width:900px){.board{display:grid;grid-template-columns:1fr 1fr;column-gap:60px}.board .item:nth-child(-n+3){border-top:0}}

/* cinematic inset scenes (reuse play.css .star inside a dark card) */
.inset .star{border-radius:26px;overflow:hidden;background:#0b0907;color:#f3eee6}
.inset .star .stage{height:min(78vh,720px);min-height:560px}
.inset .star .panel,.inset .star .meta{left:22px}
.inset .star .panel h2,.inset .star .panel .ttl{font-family:"Anton",Impact,sans-serif;font-weight:400;letter-spacing:.005em;line-height:.88;text-transform:uppercase;color:#f3eee6}
.inset .star .panel .amb{color:#f5a524}
.inset .star .btn{border:0}
.inset .star .btn.a{background:#f5a524;color:#0d0b09}
.inset .star .btn.g{background:rgba(243,238,230,.1);color:#f3eee6}
.inset .star .eyebrow{color:#ffb640;font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;gap:12px}
.inset .star .eyebrow:before{content:"";width:28px;height:1px;background:currentColor}
.inset .cap{display:flex;justify-content:space-between;gap:12px;padding:14px 4px 0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut)}
@media (min-width:900px){.inset .star .panel{left:48px;max-width:460px}.inset .star .meta{left:48px}}

/* heat ladder */
.ladder{display:grid;gap:0;border-top:2px solid var(--ink)}
.ladder .rung{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line)}
.ladder .n{font-family:var(--serif);font-style:italic;font-size:28px;color:var(--amber)}
.ladder h3{font-size:24px}
.ladder p{margin:4px 0 0;color:var(--mut);font-size:14px}
.ladder .chilis{font-size:18px;letter-spacing:2px;white-space:nowrap}
.ladder .rung:last-child .chilis,.ladder .rung:last-child h3{color:var(--hot)}
.heat .grid{display:grid;gap:28px}
.heat figure{margin:0;border-radius:18px;overflow:hidden;aspect-ratio:4/5;position:relative}
.heat figure img{width:100%;height:100%;object-fit:cover}
.heat .note{margin-top:16px}
@media (min-width:900px){.heat .grid{grid-template-columns:1fr .8fr;gap:60px;align-items:start}.heat figure{position:sticky;top:90px}}

/* filthy combos */
.filthy .grid{display:grid;gap:24px}
.combo{border:1.5px solid var(--ink);border-radius:18px;padding:22px;background:var(--paper2);display:grid;gap:10px}
.combo h3{font-size:30px}
.combo .price{font-family:var(--serif);font-style:italic;font-size:30px;color:var(--amber)}
.combo .row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.combo ul{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.combo li{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--ink);border-radius:999px;padding:6px 10px}
.filthy figure{margin:0;border-radius:18px;overflow:hidden;aspect-ratio:1/1}
.filthy figure img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){.filthy .grid{grid-template-columns:1fr 1fr;gap:40px;align-items:center}}

/* proof strip */
.proof{background:var(--ink);color:var(--paper);padding:56px 0}
.proof .grid{display:grid;gap:26px}
.proof .score b{display:block;font-family:var(--serif);font-size:72px;line-height:1;font-style:italic;color:var(--amber2)}
.proof .score span{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(243,238,230,.6)}
.proof h2{font-size:clamp(36px,6vw,64px);color:var(--paper)}
.proof p{color:rgba(243,238,230,.75);max-width:48ch}
@media (min-width:900px){.proof .grid{grid-template-columns:1.1fr repeat(3,.5fr);align-items:end;gap:40px}}

/* tiles */
.tiles{display:grid;gap:14px}
.tile{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:var(--ink);color:var(--paper);display:block}
.tile img{width:100%;height:100%;object-fit:cover;opacity:.78;transition:transform .6s}
.tile:hover img{transform:scale(1.04)}
.tile .t{position:absolute;left:18px;right:18px;bottom:16px}
.tile .t h3{font-size:30px;color:var(--paper)}
.tile .t p{margin:6px 0 0;font-size:14px;color:rgba(243,238,230,.8)}
.tile .kick{color:var(--amber2)}
@media (min-width:900px){.tiles{grid-template-columns:repeat(3,1fr)}}

/* visit */
.visit .grid{display:grid;gap:24px}
.visit .card{border:1.5px solid var(--ink);border-radius:18px;padding:24px;background:var(--paper2)}
.visit .card h2{font-size:clamp(36px,6vw,64px);margin:10px 0 8px}
.visit .hours{display:grid;gap:8px;margin:18px 0 22px;border-top:1px solid var(--line)}
.visit .hours div{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);font-size:15px}
.visit .hours span{color:var(--mut)}
.visit .map{border-radius:18px;overflow:hidden;min-height:320px;border:1.5px solid var(--ink)}
.visit .map iframe{width:100%;height:100%;min-height:320px;border:0;filter:grayscale(1) contrast(1.05)}
.faq{margin-top:40px;border-top:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:18px 0;font-family:var(--serif);font-size:22px;display:flex;justify-content:space-between;gap:12px}
.faq summary:after{content:"+";font-family:var(--mono);color:var(--amber)}
.faq details[open] summary:after{content:"–"}
.faq p{margin:0 0 18px;color:var(--mut);max-width:70ch}
@media (min-width:900px){.visit .grid{grid-template-columns:1fr 1fr;gap:40px}}

/* footer + sticky action bar */
footer{padding:50px 0 40px;border-top:2px solid var(--ink)}
footer .cols{display:grid;gap:18px;font-size:14px;color:var(--mut)}
footer .cols b{display:block;color:var(--ink);margin-bottom:6px;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
footer .cols a{display:inline-block;padding:4px 0}
footer .huge{font-family:var(--serif);font-style:italic;font-size:clamp(44px,12vw,160px);line-height:1;margin-bottom:24px;color:var(--ink)}
@media (min-width:900px){footer .cols{grid-template-columns:repeat(4,1fr)}}
.actionbar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:10px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(243,238,230,.94);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
.actionbar .btn{flex:1}
@media (min-width:900px){.actionbar{display:none}body{padding-bottom:0}}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
/* tokens expected by play.css inside the inset scenes */
.inset .star{--display:"Anton",Impact,sans-serif;--cream:#f3eee6;--amber:#f5a524;--mut:#a89c8c;--line:rgba(243,238,230,.12);--ink:#0d0b09}