/* @section: design-system */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@1,500;1,600&display=swap');

:root {
  color-scheme: light;
  --ink: #0b0b0b;
  --ink-soft: #151513;
  --ivory: #f7f5ef;
  --paper: #fdfcf8;
  --surface: #ffffff;
  --soft: #eeece5;
  --muted: #716f69;
  --muted-dark: #aaa69b;
  --line: rgba(11, 11, 11, 0.12);
  --line-dark: rgba(255, 255, 255, 0.14);
  --gold: #c8a85c;
  --gold-light: #e6cd8b;
  --gold-deep: #9c7a31;
  --green: #356e58;
  --danger: #9a3e3e;
  --font-display: "Manrope", "Avenir Next", system-ui, sans-serif;
  --font-body: "DM Sans", system-ui, -apple-system, sans-serif;
  --font-serif: "Playfair Display", Georgia, serif;
  --expo: cubic-bezier(0.16, 1, 0.3, 1);
  --quart: cubic-bezier(0.25, 1, 0.5, 1);
  --radius-sm: 12px;
  --radius-md: 22px;
  --radius-lg: 34px;
  --shadow-soft: 0 24px 70px rgba(18, 16, 10, 0.09);
  --topbar-h: 74px;
  --bottom-h: 78px;
  --rail-w: 0px;
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  overflow: hidden;
  background: var(--ink);
  color: var(--ink);
  font-family: var(--font-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button, input, select, textarea { font: inherit; }
button { color: inherit; }
img, svg { display: block; max-width: 100%; }
button, label, input[type="range"] { -webkit-tap-highlight-color: transparent; }
button { border: 0; }
::selection { background: var(--gold); color: var(--ink); }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.skip-link { position: fixed; z-index: 1000; left: 1rem; top: -5rem; padding: .8rem 1rem; background: var(--gold); color: var(--ink); border-radius: 8px; font-weight: 700; transition: top .2s var(--expo); }
.skip-link:focus { top: 1rem; }

/* @section: ambient-background */
.ambient { position: fixed; inset: auto; pointer-events: none; filter: blur(80px); opacity: .16; z-index: 0; }
.ambient-one { width: 34vw; height: 34vw; background: var(--gold); top: -18vw; right: 3vw; border-radius: 50%; }
.ambient-two { width: 25vw; height: 25vw; background: #7e6332; bottom: -15vw; left: 10vw; border-radius: 50%; }

/* @section: app-shell */
.app-shell { position: relative; z-index: 1; width: 100%; min-height: 100dvh; background: var(--paper); overflow: hidden; }
.topbar {
  position: fixed; z-index: 60; inset: 0 0 auto 0; height: var(--topbar-h);
  display: grid; grid-template-columns: auto minmax(100px, 1fr) auto; align-items: center; gap: 1rem;
  padding: 0 1rem; color: var(--ink); background: rgba(253, 252, 248, .88);
  backdrop-filter: blur(18px); border-bottom: 1px solid var(--line); transition: background .45s var(--expo), color .45s var(--expo), border-color .45s var(--expo);
}
body.screen-dark .topbar { color: var(--ivory); background: rgba(11,11,11,.72); border-color: var(--line-dark); }
.brand { display: inline-flex; align-items: center; gap: .65rem; background: transparent; padding: 0; cursor: pointer; text-align: left; }
.brand-emblem { position: relative; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; background: #111; border: 1px solid rgba(200,168,92,.34); }
.brand-emblem img { width: 100%; height: 100%; object-fit: cover; }
.brand-emblem-small { width: 38px; height: 38px; border-radius: 11px; }
.brand-copy { display: none; line-height: 1.08; }
.brand-copy strong { display: block; font: 700 .76rem/1 var(--font-display); letter-spacing: -.025em; }
.brand-copy small { display: block; margin-top: .25rem; color: var(--muted); font: 500 .54rem/1 var(--font-body); letter-spacing: .015em; }
body.screen-dark .brand-copy small { color: var(--muted-dark); }
.top-progress { min-width: 0; max-width: 390px; width: 100%; justify-self: center; }
.top-progress-meta { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; font-size: .65rem; text-transform: uppercase; letter-spacing: .11em; }
.top-progress-meta span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--muted); }
body.screen-dark .top-progress-meta span { color: var(--muted-dark); }
.progress-track { height: 3px; overflow: hidden; background: rgba(100,95,84,.18); border-radius: 999px; }
.progress-track span { display: block; height: 100%; width: 0; background: var(--gold); transform-origin: left; transition: width .7s var(--expo); }
.utility-trigger { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border-radius: 50%; background: transparent; cursor: pointer; transition: background .3s var(--expo), transform .3s var(--expo); }
.utility-trigger:hover { background: rgba(200,168,92,.14); transform: rotate(4deg); }
.utility-trigger svg { width: 18px; fill: currentColor; }
.utility-trigger span { display: none; }

/* @section: chapter-rail */
.chapter-rail { display: none; }

/* @section: screen-stage */
.screens { position: relative; height: 100dvh; margin-left: var(--rail-w); overflow: hidden; background: var(--paper); transition: background .45s var(--expo); }
.screen {
  position: absolute; inset: 0; z-index: 0; display: flex; min-height: 100dvh;
  padding: calc(var(--topbar-h) + 1rem) 1rem calc(var(--bottom-h) + 1rem);
  overflow-y: auto; overscroll-behavior: contain; background: var(--paper); opacity: 0; transform: translate3d(5%,0,0); pointer-events: none;
  transition: opacity .52s var(--expo), transform .72s var(--expo);
  scrollbar-width: thin; scrollbar-color: var(--gold) transparent;
}
.screen[hidden] { display: flex !important; visibility: hidden; }
.screen.is-active { z-index: 2; opacity: 1; transform: translate3d(0,0,0); pointer-events: auto; visibility: visible; }
.screen.is-leaving-back { transform: translate3d(5%,0,0); }
.screen.is-entering-back { transform: translate3d(-5%,0,0); }
.screen.is-soft { background: var(--ivory); }
.screen.is-dark { color: var(--ivory); background: var(--ink); }
.screen-inner { width: min(1180px, 100%); margin: auto; }
.screen sup { font-size: .32em; vertical-align: top; margin-left: .1em; color: var(--gold); }
.screen.is-active .reveal-group { animation: revealUp .8s var(--expo) both; }
.screen.is-active .reveal-group:nth-child(2) { animation-delay: .08s; }
@keyframes revealUp { from { opacity: 0; transform: translate3d(0,22px,0); } to { opacity: 1; transform: translate3d(0,0,0); } }

/* @section: shared-typography */
.eyebrow, .step-label { margin: 0 0 .9rem; color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.gold { color: var(--gold-light) !important; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); letter-spacing: -.055em; text-wrap: balance; }
h2 { margin-bottom: 1rem; font-size: clamp(2.5rem, 10vw, 6.8rem); line-height: .94; font-weight: 650; }
h3 { font-size: clamp(1.45rem, 4vw, 2rem); line-height: 1.05; }
.chapter-heading > p:last-child { max-width: 540px; margin-bottom: 0; color: var(--muted); font-size: 1rem; }
.is-dark .chapter-heading > p:last-child { color: var(--muted-dark); }
.chapter-heading.compact { max-width: 770px; margin-bottom: 2rem; }
.chapter-heading.horizontal { display: grid; gap: 1.2rem; margin-bottom: 2rem; }
.chapter-heading.horizontal > p { max-width: 360px; align-self: end; }
.statement-accent { margin: -.3rem 0 0; color: var(--gold-deep); font: 500 italic clamp(2.2rem, 8vw, 5.3rem)/.95 var(--font-serif); letter-spacing: -.04em; }

/* @section: buttons */
.primary-cta {
  position: relative; display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-width: 220px; min-height: 62px;
  padding: .8rem .8rem .8rem 1.45rem; border-radius: 999px; background: var(--gold); color: var(--ink); cursor: pointer;
  font-weight: 800; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; overflow: hidden; transition: transform .35s var(--expo), box-shadow .35s var(--expo), background .35s var(--expo);
}
.primary-cta::before { content:""; position:absolute; inset:0; background:var(--gold-light); transform:translateX(-105%); transition:transform .5s var(--expo); }
.primary-cta:hover::before { transform: translateX(0); }
.primary-cta:hover { transform: translateY(-3px); box-shadow: 0 14px 40px rgba(200,168,92,.25); }
.primary-cta span, .primary-cta svg { position: relative; z-index: 1; }
.primary-cta svg { width: 38px; height: 38px; padding: 10px; border-radius: 50%; background: var(--ink); stroke: var(--ivory); fill: none; stroke-width: 1.7; }
.text-button { display: inline-flex; align-items: center; gap: .55rem; padding: .5rem 0; background: transparent; border-bottom: 1px solid var(--ink); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .12em; cursor: pointer; transition: gap .3s var(--expo), color .3s var(--expo); }
.text-button:hover { gap: .9rem; color: var(--gold-deep); }
.quiet-button { padding: .6rem 1rem; color: inherit; background: transparent; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }

/* @section: hero-screen */
.screen-hero { overflow: hidden; padding-bottom: calc(var(--bottom-h) + 1rem); }
.hero-media { position: absolute; inset: 0; overflow: hidden; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 65% center; transform: scale(1.04); animation: heroDrift 14s var(--quart) infinite alternate; }
@keyframes heroDrift { to { transform: scale(1.095) translate3d(-1%,0,0); } }
.hero-vignette { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,7,7,.97) 0%, rgba(7,7,7,.83) 43%, rgba(7,7,7,.25) 80%), linear-gradient(0deg, rgba(7,7,7,.74), transparent 45%); }
.hero-layout { position: relative; z-index: 1; display: grid; align-content: center; min-height: calc(100dvh - var(--topbar-h) - var(--bottom-h) - 2rem); padding: 1.35rem 0; }
.hero-copy { max-width: 760px; }
.hero-brand-lockup { display: inline-flex; align-items: center; gap: .7rem; margin-bottom: 1.25rem; }
.brand-emblem-hero { width: 46px; height: 46px; border-radius: 13px; box-shadow: 0 10px 30px rgba(0,0,0,.28); }
.hero-brand-lockup > span:last-child { display: block; line-height: 1.05; }
.hero-brand-lockup strong { display: block; color: var(--ivory); font: 700 .7rem/1 var(--font-display); letter-spacing: .035em; text-transform: uppercase; }
.hero-brand-lockup small { display: block; margin-top: .34rem; color: var(--gold-light); font: 500 italic .72rem/1 var(--font-serif); letter-spacing: .01em; }
.hero-title-lockup { width: min(100%, 710px); margin-bottom: 1.35rem; }
.hero-kicker { display: flex; align-items: center; gap: .9rem; margin-bottom: .3rem; color: rgba(255,255,255,.62); font: 600 clamp(.72rem,2vw,.98rem)/1 var(--font-display); text-transform: uppercase; letter-spacing: .22em; }
.hero-kicker::after { content:""; flex: 0 1 clamp(68px,18vw,180px); height: 1px; background: linear-gradient(90deg,var(--gold),transparent); }
.hero-copy h1 { display: grid; justify-items: start; margin: 0; font-size: clamp(3.75rem, 18vw, 10.5rem); line-height: .78; font-weight: 650; letter-spacing: -.085em; }
.hero-title-main,.hero-title-accent { display: block; white-space: nowrap; }
.hero-title-accent { position: relative; margin-top: .1em; padding-left: .28em; }
.hero-copy h1 em { color: var(--gold-light); font-family: var(--font-serif); font-weight: 500; }
.hero-copy h1 sup { position: absolute; top: .08em; right: -.65em; font-size: .18em; }
.hero-promise { max-width: 570px; margin-bottom: .7rem; font: 600 clamp(1.15rem,4.5vw,2.05rem)/1.1 var(--font-display); letter-spacing: -.035em; }
.hero-sub { max-width: 520px; margin-bottom: 1.45rem; color: rgba(255,255,255,.62); font-size: .88rem; }
.hero-facts { display: none; }

