/* 신선계 — 숯(coal) · 종이(paper) · 불(fire) */
:root {
  --coal: #17110f;
  --coal-2: #221815;
  --coal-3: #2b221e;
  --bone: #f4ede2;
  --paper: #eee2d0;
  --cream: #fff6e6;
  --fire: #f05a2a;
  --fire-deep: #d9471e;
  --ember: #b4421f;
  --brass: #e9a83e;
  --n: #6e615a;
  --n-light: #a3958b;
  --n-lighter: #cbbfb3;
  --line: rgba(0, 0, 0, .12);
  --line-dark: rgba(255, 255, 255, .14);
  --max: 80rem;
  --gutter: max(1.25rem, calc((100% - var(--max)) / 2));
  --section: clamp(5rem, 9vw, 9rem);
  --font: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Noto Sans KR', system-ui, sans-serif;
  --mono: 'Source Code Pro', ui-monospace, SFMono-Regular, Menlo, monospace;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--font); color: var(--coal); background: var(--bone); line-height: 1.7; word-break: keep-all; overflow-wrap: break-word; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3 { margin: 0; letter-spacing: -0.035em; line-height: 1.18; }
p { margin: 0 0 1em; }
.wrap { padding-inline: var(--gutter); }
.mono { font-family: var(--mono); letter-spacing: 0; }
.muted { color: var(--n); }
.small { font-size: .85rem; }
.skip { position: absolute; left: -9999px; }
.skip:focus { left: 12px; top: 12px; z-index: 100; background: #fff; padding: 8px 12px; }

/* label — mono, spaced, fire */
.label { font-family: var(--mono); font-size: .72rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--fire-deep); margin: 0 0 1rem; }
.dark .label, .phead .label, .cta .label, .ft .label { color: var(--fire); }

/* ---------- header ---------- */
.hd { position: sticky; top: 0; z-index: 50; background: var(--coal); color: var(--bone); border-bottom: 1px solid var(--line-dark); }
.hd-in { display: flex; align-items: center; gap: 2rem; height: 72px; padding-inline: var(--gutter); }
.brand { display: flex; flex-direction: column; text-decoration: none; line-height: 1.15; }
.brand-tag { font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; color: var(--fire); font-weight: 500; }
.brand-name { font-size: 1.12rem; font-weight: 800; letter-spacing: -0.03em; }
.nav { display: flex; gap: 2.2rem; margin-inline: auto; font-size: .94rem; font-weight: 600; }
.nav a { text-decoration: none; color: var(--n-lighter); position: relative; padding: 4px 0; }
.nav a:hover { color: #fff; }
.nav a[aria-current] { color: #fff; }
.nav a[aria-current]::after { content: ''; position: absolute; left: 50%; bottom: -6px; width: 14px; height: 2px; margin-left: -7px; background: var(--fire); }
.nav-lang { font-family: var(--mono); font-size: .78rem; }
.hd-right { display: flex; align-items: center; gap: 1.4rem; }
.hd-tel { text-decoration: none; color: var(--n-lighter); font-size: .9rem; }
@media (max-width: 1080px) { .nav { display: none; } .hd-right { margin-left: auto; } }
@media (max-width: 560px) { .hd-tel { display: none; } }

/* ---------- buttons & links ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 1.6rem; border-radius: 2px; font-weight: 700; font-size: .95rem; text-decoration: none; border: 1px solid transparent; transition: background .15s, color .15s, border-color .15s; }
.btn-sm { min-height: 40px; padding: 0 1.1rem; font-size: .88rem; }
.btn-fire { background: var(--ember); color: #fff; }
.btn-fire:hover { background: var(--fire-deep); }
.btn-bone { background: var(--bone); color: var(--coal); }
.btn-bone:hover { background: #fff; }
.btn-ink { background: var(--coal); color: var(--bone); }
.btn-ink:hover { background: var(--coal-3); }
.btn-line { border-color: var(--coal); color: var(--coal); }
.btn-line:hover { background: var(--coal); color: var(--bone); }
.btn-row { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem; margin-top: 1.6rem; }
.link-under { font-weight: 700; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 3px; }
.link-tel { font-weight: 700; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; font-size: 1.05rem; }
.link-arrow { display: inline-block; margin-top: 2rem; font-family: var(--mono); font-size: .82rem; letter-spacing: .04em; color: var(--ember); text-decoration: none; font-weight: 500; }
.link-arrow.on-dark { color: var(--fire); }

/* ---------- hero ---------- */
.hero { position: relative; min-height: min(100svh, 980px); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: var(--coal); overflow: hidden; }
.hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(23,17,15,.82) 0%, rgba(23,17,15,.5) 45%, rgba(23,17,15,.15) 100%), linear-gradient(0deg, rgba(23,17,15,.85) 0%, rgba(23,17,15,0) 40%); }
.hero-in { position: relative; z-index: 2; padding-top: 9rem; padding-bottom: 3.5rem; max-width: calc(var(--max) * .62 + var(--gutter)); }
.hero-eyebrow { font-size: .9rem; letter-spacing: .3em; color: var(--fire); font-weight: 500; margin-bottom: 1.4rem; }
.hero h1 { font-size: clamp(2.6rem, 7.2vw, 5.6rem); font-weight: 800; letter-spacing: -0.05em; line-height: 1.08; margin-bottom: 1.6rem; text-shadow: 0 2px 30px rgba(0,0,0,.25); }
.hero-lead { font-size: clamp(1.02rem, 1.6vw, 1.22rem); line-height: 1.75; max-width: 36em; color: rgba(255,255,255,.88); }
.hero-lead strong { color: #fff; }
.hero-actions { display: flex; align-items: center; gap: 1.8rem; margin-top: 2.2rem; }
.hero-strip { position: relative; z-index: 2; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-dark); padding-inline: var(--gutter); }
.hero-strip > div { padding: 1.3rem 1.5rem 1.4rem 0; }
.hero-strip > div + div { border-left: 1px solid var(--line-dark); padding-left: 1.5rem; }
.hero-strip dt { font-size: .7rem; letter-spacing: .3em; color: var(--n-lighter); margin-bottom: .35rem; }
.hero-strip dd { margin: 0; font-weight: 600; font-size: .95rem; }
@media (max-width: 820px) { .hero-strip { grid-template-columns: 1fr; } .hero-strip > div + div { border-left: 0; padding-left: 0; border-top: 1px solid var(--line-dark); } .hero-strip > div { padding: .9rem 0; } }

