
            @import url('https://fonts.googleapis.com/css2?family=Gugi&family=Noto+Sans+KR:wght@400;500;700;900&display=swap');
            * { box-sizing: border-box; margin: 0; padding: 0; }
            :root { --broth:#B31E23; --broth-dark:#7A1417; --chili:#E8532B; --gold:#E7A928; --scallion:#5B8C3E; --paper:#FBF4E6; --ink:#2A1F18; }
            .wrap { font-family:'Noto Sans KR',sans-serif; color:var(--ink); background:var(--paper); min-height:100vh; min-height:100dvh; max-width:460px; margin:0 auto; padding:0 0 40px; box-shadow:0 0 50px rgba(60,22,10,.13); }
            .signboard { background:var(--broth); color:var(--paper); padding:26px 22px 22px; border-bottom:5px solid var(--gold); position:relative; overflow:hidden; }
            .signboard::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at 85% 15%, rgba(231,169,40,.25), transparent 45%); }
            .eyebrow { font-size:12px; letter-spacing:3px; opacity:.85; font-weight:700; }
            .title { font-family:'Gugi',cursive; font-size:38px; line-height:1.05; margin:6px 0 4px; position:relative; z-index:1; }
            .subtitle { font-size:13px; opacity:.92; font-weight:500; position:relative; z-index:1; }
            .body { padding:22px; }
            .celeb-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
            .celeb-card { background:#fff; border:1.5px solid #F0E2C8; border-radius:16px; padding:16px 14px; cursor:pointer; text-align:left; font-family:inherit; transition:.15s; position:relative; box-shadow:0 2px 8px rgba(122,20,23,.05); }
            .celeb-card:hover { transform:translateY(-3px); box-shadow:0 8px 18px rgba(122,20,23,.12); border-color:var(--gold); }
            .celeb-head { display:flex; align-items:center; gap:9px; }
            .celeb-name { font-family:'Gugi',cursive; font-size:20px; color:var(--broth); line-height:1.05; }
            .celeb-metarow { display:flex; align-items:center; gap:6px; margin:8px 0; flex-wrap:wrap; }
            .celeb-vibe { display:inline-block; font-size:11px; font-weight:700; color:#3C6127; background:#EEF5E7; padding:3px 9px; border-radius:20px; }
            .heat { font-size:12px; letter-spacing:-2px; }
            .heat-mild { font-size:10.5px; font-weight:700; color:#9A8B72; background:#F1EADB; padding:2px 7px; border-radius:20px; }
            .sauce-heat { margin-top:6px; font-size:12px; color:#8A7A62; font-weight:700; display:flex; align-items:center; gap:6px; }
            .sauce-heat .heat { letter-spacing:0; }
            .celeb-tag { font-size:12px; color:#8A7A62; line-height:1.4; }
            .celeb-arrow { position:absolute; top:14px; right:14px; color:var(--gold); font-weight:900; font-size:16px; }
            .divider { display:flex; align-items:center; gap:12px; margin:28px 0 16px; color:#C9B790; font-size:12px; font-weight:700; }
            .divider::before,.divider::after { content:""; flex:1; height:1.5px; background:#EADFC6; }
            .custom-entry { width:100%; padding:15px; background:#fff; border:2px dashed var(--gold); border-radius:14px; font-family:inherit; font-weight:800; font-size:14.5px; color:var(--broth-dark); cursor:pointer; }
            .custom-entry span { color:#9A8B72; font-weight:500; font-size:12.5px; display:block; margin-top:3px; }
            .back { background:none; border:none; font-family:inherit; font-weight:700; font-size:14px; color:var(--broth); cursor:pointer; padding:0 0 16px; }
            .ticket { background:#fff; border-radius:4px; position:relative; box-shadow:0 8px 24px rgba(122,20,23,.14); background-image:repeating-linear-gradient(90deg, transparent 0 11px, var(--paper) 11px 12px); background-position:top; background-size:100% 1px; background-repeat:repeat-x; padding:24px 20px 20px; border:1px solid #F0E6D2; }
            .ticket .stamp { position:absolute; top:18px; right:14px; width:56px; height:56px; border-radius:50%; border:2.5px solid var(--broth); color:var(--broth); display:flex; align-items:center; justify-content:center; font-family:'Gugi',cursive; font-size:11px; text-align:center; transform:rotate(-12deg); opacity:.85; line-height:1.1; padding:4px; }
            .ticket-eyebrow { font-size:11px; letter-spacing:2px; font-weight:700; color:var(--gold); margin-bottom:8px; }
            .sauce-head { display:flex; align-items:center; gap:13px; padding-right:52px; }
            .sauce-name { font-family:'Gugi',cursive; font-size:27px; color:var(--broth); line-height:1.12; }
            .sauce-person { font-size:12.5px; color:#9A8B72; font-weight:600; margin-top:2px; }
            .ing-list { margin:18px 0 16px; border-top:1.5px dashed #E0D3BB; padding-top:6px; }
            .ing-row { display:flex; justify-content:space-between; align-items:baseline; padding:8px 0; border-bottom:1px dotted #EDE2CC; font-size:14px; }
            .ing-row:last-child { border-bottom:none; }
            .ing-name { font-weight:700; }
            .ing-amt { color:var(--broth-dark); font-weight:700; white-space:nowrap; margin-left:12px; }
            .tip { margin-top:4px; font-size:13.5px; font-weight:700; color:var(--broth-dark); display:flex; gap:7px; align-items:flex-start; }
            .small-note { margin-top:10px; font-size:11.5px; color:#9A8B72; line-height:1.5; }
            .toggle { display:flex; gap:8px; margin-bottom:20px; }
            .toggle button { flex:1; padding:10px; border:2px solid #E7D9C0; background:#fff; color:var(--ink); font-family:inherit; font-weight:700; font-size:14px; border-radius:10px; cursor:pointer; }
            .toggle button.on { background:var(--broth); color:var(--paper); border-color:var(--broth); }
            .sec { margin-bottom:22px; }
            .sec-label { font-weight:900; font-size:15px; margin-bottom:10px; display:flex; align-items:center; gap:6px; }
            .sec-label .dot { width:8px; height:8px; border-radius:50%; background:var(--broth); }
            .spicy-row { display:flex; gap:8px; }
            .spicy-row button { flex:1; padding:11px 4px; border:2px solid #E7D9C0; background:#fff; border-radius:12px; font-family:inherit; font-weight:700; font-size:13.5px; cursor:pointer; color:var(--ink); }
            .spicy-row button.on { border-color:var(--chili); background:#FDECE4; color:var(--chili); }
            .chips { display:flex; flex-wrap:wrap; gap:8px; }
            .chip { padding:9px 13px; border:2px solid #E7D9C0; background:#fff; border-radius:24px; font-family:inherit; font-weight:600; font-size:13px; cursor:pointer; display:flex; align-items:center; gap:6px; color:var(--ink); }
            .chip.on { border-color:var(--scallion); background:#EEF5E7; color:#3C6127; }
            .cta { width:100%; padding:16px; background:var(--broth); color:var(--paper); border:none; border-radius:14px; font-family:'Gugi',cursive; font-size:20px; cursor:pointer; box-shadow:0 4px 0 var(--broth-dark); letter-spacing:1px; }
            .cta:active { transform:translateY(3px); box-shadow:0 1px 0 var(--broth-dark); }
            .prevnote { margin-top:20px; padding:16px; background:#FFF7E6; border:1.5px solid var(--gold); border-radius:12px; color:var(--broth-dark); font-weight:600; font-size:13.5px; line-height:1.6; text-align:center; }
            .result { margin-top:22px; }
            .result-title { font-family:'Gugi',cursive; font-size:20px; color:var(--broth); margin-bottom:16px; text-align:center; }
            .rec-card { display:block; width:100%; text-align:left; background:#fff; border:2px solid #F0E6D2; border-radius:16px; padding:15px 16px; margin-bottom:12px; cursor:pointer; font-family:inherit; box-shadow:0 4px 14px rgba(122,20,23,.08); position:relative; }
            .rec-card.top { border-color:var(--broth); box-shadow:0 8px 22px rgba(122,20,23,.16); margin-top:10px; }
            .rec-badge { position:absolute; top:-11px; left:16px; background:var(--broth); color:var(--paper); font-size:10px; font-weight:800; letter-spacing:1.5px; padding:3px 10px; border-radius:20px; }
            .rec-head { display:flex; align-items:center; gap:12px; }
            .rec-head > :last-child { margin-left:auto; flex-shrink:0; }
            .rec-name { font-family:'Gugi',cursive; font-size:19px; color:var(--broth); line-height:1.12; }
            .rec-person { font-size:12px; color:#9A8B72; font-weight:600; margin-top:3px; }
            .rec-reason { margin-top:12px; padding:10px 12px; background:#FFF7E6; border:1px solid #F3E4C0; border-radius:10px; font-size:13px; font-weight:700; color:var(--broth-dark); line-height:1.5; }
            .rec-cta { margin-top:11px; font-size:12.5px; font-weight:800; color:var(--broth); text-align:right; }
            .result-reset { width:100%; padding:12px; margin-top:4px; background:none; border:2px dashed #E7D9C0; border-radius:12px; font-family:inherit; font-weight:700; font-size:13.5px; color:#9A8B72; cursor:pointer; }
            .custom-lead { margin:20px 0 12px; font-weight:900; font-size:14px; color:var(--broth-dark); text-align:center; }
            .rec-card.custom { border-style:dashed; border-color:var(--gold); cursor:default; }
            .rec-badge.alt { background:var(--gold); color:var(--broth-dark); }
            .gen-ava { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:24px; flex-shrink:0; }
            .gen-ings { margin-top:12px; border-top:1.5px dashed #E0D3BB; padding-top:4px; }
            .gen-ing { display:flex; justify-content:space-between; align-items:baseline; padding:6px 0; border-bottom:1px dotted #EDE2CC; font-size:13.5px; }
            .gen-ing:last-child { border-bottom:none; }
            .gen-ing span:first-child { font-weight:700; }
            .gen-ing span:last-child { color:var(--broth-dark); font-weight:700; white-space:nowrap; margin-left:12px; }
            @media (prefers-reduced-motion: reduce) { .cta:active,.celeb-card:hover { transform:none; } }
          
/* --- static rebuild additions --- */
html { scrollbar-gutter: stable; background:#D8C8A8; }
html, body { margin:0; padding:0; }
body { min-height:100dvh; background:#D8C8A8; background:radial-gradient(ellipse at 50% -8%, #ECE0C7, #D5C3A1);
       font-family:'Noto Sans KR',sans-serif; }
a { color:inherit; }
.celeb-card { display:block; text-decoration:none; color:inherit; }
.celeb-card .celeb-name { text-decoration:none; }
.back { display:inline-block; text-decoration:none; }
.custom-entry { display:block; text-decoration:none; text-align:center; }
.avatar { border-radius:50%; object-fit:cover; flex-shrink:0; display:block; }
.intro { font-size:14px; line-height:1.75; color:#5C4B3A; background:#fff; border:1.5px solid #F0E2C8;
         border-radius:14px; padding:16px 16px; margin-bottom:20px; }
.intro strong { color:var(--broth); }
.howto { margin-top:18px; padding-top:14px; border-top:1.5px dashed #E0D3BB; }
.howto h2 { font-size:14px; color:var(--broth); margin-bottom:8px; font-family:'Gugi',cursive; font-weight:400; }
.howto ol { margin:0; padding-left:18px; font-size:13.5px; line-height:1.8; color:#5C4B3A; }
.related { margin-top:28px; }
.related h2 { font-family:'Gugi',cursive; font-weight:400; font-size:17px; color:var(--broth); margin-bottom:12px; }
.related-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.related-card { display:flex; align-items:center; gap:9px; background:#fff; border:1.5px solid #F0E2C8;
                border-radius:12px; padding:10px 11px; text-decoration:none; color:inherit; font-size:13.5px; font-weight:700; }
.related-card:hover { border-color:var(--gold); }
.crumb { font-size:12px; color:#9A8B72; margin-bottom:14px; }
.crumb a { color:#9A8B72; text-decoration:none; }
.crumb a:hover { text-decoration:underline; }
.sitefoot { margin-top:34px; padding-top:18px; border-top:1.5px solid #EADFC6; font-size:12px;
            color:#9A8B72; line-height:1.9; text-align:center; }
.sitefoot a { color:#9A8B72; text-decoration:none; margin:0 7px; }
.sitefoot a:hover { text-decoration:underline; }
.hasreview { margin-top:9px; font-size:11px; font-weight:800; color:#3C6127; background:#EEF5E7; display:inline-block; padding:3px 8px; border-radius:20px; }
.review { margin-top:22px; background:#FFF7E6; border:1.5px solid var(--gold); border-radius:14px; padding:18px 17px; }
.review h2 { font-family:'Gugi',cursive; font-weight:400; font-size:18px; color:var(--broth); margin-bottom:12px; }
.review p { font-size:14px; line-height:1.85; color:#4A3B2C; margin-bottom:11px; }
.review p:last-child { margin-bottom:0; }
.review strong { color:var(--broth-dark); }
.review .byline { margin-top:13px; font-size:12px; color:#9A8B72; font-weight:600; }
.breakdown { margin-top:22px; background:#fff; border:1.5px solid #F0E2C8; border-radius:14px; padding:18px 17px; }
.breakdown h2 { font-family:'Gugi',cursive; font-weight:400; font-size:18px; color:var(--broth); margin-bottom:12px; }
.bd-row { padding:10px 0; border-bottom:1px dotted #EDE2CC; }
.bd-row:last-child { border-bottom:none; }
.bd-name { font-weight:800; font-size:13.5px; color:var(--broth-dark); }
.bd-desc { font-size:13px; line-height:1.7; color:#5C4B3A; margin-top:3px; }
.fit { margin-top:22px; background:#fff; border:1.5px solid #F0E2C8; border-radius:14px; padding:18px 17px; }
.fit h2 { font-family:'Gugi',cursive; font-weight:400; font-size:18px; color:var(--broth); margin-bottom:10px; }
.fit ul { padding-left:18px; font-size:13.5px; line-height:1.9; color:#5C4B3A; }
.disclaimer { margin-top:10px; font-size:11px; color:#B0A28C; line-height:1.6; }