/* @section: welcome-screen */
.split-intro { display: grid; gap: 2rem; padding-block: 1.5rem; }
.welcome-intro { display: grid; gap: 1.5rem; }
.how-to-card { padding: 1.15rem; background: var(--ink); color: var(--ivory); border-radius: var(--radius-md); box-shadow: var(--shadow-soft); }
.how-to-heading { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: .8rem; padding-bottom: .9rem; border-bottom: 1px solid var(--line-dark); }
.how-to-heading .step-label { margin: 0; color: var(--gold-light); white-space: nowrap; }
.how-to-heading h3 { margin: 0; font-size: 1.05rem; letter-spacing: -.03em; }
.how-to-card ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.how-to-card li { display: grid; grid-template-columns: 30px 1fr; gap: .7rem; padding: .75rem 0; border-bottom: 1px solid var(--line-dark); }
.how-to-card li > span { padding-top: .15rem; color: var(--gold); font: 700 .6rem/1 var(--font-display); }
.how-to-card li p { margin: 0; color: var(--muted-dark); font-size: .72rem; }
.how-to-card li strong { display: block; margin-bottom: .12rem; color: var(--ivory); font-family: var(--font-display); font-size: .78rem; }
.saved-note { display: flex; align-items: center; gap: .55rem; margin: .8rem 0 0; color: var(--gold-light); font-size: .65rem; }
.saved-note span { display: grid; place-items: center; flex: 0 0 auto; width: 21px; height: 21px; background: var(--gold); color: var(--ink); border-radius: 50%; font-weight: 800; }
.benefit-stack { border-top: 1px solid var(--line); }
.benefit-row { position: relative; display: grid; grid-template-columns: 46px 1fr auto; gap: 1rem; align-items: center; min-height: 94px; padding: 1rem 0; border-bottom: 1px solid var(--line); transition: transform .35s var(--expo), border-color .35s var(--expo); }
.benefit-row:hover { transform: translateX(6px); border-color: var(--gold); }
.line-icon { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 50%; color: var(--gold-deep); }
.line-icon svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 1.4; }
.benefit-row strong { display: block; margin-bottom: .15rem; font-family: var(--font-display); font-size: 1.05rem; letter-spacing: -.025em; }
.benefit-row p { margin: 0; color: var(--muted); font-size: .82rem; }
.benefit-number { color: rgba(11,11,11,.25); font: 600 .65rem/1 var(--font-display); }