/* ---------- stats band ---------- */
.stats { background: var(--bone); border-bottom: 1px solid var(--line); }
.stats-in { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats-in > div { padding: 2.2rem 1.5rem 2.4rem 5rem; }
.stats-in > div + div { border-left: 1px solid var(--line); padding-left: 1.6rem; }
.stats-in > div:first-child { padding-left: 5rem; }
.stat-k { font-size: .74rem; letter-spacing: .3em; color: var(--n); margin-bottom: .4rem; }
.stat-v { font-size: clamp(2.4rem, 4.4vw, 3.4rem); font-weight: 800; letter-spacing: -0.04em; line-height: 1.1; margin: 0 0 .5rem; }
.stat-v span { font-size: .5em; color: var(--ember); font-weight: 700; margin-left: 2px; }
.stat-c { font-size: .88rem; color: var(--n); margin: 0; }
@media (max-width: 960px) { .stats-in { grid-template-columns: 1fr 1fr; } .stats-in > div, .stats-in > div:first-child { padding: 1.6rem 1.2rem; } .stats-in > div:nth-child(3) { border-left: 0; } .stats-in > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); } }

/* ---------- sections ---------- */
.sec { padding: var(--section) 0; }
.bone { background: var(--bone); }
.paper { background: var(--paper); }
.dark { background: var(--coal); color: var(--bone); }
.sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); gap: 2rem; border-top: 1px solid var(--line); padding-top: 2rem; margin-bottom: clamp(3rem, 6vw, 5rem); }
.dark .sec-head { border-top-color: var(--line-dark); }
.sec-head h2 { font-size: clamp(2rem, 4.6vw, 3.6rem); font-weight: 800; letter-spacing: -0.045em; }
.sec-lead { margin-top: 1.4rem; font-size: 1.08rem; color: var(--n); max-width: 40em; }
.dark .sec-lead { color: var(--n-light); }
@media (max-width: 820px) { .sec-head { grid-template-columns: 1fr; gap: .4rem; } }

