/* SkiSun palette sampled from the supplied, unmodified logo. */
:root { --skisun-navy: #061735; --skisun-red: #ee3a4c; --skisun-berry: #a31c4b; --bg: #f4f6fa; --text: #142643; --muted: #778399; --green: #061735; --orange: #ee3a4c; --line: #e6eaf1; --light: #eff3f9; --shadow: 0 4px 20px #06173504; }
body { color: var(--text); }
.skisun-logo { display: inline-block; position: relative; width: 163px; aspect-ratio: 203 / 57; overflow: hidden; flex-shrink: 0; }
.skisun-logo img { display: block; position: absolute; width: 127.586%; height: auto; max-width: none; left: -13.793%; top: -147.368%; }
.skisun-brand { display: flex; width: max-content; }
.sidebar > .brand { padding-left: 9px; }
.workspace { background: #f9fafc; border-color: #e3e8f2; }
.workspace-icon, .location-icon { background: #eef2f9; color: #5a729b; }
.workspace-badge { background: #fff0f2; color: #c42b49; border-color: #ffd8df; }
.workspace small, .user-profile small, .nav-label { color: #8290a7; }
.nav-item { color: #77849a; }
.nav-item.active { background: #fff0f2; color: #c82e45; }
.nav-item.active i { background: #ee3a4c; }
.nav-item:hover { background: #f2f5fa; }
.avatar { color: #546a8c; background: #eaf0f8; }
.user-profile strong { color: #142643; }
.demo-note { background: #f5f7fc; border-color: #e9edf5; }
.demo-note strong { color: #697b9e; }
.demo-note p { color: #8895aa; }
.demo-note .small-dot { background: #ee3a4c; }
.topbar { background: #ffffffdb; }
.breadcrumb, .date-top { color: #8290a5; }
.breadcrumb strong { color: #526480; }
.page-heading p, .panel-heading p, .payment-panel > p, .stat-label, .location-address { color: #7f8ca2; }
.eyebrow { color: #8794a9; }
.hello-dot { color: #ee3a4c; }
.hero-banner { background: linear-gradient(110deg, #061735 10%, #122747 69%, #572143 100%); box-shadow: 0 12px 28px #0617350e; }
.hero-banner:before { border-color: #ee3a4c16; box-shadow: 0 0 0 35px #ee3a4c05, 0 0 0 70px #ee3a4c04, 0 0 0 105px #ee3a4c03; }
.banner-label { color: #bac7dd; }
.banner-label i { background: #ee3a4c; box-shadow: 0 0 14px #ee3a4c66; }
.hero-banner p { color: #aebbd1; }
.banner-art { color: #95acce; }
.banner-badge { background: #ee3a4c; color: #fff; border-color: #112747; }
.banner-link { border-color: #ffffff28; color: #e7eefd; }
.btn { color: #405473; border-color: #dfe5ef; }
.btn:hover { background: #f1f4fa; }
.btn.primary { background: #ee3a4c; border-color: #ee3a4c; color: white; box-shadow: 0 4px 10px #ee3a4c12; }
.btn.primary:hover { background: #d92e43; border-color: #d92e43; }
.btn.dark { background: #061735; border-color: #061735; color: #fff; }
.text-btn { color: #516b91; }
.icon-btn:hover { background: #eff3f9; color: #1d3a65; }
.stat-icon { background: #f0f3f9; color: #8a9ebd; }
.stat-icon.orange { background: #fff0f2; color: #e96075; }
.stat-icon.amber { background: #fff5e5; color: #b08c4d; }
.stat-foot { color: #8c98ab; }
.mini-progress { background: #edf0f6; }
.mini-progress i { background: #788fb2; }
.legend { color: #8190a7; }
.legend-card { background: #061735; }
.legend-cash { background: #ee3a4c; }
.chart-text { fill: #8c9eb8; }
.donut { background: conic-gradient(#061735 var(--ratio), #ee3a4c 0); }
.donut.empty-donut { background: #edf1f7; }
.donut small, .payment-line > span { color: #8794a9; }
.count { background: #edf2f9; color: #7e91ae; }
.location-meta, .location-meta .icon, .location-card-foot { color: #8190a8; }
.location-card-foot { border-color: #edf0f6; }
.badge.neutral { background: #f0f3f8; color: #8996ab; }
th { background: #f8faff; color: #8998b0; border-color: #edf0f6; }
td { color: #72839e; border-color: #edf0f6; }
td strong { color: #354e72; }
td small { color: #929fb2; }
tbody tr:hover { background: #f9fbfe; }
.app-footer { color: #96a2b5; }
.info-bar { background: #eff4fb; color: #7589a8; }
.filter-select, input, select, textarea { border-color: #dfe6f0; color: #314b70; }
label { color: #657b9b; }
.filter-select { background-color: #fff; }
input::placeholder, textarea::placeholder { color: #aeb9cb; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline-color: #f48494; }
.menu-tabs { border-color: #e5eaf2; }
.menu-tabs button { color: #8291a8; }
.menu-tabs button.active { color: #db354c; border-color: #ee3a4c; }
.menu-tabs span { background: #edf1f8; color: #91a1b9; }
.product-art { background: radial-gradient(ellipse at center, #fff8ec, #f5f0e9 80%); }
.product-art.beverage { background: radial-gradient(ellipse at center, #e8f6ff, #edf1f7); }
.product-category, .product-body > p, .product-availability { color: #8998ae; }
.product-title strong { color: #d33b52; }
.product-availability { border-color: #e8edf5; }
.switch { background: #d8e0ed; }
.switch.on { background: #263f69; }
.tv-panel-title, .tv-panel h4 { color: #3d567b; }
.tv-panel > p, .tv-tip { color: #8393ad; }
.mini-tv { background: radial-gradient(ellipse at 70% 30%, #1d3559, #061735); border-color: #314b73; color: #f1f5ff; }
.mini-tv > span { color: #ff7185; }
.mini-tv-foot { color: #94a7c6; border-color: #ffffff20; }
.hint-card { background: #eef2f9; border-color: #e4eaf4; }
.hint-card strong { color: #647da3; }
.hint-card p { color: #8a9bb5; }
.display-settings { border-color: #e6ebf3; }
.display-settings > p { color: #8b9ab2; }
.layout-choices button { background: #f8fafd; color: #8a9bb6; border-color: #e5ebf5; }
.layout-choices button.active { background: #fff0f3; color: #ce344f; border-color: #f1a6b3; }
.big-icon { background: #eef3fa; color: #6681aa; }
.shift-main > p, .shift-side p { color: #8a9bb5; }
.opening-total { background: #f2f5fb; }
.opening-total span { color: #8b9bb4; }
.login-story { background: radial-gradient(ellipse at 100% 80%, #4d173a 0, #102441 35%, #061735 80%); color: #f0f4fc; }
.login-story > .brand { background: white; padding: 13px 19px; border-radius: 11px; }
.login-story:after { border-color: #ee3a4c16; }
.story-main .eyebrow, .story-main p { color: #a7b7d0; }
.story-main h1 { color: #f4f7ff; }
.floating-tag { color: #ab2545; background: #fff0f4; box-shadow: 0 8px 22px #06173535; }
.story-bottom { color: #8c9fbe; border-color: #ffffff1a; }
.story-bottom span { color: #ee3a4c; }
.login-panel { background: #fafbfe; }
.demo-label { background: #fff1f4; color: #cf5870; border-color: #f8dce4; }
.segmented { background: #edf2f9; }
.segmented button { color: #8d9db6; }
.segmented button.active { color: #294970; }
.demo-access { border-color: #e3eaf5; }
.demo-access-icon { color: #7790b3; background: #eef3fb; }
.demo-access strong { color: #687fa3; }
.demo-access p, .login-foot { color: #8e9db4; }
.demo-access b { color: #405d89; }
.demo-access .text-btn { color: #d2455e; }
.modal { border-color: #e2e8f2; }
.settlement-preview { background: #f2f6fc; }
.settlement-preview > div, .receipt-lines span, .receipt-note p { color: #879ab6; }
.settlement-preview strong { color: #435f88; }
.settlement-preview .difference { border-color: #e1e9f4; }
.receipt-lines { border-color: #dde7f6; }
.receipt-note { background: #f4f7fc; }
.receipt-brand { color: #d54661; }
#toast { background: #102847; color: #edf4ff; }
#toast.error { background: #a31c4b; }

/* Clear merchandising: price of the burger stays separate from the optional set. */
.hit-badge { display: inline-flex; align-items: center; gap: 5px; background: #ee3a4c; color: #fff; border: 1px solid #ffffff15; padding: 6px 10px; border-radius: 6px 6px 6px 0; font-size: 9px; font-weight: 700; letter-spacing: .1px; box-shadow: 0 4px 13px #a31c4b20; white-space: nowrap; }
.hit-badge > span { font-size: 13px; line-height: 1; }
.product-art > .hit-badge { position: absolute; left: 12px; top: 12px; z-index: 3; }
.hit-badge.compact { font-size: 7px; padding: 3px 6px; margin-bottom: 5px; }
.hit-badge.compact > span { font-size: 9px; }
.set-offer { display: flex; align-items: center; gap: 9px; padding: 11px 12px; background: #fff0f3; border: 1px solid #faddE4; border-radius: 10px; margin: 13px 0; text-align: left; }
.fries-art { display: block; height: 43px; width: 39px; flex-shrink: 0; }
.set-offer > div > span { display: block; font-size: 9px; color: #a5637c; margin-bottom: 4px; }
.set-offer > div > strong { display: block; font-size: 11px; color: #83374f; }
.set-offer b { color: #d12d4e; font-weight: 800; margin-left: 3px; }
.set-total { margin-left: auto; padding-left: 8px; border-left: 1px solid #efcad4; white-space: nowrap; }
.set-total > small { display: block; font-size: 8px; color: #a5637c; margin-bottom: 4px; }
.set-offer .set-total > strong { color: #b72344; font-size: 14px; }
.set-offer.compact { gap: 6px; padding: 9px 7px; border-radius: 8px; }
.set-offer.compact .fries-art { width: 27px; height: 34px; }
.set-offer.compact > div > span { font-size: 8px; }
.set-offer.compact > div > strong { font-size: 10px; }
.set-offer.compact .set-total > small { font-size: 7px; }
.set-offer.compact .set-total > strong { font-size: 12px; }
.merch-settings { border: 1px solid #e3eaf4; background: #f7f9fd; border-radius: 10px; padding: 16px; margin: 19px 0; }
.merch-settings .eyebrow { display: block; margin-bottom: 15px; }
.checkbox-option { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 15px; cursor: pointer; }
.checkbox-option:last-child { margin-bottom: 0; }
.checkbox-option > input { width: 16px; height: 16px; flex-shrink: 0; margin: 2px 0 0; accent-color: #ee3a4c; padding: 0; }
.checkbox-option strong { display: block; font-size: 11px; color: #3f577a; }
.checkbox-option small { display: block; font-size: 9px; color: #8b9bb3; margin-top: 5px; line-height: 1.6; }
.checkbox-option:has(input:disabled) { opacity: .45; }
.assembly-demo-button { border-color: #f1ccd6; background: #fff7f9; color: #b53657; }

/* Softer, layered steam with independently drifting translucent trails. */
.heat-steam { color: #bcab97; }
.steam-trail { opacity: 0; transform-origin: center bottom; animation: vapor-drift var(--steam-duration, 7s) ease-in-out infinite; animation-delay: var(--steam-delay, 0s); }
.steam-cloud { stroke-width: 12px; opacity: .13; filter: blur(4px); }
.steam-core { stroke-width: 3.5px; opacity: .25; filter: blur(1.8px); }
.tv-screen .heat-steam, .login-story .heat-steam, .mini-tv .heat-steam, .assembly-stage .heat-steam { color: #eaf3ff; }
@keyframes vapor-drift {
  0% { opacity: 0; transform: translate(-3px, 13px) scaleX(.8); }
  22% { opacity: .9; }
  48% { opacity: .7; transform: translate(4px, -10px) scaleX(1.05); }
  76% { opacity: .25; }
  100% { opacity: 0; transform: translate(13px, -34px) scaleX(1.23); }
}
.cheese-effects { fill: #f7bd34; }
.melt-drip { transform-box: fill-box; transform-origin: center top; animation: cheddar-melt 7s ease-in-out infinite; }
.drip-two { animation-delay: -2.6s; }
.drip-three { animation-delay: -4.2s; }
.layer-cheese-upper .melt-drip { animation-duration: 8.5s; }
.cheese-shine { opacity: .5; animation: cheddar-shine 7s ease-in-out infinite; }
@keyframes cheddar-melt { 0%, 100% { transform: scaleY(.72); } 55%, 70% { transform: scaleY(1.15); } }
@keyframes cheddar-shine { 0%, 100% { opacity: .25; } 55% { opacity: .7; } }
.unavailable .cheese-effects *, .sold-out .cheese-effects * { animation: none; }
.unavailable .food-art, .sold-out .food-art { filter: grayscale(1); }
.product-card.unavailable .product-art { background: #e7ebf0; }
.product-card.unavailable .product-title strong { color: #98a2b0; }
.stock-label { background: #f2f5faed; color: #566782; border-color: #ffffff80; box-shadow: 0 5px 20px #06173522; }
.stock-label strong { color: #52647e; }
.stock-label small, .stock-label > .icon { color: #8a9bb3; }

/* SkiSun's customer-facing display. */
.tv-body { background: #061735; color: #f2f6ff; }
.tv-screen { background: radial-gradient(ellipse at 95% 5%, #38203f 0, transparent 44%), radial-gradient(ellipse at 30% 50%, #132e50 0, #061735 72%); }
.tv-screen .tv-header { border-color: #adc4eb26; }
.tv-screen .tv-logo { gap: calc(1.1 * var(--unit)); }
.tv-screen .tv-logo .brand { background: #fff; border-radius: 8px; padding: calc(.6 * var(--unit)) calc(.8 * var(--unit)); }
.tv-screen .tv-logo .skisun-logo { width: calc(10 * var(--unit)); min-width: 92px; }
.tv-screen .tv-logo .tv-logo-caption { color: #f1f5ff; font-size: calc(1 * var(--unit)); letter-spacing: calc(.1 * var(--unit)); line-height: 1.5; }
.tv-logo-caption small { font-size: .48em; color: #97abc9; letter-spacing: .1em; white-space: nowrap; }
.tv-screen .tv-header > span, .tv-screen .tv-header .icon-btn { color: #a6b8d2; }
.tv-screen .tv-title > div > span { color: #91a7ca; }
.tv-screen .tv-title h1 { color: #f7f9ff; }
.tv-screen .tv-title em { color: #ff697f; }
.tv-screen .tv-stamp { color: #f06680; border-color: #f0668080; }
.tv-screen .food-visual > .burger-art { height: calc(19 * var(--unit)); max-height: 29vh; }
.tv-screen .food-visual > .hit-badge { position: absolute; z-index: 1; left: 2%; top: 10%; padding: calc(.4 * var(--unit)) calc(.7 * var(--unit)); font-size: clamp(8px, calc(.7 * var(--unit)), 20px); }
.tv-screen .food-visual > .hit-badge > span { font-size: 1.35em; }
.tv-screen .tv-item-title > strong { color: #fff4f5; }
.tv-screen .tv-burger > p { color: #9eb1ce; }
.tv-temperature.hot { color: #c5ad96; }
.tv-temperature > i { background: #e0a476; }
.tv-screen .set-offer { background: linear-gradient(110deg, #ee3a4c1c, #a31c4b26); border-color: #ee3a4c3d; border-radius: calc(.65 * var(--unit)); padding: calc(.5 * var(--unit)) calc(.75 * var(--unit)); gap: calc(.6 * var(--unit)); margin: calc(.8 * var(--unit)) 0 0; }
.tv-screen .set-offer > .fries-art { height: calc(3.5 * var(--unit)); width: calc(3.1 * var(--unit)); min-height: 32px; min-width: 27px; }
.tv-screen .set-offer > div > span { font-size: clamp(8px, calc(.6 * var(--unit)), 18px); color: #cfa0b1; }
.tv-screen .set-offer > div > strong { font-size: clamp(10px, calc(.8 * var(--unit)), 23px); color: #ffe8ee; }
.tv-screen .set-offer b { color: #ff7c90; }
.tv-screen .set-total { border-color: #ee3a4c38; padding-left: calc(.8 * var(--unit)); }
.tv-screen .set-total > small { font-size: clamp(7px, calc(.5 * var(--unit)), 15px); color: #c49aae; }
.tv-screen .set-offer .set-total > strong { font-size: clamp(13px, calc(1.2 * var(--unit)), 34px); color: #fff; }
.tv-screen .tv-drinks { border-color: #adc4eb26; }
.tv-screen .tv-drinks-heading > span { color: #9bb3d4; }
.tv-screen .tv-drinks-heading .cold-caption { color: #90bfd9; }
.tv-screen .tv-drink h3 { color: #e6f0ff; }
.tv-screen .tv-drink small { color: #839dbc; }
.tv-screen .tv-drink strong { color: #eef4ff; }
.tv-screen .tv-burger.sold-out h2, .tv-screen .tv-drink.sold-out h3 { color: #8d9eb7; }
.tv-screen .tv-burger.sold-out > p, .tv-screen .sold-out .tv-item-title > strong, .tv-temperature.out { color: #687e9f; }
.tv-screen .tv-drink .stock-label.compact { background: #a5b4cf12; border-color: #a5b4cf25; }
.tv-screen .tv-drink .stock-label strong, .tv-screen .tv-drink .stock-label > .icon { color: #9bacc5; }
.tv-screen .tv-footer { color: #748dab; }
.tv-screen .tv-footer > span:first-child { color: #b9c9e0; }
.tv-screen.is-portrait .tv-logo .skisun-logo { width: calc(17 * var(--unit)); }
.tv-screen.is-portrait .tv-logo .brand { padding: calc(1 * var(--unit)) calc(1.5 * var(--unit)); }
.tv-screen.is-portrait .tv-logo .tv-logo-caption { font-size: calc(1.65 * var(--unit)); }
.tv-screen.is-portrait .food-visual > .burger-art { height: calc(25 * var(--unit)); max-height: none; }
.tv-screen.is-portrait .food-visual > .hit-badge { top: 1%; font-size: clamp(8px, calc(1.3 * var(--unit)), 18px); padding: calc(.65 * var(--unit)) calc(1 * var(--unit)); }
.tv-screen.is-portrait .tv-item-title { grid-column: 2; grid-row: 1; }
.tv-screen.is-portrait .tv-burger > p { grid-column: 2; grid-row: 2; }
.tv-screen.is-portrait .tv-burger > .set-offer { grid-column: 2; grid-row: 3; }
.tv-screen.is-portrait .tv-temperature { display: none; }
.tv-screen.is-portrait .set-offer { gap: calc(.8 * var(--unit)); padding: calc(.9 * var(--unit)); margin-top: calc(1.7 * var(--unit)); }
.tv-screen.is-portrait .set-offer > .fries-art { width: calc(5.3 * var(--unit)); height: calc(6.2 * var(--unit)); }
.tv-screen.is-portrait .set-offer > div > span { font-size: clamp(7px, calc(1 * var(--unit)), 14px); }
.tv-screen.is-portrait .set-offer > div > strong { font-size: clamp(8px, calc(1.3 * var(--unit)), 18px); }
.tv-screen.is-portrait .set-total > small { font-size: clamp(6px, calc(.85 * var(--unit)), 12px); }
.tv-screen.is-portrait .set-offer .set-total > strong { font-size: clamp(11px, calc(1.9 * var(--unit)), 27px); }

/* A self-contained, replayable assembly demonstration. */
.assembly-body { background: #061735; color: #edf3ff; }
.assembly-page { min-height: 100svh; background: radial-gradient(ellipse at 75% 35%, #33213f, transparent 55%), #061735; padding: 30px 5vw 20px; }
.assembly-page > header { display: flex; align-items: center; justify-content: space-between; }
.assembly-page > header .brand { background: #fff; padding: 13px 20px; border-radius: 10px; }
.assembly-page > header .btn { text-decoration: none; background: #ffffff0a; border-color: #ffffff20; color: #b6c8e5; }
.assembly-page > footer { text-align: center; color: #6f89ab; font-size: 9px; letter-spacing: 2px; margin-top: 35px; }
.assembly-experience { max-width: 860px; margin: 32px auto 0; text-align: center; }
.assembly-intro { text-align: center; }
.assembly-intro .eyebrow { color: #ee6c85; letter-spacing: 2px; }
.assembly-intro h2 { color: #eaf2ff; font-size: 36px; line-height: 1.25; margin: 12px 0; letter-spacing: -1px; }
.assembly-intro h2 em { font-style: normal; color: #ff6c83; }
.assembly-intro p { color: #96aaca; font-size: 12px; }
.assembly-stage { position: relative; height: 390px; display: flex; align-items: center; justify-content: center; overflow: hidden; margin: 10px auto 5px; isolation: isolate; }
.assembly-stage::before { content: ''; position: absolute; width: 380px; height: 250px; background: radial-gradient(ellipse, #829eca17, transparent 70%); border-radius: 50%; transform: translateY(80px); z-index: -1; }
.assembly-stage > .burger-art { height: 370px; width: 450px; max-width: 100%; overflow: visible; }
.assembly-ready { position: absolute; bottom: 8px; left: 0; right: 0; color: #c6d4ea; font-size: 10px; letter-spacing: .7px; opacity: 0; animation: assembly-ready 12s ease-in-out infinite; }
.assembly-ingredients { display: flex; align-items: center; justify-content: center; gap: 12px; color: #abbddd; font-size: 11px; flex-wrap: wrap; }
.assembly-ingredients span { border: 1px solid #ffffff19; border-radius: 30px; padding: 7px 13px; background: #ffffff05; }
.assembly-ingredients i { color: #ed647e; font-style: normal; }
.assembly-controls { display: flex; justify-content: center; gap: 10px; margin-top: 24px; }
.assembly-controls .btn { background: #ffffff07; color: #c7d6ee; border-color: #ffffff23; }
.assembly-controls .btn:hover { background: #ffffff12; }
.assembly-controls .btn[aria-pressed='true'] { border-color: #ee6c85; color: #ff90a3; }
.assembly-modal { width: 680px; background: radial-gradient(ellipse at top right, #3d1b39, transparent 60%), #081c3a; border-color: #345173; color: #eaf2ff; }
.assembly-modal .modal-header h2 { font-size: 14px; color: #b8c9e4; }
.assembly-modal .modal-header .icon-btn { color: #8ea4c5; }
.assembly-modal .modal-header .icon-btn:hover { background: #ffffff0a; }
.assembly-modal .assembly-intro h2 { font-size: 28px; }
.assembly-modal .assembly-stage { height: 315px; }
.assembly-modal .assembly-stage > .burger-art { height: 290px; width: 360px; }
.assembly-modal .assembly-ingredients { gap: 7px; font-size: 9px; }
.assembly-modal .assembly-ingredients span { padding: 6px 9px; }
.assembly-modal .assembly-controls .btn { font-size: 10px; }
.is-assembling .burger-layer { animation-duration: 12s; animation-iteration-count: infinite; animation-timing-function: cubic-bezier(.2,.7,.3,1); transform-origin: center; }
.is-assembling .layer-bottom { animation-name: assemble-bottom; }
.is-assembling .layer-patty-lower { animation-name: assemble-patty-lower; }
.is-assembling .layer-cheese-lower { animation-name: assemble-cheese-lower; }
.is-assembling .layer-patty-upper { animation-name: assemble-patty-upper; }
.is-assembling .layer-cheese-upper { animation-name: assemble-cheese-upper; }
.is-assembling .layer-salad { animation-name: assemble-salad; }
.is-assembling .layer-tomato, .is-assembling .layer-bacon { animation-name: assemble-tomato; }
.is-assembling .layer-top { animation-name: assemble-top; }
.is-assembling > .heat-steam { animation: assembly-steam 12s ease-in-out infinite; }
@keyframes assemble-bottom { 0% { opacity: 0; transform: translateY(75px); } 8%, 93% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; } }
@keyframes assemble-patty-lower { 0%, 8% { opacity: 0; transform: translate(-40px, -180px) rotate(-8deg); } 18%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-cheese-lower { 0%, 19% { opacity: 0; transform: translate(35px, -170px) rotate(8deg); } 29%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-patty-upper { 0%, 30% { opacity: 0; transform: translate(-25px, -180px) rotate(-6deg); } 40%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-cheese-upper { 0%, 41% { opacity: 0; transform: translate(25px, -160px) rotate(7deg); } 51%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-salad { 0%, 52% { opacity: 0; transform: translate(-30px, -170px) rotate(-6deg); } 60%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-tomato { 0%, 61% { opacity: 0; transform: translate(25px, -160px) rotate(6deg); } 69%, 93% { opacity: 1; transform: translate(0,0) rotate(0); } 100% { opacity: 0; } }
@keyframes assemble-top { 0%, 70% { opacity: 0; transform: translateY(-190px) rotate(-5deg); } 81%, 93% { opacity: 1; transform: translateY(0) rotate(0); } 100% { opacity: 0; } }
@keyframes assembly-steam { 0%, 76%, 100% { opacity: 0; } 84%, 93% { opacity: 1; } }
@keyframes assembly-ready { 0%, 81%, 100% { opacity: 0; transform: translateY(6px); } 85%, 93% { opacity: 1; transform: translateY(0); } }
.assembly-stage.paused *, .assembly-stage.paused *::before { animation-play-state: paused !important; }

@media (max-width: 1150px) {
  .sidebar .skisun-logo { width: 143px; }
  .set-offer.compact { flex-wrap: wrap; }
  .set-offer.compact .set-total { margin-left: auto; }
}
@media (max-width: 900px) {
  .sidebar .skisun-logo { width: 131px; }
  .tv-screen .tv-logo .tv-logo-caption { display: none; }
}
@media (max-width: 650px) {
  .sidebar > .brand { padding-left: 0; }
  .sidebar .skisun-logo { width: 122px; }
  .sidebar { align-items: center; }
  .sidebar-bottom { align-self: center; }
  .login-story > .brand { padding: 10px 14px; }
  .login-story .skisun-logo { width: 133px; }
  .product-art > .hit-badge { font-size: 7px; padding: 4px 6px; left: 8px; top: 8px; }
  .set-offer.compact { gap: 5px; padding: 7px; }
  .set-offer.compact > .fries-art { width: 23px; height: 29px; }
  .set-offer.compact .set-total { width: 100%; border-left: 0; border-top: 1px solid #efcad4; padding: 6px 0 0; display: flex; align-items: center; justify-content: space-between; }
  .set-offer.compact .set-total small { margin: 0; }
  .tv-screen.is-portrait .set-offer > .fries-art { display: none; }
  .tv-screen.is-portrait .set-offer { padding: 7px; gap: 6px; }
  .tv-screen.is-portrait .set-total { padding-left: 6px; }
  .assembly-page { padding: 20px 17px; }
  .assembly-page > header .brand { padding: 10px 13px; }
  .assembly-page > header .skisun-logo { width: 118px; }
  .assembly-page > header .btn { font-size: 9px; padding: 9px; }
  .assembly-page > header .btn .icon { display: none; }
  .assembly-intro h2 { font-size: 29px; }
  .assembly-intro p { font-size: 10px; }
  .assembly-stage { height: 290px; }
  .assembly-stage > .burger-art { height: 270px; width: 330px; }
  .assembly-ingredients { gap: 6px; font-size: 8px; }
  .assembly-ingredients span { padding: 6px 8px; }
  .assembly-controls { gap: 7px; }
  .assembly-controls .btn { font-size: 10px; padding: 10px; }
  .assembly-modal { padding: 20px 15px; }
  .assembly-modal .assembly-intro h2 { font-size: 25px; }
  .assembly-modal .assembly-stage { height: 260px; }
  .assembly-modal .assembly-stage > .burger-art { height: 245px; }
}
.menu-tabs { flex-wrap: wrap; gap: 4px 12px; }
.menu-tabs button { white-space: nowrap; }
.product-art > .product-photo { width: 100%; height: 100%; max-height: 170px; padding: 10px 18px; object-fit: contain; }
.product-art > .category-art { width: 75%; height: 150px; object-fit: contain; }
.product-art > .fries-art.category-art { width: 95px; padding: 12px; }
.mini-product > .product-photo, .mini-product > .category-art { width: 100%; height: 100%; max-height: 85px; object-fit: contain; }
.food-visual > .product-photo { width: 100%; height: calc(19 * var(--unit)); max-height: 29vh; padding: calc(1.5 * var(--unit)); object-fit: contain; }
.tv-screen.is-portrait .food-visual > .product-photo { height: calc(25 * var(--unit)); max-height: none; }
.tv-screen .drink-visual > .product-photo, .tv-screen .drink-visual > .category-art { width: 100%; height: calc(6 * var(--unit)); min-height: 42px; object-fit: contain; }
.tv-screen.is-portrait .drink-visual > .product-photo, .tv-screen.is-portrait .drink-visual > .category-art { height: calc(10 * var(--unit)); }
.tv-screen .tv-category .tv-drinks-heading { flex: 0 0 17%; min-width: 0; }
.tv-screen .tv-category .tv-drinks-heading h2 { overflow-wrap: anywhere; }
.tv-screen .tv-category .tv-drinks-list { flex: 1; min-width: 0; row-gap: calc(1.6 * var(--unit)); }
.tv-screen .tv-category .tv-drink > div:last-child { min-width: 0; }
.tv-empty { text-align: center; color: #b9c9e0; padding: 10vh 0; }
.photo-upload { border: 1px solid #dfe5ef; border-radius: 12px; margin: 18px 0; padding: 14px; }
.photo-upload legend { padding: 0 6px; font-size: 12px; font-weight: 700; color: #233d60; }
.photo-upload-row { display: flex; gap: 18px; align-items: center; }
.photo-preview { display: flex; align-items: center; justify-content: center; flex: 0 0 130px; height: 115px; overflow: hidden; border: 1px solid #dce3ee; border-radius: 8px; background: repeating-conic-gradient(#e3e8ef 0% 25%, #f9fbff 0% 50%) 50% / 16px 16px; }
.photo-preview img { width: 100%; height: 100%; object-fit: contain; padding: 5px; }
.photo-preview > span { padding: 9px; color: #62728b; font-size: 11px; text-align: center; line-height: 1.8; background: #ffffffc9; }
.photo-preview small { font-size: 9px; }
.photo-upload-controls { min-width: 0; flex: 1; }
.photo-upload-controls .photo-picker { display: inline-flex; position: relative; align-items: center; gap: 6px; padding: 11px 13px; border-radius: 8px; background: #061735; color: white; font-size: 11px; cursor: pointer; margin: 0; }
.photo-picker input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; padding: 0; }
.photo-picker:focus-within { outline: 3px solid #ef8895; outline-offset: 3px; }
.photo-name { color: #687a94; font-size: 10px; line-height: 1.6; margin: 9px 0; overflow-wrap: anywhere; }
.photo-upload-controls [hidden] { display: none; }
.photo-upload .photo-help { color: #7d8ca2; font-size: 10px; line-height: 1.7; margin: 12px 0 0; }
@media (max-width: 430px) {
  .photo-upload-row { gap: 12px; }
  .photo-preview { flex-basis: 100px; height: 105px; }
  .photo-upload-controls .photo-picker { font-size: 10px; padding: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .steam-trail, .melt-drip, .cheese-shine, .is-assembling .burger-layer, .is-assembling > .heat-steam, .assembly-ready { animation: none !important; }
  .steam-trail { opacity: .3; }
  .is-assembling .burger-layer, .is-assembling > .heat-steam, .assembly-ready { opacity: 1; transform: none; }
}