/* @section: diagnosis-screen */
.diagnosis-layout { padding-block: 1.5rem; }
.diagnosis-panel { display: grid; gap: 1.2rem; }
.check-stack { display: grid; gap: .65rem; }
.choice-check { position: relative; display: grid; grid-template-columns: 28px 1fr; align-items: center; gap: .85rem; min-height: 58px; padding: .75rem 1rem; background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: var(--radius-sm); cursor: pointer; transition: border-color .3s var(--expo), transform .3s var(--expo), background .3s var(--expo); }
.choice-check:hover { transform: translateX(4px); border-color: var(--gold); }
.choice-check input { position: absolute; opacity: 0; pointer-events: none; }
.fake-check { position: relative; width: 24px; height: 24px; border: 1px solid rgba(11,11,11,.28); border-radius: 7px; transition: background .25s var(--expo), border-color .25s var(--expo); }
.fake-check::after { content:""; position:absolute; width:8px; height:13px; left:7px; top:3px; border-right:2px solid var(--ink); border-bottom:2px solid var(--ink); transform:rotate(45deg) scale(0); transition:transform .3s var(--expo); }
.choice-check:has(input:checked) { background: #f1e9d6; border-color: var(--gold); }
.choice-check input:checked + .fake-check { background: var(--gold); border-color: var(--gold); }
.choice-check input:checked + .fake-check::after { transform: rotate(45deg) scale(1); }
.diagnosis-result { position: relative; min-height: 225px; display: flex; align-items: flex-end; overflow: hidden; padding: 1.5rem; color: var(--ivory); background: var(--ink); border-radius: var(--radius-md); }
.diagnosis-result > div { position: relative; z-index: 2; }
.diagnosis-result small { display:block; margin-bottom:.5rem; color:var(--gold-light); text-transform:uppercase; letter-spacing:.15em; font-size:.62rem; }
.diagnosis-result strong { display:block; margin-bottom:.55rem; font: 650 clamp(1.55rem,6vw,2.4rem)/1 var(--font-display); letter-spacing:-.045em; }
.diagnosis-result p { margin:0; max-width:420px; color:var(--muted-dark); font-size:.85rem; }
.result-orbit { position:absolute; width:210px; height:210px; right:-55px; top:-60px; border:1px solid rgba(200,168,92,.32); border-radius:50%; animation:orbit 18s linear infinite; }
.result-orbit i { position:absolute; border-radius:50%; background:var(--gold); }
.result-orbit i:nth-child(1){width:12px;height:12px;top:15px;left:55px}.result-orbit i:nth-child(2){width:6px;height:6px;right:13px;top:95px}.result-orbit i:nth-child(3){width:9px;height:9px;bottom:14px;left:70px}
@keyframes orbit { to { transform: rotate(360deg); } }
.system-map { display:flex; align-items:center; gap:.45rem; overflow-x:auto; padding:1.4rem .2rem .2rem; scrollbar-width:none; }
.system-map span { flex:0 0 auto; color:var(--muted); font-size:.68rem; white-space:nowrap; }
.system-map b { color:var(--gold-deep); }
.system-map i { flex:0 0 22px; height:1px; background:var(--line); }

/* @section: smart-bar-screen */
.bar-layout { padding-block: 1.5rem; }
.bar-builder { display:grid; gap:1.4rem; }
.bottle-checks { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.7rem; }
.bottle-card { position:relative; min-height:185px; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; padding:1rem .6rem; background:rgba(255,255,255,.045); border:1px solid var(--line-dark); border-radius:var(--radius-sm); cursor:pointer; overflow:hidden; transition:transform .35s var(--expo), border-color .35s var(--expo), background .35s var(--expo); }
.bottle-card:hover { transform:translateY(-5px); border-color:rgba(200,168,92,.65); }
.bottle-card input { position:absolute; opacity:0; }
.bottle-card:has(input:checked){ background:rgba(200,168,92,.13); border-color:var(--gold); }
.bottle-card strong{margin-top:.8rem;font-family:var(--font-display);font-size:.9rem}.bottle-card small{color:var(--muted-dark);font-size:.66rem}.mini-check{position:absolute;right:.7rem;top:.7rem;width:18px;height:18px;border:1px solid var(--line-dark);border-radius:50%}.bottle-card:has(input:checked) .mini-check{background:var(--gold);box-shadow:inset 0 0 0 4px var(--ink)}
.bottle-shape { position:relative; width:38px; height:82px; border:1px solid rgba(230,205,139,.75); border-radius:4px 4px 9px 9px; background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(230,205,139,.13),rgba(255,255,255,.02)); }
.bottle-shape::before{content:"";position:absolute;width:15px;height:24px;left:10px;top:-25px;border:1px solid rgba(230,205,139,.75);border-bottom:0;border-radius:3px 3px 0 0}.bottle-shape::after{content:"";position:absolute;inset:25px 5px 12px;border-top:1px solid rgba(230,205,139,.35);border-bottom:1px solid rgba(230,205,139,.35)}
.bottle-round{width:56px;border-radius:45% 45% 11px 11px}.bottle-wide{width:48px;height:76px}.bottle-square{width:52px;height:68px;border-radius:3px}.bottle-tall{width:33px;height:92px}
.bar-score { display:grid; grid-template-columns:120px 1fr; align-items:center; gap:1.3rem; min-height:150px; padding:1rem; border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark); }
.score-ring { width:112px;height:112px;display:grid;place-items:center;border-radius:50%;background:conic-gradient(var(--gold) 0%,rgba(255,255,255,.09) 0);transition:background .5s var(--expo); }
.score-ring::before{content:"";grid-area:1/1;width:94px;height:94px;border-radius:50%;background:var(--ink)}.score-ring>span{grid-area:1/1;z-index:1;text-align:center}.score-ring strong{display:block;font:700 1.6rem/1 var(--font-display)}.score-ring small{color:var(--muted-dark);font-size:.62rem}.bar-score>div:last-child small{display:block;margin-bottom:.5rem;color:var(--gold-light);font-size:.65rem;text-transform:uppercase;letter-spacing:.12em}.bar-score>div:last-child strong{font:600 1.1rem/1.2 var(--font-display)}
.dont-buy{display:grid;gap:.8rem;margin-top:1.8rem;padding-top:1.6rem;border-top:1px solid var(--line-dark)}.dont-buy h3{margin-bottom:0}.dont-buy article{padding:1rem;border:1px solid var(--line-dark);border-radius:var(--radius-sm)}.dont-buy article span{color:var(--gold);font-size:.62rem}.dont-buy article strong{display:block;margin:.4rem 0;font-family:var(--font-display)}.dont-buy article p{margin:0;color:var(--muted-dark);font-size:.78rem}

/* @section: balance-screen */
.formula-layout{padding-block:1.5rem}.balance-lab{display:grid;gap:1rem}.slider-panel,.balance-visual,.formula-key{padding:1.25rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md)}.slider-panel{display:grid;gap:1.25rem}.range-control>div{display:flex;align-items:center;justify-content:space-between}.range-control label{font:650 1rem/1 var(--font-display)}.range-control output{color:var(--gold-deep);font-size:.78rem;font-weight:700}.range-control small{display:block;margin-top:.3rem;color:var(--muted);font-size:.68rem}.range-control input{width:100%;height:5px;margin:.75rem 0 0;appearance:none;background:linear-gradient(90deg,var(--gold) 50%,var(--soft) 50%);border-radius:999px;cursor:pointer}.range-control input::-webkit-slider-thumb{appearance:none;width:26px;height:26px;border:7px solid var(--surface);border-radius:50%;background:var(--ink);box-shadow:0 2px 14px rgba(0,0,0,.16)}.range-control input::-moz-range-thumb{width:14px;height:14px;border:7px solid var(--surface);border-radius:50%;background:var(--ink);box-shadow:0 2px 14px rgba(0,0,0,.16)}
.balance-visual{min-height:310px;display:grid;grid-template-columns:110px 1fr;align-items:center;gap:1.4rem;background:var(--ink);color:var(--ivory);overflow:hidden}.cocktail-glass{width:95px;height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center}.glass-bowl{position:relative;width:95px;height:105px;overflow:hidden;border:2px solid rgba(255,255,255,.62);border-top-width:3px;border-radius:0 0 45% 45%}.glass-bowl>span{position:absolute;inset:auto 2px 2px;height:62%;background:linear-gradient(180deg,rgba(230,205,139,.55),rgba(156,122,49,.75));border-radius:0 0 45% 45%;transition:height .4s var(--expo),filter .4s var(--expo)}.ice{position:absolute;width:29px;height:29px;border:1px solid rgba(255,255,255,.42);transform:rotate(15deg);z-index:2}.ice-a{left:13px;bottom:20px}.ice-b{right:12px;bottom:34px;transform:rotate(-12deg)}.ice-c{left:38px;bottom:55px;transform:rotate(27deg)}.glass-stem{width:2px;height:54px;background:rgba(255,255,255,.62)}.glass-base{width:62px;height:2px;background:rgba(255,255,255,.62)}.balance-status small{display:block;margin-bottom:.7rem;color:var(--gold-light);font-size:.62rem;text-transform:uppercase;letter-spacing:.14em}.balance-status strong{display:block;margin-bottom:.6rem;font:650 clamp(1.5rem,6vw,2.4rem)/.98 var(--font-display);letter-spacing:-.05em}.balance-status p{margin:0;color:var(--muted-dark);font-size:.8rem}.balance-status[data-state="perfect"] strong{color:var(--gold-light)}
.formula-key{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem}.formula-key>div{display:flex;flex-direction:column;align-items:center;gap:.45rem}.formula-key>div span{display:block;width:100%;height:7px;background:linear-gradient(90deg,var(--gold) var(--level),var(--soft) var(--level));border-radius:999px}.formula-key small{color:var(--muted);font-size:.65rem}.formula-key p{grid-column:1/-1;margin:.7rem 0 0;padding-top:.8rem;border-top:1px solid var(--line);font-size:.78rem}