/* story */
.story { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.story-text p { font-size: 1.06rem; line-height: 1.85; color: #3b302b; }
.story-text strong { color: var(--coal); }
.story-pull { font-size: 1.3rem !important; font-weight: 800; color: var(--coal) !important; letter-spacing: -0.03em; margin-top: 2rem; }
.story-fig { margin: 0; background: #fff; padding: 14px 14px 18px; box-shadow: 0 1px 0 var(--line), 0 20px 40px -24px rgba(23,17,15,.35); }
.story-fig figcaption { font-size: .82rem; color: var(--n); margin-top: .8rem; }
@media (max-width: 900px) { .story { grid-template-columns: 1fr; } }
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: clamp(3.5rem, 7vw, 6rem); border-top: 1px solid var(--line); }
.pillars > div { padding: 2rem 2rem 0 0; }
.pillars > div + div { border-left: 1px solid var(--line); padding-left: 2rem; }
.pillars h3 { font-size: 1.3rem; font-weight: 800; margin-bottom: .7rem; }
.pillars p:not(.label) { color: var(--n); font-size: .95rem; }
.pillars.on-dark { grid-template-columns: repeat(4, 1fr); border-top-color: var(--line-dark); margin-top: 0; }
.pillars.on-dark > div + div { border-left-color: var(--line-dark); }
.pillars.on-dark p:not(.label) { color: var(--n-light); }
@media (max-width: 900px) { .pillars, .pillars.on-dark { grid-template-columns: 1fr; } .pillars > div, .pillars > div + div { border-left: 0; padding: 1.6rem 0; border-bottom: 1px solid var(--line); } .pillars.on-dark > div { border-bottom-color: var(--line-dark); } }

/* signatures */
.sig-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3.5rem 1.6rem; }
.sig-img { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--coal-2); }
.sig-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.sig:hover .sig-img img { transform: scale(1.04); }
.sig-num { position: absolute; left: 12px; bottom: 10px; font-size: .78rem; color: #fff; text-shadow: 0 1px 6px rgba(0,0,0,.6); }
.sig-row { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: 1.1rem 0 .7rem; border-bottom: 1px solid var(--line-dark); }
.sig-row h3 { font-size: 1.12rem; font-weight: 800; }
.sig-row small { font-family: var(--mono); font-size: .72rem; color: var(--n-light); font-weight: 400; margin-left: 4px; }
.sig-price { margin: 0; color: var(--fire); font-weight: 500; font-size: 1.05rem; white-space: nowrap; }
.sig-price span { font-family: var(--font); font-size: .8em; margin-left: 1px; }
.sig-desc { margin-top: .8rem; font-size: .9rem; color: var(--n-light); }
@media (max-width: 960px) { .sig-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .sig-grid { grid-template-columns: 1fr; } }

/* full menu */
.mgroup { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); gap: 2rem; padding-top: 2.6rem; }
.mgroup + .mgroup { margin-top: 3rem; }
.mgroup-head { display: contents; }
.mgroup-head > .label { grid-column: 1; margin: 0; padding-top: .35rem; }
.mgroup-head > div { grid-column: 2; }
.mgroup-head h3 { font-size: 1.5rem; font-weight: 800; margin-bottom: .4rem; }
.mgroup-head .muted { font-size: .9rem; margin-bottom: 1.2rem; }
.mgroup .mlist { grid-column: 1 / -1; }
.mlist { list-style: none; padding: 0; margin: 0; }
.mlist li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; gap: 2rem; align-items: baseline; padding: 1.05rem 0; border-bottom: 1px solid var(--line); }
.mname { font-weight: 700; }
.mname small { font-family: var(--mono); font-size: .72rem; color: var(--n); font-weight: 400; margin-left: 6px; }
.tag { font-style: normal; font-family: var(--mono); font-size: .64rem; color: var(--ember); border: 1px solid var(--ember); padding: 1px 5px; margin-left: 6px; vertical-align: 2px; }
.mdesc { font-size: .9rem; color: var(--n); }
.mprice { font-weight: 500; white-space: nowrap; text-align: right; }
@media (max-width: 760px) { .mgroup { grid-template-columns: 1fr; gap: .4rem; } .mgroup-head > div, .mgroup-head > .label { grid-column: 1; } .mlist li { grid-template-columns: 1fr auto; gap: .2rem 1rem; } .mdesc { grid-column: 1 / -1; grid-row: 2; } .mdesc:empty { display: none; } }

/* steps */
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); border-top: 1px solid var(--line); }
.steps li { padding: 1.8rem 1.6rem 1.8rem 0; border-bottom: 1px solid var(--line); }
.steps li + li { padding-left: 1.6rem; border-left: 1px solid var(--line); }
.steps .mono { font-size: .8rem; color: var(--ember); display: block; margin-bottom: 1.4rem; }
.steps h3 { font-size: 1.16rem; font-weight: 800; margin-bottom: .6rem; }
.steps p { font-size: .93rem; color: var(--n); margin: 0; }
@media (max-width: 760px) { .steps li + li { border-left: 0; padding-left: 0; } }

