@font-face {
  font-family:'Roboto Condensed'; font-style:normal; font-weight:400 600; font-display:swap;
  src:url('./assets/fonts/roboto-condensed-latin.woff2') format('woff2');
}
:root { color-scheme:light; background:#f5f1e7; }
html { min-width:280px; -webkit-text-size-adjust:100%; }
body { margin:0; background:#f5f1e7; }
button, a, summary { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:default; }
svg { display:inline-block; vertical-align:middle; flex-shrink:0; }

500;600&display=swap');
#burg-companion-mockup { width:100%; }
#burg-companion-mockup .bk-stage { min-height:794px; padding:24px 12px; display:flex; align-items:flex-start; justify-content:center; box-sizing:border-box; }
#burg-companion-mockup .bk-app {
  --bk-red:light-dark(#b92b06,#ff9b7f); --bk-paper:light-dark(#f5f1e7,#292620);
  --bk-white:light-dark(#ffffff,#201e1a); --bk-text:light-dark(#493d35,#eee6da);
  --bk-muted:light-dark(#74665a,#beb1a0); --bk-line:light-dark(#e5dbcb,#4b4136);
  --bk-fill:light-dark(#b92b06,#b92b06); --bk-on-fill:#fff9f0;
  --bk-radius:4px; --bk-size:16px;
  width:100%; max-width:720px; min-height:728px; display:flex; flex-direction:column;
  background:var(--bk-white); color:var(--bk-text); border:1px solid var(--bk-line);
  border-top:4px solid var(--bk-fill); border-radius:4px; overflow:hidden;
  font-family:'Roboto Condensed','Arial Narrow',sans-serif; font-size:var(--bk-size); line-height:1.45;
  box-shadow:0 12px 30px light-dark(#493d3510,#00000030);
}
#burg-companion-mockup .bk-app * { box-sizing:border-box; }
#burg-companion-mockup .bk-app [hidden] { display:none!important; }
#burg-companion-mockup .bk-app h1,#burg-companion-mockup .bk-app h2,#burg-companion-mockup .bk-app h3,
#burg-companion-mockup .bk-app p { margin:0; font-family:inherit; }
#burg-companion-mockup .bk-app h1 { color:var(--bk-red); font-size:31px; font-weight:600; line-height:1.08; text-transform:uppercase; letter-spacing:-.4px; }
#burg-companion-mockup .bk-app h2 { color:var(--bk-red); font-size:24px; font-weight:500; line-height:1.15; text-transform:uppercase; }
#burg-companion-mockup .bk-app h3 { font-size:21px; font-weight:500; line-height:1.15; }
#burg-companion-mockup .bk-app button,#burg-companion-mockup .bk-app a { font:inherit; -webkit-tap-highlight-color:transparent; }
#burg-companion-mockup .bk-app button { color:inherit; }
#burg-companion-mockup .bk-app button:focus-visible,#burg-companion-mockup .bk-app a:focus-visible { outline:3px solid var(--bk-red); outline-offset:3px; }
#burg-companion-mockup .bk-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:17px 22px; background:var(--bk-paper); }
#burg-companion-mockup .bk-brand { display:flex; gap:10px; align-items:center; color:var(--bk-red); }
#burg-companion-mockup .bk-brand-logo { display:block; width:36px; height:42px; object-fit:contain; flex-shrink:0; }
#burg-companion-mockup .bk-wordmark { font-size:17px; font-weight:500; letter-spacing:.3px; line-height:1.15; }
#burg-companion-mockup .bk-wordmark span { display:block; margin-top:4px; font-size:12px; font-weight:400; letter-spacing:1.1px; text-transform:uppercase; }
#burg-companion-mockup .bk-language { border:1px solid var(--bk-line); background:var(--bk-white); color:var(--bk-red)!important; border-radius:var(--bk-radius); min-height:40px; min-width:44px; font-size:13px!important; }
#burg-companion-mockup .bk-main { flex:1; }
#burg-companion-mockup .bk-pad { padding:24px 22px; }
#burg-companion-mockup .bk-eyebrow { display:block; font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:var(--bk-muted); margin-bottom:12px; }
#burg-companion-mockup .bk-intro { margin-top:14px!important; color:var(--bk-text); }
#burg-companion-mockup .bk-welcome { background:var(--bk-paper); padding:27px 22px 25px; border-bottom:1px solid var(--bk-line); }
#burg-companion-mockup .bk-welcome h1 { font-size:42px; }
#burg-companion-mockup .bk-welcome p { max-width:260px; }
#burg-companion-mockup .bk-flourish { display:flex; gap:8px; align-items:center; margin-bottom:20px; color:var(--bk-red); }
#burg-companion-mockup .bk-flourish::after { content:''; width:62px; border-top:1px solid var(--bk-red); }
#burg-companion-mockup .bk-flourish svg { width:20px; height:20px; }
#burg-companion-mockup .bk-primary,#burg-companion-mockup .bk-secondary { border-radius:var(--bk-radius); padding:15px 17px; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:54px; width:100%; text-align:left; text-decoration:none; }
#burg-companion-mockup .bk-primary { background:var(--bk-fill); color:var(--bk-on-fill)!important; border:1px solid var(--bk-fill); font-weight:500!important; }
#burg-companion-mockup .bk-secondary { background:var(--bk-white); color:var(--bk-red)!important; border:1px solid var(--bk-red); margin-top:12px; }
#burg-companion-mockup .bk-primary svg,#burg-companion-mockup .bk-secondary svg { width:20px; height:20px; flex:none; }
#burg-companion-mockup .bk-button-label { display:flex; gap:11px; align-items:center; }
#burg-companion-mockup .bk-family { display:flex; align-items:center; gap:13px; width:100%; text-align:left; background:var(--bk-paper); border:0; border-radius:var(--bk-radius); padding:16px; margin-top:22px; }
#burg-companion-mockup .bk-family > svg { flex:none; width:25px; height:25px; color:var(--bk-red); stroke-width:1.5; }
#burg-companion-mockup .bk-family strong { display:block; color:var(--bk-red); font-weight:500; }
#burg-companion-mockup .bk-family small { display:block; color:var(--bk-muted); margin-top:3px; font-size:13px; }
#burg-companion-mockup .bk-footnote { font-size:12px; color:var(--bk-muted); margin-top:16px!important; }
#burg-companion-mockup .bk-nav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--bk-line); padding:7px 8px 9px; background:var(--bk-white); margin-top:auto; }
#burg-companion-mockup .bk-nav button { background:transparent; border:0; display:flex; flex-direction:column; align-items:center; gap:4px; padding:9px 0 5px; min-height:57px; color:var(--bk-muted); font-size:12px; border-radius:var(--bk-radius); }
#burg-companion-mockup .bk-nav button[aria-current=page] { color:var(--bk-red); background:var(--bk-paper); }
#burg-companion-mockup .bk-nav svg { width:21px; height:21px; stroke-width:1.6; }
#burg-companion-mockup .bk-back { display:flex; align-items:center; gap:7px; padding:0 0 14px; border:0; background:none; color:var(--bk-red)!important; font-size:14px!important; min-height:40px; }
#burg-companion-mockup .bk-back svg { width:16px; height:16px; }
#burg-companion-mockup .bk-tour { border:1px solid var(--bk-line); background:var(--bk-white); border-radius:var(--bk-radius); display:block; text-align:left; width:100%; padding:18px 16px; margin-top:13px; }
#burg-companion-mockup .bk-tour:first-of-type { border-color:var(--bk-red); background:var(--bk-paper); margin-top:21px; }
#burg-companion-mockup .bk-tour-title { display:flex; justify-content:space-between; gap:10px; align-items:center; color:var(--bk-red); }
#burg-companion-mockup .bk-tour-title > svg { width:20px; height:20px; flex:none; }
#burg-companion-mockup .bk-tour p { margin-top:8px; font-size:14px; }
#burg-companion-mockup .bk-meta { display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; font-size:13px; color:var(--bk-muted); }
#burg-companion-mockup .bk-meta span { display:flex; align-items:center; gap:5px; }
#burg-companion-mockup .bk-meta svg { width:15px; height:15px; }
#burg-companion-mockup .bk-direct { margin-top:22px; border-top:1px solid var(--bk-line); padding-top:8px; }
#burg-companion-mockup .bk-direct button { display:flex; gap:15px; align-items:center; width:100%; background:none; border:0; border-bottom:1px solid var(--bk-line); padding:18px 0; text-align:left; }
#burg-companion-mockup .bk-direct button > svg { color:var(--bk-red); width:24px; height:24px; flex:none; }
#burg-companion-mockup .bk-direct strong { color:var(--bk-red); display:block; font-size:22px; font-weight:500; }
#burg-companion-mockup .bk-direct small { color:var(--bk-muted); display:block; margin-top:3px; font-size:14px; }
#burg-companion-mockup .bk-direct button > svg:last-child { width:19px; height:19px; margin-left:auto; }
#burg-companion-mockup .bk-route-context { font-size:12px; color:var(--bk-muted); margin-bottom:7px!important; }
#burg-companion-mockup .bk-progress { height:3px; background:var(--bk-line); margin:13px 0 24px; }
#burg-companion-mockup .bk-progress span { display:block; height:100%; background:var(--bk-fill); }
#burg-companion-mockup .bk-station-tag { display:inline-flex; align-items:center; gap:6px; color:var(--bk-muted); font-size:13px; margin-top:10px; }
#burg-companion-mockup .bk-station-tag svg { width:15px; height:15px; }
#burg-companion-mockup .bk-player { background:var(--bk-paper); padding:18px; border-radius:var(--bk-radius); margin-top:23px; }
#burg-companion-mockup .bk-player-top { display:flex; gap:13px; align-items:center; }
#burg-companion-mockup .bk-play { width:49px; height:49px; flex:none; border:0; background:var(--bk-fill); color:var(--bk-on-fill)!important; border-radius:50%; display:flex; align-items:center; justify-content:center; }
#burg-companion-mockup .bk-play svg { width:21px; height:21px; }
#burg-companion-mockup .bk-player-title { font-weight:500; color:var(--bk-red); }
#burg-companion-mockup .bk-time { color:var(--bk-muted); font-size:12px; margin-top:3px; font-variant-numeric:tabular-nums; }
#burg-companion-mockup .bk-audio-track { height:3px; background:var(--bk-line); margin:16px 0 0; }
#burg-companion-mockup .bk-audio-track span { display:block; height:100%; background:var(--bk-fill); }
#burg-companion-mockup .bk-transcript { margin-top:19px; border-bottom:1px solid var(--bk-line); padding-bottom:16px; }
#burg-companion-mockup .bk-transcript summary { color:var(--bk-red); padding:4px 0; min-height:32px; }
#burg-companion-mockup .bk-transcript p { margin-top:10px; font-size:14px; }
#burg-companion-mockup .bk-station-copy { margin:21px 0!important; }
#burg-companion-mockup .bk-links { display:flex; gap:16px; flex-wrap:wrap; margin:14px 0 0; }
#burg-companion-mockup .bk-textbutton { background:none; border:0; padding:7px 0; min-height:38px; color:var(--bk-red)!important; display:flex; align-items:center; gap:7px; text-decoration:underline; text-underline-offset:3px; }
#burg-companion-mockup .bk-textbutton svg { width:16px; height:16px; }
#burg-companion-mockup .bk-map { position:relative; background:var(--bk-paper); height:322px; margin:20px -22px 18px; overflow:hidden; }
#burg-companion-mockup .bk-map-grid { position:absolute; inset:0; background-image:linear-gradient(var(--bk-line) 1px,transparent 1px),linear-gradient(90deg,var(--bk-line) 1px,transparent 1px); background-size:28px 28px; opacity:.45; }
#burg-companion-mockup .bk-zone { position:absolute; border:1px solid var(--bk-line); background:var(--bk-white); transform:rotate(-12deg); }
#burg-companion-mockup .bk-zone.a { left:44%; top:16%; width:85px; height:95px; }
#burg-companion-mockup .bk-zone.b { left:27%; top:47%; width:110px; height:80px; }
#burg-companion-mockup .bk-zone.c { left:63%; top:60%; width:68px; height:59px; }
#burg-companion-mockup .bk-garden { position:absolute; left:8%; top:19%; width:82px; height:120px; border-radius:48%; background:var(--bk-line); opacity:.5; transform:rotate(25deg); }
#burg-companion-mockup .bk-pin { position:absolute; transform:translate(-50%,-50%); width:44px; height:44px; border:0; background:transparent; display:grid; place-items:center; }
#burg-companion-mockup .bk-pin span { background:var(--bk-white); border:1px solid var(--bk-red); color:var(--bk-red); display:grid; place-items:center; width:31px; height:31px; border-radius:50%; font-size:14px; }
#burg-companion-mockup .bk-pin[aria-pressed=true] span { background:var(--bk-fill); color:var(--bk-on-fill); }
#burg-companion-mockup .bk-map-label { position:absolute; right:17px; bottom:13px; font-size:11px; letter-spacing:1px; color:var(--bk-muted); text-transform:uppercase; }
#burg-companion-mockup .bk-map-selected { padding:15px; border:1px solid var(--bk-line); border-radius:var(--bk-radius); }
#burg-companion-mockup .bk-map-selected .bk-primary { margin-top:13px; padding:10px 13px; min-height:46px; }
#burg-companion-mockup .bk-map-selected p { font-size:13px; color:var(--bk-muted); margin-top:5px; }
#burg-companion-mockup .bk-info-row { padding:20px 0; border-bottom:1px solid var(--bk-line); }
#burg-companion-mockup .bk-info-row p { margin-top:9px; }
#burg-companion-mockup .bk-info-row h3 { color:var(--bk-red); font-size:18px; }
#burg-companion-mockup .bk-info-row a { color:var(--bk-red); text-underline-offset:3px; }
#burg-companion-mockup .bk-info-end { margin-top:25px; }
#burg-companion-mockup .bk-complete { text-align:center; padding-top:48px; }
#burg-companion-mockup .bk-complete > svg { color:var(--bk-red); width:48px; height:48px; margin-bottom:20px; }
#burg-companion-mockup .bk-complete .bk-primary { margin-top:24px; }
@media(max-width:380px) {
  #burg-companion-mockup .bk-stage { padding:16px 0; min-height:884px; }
  #burg-companion-mockup .bk-app { min-height:818px; }
  #burg-companion-mockup .bk-header { padding:16px 17px; }
  #burg-companion-mockup .bk-pad { padding:23px 17px; }
  #burg-companion-mockup .bk-welcome { padding:25px 17px; }
  #burg-companion-mockup .bk-welcome h1 { font-size:37px; }
  #burg-companion-mockup .bk-map { margin-left:-17px; margin-right:-17px; }
}
/* Compact photographic layout based on the supplied reference. */
#burg-companion-mockup .bk-stage { min-height:0; padding:24px 12px; }
#burg-companion-mockup .bk-app { min-height:0; border:1px solid var(--bk-line); border-radius:22px; background:var(--bk-paper); overflow:hidden; }
#burg-companion-mockup .bk-header { padding:20px 20px 12px; gap:8px; }
#burg-companion-mockup .bk-brand { gap:9px; }
#burg-companion-mockup .bk-brand-logo { width:36px!important; height:42px!important; stroke-width:1.35; flex:none; }
#burg-companion-mockup .bk-wordmark { font-family:inherit; font-size:17px; font-weight:500; letter-spacing:.3px; }
#burg-companion-mockup .bk-wordmark span { font-family:inherit; font-size:12px; font-weight:400; margin-top:4px; letter-spacing:1.1px; text-transform:uppercase; }
#burg-companion-mockup .bk-languages { display:flex; gap:0; align-items:center; font-family:'Roboto Condensed',sans-serif; color:var(--bk-muted); font-size:13px; }
#burg-companion-mockup .bk-languages button { background:none; border:0; min-width:31px; min-height:44px; padding:5px; color:var(--bk-muted); }
#burg-companion-mockup .bk-languages button[aria-pressed=true] { color:var(--bk-red); font-weight:600; }
#burg-companion-mockup .bk-home { padding:3px 20px 0; }
#burg-companion-mockup .bk-home h1 { font-family:inherit; font-size:42px; line-height:1.08; text-transform:uppercase; font-weight:600; letter-spacing:-.4px; padding-bottom:16px; }
#burg-companion-mockup .bk-app h1 { text-transform:uppercase; font-family:inherit; }
#burg-companion-mockup .bk-hero { margin:0 0 12px; width:100%; aspect-ratio:1.88; border-radius:var(--bk-radius); overflow:hidden; background:var(--bk-line); }
#burg-companion-mockup .bk-hero-photo { display:block; width:100%; height:100%; max-width:none; object-fit:cover; object-position:55% var(--bk-photo-y,47%); transform:scale(var(--bk-photo-zoom,1.32)); transform-origin:55% var(--bk-photo-y,47%); }
#burg-companion-mockup .bk-home .bk-primary { justify-content:center; gap:14px; min-height:51px; padding:12px 14px; font-size:16px; }
#burg-companion-mockup .bk-primary svg { width:23px!important; height:23px!important; stroke-width:1.7; }
#burg-companion-mockup .bk-quick-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:10px; margin-top:11px; }
#burg-companion-mockup .bk-quick { display:flex; align-items:center; justify-content:center; gap:10px; min-height:56px; padding:10px 8px; border:1px solid var(--bk-line); border-radius:var(--bk-radius); background:var(--bk-paper); color:var(--bk-red)!important; font-size:15px!important; font-weight:500!important; }
#burg-companion-mockup .bk-quick svg { width:25px!important; height:25px!important; flex:none; stroke-width:1.7; }
#burg-companion-mockup .bk-family { background:none; border-radius:0; margin-top:3px; padding:12px 0 14px; min-height:58px; justify-content:center; gap:10px; color:var(--bk-red)!important; font-size:15px; font-weight:500; }
#burg-companion-mockup .bk-family > svg { width:25px!important; height:25px!important; stroke-width:1.7; }
#burg-companion-mockup .bk-family > svg:last-child { width:18px!important; height:18px!important; }
#burg-companion-mockup .bk-nav { background:var(--bk-paper); padding:7px 10px 11px; }
#burg-companion-mockup .bk-nav button { padding:5px 0 2px; gap:5px; min-height:55px; font-size:12px; }
#burg-companion-mockup .bk-nav button[aria-current=page] { background:transparent; font-weight:500; }
#burg-companion-mockup .bk-nav svg { width:25px!important; height:25px!important; stroke-width:1.7; }
#burg-companion-mockup .bk-nav button[aria-current=page] svg.lucide-house { fill:var(--bk-red); stroke:var(--bk-paper); }
#burg-companion-mockup .bk-tour { background:var(--bk-paper); padding:20px 16px; }
#burg-companion-mockup .bk-tour-title h3 { font-size:21px; }
#burg-companion-mockup .bk-meta svg { width:18px; height:18px; }
#burg-companion-mockup .bk-player { background:var(--bk-white); }
#burg-companion-mockup .bk-map-selected { background:var(--bk-white); }
#burg-companion-mockup .bk-scan-window { display:flex; flex-direction:column; gap:22px; align-items:center; justify-content:center; min-height:285px; margin-top:24px; padding:30px; background:var(--bk-white); border:1px solid var(--bk-line); border-radius:var(--bk-radius); text-align:center; color:var(--bk-red); }
#burg-companion-mockup .bk-scan-window svg { width:110px!important; height:110px!important; stroke-width:1; }
@media(max-width:380px) {
  #burg-companion-mockup .bk-stage { padding:16px 0; min-height:0; }
  #burg-companion-mockup .bk-app { min-height:0; }
  #burg-companion-mockup .bk-header { padding:18px 15px 10px; }
  #burg-companion-mockup .bk-home { padding:3px 15px 0; }
  #burg-companion-mockup .bk-home h1 { font-size:37px; }
  #burg-companion-mockup .bk-wordmark { font-size:17px; }
  #burg-companion-mockup .bk-brand { gap:7px; }
  #burg-companion-mockup .bk-brand-logo { width:31px!important; height:38px!important; }
  #burg-companion-mockup .bk-quick { gap:6px; padding:10px 6px; font-size:14px!important; }
  #burg-companion-mockup .bk-quick svg { width:22px!important; height:22px!important; }
}


/* Standalone layout: full device width, no surrounding preview frame. */
#burg-companion-mockup .bk-app {
  --bk-red:#b92b06; --bk-paper:#f5f1e7; --bk-white:#fff;
  --bk-text:#493d35; --bk-muted:#74665a; --bk-line:#e5dbcb;
  --bk-fill:#b92b06; --bk-on-fill:#fff9f0;
  width:100%; max-width:720px; min-height:100vh; min-height:100svh;
  margin:0 auto; border:0; border-radius:0; box-shadow:none;
}
#burg-companion-mockup .bk-header { padding-top:calc(20px + env(safe-area-inset-top,0px)); }
#burg-companion-mockup .bk-main { padding-bottom:calc(86px + env(safe-area-inset-bottom,0px)); }
#burg-companion-mockup .bk-nav {
  position:fixed; z-index:10; bottom:0; left:50%; transform:translateX(-50%);
  width:100%; max-width:720px; box-sizing:border-box;
  padding-bottom:calc(11px + env(safe-area-inset-bottom,0px));
}
@media(max-width:380px) {
  #burg-companion-mockup .bk-header { padding-top:calc(18px + env(safe-area-inset-top,0px)); }
}

/* Small phone gutters, with room for landscape display cutouts. */
#burg-companion-mockup .bk-app {
  --bk-gutter:20px;
  --bk-content-left:max(var(--bk-gutter),env(safe-area-inset-left,0px));
  --bk-content-right:max(var(--bk-gutter),env(safe-area-inset-right,0px));
}
#burg-companion-mockup .bk-header,
#burg-companion-mockup .bk-home,
#burg-companion-mockup .bk-pad {
  padding-left:var(--bk-content-left);
  padding-right:var(--bk-content-right);
}
#burg-companion-mockup .bk-map {
  margin-left:calc(-1 * var(--bk-content-left));
  margin-right:calc(-1 * var(--bk-content-right));
}
#burg-companion-mockup .bk-nav {
  padding-left:var(--bk-content-left);
  padding-right:var(--bk-content-right);
}

/* Match the header's top spacing on smaller phones as well. */
@media(max-width:380px) {
  #burg-companion-mockup .bk-app { --bk-gutter:18px; }
}