/* Moth & Mercury, a fictional late-night cocktail lounge. Sample concept by DAH Websites (BRIEF-6).
   Comic-ink playbill system: vermilion, ink, paper; brass only on the main action (Reserve). Own file, shares nothing. */
@font-face{font-family:"Alfa Slab One";src:url(/assets/fonts/alfa-slab-one-latin.woff2) format("woff2");font-weight:400;font-display:optional}
@font-face{font-family:Spectral;src:url(/assets/fonts/spectral-400-latin.woff2) format("woff2");font-weight:400;font-display:optional}
@font-face{font-family:Spectral;src:url(/assets/fonts/spectral-400-italic-latin.woff2) format("woff2");font-weight:400;font-style:italic;font-display:optional}
@font-face{font-family:Spectral;src:url(/assets/fonts/spectral-600-latin.woff2) format("woff2");font-weight:600;font-display:optional}
:root{--ink:#17110f;--ink-2:#241a16;--paper:#f3ead7;--paper-2:#e7dcc4;--red:#c1271d;--deep:#7e1912;--brass:#d8aa4f;--brass-2:#f0c873;
  --slab:"Alfa Slab One",Rockwell,"Roboto Slab",serif;--serif:Spectral,Georgia,"Times New Roman",serif;--ease:cubic-bezier(.22,1,.36,1);
  --line:3px solid var(--ink);--pop:6px 6px 0 var(--ink);--head:64px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--head) + 16px);background:var(--ink)}
body{margin:0;background:var(--ink);color:var(--paper);font:400 1.0625rem/1.62 var(--serif);overflow-x:clip;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--brass-2);outline-offset:3px}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--slab);font-weight:400;line-height:1.02;letter-spacing:.005em;margin:0 0 .4em}
h1{font-size:clamp(2.6rem,11vw,6.4rem)}h2{font-size:clamp(2rem,7.4vw,4.2rem)}h3{font-size:clamp(1.25rem,4.6vw,1.6rem)}
p{margin:0 0 1em}
.mm-i{width:1.05em;height:1.05em;flex:none;display:inline-block;vertical-align:-.15em}
.mm-defs{position:absolute;width:0;height:0;overflow:hidden}
.mm-skip{position:absolute;left:12px;top:-60px;z-index:60;background:var(--paper);color:var(--ink);padding:10px 16px;border:var(--line)}
.mm-skip:focus{top:12px}
.mm-wrap{width:min(1180px,100% - 40px);margin-inline:auto}
.mm-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* banner + header */
.mm-flag{margin:0;padding:8px 16px;background:var(--paper);color:var(--ink);font-size:.82rem;text-align:center;border-bottom:var(--line);position:relative;z-index:41}
.mm-flag span{opacity:.7}.mm-flag a{font-weight:600;white-space:nowrap}
.mm-head{position:sticky;top:0;z-index:40;height:var(--head);display:flex;align-items:center;gap:14px;padding:0 16px;background:var(--ink);border-bottom:2px solid var(--red)}
.mm-logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--slab);font-size:1.12rem;letter-spacing:.02em;white-space:nowrap;margin-right:auto}
.mm-logo svg{width:34px;height:26px}
.mm-logo b{font-weight:400;color:var(--red);padding:0 .12em}
.mm-nav{display:none}
.mm-reserve,.mm-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:46px;padding:10px 20px;border:var(--line);border-radius:999px;background:var(--brass);color:var(--ink);
  font:400 1rem/1 var(--slab);letter-spacing:.02em;text-decoration:none;cursor:pointer;box-shadow:3px 3px 0 var(--paper);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .2s}
.mm-reserve:hover,.mm-btn:hover{background:var(--brass-2);transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--paper)}
.mm-reserve:active,.mm-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--paper)}
.mm-head .mm-reserve{min-height:40px;padding:8px 15px;font-size:.9rem}
.mm-btn.ghost{background:transparent;color:var(--paper);border-color:var(--paper);box-shadow:none}
.mm-btn.ghost:hover{background:var(--paper);color:var(--ink)}
.on-paper .mm-btn{box-shadow:var(--pop)}.on-paper .mm-btn.ghost{color:var(--ink);border-color:var(--ink)}
.on-paper .mm-btn.ghost:hover{background:var(--ink);color:var(--paper)}
.mm-menu-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 4px;background:none;border:0;cursor:pointer;font:600 .95rem/1 var(--serif);letter-spacing:.08em;text-transform:uppercase}
.mm-burger{width:22px;height:12px;position:relative}.mm-burger i{position:absolute;left:0;right:0;height:2px;background:currentColor;transition:transform .4s var(--ease)}
.mm-burger i:first-child{top:0}.mm-burger i:last-child{bottom:0}
[aria-expanded="true"] .mm-burger i:first-child{transform:translateY(5px) rotate(45deg)}[aria-expanded="true"] .mm-burger i:last-child{transform:translateY(-5px) rotate(-45deg)}
/* phone menu: a drinks card with dotted leaders */
.mm-card-menu{position:fixed;inset:var(--head) 0 auto;z-index:39;max-height:calc(100svh - var(--head));overflow:auto;background:var(--paper);color:var(--ink);border-bottom:var(--line);padding:22px 20px 26px;
  transform:translateY(-12px);opacity:0;visibility:hidden;transition:transform .45s var(--ease),opacity .3s,visibility 0s .45s}
