.flow-body{background:var(--red)}.flow{flex-direction:column;min-height:100dvh;display:flex}.flow-header{width:100%;max-width:640px;padding:8px var(--gutter);align-items:center;gap:4px;margin-inline:auto;display:flex}.flow-header__home{align-items:center;min-height:44px;margin-right:auto;display:inline-flex}.flow-header__home .logo{width:auto;height:28px}.icon-btn{width:48px;height:48px;color:var(--white);background:0 0;border:0;border-radius:50%;place-items:center;display:inline-grid}.icon-btn:hover{background:#00000026}.icon-btn .icon{width:26px;height:26px}#sound-toggle .icon--on,#sound-toggle[aria-pressed=true] .icon--off{display:none}#sound-toggle[aria-pressed=true] .icon--on{display:block}.flow-progress{width:100%;max-width:640px;padding:0 var(--gutter) 8px;align-items:center;gap:12px;margin-inline:auto;display:flex}.flow-progress__track{background:#00000040;border-radius:999px;flex:1;height:10px;overflow:hidden}.flow-progress__fill{width:var(--progress,16%);border-radius:inherit;background:var(--yellow);height:100%;transition:width .35s var(--ease-out);display:block}.flow-progress__text{min-width:3.5em;font-family:var(--font-display);text-align:right;font-size:.9rem}.flow-main{width:100%;max-width:640px;padding:8px var(--gutter) 40px;flex:1;margin-inline:auto}.step:not([hidden]){animation:step-in .32s var(--ease-out)}@keyframes step-in{0%{opacity:0;transform:translateY(10px)}}@media (prefers-reduced-motion:reduce){.step:not([hidden]){animation-name:step-fade}@keyframes step-fade{0%{opacity:0}}}.card{border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:24px 20px}.card h2{font-size:clamp(1.7rem,7vw,2.2rem)}.card h2:focus{outline:none}.card>p{margin-top:12px}.card--center{text-align:center}.card--center .badge-18{margin:0 auto 16px}.badge-18--big{width:72px;height:72px;color:var(--red);border-width:5px;font-size:1.4rem}.badge-18--small{border-width:2px;width:32px;height:32px;font-size:.7rem}.stack{gap:12px;margin-top:24px;display:grid}.fine{color:var(--muted);margin-top:16px;font-size:.88rem}.question{border:0;min-width:0;margin:0;padding:0}.question legend{margin-bottom:18px;padding:0}.question--sub{margin-top:20px}.question__sub{font-family:var(--font-display);color:var(--red);font-size:1.1rem}.question__help{color:var(--muted);margin:6px 0 18px}.choices{gap:10px;display:grid}@media (width>=400px){.choices--cols-2{grid-template-columns:1fr 1fr}}.choice{cursor:pointer;-webkit-tap-highlight-color:transparent;display:block;position:relative}.choice__input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.choice__box{border:3px solid var(--black);border-radius:var(--radius);background:var(--white);height:100%;min-height:64px;color:var(--black);transition:background-color .15s, transform .15s var(--ease-out), box-shadow .15s;align-items:center;gap:14px;padding:12px 14px;display:flex}.choices--compact .choice__box{min-height:52px;padding-block:8px}.choice:hover .choice__box{box-shadow:4px 4px 0 var(--black);transform:translate(-1px,-1px)}.choice__input:checked+.choice__box{background:var(--yellow);box-shadow:4px 4px 0 var(--black)}.choice__input:focus-visible+.choice__box{outline:3px solid var(--black);outline-offset:3px}.choice__icon{flex:none;width:32px;height:32px}.choice__text{flex:1;gap:2px;display:grid}.choice__label{font-family:var(--font-display);font-size:1.1rem;line-height:1.15}.choice__hint{font-size:.88rem;line-height:1.3}.choice__check{border:2.5px solid var(--black);color:#0000;border-radius:50%;flex:none;width:26px;height:26px;padding:4px}.choice__input[type=checkbox]+.choice__box .choice__check{border-radius:7px}.choice__input:checked+.choice__box .choice__check{background:var(--black);color:var(--yellow)}.step-nav{grid-template-columns:auto 1fr;gap:10px;margin-top:24px;display:grid}.step-nav__back{--btn-fg:var(--black);padding-inline:1em}.step-nav__next{grid-column:2}.step-error{border-left:5px solid var(--red);background:var(--grey-100);margin-top:16px;padding:10px 14px;font-weight:700}.step--shake{text-align:center;justify-items:center;display:grid}.step--shake h2{font-size:clamp(2rem,9vw,2.8rem)}.step--shake h2:focus{outline:none}.ingredients{flex-wrap:wrap;justify-content:center;gap:8px;max-width:34em;margin:16px 0 0;padding:0;list-style:none;display:flex}.ingredients li{background:var(--black);color:var(--white);border-radius:999px;padding:6px 12px;font-size:.88rem;font-weight:700}.shake-stage{width:min(64vw,280px);margin:20px 0 12px}.shake-actions{justify-items:center;gap:8px;width:100%;display:grid}.shake-btn{min-width:min(100%,280px)}.shake-hint{align-items:center;gap:8px;font-weight:700;display:flex}.flow[data-busy] .shake-actions{visibility:hidden}.result-head{text-align:center;margin-bottom:20px}.result-head h2{margin-top:6px;font-size:clamp(2.2rem,10vw,3rem)}.result-head h2:focus{outline:none}.result-source{border-radius:var(--radius-sm);background:var(--black);max-width:30em;color:var(--white);margin:12px auto 0;padding:10px 14px;font-size:.92rem}.result-actions{justify-items:center;gap:12px;max-width:480px;margin:36px auto 0;display:grid}.result-rg{align-items:center;gap:8px;margin-top:-2px;display:flex}.result-rg a{align-items:center;min-height:44px;font-weight:700;display:inline-flex}.result-actions__row{grid-template-columns:1fr 1fr;gap:10px;width:100%;display:grid}.result-actions__row .btn{padding-inline:.8em;font-size:.98rem}.demo-info{border-radius:var(--radius);border:2px dashed #ffffffb3;max-width:480px;margin:32px auto 0;padding:14px 16px;font-size:.92rem}.demo-info summary{cursor:pointer;align-items:center;min-height:44px;font-weight:700;display:flex}.demo-info dl{grid-template-columns:auto 1fr;gap:6px 14px;margin:10px 0 16px;display:grid}.demo-info dt{font-weight:700}.demo-info dd{margin:0}.toast{left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:50;width:max-content;max-width:calc(100% - 2 * var(--gutter));border-radius:var(--radius-sm);background:var(--black);color:var(--white);box-shadow:var(--shadow);padding:12px 18px;font-weight:700;position:fixed;transform:translate(-50%)}.dialog{width:min(100% - 2 * var(--gutter), 440px);border-radius:var(--radius-lg);background:0 0;border:0;padding:0}.dialog::backdrop{background:#0009}.dialog__body{border-radius:var(--radius-lg);padding:28px 22px 22px}.dialog__body h2{font-size:1.8rem}.dialog__body>p{margin-top:12px}.dialog__url{border-radius:var(--radius-sm);background:var(--grey-100);word-break:break-all;flex-wrap:wrap;gap:6px;padding:10px 12px;font-weight:700;display:flex}.dialog__body .fine{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.dialog__body .fine .badge-18{color:var(--red)}.dialog form{margin-top:20px}.flow-band{font-size:.8rem}