/* gallery */
.gallery { display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: clamp(140px, 16vw, 230px); gap: 10px; }
.gallery figure { margin: 0; overflow: hidden; background: var(--coal-2); }
.gallery img { width: 100%; height: 100%; object-fit: cover; }
.gallery .g0 { grid-column: span 4; grid-row: span 2; }
.gallery .g1 { grid-column: span 2; grid-row: span 2; }
.gallery .g2, .gallery .g3, .gallery .g4 { grid-column: span 2; }
.gallery .g5 { display: none; }
@media (max-width: 760px) { .gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; } .gallery .g0 { grid-column: span 2; grid-row: span 2; } .gallery .g1 { grid-column: span 1; grid-row: span 2; } .gallery .g2, .gallery .g3, .gallery .g4, .gallery .g5 { grid-column: span 1; display: block; } }

/* voices */
.voices-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 3rem; align-items: end; margin-bottom: 4rem; }
.score-num { font-size: clamp(6rem, 14vw, 10rem); font-weight: 800; letter-spacing: -0.06em; line-height: .9; color: var(--fire); margin: 0 0 1rem; }
.score-cap { font-size: .85rem; color: var(--n-light); margin: 0; }
.kw { list-style: none; padding: 0; margin: 0; }
.kw li { display: grid; grid-template-columns: 11em 1fr auto; gap: 1rem; align-items: center; padding: .85rem 0; border-bottom: 1px solid var(--line-dark); font-size: .92rem; }
.kw-bar { height: 3px; background: var(--line-dark); }
.kw-bar i { display: block; height: 100%; background: var(--fire); }
.kw-n { text-align: right; min-width: 4.5em; }
@media (max-width: 860px) { .voices-top { grid-template-columns: 1fr; } .kw li { grid-template-columns: 1fr auto; } .kw-bar { grid-column: 1 / -1; grid-row: 2; } }
.quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 2.4rem; }
.quote { margin: 0; padding: 2rem 0; border-top: 1px solid var(--line-dark); display: flex; flex-direction: column; justify-content: space-between; }
.quote blockquote { margin: 0 0 1.6rem; font-size: .98rem; line-height: 1.8; font-weight: 600; color: var(--bone); }
.quote figcaption { font-size: .78rem; color: var(--n-light); line-height: 1.8; }
.quote figcaption a { color: var(--n-lighter); }
.blogs { margin-top: 3.5rem; }
@media (max-width: 960px) { .quotes { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .quotes { grid-template-columns: 1fr; } }

/* occasions */
.occ { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.occ a { display: grid; grid-template-columns: 3rem 8rem 1fr auto; gap: 1.2rem; align-items: center; padding: 1.6rem 0; border-bottom: 1px solid var(--line); text-decoration: none; transition: padding .2s; }
.occ a:hover { padding-left: .6rem; }
.occ-n { font-size: .8rem; color: var(--ember); }
.occ-tag { font-weight: 800; }
.occ-q { font-size: 1.12rem; color: #3b302b; }
.occ-arrow { color: var(--ember); font-size: 1.2rem; }
@media (max-width: 700px) { .occ a { grid-template-columns: 2.4rem 1fr auto; } .occ-q { grid-column: 2 / 3; font-size: .98rem; } .occ-tag { grid-column: 2; } .occ-arrow { grid-row: 1 / 3; grid-column: 3; } }

/* visit */
.visit { display: grid; grid-template-columns: 1.15fr 1.15fr .8fr; gap: clamp(1.6rem, 3.5vw, 3.5rem); align-items: start; }
.visit-map iframe { width: 100%; aspect-ratio: 4 / 3; border: 0; filter: grayscale(.35) contrast(.95); background: var(--paper); }
.vtable { display: grid; grid-template-columns: 5.5em 1fr; margin: 0; border-top: 1px solid var(--line); }
.vtable dt, .vtable dd { padding: .95rem 0; border-bottom: 1px solid var(--line); }
.vtable dt { font-size: .74rem; letter-spacing: .2em; color: var(--ember); padding-top: 1.1rem; }
.vtable dd { margin: 0; font-weight: 600; font-size: .95rem; }
.vtable dd span { display: block; font-weight: 400; font-size: .84rem; color: var(--n); margin-top: 2px; }
.vtable.compact { margin-top: 2rem; }
.vhours h3 { font-size: 1.05rem; font-weight: 800; padding-bottom: .9rem; border-bottom: 1px solid var(--coal); }
.hours { width: 100%; border-collapse: collapse; font-size: .9rem; }
.hours th, .hours td { text-align: left; padding: .72rem 0; border-bottom: 1px solid var(--line); font-weight: 500; }
.hours th { width: 2.6em; font-family: var(--font); font-weight: 700; }
.hours tr.off td, .hours tr.off th { color: var(--ember); }
.vhours .small { margin-top: 1rem; }
@media (max-width: 1080px) { .visit { grid-template-columns: 1fr 1fr; } .visit-map { grid-column: 1 / -1; } }
@media (max-width: 700px) { .visit { grid-template-columns: 1fr; } }
.routes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4rem; }
.routes h3 { font-size: 1.12rem; font-weight: 800; padding-bottom: .9rem; border-bottom: 1px solid var(--coal); margin-bottom: 1rem; }
.routes h3 small { display: block; font-size: .78rem; color: var(--ember); font-weight: 500; margin-top: .3rem; }
.routes ol { padding-left: 1.2em; margin: 0; color: #3b302b; }
.routes ol li { padding: .3rem 0; }
.routes ol.plain { list-style: none; padding: 0; }
@media (max-width: 960px) { .routes { grid-template-columns: 1fr; } }

/* faq */
.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; list-style: none; padding: 1.5rem 3rem 1.5rem 0; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: 0; top: 1.15rem; font-size: 1.6rem; font-weight: 300; color: var(--ember); }
.faq details[open] summary::after { content: '–'; }
.faq summary h3 { display: inline; font-size: 1.12rem; font-weight: 700; letter-spacing: -0.02em; }
.faq details p { padding: 0 3rem 1.6rem 0; color: #4a3f39; margin: 0; max-width: 48em; }

/* page head (sub pages) */
.phead { background: var(--coal); color: var(--bone); padding: clamp(5rem, 9vw, 8rem) 0 clamp(3.5rem, 6vw, 5rem); border-bottom: 1px solid var(--line-dark); }
.phead h1 { font-size: clamp(2.4rem, 6vw, 4.6rem); font-weight: 800; letter-spacing: -0.05em; margin-bottom: 1.4rem; }
.phead-lead { font-size: 1.08rem; color: var(--n-lighter); max-width: 40em; margin: 0; }

/* cta */
.cta { background: var(--coal-2); color: var(--bone); padding: clamp(4.5rem, 8vw, 7rem) 0; }
.cta-in { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; }
.cta h2 { font-size: clamp(2.2rem, 5vw, 3.8rem); font-weight: 800; letter-spacing: -0.045em; margin-bottom: 1.2rem; }
.cta-lead { color: var(--n-lighter); max-width: 34em; margin: 0; }
.cta-actions { display: flex; align-items: center; gap: 1.8rem; }

/* footer */
.ft { background: var(--coal); color: var(--n-lighter); padding: 4.5rem 0 2rem; border-top: 1px solid var(--line-dark); font-size: .9rem; }
.ft-grid { display: grid; grid-template-columns: 1.4fr .8fr .8fr 1.5fr; gap: 2.4rem; }
.ft-name { font-size: 1.15rem; font-weight: 800; color: #fff; margin-bottom: 1rem; }
.ft address { font-style: normal; line-height: 1.9; }
.ft a { text-decoration: none; }
.ft a:hover { color: #fff; }
.ft-h { font-family: var(--mono); font-size: .7rem; letter-spacing: .2em; color: var(--n-light); font-weight: 500; margin-bottom: 1rem; text-transform: uppercase; }
.ft-h + .ft-note + .ft-h, .ft-note + .ft-h { margin-top: 1.6rem; }
.ft-list { list-style: none; padding: 0; margin: 0; line-height: 2.2; }
.ft-note { font-size: .84rem; line-height: 1.8; margin: 0; }
.ft-bottom { margin-top: 3.5rem; padding-top: 1.4rem; border-top: 1px solid var(--line-dark); font-size: .78rem; color: var(--n); }
@media (max-width: 900px) { .ft-grid { grid-template-columns: 1fr 1fr; } .ft-brand { grid-column: 1 / -1; } }
@media (max-width: 520px) { .ft-grid { grid-template-columns: 1fr; } }

/* mobile action bar */
.mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: none; grid-template-columns: 1fr 1fr 1.5fr; background: var(--coal); border-top: 1px solid var(--line-dark); padding-bottom: env(safe-area-inset-bottom); }
.mbar a { color: var(--bone); text-decoration: none; text-align: center; padding: 1.05rem 0; font-weight: 700; font-size: .95rem; }
.mbar a.is-fire { background: var(--ember); color: #fff; }
@media (max-width: 900px) { .mbar { display: grid; } body { padding-bottom: 60px; } }