body.welcome-guide-open{overflow:hidden}
dialog.welcome-guide{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:hidden;color:var(--green-dark,#164a2d)}
dialog.welcome-guide::backdrop{background:transparent}
.welcome-guide-veil{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.welcome-guide .welcome-guide-card{display:flex;flex-direction:column;overflow:hidden}
.welcome-guide-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:3px;margin:-3px}
.welcome-guide .welcome-guide-actions,.welcome-guide .welcome-guide-other{flex-shrink:0}
.welcome-guide-card{position:absolute;box-sizing:border-box;width:380px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;padding:24px;border:1px solid #dbe7d5;border-radius:20px;background:#fbfdf8;box-shadow:0 16px 64px #0c302340;text-align:left}
.welcome-guide-top{display:flex;align-items:center;justify-content:space-between;gap:16px;color:#59695c;font-size:13px;font-weight:600}
.welcome-guide-top button{padding:8px 0 8px 16px;min-height:44px;border:0;background:none;color:#247b46;font:inherit;text-decoration:underline;cursor:pointer}
.welcome-guide-progress{display:flex;gap:5px;margin:3px 0 22px}
.welcome-guide-progress i{flex:1;height:4px;border-radius:4px;background:#dce7d7}.welcome-guide-progress .is-done{background:#247b46}
.welcome-guide-logo{display:block;width:145px;height:auto;margin:0 0 20px}
#welcome-guide-title{margin:0 0 10px;font-size:28px;line-height:1.2;color:#164a2d;outline:none}
#welcome-guide-description{margin:0 0 22px;font-size:17px;line-height:1.6;color:#334c3e}
.welcome-guide-options{display:flex;flex-direction:column;gap:10px;margin:0 0 22px;padding:0;border:0}
.welcome-guide-options legend{margin-bottom:12px;font-size:14px;font-weight:700;color:#164a2d}
.welcome-guide-options label{display:flex;align-items:center;gap:11px;min-height:50px;padding:12px;border:1px solid #cadbc4;border-radius:11px;background:#fff;font-size:16px;line-height:1.4;cursor:pointer}
.welcome-guide-options label:has(input:checked){border-color:#247b46;background:#e8f4e7}
.welcome-guide-options input{flex:none;width:19px;height:19px;margin:0;accent-color:#247b46}
.welcome-guide-actions{display:flex;align-items:stretch;gap:10px;margin-top:6px}
.welcome-guide-actions .primary{flex:1;min-width:0;min-height:50px;padding:13px 16px;font-size:15px;line-height:1.4;white-space:normal}
.welcome-guide-actions .text{flex:none;padding:12px 0;min-width:52px;font-size:14px}
.welcome-guide-other{display:block;width:100%;min-height:44px;margin:10px 0 0;text-align:center;font-size:14px}
.welcome-guide-recipe{display:flex;align-items:center;gap:14px;margin:0 0 22px;padding:12px;border:1px solid #dce7d7;border-radius:12px;background:#e8f4e7}
.welcome-guide-recipe img{flex:none;width:64px;height:64px;border-radius:9px;object-fit:cover}
.welcome-guide-recipe strong,.welcome-guide-recipe span{display:block}.welcome-guide-recipe strong{font-size:16px;line-height:1.35}.welcome-guide-recipe span{margin-top:5px;font-size:14px;color:#59695c}
.welcome-guide-note{margin:-8px 0 18px;font-size:13px;line-height:1.5;color:#59695c}
.welcome-guide-water{display:flex;align-items:flex-start;gap:12px;margin:0 0 20px}
.welcome-guide-water p{margin:0;font-size:16px;line-height:1.5;color:#334c3e}
.welcome-guide-water-icon{display:grid;place-items:center;flex:none;width:44px;height:44px;border:3px solid #f3d783;border-radius:50%;background:#12679b;color:white}
.welcome-guide-water-icon svg{width:29px;height:29px}
.welcome-guide-water+.welcome-guide-options legend{font-size:16px;line-height:1.4}
.comfortable-reading #welcome-guide-title{font-size:31px}
.comfortable-reading #welcome-guide-description{font-size:20px;line-height:1.6}
.comfortable-reading .welcome-guide-options label{font-size:18px}
.comfortable-reading .welcome-guide-actions .primary{font-size:17px}
.comfortable-reading .welcome-guide-water p{font-size:18px}
.welcome-guide button:focus-visible,.welcome-guide input:focus-visible{outline:3px solid #b4822b;outline-offset:3px}
@media(max-width:800px){
 .welcome-guide-card{width:calc(100vw - 32px);padding:20px;max-height:calc(100dvh - 130px - env(safe-area-inset-bottom,0px))}
 .welcome-guide[data-stage="0"] .welcome-guide-card,.welcome-guide[data-stage="5"] .welcome-guide-card{max-height:calc(100dvh - 32px - env(safe-area-inset-bottom,0px))}
 #welcome-guide-title{font-size:26px}.welcome-guide-progress{margin-bottom:18px}
}