/* @section: menu-screen */
.menu-layout{padding-block:1.5rem}.recipe-grid{display:grid;gap:1rem}.recipe-card{overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);transition:transform .4s var(--expo),box-shadow .4s var(--expo)}.recipe-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-soft)}.recipe-image{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--ink)}.recipe-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--expo)}.recipe-card:hover img{transform:scale(1.045)}.recipe-image>span{position:absolute;left:1rem;top:1rem;padding:.4rem .7rem;background:var(--gold);border-radius:999px;font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.recipe-body{padding:1.25rem}.recipe-meta{display:flex;gap:.5rem;margin-bottom:.8rem}.recipe-meta span{padding:.3rem .55rem;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.62rem}.recipe-body h3{margin-bottom:.65rem}.recipe-body p{margin-bottom:1rem;color:var(--muted);font-size:.8rem}.recipe-body p strong{color:var(--ink)}

/* @section: method-screen */
.method-layout{padding-block:1.5rem}.timer-stage{display:grid;justify-items:center;gap:1rem;margin-bottom:1.5rem}.timer-ring{position:relative;width:210px;height:210px;display:grid;place-items:center}.timer-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}.timer-ring circle{fill:none;stroke-width:3}.timer-bg{stroke:rgba(255,255,255,.1)}.timer-progress{stroke:var(--gold);stroke-linecap:round;stroke-dasharray:326.73;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear}.timer-ring>div{text-align:center}.timer-ring strong{display:block;font:650 2.7rem/1 var(--font-display);letter-spacing:-.06em}.timer-ring small{display:block;margin-top:.45rem;color:var(--muted-dark);font-size:.66rem}.timer-actions{display:flex;gap:.7rem}.round-action{min-width:96px;min-height:42px;padding:.6rem 1rem;border:1px solid var(--line-dark);border-radius:999px;background:transparent;color:var(--ivory);cursor:pointer;font-size:.72rem;font-weight:700}.round-action.primary{background:var(--gold);border-color:var(--gold);color:var(--ink)}.prep-checklist{padding:1.1rem;background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:var(--radius-md)}.prep-heading{display:flex;justify-content:space-between;gap:1rem;align-items:end;margin-bottom:1rem}.prep-heading h3{margin:0}.prep-heading>span{color:var(--gold-light);font-weight:700}.prep-item{position:relative;display:grid;grid-template-columns:30px 1fr 24px;align-items:center;gap:.65rem;min-height:54px;border-top:1px solid var(--line-dark);cursor:pointer}.prep-item input{position:absolute;opacity:0}.prep-item>span{color:var(--muted-dark);font-size:.62rem}.prep-item strong{font-size:.8rem;font-weight:500}.prep-item i{width:20px;height:20px;border:1px solid var(--line-dark);border-radius:50%;transition:background .3s var(--expo)}.prep-item:has(input:checked) strong{text-decoration:line-through;color:var(--muted-dark)}.prep-item:has(input:checked) i{background:var(--gold);box-shadow:inset 0 0 0 5px var(--ink)}.ready-message{display:none;margin-top:1rem;padding:1.2rem;text-align:center;background:var(--gold);color:var(--ink);border-radius:var(--radius-sm)}.ready-message.is-visible{display:block;animation:revealUp .6s var(--expo)}.ready-message span{display:grid;place-items:center;width:34px;height:34px;margin:0 auto .6rem;background:var(--ink);color:var(--gold);border-radius:50%}.ready-message strong{display:block;font:700 1.25rem/1 var(--font-display)}.ready-message p{margin:.4rem 0 0;font-size:.75rem}

