:root{color:#1e3932;background:#f2f0eb;font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--green: #006241;--green-dark: #1e3932;--green-accent: #00754a;--green-soft: #d4e9e2;--yellow: #f2cc54;--yellow-soft: #fff3bf;--paper: #fffdf8;--ink: #1e3932;--muted: #66756d;--line: #d9e1da;--red: #d85a4d;--red-soft: #fff0ed;--green-feedback: #369e59;--green-feedback-soft: #e9f7ea}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;background:#f2f0eb}button,a{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #f2cc54;outline-offset:3px}.page-shell{width:min(100%,500px);min-height:100vh;margin:0 auto;padding:22px 20px 28px;background:var(--paper);box-shadow:0 0 0 1px #1e39320f,0 26px 80px #1e39321c}.app-header{display:flex;align-items:center;gap:12px;padding:6px 3px 20px;border-bottom:1px solid var(--line)}.brand-mark{display:grid;width:46px;height:46px;place-items:center;border-radius:15px;background:var(--yellow-soft);font-size:27px}.app-header h1{margin:0;color:var(--green);font-size:22px;letter-spacing:-.03em}.app-header p{margin:3px 0 0;color:var(--muted);font-size:13px}.status-light{width:9px;height:9px;margin-left:auto;border-radius:50%;background:var(--green-feedback);box-shadow:0 0 0 4px var(--green-feedback-soft)}.welcome-section{padding:30px 0 0}.welcome-title{margin:0;color:var(--ink);font-size:clamp(30px,8vw,42px);font-weight:850;letter-spacing:-.08em;line-height:1.15}.welcome-copy{margin:11px 0 0;color:var(--muted);font-size:16px}.voice-button{position:relative;display:flex;width:min(100%,300px);aspect-ratio:1;flex-direction:column;align-items:center;justify-content:center;gap:11px;margin:28px auto 0;overflow:hidden;border:0;border-radius:50%;background:var(--green-accent);color:#fff;box-shadow:0 14px #00624114,0 22px 35px #00624133;transition:transform .18s ease,background .18s ease}.voice-button:hover{transform:translateY(-3px)}.voice-button:active{transform:scale(.98)}.voice-button--listening{background:var(--green)}.voice-button__halo{position:absolute;top:15%;right:15%;bottom:15%;left:15%;border:1px solid rgba(255,255,255,.2);border-radius:50%}.voice-button--listening .voice-button__halo{animation:pulse 1.4s ease-in-out infinite}.voice-button strong{z-index:1;font-size:24px;letter-spacing:-.05em}.voice-button small{z-index:1;color:#d4e5d9;font-size:14px}.mic-icon{z-index:1;width:54px;height:60px}.mic-icon svg{width:100%;height:100%;fill:none;stroke:#fff;stroke-linecap:round;stroke-linejoin:round;stroke-width:4.5}.heard-line{width:fit-content;margin:20px auto 0;padding:11px 18px;border-radius:999px;background:var(--green-soft);color:var(--muted);font-size:15px}.heard-line strong{margin-left:5px;color:var(--green)}.voice-notice{display:flex;align-items:flex-start;gap:9px;margin:18px auto 0;padding:12px 14px;border:1px solid #e6cf73;border-radius:14px;background:var(--yellow-soft);color:#66541a;font-size:14px;line-height:1.45}.voice-notice__icon{display:grid;flex:0 0 22px;width:22px;height:22px;place-items:center;border-radius:50%;background:var(--yellow);color:var(--green-dark);font-size:14px;font-weight:900}.quick-section{margin-top:35px}.section-heading-row{display:flex;align-items:baseline;justify-content:space-between}.section-heading-row h2{margin:0;font-size:20px;letter-spacing:-.04em}.section-heading-row span{color:var(--muted);font-size:13px}.quick-list{display:grid;gap:10px;margin-top:14px}.quick-drink{display:flex;align-items:center;gap:12px;width:100%;min-height:65px;padding:9px 15px 9px 10px;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);text-align:left;transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}.quick-drink:hover{border-color:var(--green);box-shadow:0 9px 20px #00624114;transform:translateY(-2px)}.quick-drink__icon{display:grid;width:43px;height:43px;place-items:center;border-radius:14px;background:var(--yellow-soft);font-size:23px}.quick-drink>span:nth-child(2){font-size:17px;font-weight:750}.quick-drink__arrow{margin-left:auto;color:var(--green);font-size:24px}.practice-entry{display:flex;align-items:center;gap:13px;width:100%;margin-top:19px;padding:16px 17px;border:1.5px solid var(--green);border-radius:18px;background:transparent;color:var(--green);text-align:left}.practice-entry:hover{background:var(--green-soft)}.practice-entry__icon{display:grid;width:41px;height:41px;place-items:center;border-radius:13px;background:var(--green-soft);font-size:24px}.practice-entry strong,.practice-entry small{display:block}.practice-entry strong{font-size:17px}.practice-entry small{margin-top:3px;color:var(--muted);font-size:13px}.practice-entry__arrow{margin-left:auto;font-size:24px}.recipe-panel{padding:25px 0 0}.recipe-panel__topline,.recipe-heading,.condition-row,.section-title,.result-title,.legend-row{display:flex;align-items:center}.recipe-panel__topline{justify-content:space-between}.eyebrow,.demo-note{color:var(--green);font-size:13px;font-weight:800}.demo-note{color:var(--muted);font-weight:500}.recipe-heading{justify-content:space-between;gap:15px;margin-top:12px}.recipe-heading h2{margin:0;font-size:36px;letter-spacing:-.08em}.recipe-heading p{margin:6px 0 0;color:var(--muted);font-size:14px}.drink-mark{display:grid;width:64px;height:64px;place-items:center;border-radius:22px;background:var(--yellow-soft);font-size:31px}.condition-row{flex-wrap:wrap;gap:8px;margin-top:20px}.condition-row span{padding:8px 12px;border-radius:10px;background:var(--green-soft);color:var(--green);font-size:14px;font-weight:750}.recipe-section{margin-top:24px}.section-title{gap:8px;color:var(--green);font-size:16px;font-weight:850}.section-dot{width:9px;height:9px;border-radius:50%;background:var(--green)}.section-dot--yellow{background:var(--yellow)}.ingredient-list{margin-top:10px;border-top:1px solid var(--line)}.ingredient-row{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:17px}.ingredient-row strong{color:var(--green)}.ingredient-name--lemon{color:#a17c00}.ingredient-name--green{color:var(--green)}.recipe-actions{display:grid;gap:10px;margin-top:20px}.recipe-panel--focused{padding-top:18px}.recipe-panel--focused .eyebrow{font-size:15px;letter-spacing:-.03em}.recipe-heading--focused{margin-top:7px}.recipe-heading--focused h2{color:var(--green);font-size:clamp(42px,12vw,62px);line-height:1}.recipe-heading--focused p{font-size:15px}.recipe-panel--focused .drink-mark{width:70px;height:70px;font-size:34px}.recipe-panel--focused .condition-row{gap:9px;margin-top:18px}.recipe-panel--focused .condition-row span{padding:11px 15px;border-radius:13px;font-size:16px}.recipe-panel--ingredients-only{padding-top:18px}.recipe-panel--ingredients-only .eyebrow{font-size:15px;letter-spacing:-.03em}.recipe-panel--ingredients-only .recipe-heading{margin-top:7px}.recipe-panel--ingredients-only .condition-row{gap:9px;margin-top:18px}.recipe-panel--ingredients-only .condition-row span{padding:11px 15px;border-radius:13px;font-size:16px}.variant-picker{margin-top:22px;padding:17px;border:2px solid var(--green);border-radius:20px;background:var(--green-soft)}.variant-picker__heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.variant-picker__heading .section-title{font-size:19px}.variant-picker__heading p{margin:5px 0 0;color:var(--muted);font-size:13px}.variant-picker__heading>strong{display:grid;min-width:84px;height:42px;padding:0 10px;place-items:center;border-radius:13px;background:var(--yellow);color:var(--green-dark);font-size:14px;white-space:nowrap}.variant-choice{margin-top:17px}.variant-choice>span{display:block;color:var(--green-dark);font-size:14px;font-weight:850}.variant-options{display:flex;gap:8px;margin-top:9px}.variant-option{display:flex;min-height:54px;flex:1;align-items:center;justify-content:center;gap:7px;padding:8px 10px;border:1.5px solid #b8ccb9;border-radius:14px;background:#fff;color:var(--green);font-size:17px;font-weight:850}.variant-option:hover{border-color:var(--green);background:#fbfdf8}.variant-option--selected{border-color:var(--green);background:var(--green);color:#fff;box-shadow:0 0 0 2px #0062411f}.variant-option--selected:hover{background:var(--green-dark)}.variant-option span{font-size:18px}.variant-picker__hint{margin:15px 0 0;color:var(--muted);font-size:13px}.recipe-section--ingredients{margin-top:25px}.recipe-section--ingredients .section-title{font-size:18px}.ingredient-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.ingredient-grid--large{gap:12px}.ingredient-tile--large{display:flex;min-height:116px;flex-direction:column;justify-content:space-between;gap:4px;padding:14px;border:1px solid #dce5dc;border-radius:18px;background:#fff;box-shadow:0 7px 14px #1e39320d}.ingredient-tile__topline{display:flex;align-items:center;justify-content:space-between;gap:8px}.ingredient-group{color:var(--muted);font-size:12px;font-weight:750}.ingredient-dot{width:9px;height:9px;border-radius:50%;background:#b6c3b8}.ingredient-dot--lemon{background:var(--yellow)}.ingredient-dot--green{background:var(--green-feedback)}.ingredient-dot--neutral{background:#b6c3b8}.ingredient-label{display:block;margin-top:13px;font-size:20px;font-weight:850}.ingredient-tile--large strong{color:var(--green);font-size:22px;letter-spacing:-.04em}.serve-note{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;padding:14px 15px;border-left:4px solid var(--yellow);background:var(--yellow-soft);color:#66541a;font-size:14px;line-height:1.5}.serve-note strong{flex:0 0 auto;font-size:14px;white-space:nowrap}.button{min-height:56px;border-radius:16px;font-size:17px;font-weight:850;transition:transform .18s ease,background .18s ease}.button:active{transform:scale(.985)}.button--primary{border:1px solid var(--green-accent);background:var(--green-accent);color:#fff}.button--primary:hover{background:var(--green-dark)}.button--outline{border:1.5px solid var(--green);background:transparent;color:var(--green)}.button--outline:hover{background:var(--green-soft)}.button--wide{width:100%;margin-top:25px}.page-shell--practice{padding-bottom:24px}.back-link{display:grid;width:43px;height:43px;place-items:center;border-radius:13px;background:var(--green-soft);color:var(--green);font-size:28px;text-decoration:none}.practice-count{margin-left:auto;color:var(--muted);font-size:14px;font-weight:750}.practice-section{padding-top:24px}.question-card{position:relative;padding:23px 22px 20px;border-radius:22px;background:var(--yellow-soft);overflow:hidden}.question-card__leaf{position:absolute;top:12px;right:18px;color:#c7a520;font-size:28px}.question-card h2{margin:0;font-size:clamp(28px,7vw,36px);letter-spacing:-.08em}.question-card p{margin:10px 0 0;color:#71632b;font-size:15px}.option-groups{margin-top:24px}.group-label{margin:0 0 10px;color:var(--muted);font-size:14px;font-weight:750}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.option{position:relative;display:flex;min-height:73px;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:10px 38px 10px 14px;border:1.5px solid #c8d5c8;border-radius:16px;background:#fff;color:var(--ink);text-align:left}.option:hover:not(:disabled){border-color:var(--green);background:#fbfdf8}.option>span:first-child{font-size:17px;font-weight:800}.option small{color:var(--muted);font-size:12px}.option--selected{border-color:var(--green);background:var(--green);color:#fff}.option--selected small{color:#d5e7da}.option--correct{border-color:var(--green-feedback);background:var(--green-feedback-soft);color:#1c7037}.option--missing{border-color:#dfbd3b;background:var(--yellow-soft);color:#805f00}.option--extra{border-color:var(--red);background:var(--red-soft);color:#a03e35}.option--neutral{border-color:var(--line);background:#fafbf8;color:#a0aaa2}.option-status{position:absolute;top:13px;right:13px;font-size:20px;font-weight:900}.answer-result{margin-top:22px;padding:16px;border:1px solid var(--line);border-radius:17px;background:#fff}.result-title{align-items:flex-start;gap:12px}.result-face{display:grid;flex:0 0 34px;width:34px;height:34px;place-items:center;border-radius:50%;background:var(--green-feedback);color:#fff;font-size:21px;font-weight:900}.result-title strong,.result-title span{display:block}.result-title strong{font-size:18px}.result-title span{margin-top:4px;color:var(--muted);font-size:13px;line-height:1.4}.legend-row{flex-wrap:wrap;gap:12px;margin-top:15px;color:var(--muted);font-size:12px}.legend-row span{display:inline-flex;align-items:center;gap:5px}.legend-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green-feedback)}.legend-dot--yellow{background:#dfbd3b}.legend-dot--red{background:var(--red)}.return-link{display:block;margin-top:18px;color:var(--green);font-size:15px;font-weight:750;text-align:center;text-decoration:none}.return-link:hover{text-decoration:underline}.page-footer{margin-top:27px;color:#95a096;font-size:12px;text-align:center}@keyframes pulse{0%,to{transform:scale(.95);opacity:.55}50%{transform:scale(1.08);opacity:1}}@media(max-width:430px){.page-shell{padding-right:16px;padding-left:16px}.voice-button{width:min(100%,260px)}.recipe-heading h2{font-size:31px}}@media(max-width:360px){.variant-picker{padding:14px}.variant-picker__heading{align-items:center}.variant-picker__heading>strong{min-width:76px;padding:0 8px;font-size:12px}.variant-options{gap:6px}.variant-option{padding-right:5px;padding-left:5px;font-size:15px}.ingredient-tile--large{padding:12px}.ingredient-label{font-size:18px}.ingredient-tile--large strong{font-size:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