.mm-card-menu.is-open{transform:none;opacity:1;visibility:visible;transition:transform .45s var(--ease),opacity .3s}
.mm-card-menu h2{font-size:1.05rem;letter-spacing:.2em;text-transform:uppercase;text-align:center;margin-bottom:12px}
.mm-card-menu ul{list-style:none;margin:0;padding:0}
.mm-card-menu a{display:flex;align-items:baseline;gap:8px;padding:9px 0;text-decoration:none;font:400 1.35rem/1.15 var(--slab)}
.mm-card-menu a::after{content:"";flex:1;order:1;border-bottom:2px dotted currentColor;opacity:.45;transform:translateY(-4px)}
.mm-card-menu a small{order:2;font:italic 400 .95rem/1 var(--serif);color:var(--red)}
.mm-card-menu a[aria-current="page"]{color:var(--red)}
@media(min-width:1000px){
  .mm-head{padding:0 28px;gap:24px}.mm-menu-btn,.mm-card-menu{display:none}
  .mm-nav{display:flex;gap:4px}
  .mm-nav a{position:relative;padding:8px 10px;text-decoration:none;font-size:.98rem;letter-spacing:.03em}
  .mm-nav a::after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
  .mm-nav a:hover::after,.mm-nav a[aria-current="page"]::after{transform:none}
}
.mm-crumbs{font-size:.88rem;margin:0 0 18px;opacity:.85}.mm-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.mm-crumbs li+li::before{content:"/";margin-right:6px;opacity:.6}