/* @section: experience-screen */
.experience-layout{padding-block:1.5rem}.experience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.experience-card{min-height:155px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:1rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);text-align:left;cursor:pointer;transition:transform .35s var(--expo),background .35s var(--expo),color .35s var(--expo),border-color .35s var(--expo)}.experience-card:hover{transform:translateY(-4px);border-color:var(--gold)}.experience-card.is-open{background:var(--ink);color:var(--ivory);border-color:var(--ink)}.card-index{color:var(--gold-deep);font-size:.62rem}.experience-card strong{display:block;margin-top:auto;font-family:var(--font-display);font-size:.9rem}.experience-card small{color:var(--muted);font-size:.65rem}.experience-card.is-open small{color:var(--muted-dark)}.card-line-art{position:relative;width:56px;height:45px;margin:.5rem auto}.card-line-art i{position:absolute;border:1px solid currentColor;opacity:.7}.decor i:first-child{width:35px;height:20px;border-radius:50%;left:0;top:10px;transform:rotate(-20deg)}.decor i:last-child{width:28px;height:10px;border-width:1px 0 0;right:0;bottom:5px;transform:rotate(25deg)}.ice-art i{width:28px;height:28px;transform:rotate(15deg)}.ice-art i:last-child{right:0;bottom:0;transform:rotate(-15deg)}.glass-art i:first-child{width:34px;height:28px;left:10px;border-radius:0 0 50% 50%}.glass-art i:last-child{height:16px;left:27px;bottom:0;border-width:0 0 0 1px}.music-art i:first-child{height:35px;left:15px;border-width:0 1px 0 0}.music-art i:last-child{width:16px;height:10px;border-radius:50%;left:0;bottom:0}.serve-art i:first-child{width:45px;height:18px;border-radius:50%;bottom:5px}.serve-art i:last-child{height:30px;right:3px;top:0;border-width:0 0 0 1px;transform:rotate(-20deg)}.words-art i{width:45px;height:28px;border-radius:50%}.words-art i:last-child{width:10px;height:10px;left:8px;bottom:6px;border-width:0 0 1px 1px;transform:rotate(-30deg)}.mini-guide{display:grid;grid-template-columns:54px 1fr;gap:1rem;margin-top:1rem;padding:1.3rem;background:#efe5cf;border-radius:var(--radius-md)}.guide-number{font:700 1.6rem/1 var(--font-display);color:var(--gold-deep)}.mini-guide h3{margin-bottom:.65rem}.mini-guide p{font-size:.8rem}.mini-guide strong{font-size:.72rem;color:var(--gold-deep)}

/* @section: final-checklist-screen */
.final-check-layout{padding-block:1.5rem}.final-check-card{padding:1.1rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}.final-check-top{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-bottom:.7rem;padding-bottom:.7rem;border-bottom:1px solid var(--line)}.final-check-top>span{color:var(--gold-deep);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.checklist-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.45rem}.quiet-button-gold{background:var(--gold);border-color:var(--gold)}.quiet-button:disabled,.primary-cta:disabled{opacity:.58;cursor:progress}.download-assurance{display:grid;grid-template-columns:34px 1fr;gap:.7rem;align-items:center;margin:.8rem 0 .4rem;padding:.85rem;background:#f4ecda;border-radius:var(--radius-sm)}.download-assurance>span{display:grid;place-items:center;width:32px;height:32px;background:var(--ink);color:var(--gold);border-radius:50%;font-weight:800}.download-assurance p{margin:0;color:var(--muted);font-size:.68rem}.download-assurance strong{display:block;margin-bottom:.12rem;color:var(--ink);font-family:var(--font-display);font-size:.75rem}.final-checks{display:grid}.final-checks label{position:relative;display:grid;grid-template-columns:27px 1fr;align-items:center;gap:.75rem;min-height:52px;border-bottom:1px solid var(--line);cursor:pointer}.final-checks input{position:absolute;opacity:0}.final-checks label>span{position:relative;width:23px;height:23px;border:1px solid rgba(11,11,11,.25);border-radius:7px}.final-checks label>span::after{content:"";position:absolute;width:7px;height:12px;left:7px;top:3px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg) scale(0);transition:transform .25s var(--expo)}.final-checks strong{font-size:.82rem;font-weight:500}.final-checks label:has(input:checked)>span{background:var(--gold);border-color:var(--gold)}.final-checks label:has(input:checked)>span::after{transform:rotate(45deg) scale(1)}.final-checks label:has(input:checked) strong{color:var(--muted);text-decoration:line-through}.completion-celebration{position:relative;display:none;overflow:hidden;margin-top:1rem;padding:2rem 1rem;text-align:center;background:var(--ink);color:var(--ivory);border-radius:var(--radius-sm)}.completion-celebration.is-visible{display:block;animation:celebrateIn .8s var(--expo)}@keyframes celebrateIn{0%{opacity:0;transform:scale(.92)}70%{transform:scale(1.02)}100%{opacity:1;transform:scale(1)}}.completion-celebration small{display:block;margin-bottom:.7rem;color:var(--gold-light);text-transform:uppercase;letter-spacing:.14em;font-size:.62rem}.completion-celebration strong{display:block;font:650 clamp(1.6rem,7vw,2.8rem)/1.05 var(--font-display);letter-spacing:-.05em}.completion-celebration p{margin:.8rem 0 0;color:var(--muted-dark);font-size:.78rem}.celebration-burst{position:absolute;inset:50% auto auto 50%;width:10px;height:10px;border-radius:50%;box-shadow:0 -85px var(--gold),60px -60px var(--gold-light),85px 0 var(--gold),60px 60px var(--gold-light),0 85px var(--gold),-60px 60px var(--gold-light),-85px 0 var(--gold),-60px -60px var(--gold-light);animation:burst 2.5s var(--expo) infinite}@keyframes burst{0%{transform:translate(-50%,-50%) scale(.2) rotate(0);opacity:0}25%{opacity:.8}100%{transform:translate(-50%,-50%) scale(1.2) rotate(80deg);opacity:0}}

/* @section: tools-screen */
.tools-layout{padding-block:1.5rem}.tool-tabs{display:flex;gap:.5rem;overflow-x:auto;padding:.2rem 0 1rem;scrollbar-width:none}.tool-tab{flex:0 0 auto;padding:.7rem 1rem;background:transparent;color:var(--muted-dark);border:1px solid var(--line-dark);border-radius:999px;cursor:pointer;font-size:.68rem;font-weight:700;transition:background .3s var(--expo),color .3s var(--expo)}.tool-tab.is-active{background:var(--gold);border-color:var(--gold);color:var(--ink)}.tools-stage{padding:1rem;background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:var(--radius-md)}.tool-panel{display:none}.tool-panel.is-active{display:grid;gap:1.5rem;animation:revealUp .55s var(--expo)}.tool-form label{display:block;margin-bottom:.8rem;font:600 1.35rem/1 var(--font-display);letter-spacing:-.03em}.tool-form>p:last-child{margin:.8rem 0 0;color:var(--muted-dark);font-size:.73rem}.number-input{display:grid;grid-template-columns:46px 1fr 46px;max-width:290px;background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:999px;overflow:hidden}.number-input button{background:transparent;color:var(--ivory);font-size:1.3rem;cursor:pointer}.number-input input,.currency-input input{min-width:0;padding:.65rem;border:0;outline:0;background:transparent;color:var(--ivory);font:700 1.8rem/1 var(--font-display);text-align:center;-moz-appearance:textfield}.number-input input::-webkit-inner-spin-button,.currency-input input::-webkit-inner-spin-button{-webkit-appearance:none}.tool-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.tool-results article{min-height:98px;padding:1rem;background:var(--ivory);color:var(--ink);border-radius:var(--radius-sm)}.tool-results small{display:block;margin-bottom:.75rem;color:var(--muted);font-size:.64rem;text-transform:uppercase;letter-spacing:.1em}.tool-results strong{font:650 1.4rem/1 var(--font-display);letter-spacing:-.04em}.tool-results article:first-child{grid-column:1/-1;background:var(--gold)}.ice-result{display:flex;align-items:center;gap:1.5rem;padding:1.5rem;background:var(--ivory);color:var(--ink);border-radius:var(--radius-sm)}.ice-cube-visual{position:relative;flex:0 0 72px;width:72px;height:72px;border:1px solid rgba(11,11,11,.35);transform:rotate(12deg);background:linear-gradient(135deg,rgba(200,168,92,.35),transparent)}.ice-cube-visual i{position:absolute;inset:10px;border:1px solid rgba(11,11,11,.16)}.ice-result small,.shopping-result>small,.generated-menu>small{display:block;color:var(--gold-deep);font-size:.62rem;text-transform:uppercase;letter-spacing:.13em}.ice-result strong{display:block;font:700 2rem/1 var(--font-display);letter-spacing:-.05em}.ice-result p{margin:.45rem 0 0;color:var(--muted);font-size:.72rem}.currency-input{display:flex;align-items:center;max-width:300px;border-bottom:1px solid var(--line-dark)}.currency-input span{color:var(--gold);font:700 1.8rem/1 var(--font-display)}.currency-input input{text-align:left}.shopping-result,.generated-menu{padding:1.4rem;background:var(--ivory);color:var(--ink);border-radius:var(--radius-sm)}.shopping-result h3,.generated-menu h3{margin:.5rem 0 1rem}.shopping-result ul{list-style:none;padding:0;margin:0}.shopping-result li{display:grid;grid-template-columns:52px 1fr;gap:.7rem;padding:.65rem 0;border-top:1px solid var(--line);font-size:.78rem}.shopping-result li span{color:var(--gold-deep);font-weight:700}.shopping-result p,.generated-menu p{margin:.8rem 0 0;color:var(--muted);font-size:.73rem}.menu-generator-form h3{margin:0 0 .55rem;color:var(--ivory);font-size:1.35rem}.menu-helper{max-width:430px;margin:0 0 1rem;color:var(--muted-dark);font-size:.72rem}.event-options{display:flex;flex-wrap:wrap;gap:.55rem}.event-options button{position:relative;padding:.72rem 1rem .72rem 2rem;background:transparent;color:var(--ivory);border:1px solid var(--line-dark);border-radius:999px;cursor:pointer;font-size:.7rem;transition:background .3s var(--expo),color .3s var(--expo),border-color .3s var(--expo),transform .3s var(--expo)}.event-options button::before{content:"";position:absolute;left:.75rem;top:50%;width:12px;height:12px;border:1px solid rgba(255,255,255,.34);border-radius:50%;transform:translateY(-50%);transition:background .25s var(--expo),box-shadow .25s var(--expo)}.event-options button:hover{border-color:var(--gold);transform:translateY(-2px)}.event-options button.is-selected{background:var(--gold);border-color:var(--gold);color:var(--ink);font-weight:700}.event-options button.is-selected::before{background:var(--ink);border-color:var(--ink);box-shadow:inset 0 0 0 3px var(--gold)}.menu-selection-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:430px;margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line-dark)}.menu-selection-meta>span{color:var(--gold-light);font-size:.65rem;font-weight:700}.clear-events{padding:.4rem 0;background:transparent;color:var(--muted-dark);border-bottom:1px solid currentColor;cursor:pointer;font-size:.65rem}.clear-events:disabled{opacity:.35;cursor:not-allowed}.generated-menu{position:relative;overflow:hidden}.generated-menu::after{content:"";position:absolute;width:150px;height:150px;right:-90px;top:-90px;border:1px solid rgba(200,168,92,.3);border-radius:50%;pointer-events:none}.generated-menu-heading{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:1rem}.generated-menu-heading>small{color:var(--gold-deep);font-size:.62rem;text-transform:uppercase;letter-spacing:.13em}.generated-menu-heading>span{padding:.32rem .55rem;background:var(--ink);color:var(--gold-light);border-radius:999px;font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.menu-list{position:relative;z-index:1;display:grid;gap:0;margin-top:1rem}.menu-pick{display:grid;grid-template-columns:32px 1fr;gap:.7rem;padding:.72rem 0;border-top:1px solid var(--line)}.menu-pick>span{color:var(--gold-deep);font-weight:800}.menu-pick strong{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;font-family:var(--font-display)}.menu-pick small,.menu-pick em{display:block;color:var(--muted);font-size:.65rem}.menu-pick em{margin-top:.12rem;color:var(--gold-deep);font-style:normal}.zero-badge{display:inline-block;padding:.2rem .4rem;background:#e7e1d2;color:var(--ink);border-radius:999px;font:700 .52rem/1 var(--font-body);letter-spacing:.04em}.generated-menu .menu-rule{margin-top:1rem;padding-top:.85rem;border-top:1px solid var(--line);font-size:.68rem}

/* @section: contextual-menu-recommender */
#tool-menu.tool-panel.is-active{display:block;min-height:0}.recommender-intro{display:grid;gap:.7rem;margin-bottom:1.2rem;padding-bottom:1.2rem;border-bottom:1px solid var(--line-dark)}.recommender-intro h3{margin:0;color:var(--ivory);font-size:clamp(1.45rem,4vw,2.35rem)}.recommender-intro>p{max-width:680px;margin:0;color:var(--muted-dark);font-size:.76rem}.recommender-layout{display:grid;gap:1rem}.menu-generator-form{display:grid;gap:.8rem}.recommender-step{padding:1rem;background:rgba(255,255,255,.035);border:1px solid var(--line-dark);border-radius:var(--radius-sm)}.recommender-step-heading{display:grid;grid-template-columns:32px 1fr;gap:.65rem;align-items:start;margin-bottom:.85rem}.recommender-step-heading>span{display:grid;place-items:center;width:28px;height:28px;border:1px solid rgba(200,168,92,.5);border-radius:50%;color:var(--gold-light);font:700 .58rem/1 var(--font-display)}.recommender-step-heading h4{margin:0;color:var(--ivory);font:650 1rem/1.1 var(--font-display);letter-spacing:-.03em}.recommender-step-heading p{margin:.2rem 0 0;color:var(--muted-dark);font-size:.66rem}.base-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.base-options button,.ingredient-options button{min-height:42px;padding:.6rem .75rem;background:transparent;color:var(--ivory);border:1px solid var(--line-dark);border-radius:10px;cursor:pointer;text-align:left;font-size:.68rem;transition:background .25s var(--expo),border-color .25s var(--expo),color .25s var(--expo),transform .25s var(--expo)}.base-options button:hover,.ingredient-options button:hover{border-color:var(--gold);transform:translateY(-1px)}.base-options button.is-selected,.ingredient-options button.is-selected{background:rgba(200,168,92,.18);border-color:var(--gold);color:var(--gold-light);font-weight:700}.base-options button.is-selected::before,.ingredient-options button.is-selected::before{content:"✓";margin-right:.4rem;color:var(--gold)}.ingredient-groups{display:grid;gap:.45rem}.ingredient-groups details{overflow:hidden;border:1px solid var(--line-dark);border-radius:10px;background:rgba(0,0,0,.12)}.ingredient-groups summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:44px;padding:.7rem .85rem;cursor:pointer;list-style:none;color:var(--ivory);font-size:.72rem;font-weight:700}.ingredient-groups summary::-webkit-details-marker{display:none}.ingredient-groups summary::after{content:"+";margin-left:auto;color:var(--gold);font-size:1rem}.ingredient-groups details[open] summary::after{content:"−"}.ingredient-groups summary small{order:2;display:grid;place-items:center;min-width:22px;height:22px;padding:0 .35rem;background:rgba(200,168,92,.14);color:var(--gold-light);border-radius:999px;font-size:.58rem}.ingredient-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;padding:0 .65rem .65rem}.menu-selection-meta>div{display:flex;flex-wrap:wrap;gap:.4rem}.menu-selection-meta>div span{padding:.3rem .5rem;background:rgba(200,168,92,.1);color:var(--gold-light);border-radius:999px;font-size:.58rem;font-weight:700}.generated-menu{min-width:0}.empty-guidance{display:grid;grid-template-columns:34px 1fr;gap:.7rem;align-items:center;margin-top:1.1rem;padding:.9rem;background:#eee4cf;border-radius:12px}.empty-guidance>span{display:grid;place-items:center;width:32px;height:32px;background:var(--ink);color:var(--gold);border-radius:50%;font-size:.65rem;font-weight:800}.empty-guidance p{margin:0!important;color:var(--ink)!important}.menu-plan-summary{position:relative;z-index:1;margin:1rem 0;padding:1rem;background:var(--ink);color:var(--ivory);border-radius:14px}.menu-plan-summary>small{display:block;margin-bottom:.65rem;color:var(--gold-light);font-size:.58rem;text-transform:uppercase;letter-spacing:.13em}.menu-plan-summary>div{display:grid;gap:.35rem}.menu-plan-summary span{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:.45rem;padding:.45rem 0;border-top:1px solid var(--line-dark);font-size:.7rem}.menu-plan-summary b{color:var(--gold);font-size:.58rem}.recommendation-sections{position:relative;z-index:1;display:grid;gap:1.2rem;margin-top:1.2rem}.recommendation-section{display:grid;gap:.7rem}.recommendation-section-heading{display:flex;align-items:end;justify-content:space-between;gap:1rem}.recommendation-section-heading h4{margin:0;font:650 1rem/1.1 var(--font-display);letter-spacing:-.03em}.recommendation-section-heading p{margin:.2rem 0 0;color:var(--muted);font-size:.63rem}.recommendation-section-heading>span{display:grid;place-items:center;flex:0 0 auto;width:28px;height:28px;background:#e9e0cb;color:var(--gold-deep);border-radius:50%;font-size:.62rem;font-weight:800}.recommendation-grid{display:grid;gap:.6rem}.recommendation-card{position:relative;padding:1rem;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 24px rgba(11,11,11,.045)}.recommendation-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;border-radius:14px 0 0 14px;background:var(--muted)}.recommendation-ready::before{background:var(--green)}.recommendation-near::before{background:var(--gold-deep)}.recommendation-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}.recommendation-card-top>strong{color:var(--gold-deep);font:700 1rem/1 var(--font-display)}.recommendation-status{padding:.28rem .5rem;background:#f0ece2;border-radius:999px;color:var(--muted);font-size:.53rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.recommendation-ready .recommendation-status{background:#e4eee8;color:var(--green)}.recommendation-near .recommendation-status{background:#f1e7ce;color:var(--gold-deep)}.recommendation-card h5{margin:.65rem 0 .5rem;font:650 1rem/1.05 var(--font-display);letter-spacing:-.035em}.recommendation-tags{display:flex;flex-wrap:wrap;gap:.35rem}.recommendation-tags span{padding:.25rem .42rem;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.54rem}.recommendation-card>p{margin:.65rem 0;color:var(--muted);font-size:.65rem}.recommendation-missing{padding:.6rem .7rem;background:var(--ivory);border-radius:9px}.recommendation-missing small{display:block;color:var(--gold-deep);font-size:.52rem;text-transform:uppercase;letter-spacing:.1em}.recommendation-missing strong{display:block;margin-top:.16rem;font-size:.62rem}.recommendation-detail{display:inline-flex;align-items:center;gap:.4rem;margin-top:.7rem;padding:.25rem 0;background:transparent;border-bottom:1px solid var(--ink);cursor:pointer;font-size:.58rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.recommendation-detail:hover{color:var(--gold-deep)}

@media (min-width:700px){.recommender-intro{grid-template-columns:1fr .9fr;align-items:end}.recommender-layout{grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);align-items:start}.menu-generator-form{position:sticky;top:calc(var(--topbar-h) + 1rem)}.base-options{grid-template-columns:repeat(5,minmax(0,1fr))}.base-options button{text-align:center;padding-inline:.4rem}.ingredient-options{grid-template-columns:repeat(2,minmax(0,1fr))}.generated-menu{min-height:520px}.recommendation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recommendation-section-ready .recommendation-card:first-child{grid-column:1/-1}.menu-plan-summary>div{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:1rem}.menu-plan-summary span:nth-child(2){border-top:1px solid var(--line-dark)}}
@media (min-width:1120px){#tool-menu.tool-panel.is-active{padding:.2rem}.recommender-layout{grid-template-columns:minmax(390px,.82fr) minmax(0,1.18fr);gap:1.35rem}.menu-generator-form{top:calc(var(--topbar-h) + .5rem)}.recommender-step{padding:1rem}.ingredient-options{grid-template-columns:repeat(3,minmax(0,1fr))}.recommendation-card{padding:1.05rem}.generated-menu{padding:1.5rem}}

/* @section: finale-screen */
.screen-finale{overflow:hidden}.finale-glow{position:absolute;width:min(90vw,700px);height:min(90vw,700px);left:50%;top:48%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(200,168,92,.15),transparent 65%);border:1px solid rgba(200,168,92,.15);border-radius:50%}.finale-layout{position:relative;z-index:1;padding-block:2rem;text-align:center}.finale-layout>h2{max-width:920px;margin-inline:auto;font-size:clamp(2.2rem,9vw,6.8rem);color:rgba(255,255,255,.55)}.finale-turn{margin:1.4rem 0}.finale-turn span{display:block;color:var(--muted-dark);font-size:.75rem;text-transform:uppercase;letter-spacing:.18em}.finale-turn strong{display:block;color:var(--gold-light);font:500 italic clamp(3.3rem,15vw,9rem)/.9 var(--font-serif);letter-spacing:-.06em}.finale-copy{max-width:500px;margin:0 auto 1.8rem;color:var(--ivory);font-size:clamp(1rem,3vw,1.3rem)}.finale-download{margin-inline:auto}.download-caption{max-width:420px;margin:.85rem auto 0;color:var(--muted-dark);font-size:.67rem}.finale-signature{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-top:1.5rem;text-align:left}.brand-emblem-signature{width:42px;height:42px;border-radius:12px}.finale-signature p{margin:0;font:600 .75rem/1.15 var(--font-display)}.finale-signature small{display:block;margin-top:.25rem;color:var(--gold-light);font-family:var(--font-serif);font-style:italic;font-weight:400}

/* @section: bottom-navigation */
.bottom-nav{position:fixed;z-index:60;inset:auto 0 0 0;height:var(--bottom-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem;padding:.65rem 1rem calc(.65rem + env(safe-area-inset-bottom));background:rgba(253,252,248,.92);backdrop-filter:blur(18px);border-top:1px solid var(--line);transition:background .45s var(--expo),color .45s var(--expo),border-color .45s var(--expo)}body.screen-dark .bottom-nav{background:rgba(11,11,11,.82);color:var(--ivory);border-color:var(--line-dark)}.nav-button{display:flex;align-items:center;gap:.45rem;min-height:42px;padding:.4rem;background:transparent;cursor:pointer;font-size:.7rem;font-weight:700}.nav-button svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.8}.nav-next{justify-self:end}.nav-button:disabled{opacity:.22;cursor:not-allowed}.screen-counter{display:flex;align-items:center;gap:.5rem;color:var(--muted);font:700 .65rem/1 var(--font-display)}body.screen-dark .screen-counter{color:var(--muted-dark)}.screen-counter i{width:32px;height:1px;background:currentColor}.screen-counter span:first-child{color:var(--gold-deep)}

/* @section: recipe-dialog */
.recipe-dialog{width:min(920px,calc(100% - 1.2rem));max-height:calc(100dvh - 1.2rem);padding:0;border:0;border-radius:var(--radius-md);background:var(--paper);color:var(--ink);box-shadow:0 40px 100px rgba(0,0,0,.4);overflow:hidden}.recipe-dialog::backdrop{background:rgba(0,0,0,.76);backdrop-filter:blur(9px)}.recipe-dialog[open]{animation:dialogIn .5s var(--expo)}@keyframes dialogIn{from{opacity:0;transform:translateY(30px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.dialog-close{position:absolute;z-index:3;right:.8rem;top:.8rem;width:42px;height:42px;background:rgba(11,11,11,.75);border-radius:50%;cursor:pointer}.dialog-close span{position:absolute;width:18px;height:1px;left:12px;top:21px;background:var(--ivory);transform:rotate(45deg)}.dialog-close span:last-child{transform:rotate(-45deg)}.dialog-scroll{max-height:calc(100dvh - 1.2rem);overflow-y:auto}.dialog-visual{position:relative;aspect-ratio:16/10;background:var(--ink)}.dialog-visual img{width:100%;height:100%;object-fit:cover}.dialog-visual>div{position:absolute;left:1rem;bottom:1rem;display:flex;gap:.4rem}.dialog-visual span{padding:.4rem .65rem;background:rgba(11,11,11,.75);color:var(--ivory);border-radius:999px;font-size:.62rem}.dialog-content{padding:1.5rem}.dialog-content h2{font-size:clamp(2.1rem,8vw,4.3rem)}.dialog-content>p{color:var(--muted)}.recipe-detail-grid{display:grid;gap:1.3rem;margin:1.5rem 0}.recipe-detail-grid h3{font-size:1.1rem}.recipe-detail-grid ul,.recipe-detail-grid ol{padding-left:1.2rem;color:var(--muted);font-size:.82rem}.recipe-detail-grid li{margin-bottom:.55rem}.dialog-content details{border-top:1px solid var(--line);padding:1rem 0}.dialog-content summary{cursor:pointer;font-weight:700}.dialog-content details p{margin:.7rem 0 0;color:var(--muted);font-size:.82rem}.dialog-content blockquote{margin:1rem 0 0;padding:1.4rem;background:var(--ink);color:var(--ivory);border-radius:var(--radius-sm)}.dialog-content blockquote small{color:var(--gold-light);text-transform:uppercase;letter-spacing:.12em}.dialog-content blockquote p{margin:.5rem 0 0;font:500 italic 1.25rem/1.25 var(--font-serif)}

/* @section: toast */
.toast{position:fixed;z-index:100;left:50%;bottom:calc(var(--bottom-h) + 1rem);display:flex;align-items:center;gap:.65rem;max-width:calc(100% - 2rem);padding:.8rem 1rem;background:var(--ink);color:var(--ivory);border:1px solid var(--line-dark);border-radius:999px;box-shadow:0 16px 50px rgba(0,0,0,.25);opacity:0;transform:translate(-50%,20px);pointer-events:none;transition:opacity .35s var(--expo),transform .35s var(--expo)}.toast.is-visible{opacity:1;transform:translate(-50%,0)}.toast span{display:grid;place-items:center;width:23px;height:23px;background:var(--gold);color:var(--ink);border-radius:50%;font-weight:800}.toast p{margin:0;font-size:.72rem;white-space:nowrap}

/* @section: tablet-layout */
@media (min-width: 700px) {
  :root{--topbar-h:82px;--bottom-h:82px}
  .topbar{padding-inline:1.5rem}.brand-copy{display:block}.utility-trigger{width:auto;padding:0 .8rem;border-radius:999px;grid-auto-flow:column;gap:.5rem}.utility-trigger span{display:block;font-size:.68rem;font-weight:700}
  .screen{padding:calc(var(--topbar-h) + 1.5rem) 2rem calc(var(--bottom-h) + 1.5rem)}
  .hero-copy h1{font-size:clamp(6.5rem,16vw,10.5rem)}.hero-brand-lockup{margin-bottom:1.5rem}.brand-emblem-hero{width:52px;height:52px}.hero-facts{position:absolute;right:0;bottom:2rem;display:flex;gap:2.2rem}.hero-facts div{padding-left:1rem;border-left:1px solid rgba(255,255,255,.25)}.hero-facts span,.hero-facts strong{display:block}.hero-facts span{color:var(--muted-dark);font-size:.62rem;text-transform:uppercase;letter-spacing:.14em}.hero-facts strong{margin-top:.2rem;font-size:.82rem}
  .chapter-heading.horizontal{grid-template-columns:1fr minmax(260px,.42fr);align-items:end}
  .diagnosis-panel{grid-template-columns:1.05fr .95fr}.diagnosis-result{min-height:100%}.system-map{justify-content:center}
  .bottle-checks{grid-template-columns:repeat(5,minmax(0,1fr))}.bar-builder{grid-template-columns:1fr 260px}.bar-score{grid-template-columns:1fr;text-align:center;justify-items:center;border:1px solid var(--line-dark);border-radius:var(--radius-md)}.dont-buy{grid-template-columns:1.15fr repeat(3,1fr);align-items:stretch}.dont-buy>div{padding-right:1rem}
  .balance-lab{grid-template-columns:1fr 1fr}.formula-key{grid-column:1/-1;grid-template-columns:repeat(3,1fr) 1.6fr;align-items:center}.formula-key p{grid-column:auto;margin:0;padding:0 0 0 1rem;border-top:0;border-left:1px solid var(--line)}
  .recipe-grid{grid-template-columns:1.2fr 1fr 1fr}.recipe-featured .recipe-image{aspect-ratio:4/3}
  .method-layout{display:grid;grid-template-columns:.7fr 1.3fr;grid-template-areas:"heading heading" "timer prep";gap:1.5rem}.method-layout>.chapter-heading{grid-area:heading}.timer-stage{grid-area:timer;margin:0;align-self:center}.prep-checklist{grid-area:prep}
  .experience-grid{grid-template-columns:repeat(3,1fr)}.experience-card{min-height:190px}.mini-guide{grid-template-columns:80px 1fr;padding:2rem}.guide-number{font-size:2.5rem}
  .final-check-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:2rem;align-items:start}.final-check-layout>.chapter-heading{position:sticky;top:calc(var(--topbar-h) + 2rem)}.final-check-card{padding:1.5rem}.final-checks{grid-template-columns:repeat(2,1fr);column-gap:1.5rem}.final-checks label:nth-last-child(1){grid-column:1/-1}
  .tool-panel.is-active{grid-template-columns:.7fr 1.3fr;align-items:center;min-height:330px}.tool-results{grid-template-columns:repeat(2,1fr)}.tool-results article:first-child{grid-column:auto;grid-row:span 2}.ice-result,.shopping-result,.generated-menu{min-height:250px;align-content:center}.ice-result{padding:2.5rem}.event-options{max-width:420px}
  .recipe-detail-grid{grid-template-columns:1fr 1fr}.dialog-content{padding:2.2rem}
}

/* @section: desktop-layout */
@media (min-width: 1120px) {
  :root{--rail-w:190px;--topbar-h:88px;--bottom-h:0px}
  .topbar{left:var(--rail-w);padding-inline:2rem}.top-progress{max-width:480px}.utility-trigger{padding-inline:1rem}
  .chapter-rail{position:fixed;z-index:70;inset:0 auto 0 0;width:var(--rail-w);display:flex;flex-direction:column;justify-content:center;gap:.2rem;padding:1.2rem;color:var(--muted-dark);background:#080808;border-right:1px solid var(--line-dark)}
  .rail-line{position:absolute;left:30px;top:calc(50% - 215px);width:1px;height:430px;background:rgba(255,255,255,.08)}.rail-line span{display:block;width:1px;height:0;background:var(--gold);transition:height .7s var(--expo)}
  .rail-item{position:relative;display:grid;grid-template-columns:28px 1fr;align-items:center;gap:.5rem;min-height:39px;padding:.3rem 0;background:transparent;color:inherit;text-align:left;cursor:pointer;transition:color .3s var(--expo),transform .3s var(--expo)}.rail-item::before{content:"";position:absolute;left:6px;width:7px;height:7px;border:1px solid currentColor;border-radius:50%;background:#080808;transform:scale(.7);transition:background .3s var(--expo),transform .3s var(--expo)}.rail-item span{grid-column:1;margin-left:17px;font-size:.53rem;opacity:0}.rail-item strong{grid-column:2;font-size:.62rem;font-weight:500;white-space:nowrap}.rail-item:hover{color:var(--ivory);transform:translateX(3px)}.rail-item.is-active{color:var(--gold-light)}.rail-item.is-active::before,.rail-item.is-complete::before{background:var(--gold);border-color:var(--gold)}.rail-item.is-active::before{transform:scale(1.2)}
  .screen{padding:calc(var(--topbar-h) + 2rem) clamp(2.5rem,5vw,5.8rem) 2rem}.screen-inner{min-height:calc(100dvh - var(--topbar-h) - 4rem);display:grid;align-content:center}
  .bottom-nav{position:fixed;left:var(--rail-w);right:0;bottom:1.25rem;width:max-content;height:auto;margin:auto;padding:.45rem .7rem;background:rgba(253,252,248,.84);border:1px solid var(--line);border-radius:999px;box-shadow:0 12px 40px rgba(0,0,0,.1)}body.screen-dark .bottom-nav{background:rgba(11,11,11,.72);border-color:var(--line-dark)}.nav-button{min-height:34px}.screen-counter i{width:46px}
  .split-intro{grid-template-columns:1fr 1fr;align-items:center;gap:clamp(3rem,7vw,7rem)}.welcome-intro{align-self:center}.welcome-intro>.chapter-heading{padding-top:0}.how-to-card{max-width:590px;padding:1.3rem}.benefit-row{min-height:86px}
  .chapter-heading.compact{margin-bottom:2.5rem}.diagnosis-layout,.bar-layout,.formula-layout,.menu-layout,.experience-layout,.tools-layout{padding-block:1rem}
  .balance-lab{grid-template-columns:.9fr 1.1fr}.slider-panel,.balance-visual,.formula-key{padding:1.6rem}.balance-visual{min-height:350px;grid-template-columns:150px 1fr}.cocktail-glass{transform:scale(1.2)}
  .recipe-image{aspect-ratio:4/3}.recipe-body{padding:1.35rem}
  .method-layout{grid-template-columns:.72fr 1.28fr;grid-template-areas:"heading prep" "timer prep";align-items:center}.method-layout>.chapter-heading{align-self:end}.timer-ring{width:230px;height:230px}.prep-checklist{padding:1.4rem}.prep-item{min-height:58px}
  .experience-layout{grid-template-columns:1fr}.experience-grid{grid-template-columns:repeat(6,1fr)}.experience-card{min-height:210px}.mini-guide{grid-template-columns:100px 1fr;max-width:900px}.mini-guide>div{display:grid;grid-template-columns:1fr 1.4fr;column-gap:2rem}.mini-guide .step-label,.mini-guide h3{grid-column:1}.mini-guide p,.mini-guide strong{grid-column:2}.mini-guide p{grid-row:1/3}
  .final-check-layout{grid-template-columns:.7fr 1.3fr;gap:5rem}.final-check-card{max-width:760px}.final-checks label{min-height:58px}
  .tools-stage{padding:1.7rem}.tool-panel.is-active{grid-template-columns:.72fr 1.28fr;gap:3rem}.tool-results{grid-template-columns:repeat(3,1fr)}.tool-results article:first-child{grid-column:auto;grid-row:span 2}.tool-results article:nth-child(2){grid-row:span 2}.tool-results article{min-height:110px}.tool-results strong{font-size:1.7rem}
  .finale-layout{min-height:calc(100dvh - var(--topbar-h) - 4rem)}
  .dialog-scroll{display:grid;grid-template-columns:.85fr 1.15fr}.dialog-visual{position:sticky;top:0;height:calc(100dvh - 2rem);aspect-ratio:auto}.dialog-content{padding:3rem;overflow-y:auto}
}

/* @section: widescreen-refinement */
@media (min-width: 1500px) {
  :root{--rail-w:220px}.chapter-rail{width:var(--rail-w);padding-inline:1.6rem}.rail-line{left:38px}.screen-inner{width:min(1300px,100%)}.hero-copy h1{font-size:11rem}.chapter-heading.horizontal{grid-template-columns:1fr 420px}
}

/* @section: motion-accessibility */
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.hero-media img{transform:none}.result-orbit,.celebration-burst{animation:none}
}

/* @section: print-checklist */
@media print {
  body{overflow:visible;background:white}.topbar,.chapter-rail,.bottom-nav,.screen:not([data-screen="8"]),.quiet-button,.ambient{display:none!important}.screens{height:auto;margin:0;overflow:visible}.screen[data-screen="8"]{position:static;display:block!important;visibility:visible!important;opacity:1!important;transform:none!important;overflow:visible;padding:1cm;background:white;color:black}.screen-inner{width:100%;min-height:0}.final-check-layout{display:block}.final-check-card{box-shadow:none;border:1px solid #ccc}.completion-celebration{display:none!important}.final-checks label{break-inside:avoid}
}