@font-face{font-family:Citrus;src:url('assets/citrus.otf')}@font-face{font-family:Bebas;src:url('assets/bebas.otf')}@font-face{font-family:BebasBook;src:url('assets/bebas-book.otf')}@font-face{font-family:BebasBold;src:url('assets/bebas-bold.otf')}
@font-face{font-family:BebasPro;src:url('assets/bebas-pro-regular.otf');font-weight:400;font-style:normal}@font-face{font-family:BebasProBook;src:url('assets/bebas-pro-book.otf');font-weight:400;font-style:normal}
:root{color-scheme:dark;--accent:#fcab28;--line:#373836;--muted:#93958e;--paper:#fff;--ink:#111;--sub:#42433d}
*{box-sizing:border-box}body{margin:0;background:#171817;color:#eeeee8;font:13px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,select{font:inherit;color:inherit;border:1px solid var(--line);background:#232422;border-radius:7px;padding:9px 13px;cursor:pointer}button:hover,select:hover{border-color:#787a71}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button[aria-pressed=true]{background:#fcab28;color:#191919;border-color:#fcab28}a{color:inherit;text-decoration:none}.studio-header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 32px}.identity{display:flex;gap:11px;align-items:center;font-size:12px;letter-spacing:.07em;font-weight:750;white-space:nowrap}.identity small{display:block;color:var(--muted);font-size:9px;letter-spacing:.18em;margin-top:3px}.identity b{color:var(--accent);margin-left:4px}.brand-mark{border:1px solid #686a61;padding:8px 7px;font-size:19px;letter-spacing:-.07em;font-weight:900}.screen-tabs{display:flex;gap:5px}.screen-tabs button{background:transparent;border-color:transparent;padding:10px 14px;white-space:nowrap}.screen-tabs button[aria-pressed=true]{background:#30312c;color:#fff;border-color:#4e5047}.screen-tabs button span{color:var(--accent);margin-right:6px;font-size:10px}.quiet{background:transparent;border:0;color:#babcb3;font-size:11px}.note-dot,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-left:5px}.live-dot{background:#9cae80;margin:0 7px 0 0}main{max-width:1800px;margin:auto;padding:26px 32px 18px}.workspace-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:20px}.eyebrow{font-size:9px;letter-spacing:.18em;color:var(--muted)}h1{font-weight:550;font-size:21px;letter-spacing:-.03em;margin:5px 0 0}.workspace-meta{display:flex;gap:7px;align-items:center;color:#a4a69c;font-size:10px;padding-bottom:4px}.divider{color:#5e6059;padding:0 9px}#screens{display:grid;gap:16px;max-width:100%;margin:auto}.screen-card{position:relative;background:#fff;aspect-ratio:16/9;box-shadow:0 10px 30px #0003;overflow:hidden;width:100%;max-height:calc(100dvh - 285px)}.screen-card[hidden]{display:none}.screen-card svg{display:block;width:100%;height:100%}.screen-label{display:none}#screens.overview{grid-template-columns:repeat(3,minmax(0,1fr));padding:65px 0 80px}.overview .screen-card{overflow:visible;max-height:none}.overview .screen-label{display:block;position:absolute;top:-30px;color:#c2c4ba;font-size:10px;letter-spacing:.09em}.transport{display:flex;gap:24px;align-items:center;margin-top:22px;border:1px solid var(--line);border-radius:10px;padding:16px 18px;background:#1e1f1d}.transport-primary,.transport-options{display:flex;gap:7px;align-items:center}.play-button{min-width:82px;background:var(--accent);border-color:var(--accent);color:#171817;font-weight:650}.transport #restart{font-size:20px;padding:3px 12px}output{white-space:nowrap;color:#b7b9ae;min-width:88px;font-variant-numeric:tabular-nums;font-size:11px;margin-left:5px}.timeline{flex:1;min-width:100px}input[type=range]{width:100%;accent-color:var(--accent);cursor:pointer;height:5px;display:block;margin:5px 0 9px}.timeline div{display:flex;justify-content:space-between;font-size:7px;letter-spacing:.06em;color:#787c70}.transport-options{white-space:nowrap}.transport-options button,.transport-options select{font-size:11px}.studio-footer{display:flex;justify-content:space-between;gap:15px;color:#7d8175;font-size:10px;margin-top:14px}#status{font-size:12px;color:#f8bb55;margin:8px 0 0}#status:empty{display:none}#notes{position:fixed;z-index:10;right:20px;top:100px;width:390px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 120px);overflow:auto;padding:25px;background:#272925;border:1px solid #4e5147;box-shadow:0 20px 90px #0009;border-radius:12px;color:#bfc3b6;font-size:12px}#notes h2{font-size:23px;color:#fff;font-weight:550;margin:12px 0}#notes li{margin-bottom:12px}#notes ul{padding-left:18px}#notes b{color:#e8eade}#notes a{color:var(--accent);border-bottom:1px solid #745a25}.notes-head{display:flex;justify-content:space-between;align-items:center}.notes-head button{font-size:20px;padding:0 8px;border:0;background:none}#loading{position:fixed;inset:0;display:grid;place-items:center;z-index:20;background:#171817;color:var(--accent);font-size:15px}#loading[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.menu-svg{--paper:#fff;--ink:#111;--sub:#444;--rule:#e6e2db;background:var(--paper);color:var(--ink)}.menu-svg text{fill:var(--ink)}.menu-svg .paper{fill:var(--paper)}.menu-svg .ink{fill:var(--ink)}.menu-svg .accent{fill:#fcab28}.menu-svg .sub{fill:var(--sub)}.menu-svg .rule{stroke:var(--rule);stroke-width:1.5}.menu-svg .title{font-family:Citrus,sans-serif}.menu-svg .body-copy{font-family:Bebas,sans-serif}.menu-svg .price{font-family:BebasBold,sans-serif;fill:#e69516}.menu-svg .price-label{font-family:Bebas,sans-serif;fill:var(--sub)}.menu-svg .texture{display:none}.menu-svg .brand-logo{fill:var(--ink)}.menu-svg .side-fill{fill:#000}.menu-svg .side-text{fill:#fff}.menu-svg .hero-copy{fill:var(--ink)}.menu-svg .soft-shadow{fill:#000;opacity:.16}.dark .menu-svg{--paper:#20221e;--ink:#fffdf3;--sub:#d3d1c5;--rule:#4a4b42}.dark .menu-svg .texture{display:block}.menu-svg .blank-price{fill:var(--sub)}.menu-svg .static-hide{display:none}
#screens:fullscreen{background:#111;display:grid;align-content:center;width:100vw;height:100vh;max-width:none;gap:0}#screens:fullscreen .screen-card{max-height:none;box-shadow:none;height:min(100vh,56.25vw);width:100%;background:#111}#screens:fullscreen.overview{grid-template-columns:repeat(3,1fr);padding:0}#screens:fullscreen.overview .screen-card{height:auto}.display-mode .studio-header,.display-mode .workspace-heading,.display-mode .transport,.display-mode .studio-footer{display:none}.display-mode main{padding:0;max-width:none;height:100dvh;display:grid;align-content:center}.display-mode .screen-card{max-height:none;height:min(100dvh,56.25vw);width:100vw}.display-mode #screens.overview{padding:0}.display-mode .overview .screen-card{width:100%;height:auto}.display-mode .screen-label{display:none}.display-mode #status{position:fixed;bottom:5px;left:10px}
@media(max-width:1100px){.studio-header{padding:0 18px;gap:10px}.identity{font-size:10px}.screen-tabs button{padding:9px 9px}.quiet{font-size:0}.quiet .note-dot{width:8px;height:8px}main{padding:20px 18px}.transport{gap:12px;padding:12px}.transport-options{gap:4px}.transport-options button{padding:9px}.studio-footer{font-size:9px}}
@media(max-width:760px){.studio-header{height:auto;flex-wrap:wrap;padding:14px;gap:12px}.identity{flex:1}.screen-tabs{order:3;width:100%;justify-content:space-between}.screen-tabs button{font-size:11px;padding:8px}.workspace-heading{margin-bottom:13px}.workspace-meta{display:none}main{padding:18px 12px}.screen-card{max-height:none}#screens.overview{grid-template-columns:1fr;padding:25px 0 0;gap:45px}.transport{flex-wrap:wrap;gap:12px}.transport-primary{flex:1}.transport-options{order:2}.timeline{order:3;flex-basis:100%}.studio-footer{display:block;line-height:1.8}.studio-footer>span{display:block}h1{font-size:19px}.timeline div{font-size:6px}}

.composition-tabs{display:flex;gap:6px;margin-top:14px;flex-wrap:wrap}.composition-tabs[hidden]{display:none}.composition-tabs button{font-size:11px;background:transparent;padding:7px 12px;border-color:#393b34;color:#b7b9ae}.composition-tabs button span{font-size:9px;margin-right:6px;color:#a6a98e}.composition-tabs button[aria-pressed=true]{background:#30312c;border-color:#7b6945;color:#fff}.composition-tabs button[aria-pressed=true] span{color:#fcab28}.display-mode .composition-tabs{display:none}.screen-card{max-height:calc(100dvh - 326px)}.overview .screen-card,.display-mode .screen-card{max-height:none}@media(max-width:760px){.screen-card{max-height:none}.composition-tabs button{font-size:10px;padding:7px 8px}}
/* Keep the preview frame at 16:9 when the transport limits its height. */
.screen-card{width:min(100%,calc((100dvh - 326px)*16/9));max-height:none;margin-inline:auto}.overview .screen-card,.display-mode .screen-card,#screens:fullscreen .screen-card{width:100%}@media(max-width:760px){.screen-card{width:100%}}
/* Shared menu typography measured from the supplied SVGs. */
.reference-menu{font-synthesis:none}.reference-menu .reference-copy{font-family:BebasPro,sans-serif;font-weight:400}.reference-menu .reference-category{font-family:BebasBold,sans-serif}.reference-menu .price{font-family:BebasProBook,sans-serif;font-weight:400;fill:#fcab28}.reference-menu .price-unit{font-family:BebasProBook,sans-serif;font-weight:400;fill:var(--ink)}.reference-menu .price-label{font-family:BebasPro,sans-serif;fill:var(--sub)}.reference-menu .blank-price{fill:var(--sub)}.reference-menu .tile-label{fill:#fff}