/* ================= the scroll story (home) ================= */
.mm-story{position:relative;background:var(--ink)}
.mm-skip-story{position:absolute;right:16px;top:12px;z-index:5;font-size:.85rem;background:var(--ink);padding:6px 10px;border:1px solid var(--paper);border-radius:999px;text-decoration:none;opacity:.85}
.mm-scene{position:relative;height:var(--len,230svh);background:var(--bg,var(--ink));color:var(--fg,var(--paper))}
.mm-pin{position:sticky;top:0;height:100svh;overflow:hidden;contain:paint}
.mm-pin::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:var(--dot-o,.1);
  background:radial-gradient(circle,var(--dot,#f3ead7) 1.05px,transparent 1.5px) 0 0/7px 7px}
.mm-stage{position:absolute;left:50%;top:41%;height:min(60svh,108vw);aspect-ratio:3/4;transform:translate(-50%,-50%)}
.mm-layer{position:absolute;inset:0;transform-origin:50% 50%}
.mm-svg{width:100%;height:100%}
.mm-scene.is-live .mm-layer,.mm-scene.is-live .mm-cap-in,.mm-scene.is-live .mm-title span{will-change:transform,opacity}
.mm-cap{position:absolute;left:16px;right:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:3}
.mm-cap-in{background:var(--paper);color:var(--ink);border:var(--line);box-shadow:var(--pop);padding:16px 18px 6px;max-width:34rem}
.mm-cap-in h2{font-size:clamp(1.55rem,6.6vw,2.6rem);margin-bottom:.3em}
.mm-cap-in p{font-size:1rem;line-height:1.5}
.mm-act{display:inline-block;font:italic 400 .95rem/1 var(--serif);color:var(--red);margin-bottom:8px}
.mm-cap.dark .mm-cap-in{background:var(--ink);color:var(--paper);border-color:var(--paper);box-shadow:6px 6px 0 var(--red)}
.mm-cap.dark .mm-act{color:var(--brass-2)}
/* scene 1, hero */
.mm-hero{--len:190svh}
.mm-hero .mm-stage{top:58%;height:min(64svh,112vw)}
.mm-title{position:absolute;left:0;right:0;top:calc(3svh + 10px);z-index:3;text-align:center;margin:0;font-size:clamp(3rem,15.5vw,8.8rem);line-height:.9;color:var(--paper);text-shadow:4px 4px 0 var(--red)}
.mm-title span{display:block}.mm-title .amp{font-family:var(--serif);font-style:italic;font-size:.55em;color:var(--brass-2);text-shadow:none;line-height:1.1}
.mm-hero-line{position:absolute;left:20px;right:20px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:3;text-align:center;font:italic 400 1.2rem/1.4 var(--serif);margin:0}
.mm-hero-line span{display:block;font:400 .82rem/1.4 var(--serif);font-style:normal;letter-spacing:.14em;text-transform:uppercase;opacity:.8;margin-top:8px}
.mm-moth-orbit{transform-origin:70.67% 56.5%}
/* per-scene pivots */
[data-part="house"]{transform-origin:50% 75%}
[data-part="curtain-l"]{transform-origin:0 50%}[data-part="curtain-r"]{transform-origin:100% 50%}
[data-part="splash"]{transform-origin:50% 67.5%}
[data-part="bottle"]{transform-origin:59.33% 35%}[data-part="stream"]{transform-origin:59.33% 35.5%}
[data-part="martini-liquid"]{transform-origin:59.33% 77%}
[data-part="spot"]{transform-origin:50% -5%}
[data-part="wing-l"],[data-part="wing-r"]{transform-origin:50% 47.5%}
[data-part="hour"],[data-part="minute"],[data-part="clock"]{transform-origin:50% 47.5%}
.mm-curtain{--bg:var(--deep);--len:230svh}
.mm-cube{--bg:var(--paper);--fg:var(--ink);--dot:#17110f;--dot-o:.13;--len:250svh}
.mm-pour{--bg:var(--ink);--len:250svh}
.mm-singer{--bg:#120d0b;--len:220svh}
.mm-moth{--bg:var(--paper);--fg:var(--ink);--dot:#c1271d;--dot-o:.16;--len:220svh}
.mm-clock{--bg:var(--red);--dot:#17110f;--dot-o:.14;--len:210svh}
@media(min-width:900px){
  .mm-stage{left:68%;top:50%;height:min(86svh,820px)}
  .mm-hero .mm-stage{left:50%;top:60%;height:min(70svh,700px)}
  .mm-cap{left:max(32px,6vw);right:auto;bottom:auto;top:50%;width:min(38vw,470px);transform:translateY(-50%)}
  .mm-hero-line{bottom:28px}
  .mm-title{top:4svh;font-size:clamp(4rem,11vw,9.5rem)}
  .mm-title span{display:inline}.mm-title .amp{font-size:.5em;padding:0 .2em;vertical-align:.2em}
}
/* pick a pour */
.mm-pick{background:var(--paper);color:var(--ink);padding:72px 0 84px;border-top:var(--line);border-bottom:var(--line);position:relative;overflow:hidden}
.mm-pick::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,#c1271d 1.05px,transparent 1.5px) 0 0/7px 7px;opacity:.12;pointer-events:none}
.mm-pick-grid{position:relative;display:grid;gap:28px}
.mm-pick h2{max-width:12ch}
.mm-pick-lede{font-size:1.12rem;max-width:34rem}
.mm-pours{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 6px}
.mm-pours button{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-height:84px;padding:12px 14px;text-align:left;background:var(--paper);border:var(--line);box-shadow:4px 4px 0 var(--ink);cursor:pointer;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .2s}
.mm-pours button b{font:400 1.08rem/1.1 var(--slab)}.mm-pours button span{font-size:.9rem;font-style:italic;opacity:.8}
.mm-pours button i{width:22px;height:8px;border:2px solid var(--ink);background:var(--c)}
.mm-pours button:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.mm-pours button[aria-pressed="true"]{background:var(--ink);color:var(--paper);box-shadow:4px 4px 0 var(--red)}
.mm-pours button[aria-pressed="true"] i{border-color:var(--paper)}
.mm-coupe-wrap{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:16px}
.mm-coupe{position:relative;width:min(300px,78vw);aspect-ratio:4/5;--pour:#c1271d}
.mm-coupe>div{position:absolute;inset:0}
.mm-coupe .liq{transform-origin:50% 61.3%;transform:scale(.2,0)}
.mm-coupe.is-full .liq{transform:none}
.mm-coupe .stream{transform-origin:50% 0;transform:scaleY(0)}
.mm-garnish{position:absolute;inset:0;opacity:0;transition:opacity .5s var(--ease)}
.mm-coupe[data-garnish="twist"] .g-twist,.mm-coupe[data-garnish="cherry"] .g-cherry,.mm-coupe[data-garnish="olive"] .g-olive,.mm-coupe[data-garnish="leaf"] .g-leaf{opacity:1}
.mm-recipe{width:100%;max-width:26rem;border:var(--line);background:var(--paper);box-shadow:var(--pop);padding:16px 18px}
.mm-recipe h3{margin-bottom:.2em}.mm-recipe p{margin:0 0 .4em}.mm-recipe .mm-fine{font-size:.85rem;opacity:.75;margin:0}
@media(min-width:900px){.mm-pick-grid{grid-template-columns:1.05fr .95fr;align-items:center}.mm-pours{grid-template-columns:1fr 1fr}}
/* the house: ticket-stub teasers */
.mm-house{padding:80px 0 92px;background:var(--ink)}
.mm-house h2{max-width:14ch}
.mm-stubs{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:16px}
.mm-stub{position:relative;display:grid;grid-template-columns:76px 1fr;min-height:112px;background:var(--paper);color:var(--ink);text-decoration:none;border:var(--line);
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.mm-stub:hover{transform:translate(-3px,-3px) rotate(-.4deg);box-shadow:8px 8px 0 var(--red)}
.mm-stub .num{display:grid;place-items:center;background:var(--red);color:var(--paper);font:400 1.6rem/1 var(--slab);border-right:3px dashed var(--ink)}
.mm-stub .num svg{width:40px;height:40px}
.mm-stub div{padding:14px 16px}.mm-stub h3{margin:0 0 .2em}.mm-stub p{margin:0;font-size:.98rem}
@media(min-width:760px){.mm-stubs{grid-template-columns:1fr 1fr}}@media(min-width:1100px){.mm-stubs{grid-template-columns:1fr 1fr 1fr}}

/* ================= inner pages ================= */
.mm-bill{position:relative;overflow:hidden;background:var(--red);color:var(--paper);border-bottom:var(--line);padding:34px 0 40px}
.mm-bill::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,#17110f 1.05px,transparent 1.5px) 0 0/7px 7px;opacity:.16;pointer-events:none}
.mm-bill-grid{position:relative;display:grid;gap:12px;align-items:end}
.mm-bill h1{font-size:clamp(2.6rem,12vw,6rem);text-shadow:4px 4px 0 var(--ink);margin-bottom:.15em}
.mm-bill .mm-lede{font:italic 400 1.22rem/1.45 var(--serif);max-width:36rem;margin:0}
.mm-emblem{position:relative;width:min(240px,56vw);aspect-ratio:3/4;justify-self:end;margin-top:-6px}
.mm-emblem .mm-layer{position:absolute;inset:0}
@media(min-width:900px){.mm-bill{padding:56px 0 60px}.mm-bill-grid{grid-template-columns:1fr auto}.mm-emblem{width:270px;margin:0}}
.mm-sec{padding:64px 0}.mm-sec.on-paper{background:var(--paper);color:var(--ink)}
.mm-sec.on-red{background:var(--deep)}
.mm-sec h2{margin-bottom:.5em}
.mm-two{display:grid;gap:28px}@media(min-width:900px){.mm-two{grid-template-columns:1fr 1fr;gap:56px}}
.mm-panel{border:var(--line);background:var(--paper);color:var(--ink);box-shadow:var(--pop);padding:20px}
.mm-sec:not(.on-paper) .mm-panel{border-color:var(--paper);box-shadow:6px 6px 0 var(--red)}
.mm-ph{display:block;border:2px dashed currentColor;padding:12px 14px;font-style:italic;opacity:.85}
.mm-list{margin:0;padding-left:1.2em}.mm-list li{margin-bottom:.4em}
.mm-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.mm-chips button{min-height:44px;padding:8px 16px;border:2px solid currentColor;border-radius:999px;background:transparent;cursor:pointer;font-size:.98rem}
.mm-chips button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.mm-sec:not(.on-paper) .mm-chips button[aria-pressed="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.mm-out{display:block;font-style:italic;margin:0 0 14px;min-height:1.6em}
/* menu */
.mm-drinks{list-style:none;margin:0;padding:0;display:grid;gap:0}
.mm-drink{display:grid;grid-template-columns:1fr auto;gap:2px 14px;padding:16px 0;border-bottom:2px dotted rgba(23,17,15,.4);transition:background .3s}
.mm-drink h3{margin:0;font-size:1.3rem}.mm-drink p{margin:0;grid-column:1/-1;font-size:1rem}
.mm-drink .tag{font:italic 400 .9rem/1.3 var(--serif);color:var(--red);white-space:nowrap}
.mm-drink .price{grid-column:1/-1;font-size:.85rem;opacity:.7}
.mm-drink[data-match]{background:linear-gradient(90deg,rgba(193,39,29,.12),transparent 70%);padding-left:12px;border-left:5px solid var(--red)}
.mm-drink[data-match] h3::after{content:attr(data-match);display:inline-block;margin-left:8px;padding:2px 8px;font:600 .72rem/1.4 var(--serif);letter-spacing:.08em;text-transform:uppercase;background:var(--red);color:var(--paper);vertical-align:.3em}
.mm-compass{display:grid;gap:18px}
.mm-pad{position:relative;width:min(100%,340px);aspect-ratio:1;border:var(--line);background:var(--paper);touch-action:none;cursor:crosshair;
  background-image:linear-gradient(var(--ink),var(--ink)),linear-gradient(var(--ink),var(--ink));background-size:2px 100%,100% 2px;background-position:center;background-repeat:no-repeat}
.mm-pad span{position:absolute;font:italic 400 .85rem/1 var(--serif);padding:4px}
.mm-pad .n{top:4px;left:50%;transform:translateX(-50%)}.mm-pad .s{bottom:4px;left:50%;transform:translateX(-50%)}.mm-pad .w{left:4px;top:50%;transform:translateY(-50%)}.mm-pad .e{right:4px;top:50%;transform:translateY(-50%)}
.mm-dot{position:absolute;left:0;top:0;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:var(--red);border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);transition:transform .25s var(--ease)}
.mm-range{display:grid;gap:4px}.mm-range label{font-weight:600}
.mm-range input{width:100%;accent-color:var(--red);min-height:32px}
.mm-range .ends{display:flex;justify-content:space-between;font-size:.85rem;font-style:italic}
@media(min-width:900px){.mm-compass{grid-template-columns:340px 1fr;align-items:start}}
/* forms */
.mm-form{display:grid;gap:16px}
.mm-field{display:grid;gap:6px}.mm-field label,.mm-legend{font-weight:600}
.mm-field input,.mm-field select,.mm-field textarea{width:100%;min-height:48px;padding:10px 12px;border:var(--line);border-radius:0;background:#fffaf0;color:var(--ink)}
.mm-field textarea{min-height:110px}
.mm-err{display:block;min-height:1.4em;font-size:.92rem;color:var(--deep);font-weight:600}
.mm-sec:not(.on-paper) .mm-err{color:var(--brass-2)}
[aria-invalid="true"]{border-color:var(--red)!important;box-shadow:inset 0 0 0 2px var(--red)}
.mm-hint{font-size:.9rem;opacity:.8;margin:0}
.mm-done{border:var(--line);background:var(--ink);color:var(--paper);box-shadow:6px 6px 0 var(--red);padding:20px}
.mm-done h3{color:var(--brass-2)}
fieldset{border:0;margin:0;padding:0;min-width:0}
.mm-opts{display:flex;flex-wrap:wrap;gap:8px}
.mm-opts label{position:relative;cursor:pointer}
.mm-opts input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.mm-opts span{display:inline-flex;align-items:center;justify-content:center;min-height:46px;min-width:46px;padding:8px 14px;border:var(--line);background:#fffaf0;color:var(--ink);transition:transform .3s var(--ease)}
.mm-opts input:checked+span{background:var(--ink);color:var(--paper);box-shadow:3px 3px 0 var(--red)}
.mm-opts input:focus-visible+span{outline:3px solid var(--red);outline-offset:2px}
.mm-nights span{flex-direction:column;min-width:74px;line-height:1.15}.mm-nights b{font:400 1.25rem/1 var(--slab)}
.mm-step{display:inline-flex;align-items:center;border:var(--line);background:#fffaf0;color:var(--ink)}
.mm-step button{width:48px;height:48px;border:0;background:transparent;font:400 1.4rem/1 var(--slab);cursor:pointer}
.mm-step output{min-width:56px;text-align:center;font:400 1.4rem/1 var(--slab)}
.mm-ticket{display:grid;grid-template-columns:1fr 64px;border:var(--line);background:var(--paper);color:var(--ink);margin-top:10px}
.mm-ticket>div{padding:14px 16px}.mm-ticket .tear{border-left:3px dashed var(--ink);display:grid;place-items:center;background:var(--red);color:var(--paper);font:400 1rem/1 var(--slab);writing-mode:vertical-rl}
.mm-ticket dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:4px 12px}.mm-ticket dt{font-weight:600}.mm-ticket dd{margin:0}
.mm-rooms{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.mm-room{border:var(--line);padding:16px;background:var(--paper);color:var(--ink);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.mm-room[data-suggested]{box-shadow:6px 6px 0 var(--red);transform:translate(-3px,-3px)}
.mm-room[data-suggested] h3::after{content:"Suggested";margin-left:10px;padding:2px 8px;font:600 .72rem/1.4 var(--serif);letter-spacing:.08em;text-transform:uppercase;background:var(--red);color:var(--paper);vertical-align:.3em}
@media(min-width:900px){.mm-rooms{grid-template-columns:repeat(3,1fr)}}
/* events */
.mm-bills{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.mm-gig{display:grid;grid-template-columns:84px 1fr;border:var(--line);background:var(--paper);color:var(--ink)}
.mm-gig .day{display:grid;place-items:center;align-content:center;gap:4px;background:var(--ink);color:var(--paper);font:400 1.1rem/1 var(--slab);text-transform:uppercase;padding:10px 4px;text-align:center}
.mm-gig .day small{font:italic 400 .82rem/1 var(--serif);text-transform:none;color:var(--brass-2)}
.mm-gig>div:last-child{padding:14px 16px}.mm-gig h3{margin:0 0 .2em}.mm-gig p{margin:0 0 .6em}
.mm-save{min-height:44px;padding:6px 14px;border:2px solid var(--ink);border-radius:999px;background:transparent;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.mm-save[aria-pressed="true"]{background:var(--red);color:var(--paper);border-color:var(--red)}
@media(min-width:900px){.mm-bills{grid-template-columns:1fr 1fr}}
/* classes: stir timer */
.mm-stir{display:grid;gap:16px;justify-items:start}
.mm-tin{position:relative;width:180px;height:180px;border:var(--line);border-radius:50%;background:var(--paper);display:grid;place-items:center;overflow:hidden}
.mm-tin svg{width:120px;height:120px}
.mm-spoon{transform-origin:50% 50%}
.mm-stir.is-running .mm-spoon{animation:mm-stir 1.2s linear infinite}
@keyframes mm-stir{to{transform:rotate(360deg)}}
.mm-count{font:400 2.4rem/1 var(--slab)}
/* faq */
.mm-faq-group{margin-bottom:34px}.mm-faq-group h2{font-size:clamp(1.5rem,5vw,2.2rem)}
.mm-faq details{border:var(--line);background:var(--paper);color:var(--ink);margin-bottom:10px}
.mm-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;padding:14px 16px;font:400 1.1rem/1.25 var(--slab)}
.mm-faq summary::-webkit-details-marker{display:none}
.mm-faq summary svg{transition:transform .35s var(--ease);flex:none;width:22px;height:22px}
.mm-faq details[open] summary svg{transform:rotate(45deg)}
.mm-faq details p{padding:0 16px 14px;margin:0}
.mm-search{width:100%;max-width:28rem;min-height:48px;padding:10px 14px;border:var(--line);background:#fffaf0;color:var(--ink);margin-bottom:6px}
/* visit map */
.mm-map{border:var(--line);background:var(--paper);box-shadow:var(--pop)}
.mm-hours{width:100%;border-collapse:collapse}.mm-hours th,.mm-hours td{text-align:left;padding:9px 0;border-bottom:2px dotted rgba(23,17,15,.35)}
/* footer: a matchbook */
.mm-foot{background:var(--red);color:var(--paper);border-top:var(--line);padding:0 0 calc(96px + env(safe-area-inset-bottom));position:relative}
.mm-strike{height:26px;background:repeating-linear-gradient(-35deg,#5c140f 0 3px,#3a0d0a 3px 6px);border-bottom:var(--line)}
.mm-foot-grid{display:grid;gap:26px;padding:40px 0 20px}
.mm-foot h2{font-size:1rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:10px;color:var(--ink)}
.mm-foot ul{list-style:none;margin:0;padding:0;columns:2;column-gap:20px}.mm-foot li{margin-bottom:6px}
.mm-foot-word{font:400 clamp(3rem,14vw,9rem)/.9 var(--slab);color:var(--ink);margin:12px 0 18px;letter-spacing:-.01em}
.mm-fine{font-size:.88rem;opacity:.9}
@media(min-width:900px){.mm-foot-grid{grid-template-columns:1.1fr 1fr 1.3fr 1fr}.mm-foot{padding-bottom:28px}}
/* phone dock */
.mm-dock{position:fixed;left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:30;display:grid;grid-template-columns:1fr 1.4fr;gap:8px}
.mm-dock a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border:var(--line);text-decoration:none;font:400 1rem/1 var(--slab);background:var(--paper);color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
.mm-dock a.go{background:var(--brass)}
@media(min-width:900px){.mm-dock{display:none}}
/* reveal for inner pages (IntersectionObserver adds .in) */
.js .mm-rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.js .mm-rv.in{opacity:1;transform:none}

/* reduced motion: every scene is a still panel, in reading order, with a simple fade */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
  .mm-scene{height:auto!important}
  .mm-pin{position:relative;height:auto;overflow:hidden;padding:20px 0 28px;display:flex;flex-direction:column;align-items:center;gap:18px}
  .mm-stage,.mm-hero .mm-stage{position:relative;left:auto;top:auto;transform:none;height:min(64svh,104vw);order:1}
  .mm-cap,.mm-hero-line{position:relative;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:min(100% - 32px,34rem);order:2}
  .mm-title{position:relative;top:auto;order:0}
  .js .mm-rv{opacity:1;transform:none}
  .js .mm-fade{opacity:0;transition:opacity .6s linear!important}.js .mm-fade.in{opacity:1}
}
/* round 6 additions: story title parts, pour states, routes */
[hidden]{display:none!important}
.mm-title [data-t]{display:inline-block}
@media(max-width:899px){.mm-title [data-t]{display:block}}
.mm-coupe .liq{transition:transform 1s var(--ease)}
.mm-coupe.is-empty .liq{transition:transform .3s cubic-bezier(.5,0,.75,0)}
.mm-coupe .stream{transition:transform .35s var(--ease)}
.mm-coupe.is-pouring .stream{transform:none}
.mm-coupe.is-pouring .stream,.mm-coupe.is-pouring .liq{will-change:transform}
.mm-route{opacity:0;transition:opacity .45s var(--ease)}
.mm-route.is-on{opacity:1}
.mm-map svg{aspect-ratio:4/3;height:auto}
.mm-stir .mm-opts{margin-bottom:4px}
.mm-done .mm-ticket{margin:12px 0}
.mm-done:focus{outline:3px solid var(--brass-2);outline-offset:3px}
.mm-pin{top:var(--head);height:calc(100svh - var(--head))}
@media(max-width:479px){.mm-head .mm-reserve{display:none}}
@media(max-width:899px){
  .mm-hero .mm-stage{top:47%;height:min(44svh,86vw)}
  .mm-hero-line{bottom:calc(132px + env(safe-area-inset-bottom));font-size:1.08rem}
  .mm-stage{top:36%;height:min(52svh,100vw)}
  .mm-cap{bottom:calc(76px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){.mm-pin{top:auto;height:auto}}
[data-part="cube"]{transform-origin:50% 27.25%}
@media(min-width:900px){
  .mm-hero .mm-stage{top:58%;height:min(60svh,640px)}
  .mm-hero-line{left:max(32px,6vw);right:auto;bottom:48px;max-width:20rem;text-align:left}
}
@media(min-width:900px){.mm-title{font-size:clamp(4rem,8.6vw,8.2rem)}}

/* Disabled until its local-only handler is installed. Keep the existing form layout. */
fieldset[data-demo-guard]{display:contents;border:0;padding:0;margin:0;min-width:0}

/* Contrast (Lighthouse r6): red on ink is display-only; small text uses brass on ink and ink-on-red only at slab sizes. */
.mm-house .mm-act{color:var(--brass-2)}
.mm-foot h2{color:var(--paper)}
.mm-foot .mm-fine{opacity:1;color:var(--paper)}


/* Photographic scenes: keep the story movement quiet and let the room carry the scene. */
.mm-photo-layer{inset:0;overflow:hidden;background:#17110f}
.mm-stage-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.78) brightness(.78);transform:scale(1.02);animation:mmPhotoBreath 30s ease-in-out infinite alternate}
.mm-hero .mm-stage-image{filter:saturate(.72) brightness(.62)}
.mm-stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,11,10,.12),rgba(15,11,10,.16) 52%,rgba(15,11,10,.64))}
.mm-title,.mm-hero-line{z-index:4}
.mm-cap-in{border-radius:2px;box-shadow:0 14px 40px rgba(0,0,0,.24);backdrop-filter:blur(2px)}
.mm-reserve,.mm-btn{border-radius:3px;box-shadow:none}
.mm-reserve:hover,.mm-btn:hover{transform:translateY(-2px);box-shadow:none}
@keyframes mmPhotoBreath{from{transform:scale(1.02)}to{transform:scale(1.075)}}
@media(prefers-reduced-motion:reduce){.mm-stage-image{animation:none}}

@media(min-width:900px){.mm-stage,.mm-hero .mm-stage{aspect-ratio:4/3;height:min(68svh,760px);max-width:66vw}}
.mm-stage-image{filter:saturate(.84) brightness(.88)}
.mm-hero .mm-stage-image{filter:saturate(.78) brightness(.78)}
.mm-pin::before{opacity:.025;background-size:12px 12px}
.mm-title{text-shadow:none}
.mm-cap.dark .mm-cap-in{box-shadow:0 14px 40px rgba(0,0,0,.22)}
.mm-recipe{box-shadow:0 12px 34px rgba(23,17,15,.12);border-width:1px}
.mm-coupe{width:min(520px,100%);aspect-ratio:4/3;overflow:hidden;background:#201711;border:0;box-shadow:0 22px 60px rgba(0,0,0,.18)}
.mm-coupe-photo{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.82);opacity:1;transform:scale(1.01);transition:opacity .45s ease,transform 18s ease-out}
.mm-coupe:hover .mm-coupe-photo{transform:scale(1.055)}
.mm-pick::before{opacity:.035}
@media(prefers-reduced-motion:reduce){.mm-coupe-photo{transition:none}}

/* 1031-073816: compress pinned opener to a maximum 1.5-screen runway. */
html.js .mm-story,html.js .mm-story.is-on{height:150svh!important}

/* 1031-073816: tighter sample home rhythm. */
main>section:not(.vf-chair):not(.mm-story):not(.le-shift):not(.cw-walk):not(.ib-dsc):not(.jl-cl):not(.np-ss){padding-block:clamp(22px,4vh,42px)!important;min-height:0!important}
main>section>header,main>section>div:not([class*="dock"]){margin-bottom:clamp(12px,2.2vh,24px)}
@media(max-width:760px){main>section:not(.vf-chair):not(.mm-story):not(.le-shift):not(.cw-walk):not(.ib-dsc):not(.jl-cl):not(.np-ss){padding-block:22px!important}}

/* 1031-073816: all seven illustrated beats play across a 1.5-screen scroll. */
html.js .mm-story,html.js .mm-story.is-on{height:150svh!important;overflow:clip!important}.mm-story .mm-scene{height:calc(150svh / 7)!important}.mm-story .mm-pin{position:sticky;top:var(--head);height:calc(100svh - var(--head));overflow:hidden}

/* 1031-073816: floating controls are in document flow, so headlines and fields are never covered. */
:where(.cw-sticky,.fw-dock,.ib-dock,.jl-dock,.ke-dock,.le-dock,.mm-dock,.np-dock,.pt-dock,.sm-dock,.vf-dock){position:relative!important;inset:auto!important;transform:none!important;margin-top:20px!important;z-index:2!important}
:where(.cw-head,.fw-top,.ib-head,.jl-head,.ke-head,.mm-head,.np-head,.pt-top,.vf-mast,.sm-tabs){position:relative!important;top:auto!important;z-index:2!important}
:where(.np-ss-frame,.np-ss-grid,.jl-cl-side,.ib-dsc-pin,.mm-pin,.vf-chair-pin){position:relative!important;top:auto!important}

/* 1031-073816 collision follow-up: remove remaining sticky text bands and use in-flow endings. */
body{padding-bottom:0!important}
.sm-head{position:relative!important;top:auto!important}.ke-wire{height:150svh!important;overflow:clip!important}

/* Give the seven scene captions their own short panes; the caption reveal still follows the scroll. */
html.js .mm-story .mm-scene{height:calc(150svh / 7)!important;overflow:hidden!important}
html.js .mm-story .mm-pin{position:relative!important;top:auto!important;height:100%!important;min-height:0!important;overflow:hidden!important}
html.js .mm-story .mm-hero{height:270px!important}
html.js .mm-story .mm-scene:not(.mm-hero){height:calc((150svh - 270px) / 6)!important}
.mm-skip-story:not(:focus-visible){position:absolute!important;left:-10000px!important;right:auto!important;top:auto!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.mm-pick-grid{gap:42px!important}
.mm-pick-lede{margin:0!important}
.mm-hero-line{bottom:22px!important}