/* Hanip Choice common visual layer. Individual categories override --choice-accent only. */
:root{--choice-accent:#f2d7a7;--gold:var(--choice-accent)}
/* Keep the original shared background and diagonal pattern from choice.css. */
/* Header and navigation use the unchanged shared site palette. */
main{max-width:940px;margin:0 auto;padding:23px 24px 70px}.kicker,.number{color:var(--choice-accent);font-size:12px;font-weight:800;letter-spacing:.08em}
.choice-intro{text-align:center;padding:36px 10px 38px;min-height:215px;display:flex;flex-direction:column;align-items:center;justify-content:center}.choice-intro h1{font-size:clamp(34px,5vw,46px);letter-spacing:-2px;margin:12px 0 15px;line-height:1.25}.choice-intro h1 em{color:var(--choice-accent);font-style:normal}.choice-intro .intro{color:#cbc2c0;font-size:15px;line-height:1.8;margin:0}
.choice-questions{max-width:790px;margin:auto}.choice-questions .step{background:none;border:0;border-bottom:1px solid #ffffff16;border-radius:0;margin:0;padding:24px 0 29px}.choice-questions .step:first-child{border-top:1px solid #ffffff16}.choice-questions .step .number{display:inline-block;min-width:32px;vertical-align:baseline}.choice-questions .step h2{display:inline;font-size:21px;letter-spacing:-.6px;margin:0}.choice-questions .step .hint{margin:4px 0 18px 35px;font-size:13px;color:#b3aab0}.choice-questions .options{display:flex;flex-wrap:wrap;gap:10px;padding-left:35px}.choice-questions .option{width:auto;min-height:46px;border:1px solid #534747;background:#2b2629;color:#ded7d5;border-radius:11px;padding:11px 20px;cursor:pointer;font:inherit;text-align:center}.choice-questions .option:hover{border-color:var(--choice-accent);background:#3c3332}.choice-questions .option[aria-pressed=true]{background:color-mix(in srgb,var(--choice-accent) 28%,#292428);border-color:var(--choice-accent);color:#fff;font-weight:800}.choice-questions .primary{background:var(--choice-accent);color:#282018;border:1px solid var(--choice-accent);border-radius:13px;padding:16px 43px;font:inherit;font-weight:800;cursor:pointer}.choice-questions #pickArea{text-align:center;padding:35px 10px}.choice-questions #pickArea .primary{width:auto;margin:0}.choice-questions .foot{font-size:13px;color:#aaa4ac}
.overlay{background:#0e0d10e8;backdrop-filter:blur(13px)}.panel{background:radial-gradient(ellipse at 90% 0%,color-mix(in srgb,var(--choice-accent) 11%,transparent),transparent 55%),#211d20;border:1px solid #66534b;border-radius:20px;padding:32px}.panel h2{font-size:clamp(28px,5vw,37px);letter-spacing:-1.5px;margin:8px 0}.results{gap:12px}.result-card{background:linear-gradient(110deg,#302825,#272326);border:1px solid #5d4b3c;border-radius:13px}.result-art{background:linear-gradient(135deg,color-mix(in srgb,var(--choice-accent) 32%,#242124),#292832)}.result-copy small{color:var(--choice-accent)}.close{border-color:#ffffff40}.panel .primary{width:100%;margin-top:18px}
@media(max-width:600px){nav{padding:16px 18px}.links{gap:14px}main{padding:18px 17px 60px}.choice-intro{min-height:190px;padding:26px 4px}.choice-questions .step h2{font-size:18px}.choice-questions .step .hint{margin-left:26px}.choice-questions .options{padding-left:26px;gap:8px}.choice-questions .option{padding:10px 14px}.panel{padding:20px}}

/* Navigation colors must never inherit a content category accent. */
header .logo,header .links a{color:inherit}header .links a.current{color:#f2d7a7}header .links a:not(.current){color:#c9c7d0}

/* v4: shared, single-row site navigation; only the Choice tab is active. */
header nav{max-width:940px;margin:0 auto;padding:17px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:nowrap}
header nav .logo{flex:0 0 auto;color:#f6f3f1!important;white-space:nowrap}
header nav .links{display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:24px;min-width:0;margin-left:auto}
header nav .links a{flex:0 0 auto;white-space:nowrap;color:#c9c7d0!important}
header nav .links a.current{color:#f2d7a7!important}
@media(max-width:600px){header nav{padding:16px 18px;gap:10px}header nav .links{gap:clamp(7px,2.5vw,14px);font-size:clamp(10px,2.9vw,13px)}header nav .logo{font-size:18px}}
/* Modal must overlay, not flow below the questions. */
.overlay[hidden],.loading[hidden]{display:none!important}
.overlay,.loading{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto;overscroll-behavior:contain}
.overlay .panel{position:relative;width:min(100%,680px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 24px 90px #000a}
.overlay .results{display:grid;gap:12px}.overlay .result-card{display:flex;align-items:center;gap:16px;padding:15px}.overlay .result-art{flex:0 0 92px;height:92px;border-radius:12px;display:grid;place-items:center;font-size:38px;overflow:hidden}.overlay .result-art img{width:100%;height:100%;object-fit:cover}.overlay .result-copy{min-width:0}.overlay .result-copy strong{font-size:18px}.overlay .result-copy p{font-size:13px;line-height:1.5;color:#b3aab0}.overlay .result-copy small{font-size:12px}.overlay .close{display:block;margin:12px auto 0;background:transparent;border:1px solid #ffffff40;border-radius:10px;padding:10px 20px;color:#ddd;cursor:pointer}
.choice-loading{background:#151316ed;backdrop-filter:blur(13px);text-align:center}.choice-loading-panel{width:min(100%,420px);padding:35px 16px}.choice-loading-art{font-size:64px;animation:choice-pulse 1.1s ease-in-out infinite alternate}.choice-loading h2{font-size:24px;margin:12px 0}.choice-loading p{font-size:13px;color:#b3aab0}@keyframes choice-pulse{to{transform:scale(1.14);opacity:.6}}
@media(prefers-reduced-motion:reduce){.choice-loading-art{animation:none}}

/* v5: align Choice detail layout and controls with Food, category accent only. */
.choice-intro.intro{position:relative;isolation:isolate;min-height:260px;padding:44px 12px 38px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center}
.choice-intro.intro h1{font-size:clamp(34px,5vw,46px);letter-spacing:-2px;margin:0 0 15px;line-height:1.25;color:var(--choice-accent)}
.choice-intro.intro p.intro{min-height:0;padding:0;display:block;color:color-mix(in srgb,var(--choice-accent) 62%,#c9c1c5);font-size:15px;line-height:1.8}
.choice-questions .step .number{color:var(--choice-accent)}
.choice-questions .step .hint,.choice-questions .foot{color:color-mix(in srgb,var(--choice-accent) 50%,#b3aab0)}
.choice-questions .option{border-color:color-mix(in srgb,var(--choice-accent) 34%,#534747);background:color-mix(in srgb,var(--choice-accent) 7%,#2b2629);color:color-mix(in srgb,var(--choice-accent) 22%,#ded7d5);font-weight:400}
.choice-questions .option[aria-pressed=true]{background:color-mix(in srgb,var(--choice-accent) 28%,#292428);border-color:var(--choice-accent);color:#fff;font-weight:400}
.choice-questions .option:hover{background:color-mix(in srgb,var(--choice-accent) 17%,#2b2629)}
.overlay .panel{border-color:color-mix(in srgb,var(--choice-accent) 55%,#66534b);background:radial-gradient(ellipse at 90% 0%,color-mix(in srgb,var(--choice-accent) 15%,transparent),transparent 55%),#211d20}
.overlay .panel .kicker,.overlay .panel h2,.overlay .panel .hint{color:var(--choice-accent)}
.overlay .result-card{border-color:color-mix(in srgb,var(--choice-accent) 48%,#5d4b3c);background:linear-gradient(110deg,color-mix(in srgb,var(--choice-accent) 11%,#302825),#272326)}
.overlay .result-copy strong{color:color-mix(in srgb,var(--choice-accent) 55%,#fff)}
.overlay .result-copy p{color:color-mix(in srgb,var(--choice-accent) 30%,#b3aab0)}
.overlay .panel .primary{background:var(--choice-accent);border-color:var(--choice-accent);color:#282018}
.overlay .close{border-color:color-mix(in srgb,var(--choice-accent) 55%,#ffffff40);color:var(--choice-accent)}
.choice-loading .loading-art{position:relative;width:160px;height:160px;margin:0 auto 22px;display:grid;place-items:center;animation:none}
.choice-loading .plate{border-color:var(--choice-accent);box-shadow:0 0 0 9px color-mix(in srgb,var(--choice-accent) 6%,transparent),0 0 35px color-mix(in srgb,var(--choice-accent) 15%,transparent)}
.choice-loading .plate-inner{border-color:var(--choice-accent);color:var(--choice-accent)}
.choice-loading .orbit-dot{background:var(--choice-accent);box-shadow:0 0 15px var(--choice-accent)}
.choice-loading h2{color:var(--choice-accent)}
.choice-loading p{color:color-mix(in srgb,var(--choice-accent) 42%,#b3aab0)}
@media(max-width:600px){.choice-intro.intro{min-height:235px;padding:38px 4px 30px}.choice-intro.intro p.intro{font-size:14px}}

/* v6: shared Food-style hero, question heading, loading and result presentation */
.choice-intro.intro{min-height:260px;padding:44px 12px 38px}
.choice-intro.intro h1{color:#f6f3f1;margin:0 0 9px}
.choice-intro.intro h1 em{color:var(--choice-accent);font-style:normal}
.choice-hero-icon{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 12px;border:1px solid color-mix(in srgb,var(--choice-accent) 48%,transparent);border-radius:14px;background:color-mix(in srgb,var(--choice-accent) 12%,transparent);color:var(--choice-accent);font-size:24px}
.choice-step-top{display:flex;align-items:baseline;gap:13px;flex-wrap:wrap;margin-bottom:19px}
.choice-questions .step .choice-step-top .number{min-width:19px;flex:none}
.choice-questions .step .choice-step-top h2{display:inline;margin:0;font-size:19px}
.choice-questions .step .choice-step-top .hint{margin:0;color:color-mix(in srgb,var(--choice-accent) 45%,#ada3a4);font-size:13px}
.choice-questions .step .choice-step-top + .options{padding-left:32px}
.choice-loading .loading-panel{width:min(100%,420px);padding:45px 18px;text-align:center}
.choice-loading .loading-panel h2{font-size:clamp(21px,4vw,27px);letter-spacing:-1px;margin:10px 0 11px}
.choice-loading .loading-dots{display:inline-block;min-width:20px;animation:fade-in .8s ease-in-out infinite alternate}
.overlay .panel{width:min(100%,720px);padding:48px 28px 32px}
.overlay .result-head{text-align:center;padding:0 28px}
.overlay .result-head .section-kicker{display:block;color:var(--choice-accent);font-size:12px;letter-spacing:.18em;margin-bottom:8px}
.overlay .result-head h2{font-size:clamp(28px,5vw,37px);margin:0 0 9px;color:#f6f3f1}
.overlay .result-head h2 em{color:var(--choice-accent);font-style:normal}
.overlay .result-head p{font-size:14px;margin:0;color:color-mix(in srgb,var(--choice-accent) 32%,#bcb0ad)}
.overlay .results{max-width:680px;margin:24px auto 0;gap:12px}
.overlay .result-card{position:relative;padding:20px 22px;animation:step-in .35s ease both}
.overlay .result-card:nth-child(2){animation-delay:.07s}.overlay .result-card:nth-child(3){animation-delay:.14s}
.overlay .result-card.featured{padding:27px 24px;border-color:var(--choice-accent);background:radial-gradient(circle at 90% 0%,color-mix(in srgb,var(--choice-accent) 18%,transparent),transparent 48%),linear-gradient(120deg,#353037,#272326);box-shadow:0 10px 32px #0004}
.overlay .result-card.featured:after{content:'오늘의 한입';position:absolute;right:16px;top:12px;color:var(--choice-accent);font-size:11px;font-weight:700}
.overlay .result-card.featured .result-copy strong{font-size:24px}
.overlay .result-card.featured .result-art{width:92px;height:92px}
.overlay .panel .primary{width:auto;display:block;margin:25px auto 0}
@media(max-width:600px){.choice-questions .step .choice-step-top{gap:8px}.choice-questions .step .choice-step-top h2{font-size:18px}.choice-questions .step .choice-step-top .hint{font-size:12px}.choice-questions .step .choice-step-top + .options{padding-left:24px}.overlay .panel{padding:48px 15px 24px}.overlay .result-head{padding:0 12px}.overlay .result-card.featured{padding-top:46px}.overlay .result-card.featured:after{right:16px;top:13px}}
@media(prefers-reduced-motion:reduce){.choice-loading .loading-dots{animation:none}}
