
:root{--orange:#f35428;--ink:#252923;--muted:#86877e;--paper:#faf9f5;--line:#e9e9e0}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans','Noto Sans KR',sans-serif}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}header{height:94px;max-width:1376px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 48px;border-bottom:1px solid var(--line)}.logo{font-size:25px;font-weight:900;letter-spacing:-1.2px}.logo span{color:var(--orange)}.logo i{font-style:normal;margin-right:9px;font-size:30px}nav{display:flex;gap:36px;font-size:14px;font-weight:600}nav a.active{color:var(--orange)}.save-nav{border:1px solid #ddded5;border-radius:24px;padding:11px 18px;background:transparent;font-size:13px}.save-nav span{color:var(--orange);margin-left:8px}main{max-width:1280px;margin:auto;padding:40px 0 70px}.hero{height:455px;border-radius:19px;overflow:hidden;position:relative;background:#223326}.hero>img{height:100%;width:100%;object-fit:cover;object-position:50% 56%}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,29,18,.88),rgba(14,29,18,.45) 47%,transparent 80%)}.hero-copy{position:absolute;z-index:1;top:53px;left:55px;color:white}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2px}.hero .eyebrow{color:#d9e7b4}.hero h1{font-size:45px;line-height:1.4;letter-spacing:-2px;margin:19px 0 15px;font-weight:800}.hero p{font-size:14px;line-height:1.9;color:#e1e5dc}.primary{border:0;border-radius:7px;background:var(--orange);color:white;font-size:13px;font-weight:700;padding:16px 23px;margin-top:15px}.primary b{margin-left:25px}.hero-note{position:absolute;z-index:1;bottom:27px;right:30px;color:white;font-size:11px;background:#ffffff20;backdrop-filter:blur(12px);padding:12px 17px;border-radius:8px}.hero-note span{color:#d7decf;margin-right:15px}.intro{display:flex;align-items:center;justify-content:space-between;margin-top:43px}.intro h2{font-size:26px;letter-spacing:-1px;margin:0 0 8px}.intro p{font-size:13px;color:var(--muted);margin:0}.search{width:320px;border:1px solid #dedfd5;background:white;border-radius:9px;display:flex;align-items:center;padding:13px 16px;gap:12px}.search input{border:0;outline:0;width:100%;font-size:12px;background:transparent}.filters{display:flex;align-items:center;justify-content:space-between;margin:29px 0 27px;gap:12px}.categories{display:flex;gap:9px;flex-wrap:wrap}.chip{border:1px solid var(--line);background:white;border-radius:25px;padding:11px 19px;font-size:12px;color:#5e6258}.chip.selected{background:var(--ink);border-color:var(--ink);color:white}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px 23px}.card{min-width:0}.photo{height:196px;border-radius:12px;overflow:hidden;position:relative;cursor:pointer;background:#eee}.photo img{width:100%;height:100%;object-fit:cover;transition:transform .35s}.photo:hover img{transform:scale(1.05)}.bookmark{position:absolute;right:12px;top:12px;border:0;border-radius:50%;background:#fffef8eb;width:32px;height:32px;font-size:18px;color:#555d4f}.bookmark.saved{color:var(--orange)}.time{position:absolute;left:12px;bottom:12px;color:white;background:#252923ab;border-radius:5px;padding:5px 8px;font-size:10px}.video-badge{position:absolute;right:12px;bottom:12px;background:white;border-radius:5px;padding:5px 7px;font-size:9px;font-weight:600}.video-badge b{color:#e64731;margin-right:4px}.card-meta{font-size:10px;color:#92948a;margin-top:16px}.card-meta span{color:var(--orange);margin-right:7px}.card h3{font-size:17px;letter-spacing:-.6px;margin:8px 0;cursor:pointer}.card p{font-size:11px;color:var(--muted);margin:0;line-height:1.7}.card-bottom{display:flex;justify-content:space-between;margin-top:14px;font-size:10px;color:#7f8377}.card-bottom b{color:#e9a328}.section-line{display:flex;justify-content:space-between;align-items:center;margin:43px 0 20px}.section-line h2{font-size:21px;letter-spacing:-.7px;margin:0}.section-line span{font-size:11px;color:#8b8d81}.banner{margin-top:48px;background:#f0f1e6;border-radius:12px;padding:27px 34px;display:flex;justify-content:space-between;align-items:center}.banner h3{font-size:18px;margin:0 0 7px}.banner p{font-size:12px;color:#858875;margin:0}.banner button{margin:0;background:transparent;border:1px solid #bbc0aa;color:#4a5540;border-radius:7px;padding:12px 18px;font-size:12px}footer{border-top:1px solid var(--line);max-width:1280px;margin:auto;padding:28px 0 35px;display:flex;justify-content:space-between;align-items:center;color:#92968a;font-size:10px}footer .logo{font-size:19px;color:var(--ink)}.empty{grid-column:1/-1;padding:65px;text-align:center;color:var(--muted)}dialog{border:0;border-radius:18px;padding:0;width:min(900px,94vw);max-height:92vh;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#172219aa;backdrop-filter:blur(4px)}.detail{padding:35px}.close{position:absolute;right:15px;top:15px;width:34px;height:34px;border:0;background:white;border-radius:50%;font-size:22px;z-index:2}.detail-cover{height:250px;width:100%;object-fit:cover}.detail h2{font-size:28px;margin:12px 0}.detail p{color:#7f8377;font-size:13px;line-height:1.8}.detail-cols{display:grid;grid-template-columns:1fr 1.65fr;gap:35px;margin-top:25px}.detail h3{font-size:17px}.ingredient{display:flex;gap:9px;padding:11px 0;border-bottom:1px solid var(--line);font-size:13px}.ingredient:has(input:checked){text-decoration:line-through;color:#a3a799}.step{display:flex;gap:14px;margin:0 0 22px;font-size:13px;line-height:1.9}.step b{border-radius:50%;background:#eff0e5;min-width:28px;height:28px;text-align:center;color:#6c775c}.video-link{display:block;background:#fff0e8;border:1px solid #f7d9c9;border-radius:9px;padding:17px;font-size:13px;color:#c94f2c}.detail iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:9px}.detail-actions{display:flex;align-items:center;gap:15px;font-size:13px}.detail-actions button{border:1px solid #dedfd5;background:white;border-radius:5px;padding:5px 12px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#252923;color:white;border-radius:9px;padding:13px 22px;font-size:13px;z-index:5;display:none}button:focus-visible,a:focus-visible{outline:3px solid #fba58a;outline-offset:3px}
@media(min-width:1500px){main{padding-top:45px}}@media(max-width:1375px){main,footer{margin-left:48px;margin-right:48px}}@media(max-width:1000px){.grid{grid-template-columns:repeat(3,1fr)}.hero{height:425px}.hero h1{font-size:39px}.photo{height:185px}nav{gap:20px}}@media(max-width:720px){header{height:76px;padding:0 20px}.logo{font-size:22px}nav{display:none}.save-nav{font-size:11px;padding:9px 12px}main{margin:0;padding:20px 20px 35px}.hero{height:435px;border-radius:13px}.hero-copy{top:35px;left:26px}.hero h1{font-size:35px;margin-top:20px}.hero p{font-size:12px}.hero>img{object-position:65%}.hero:after{background:linear-gradient(90deg,#102619d9,#10261955)}.hero-note{right:17px;bottom:18px;font-size:10px}.intro{display:block;margin-top:32px}.intro h2{font-size:24px}.search{width:100%;margin-top:22px}.filters{display:block;margin:20px 0}.categories{gap:7px;flex-wrap:nowrap;overflow:auto;padding-bottom:8px}.chip{white-space:nowrap;padding:10px 15px}.grid{grid-template-columns:repeat(2,1fr);gap:25px 14px}.photo{height:160px}.card h3{font-size:15px;line-height:1.5}.card p{font-size:10px}.card-meta{margin-top:12px}.video-badge{font-size:8px;right:7px}.time{left:7px;font-size:9px}.banner{padding:23px;display:block;margin-top:32px}.banner h3{font-size:17px}.banner p{line-height:1.8}.banner button{margin-top:15px}footer{margin:0 20px;gap:15px;align-items:flex-start;flex-direction:column}.detail{padding:22px}.detail-cols{grid-template-columns:1fr;gap:5px}.detail-cover{height:200px}.detail h2{font-size:24px}}@media(max-width:380px){.photo{height:135px}.hero h1{font-size:30px}.logo{font-size:19px}}

html{scroll-behavior:smooth}section[id]{scroll-margin-top:24px}.browse-tabs{display:flex;align-items:center;gap:12px;margin:24px 0 5px}.browse-tabs a{font-size:13px;font-weight:600;border:1px solid var(--line);padding:13px 20px;background:white;border-radius:8px}.browse-tabs a:hover{border-color:var(--orange);color:var(--orange)}.browse-tabs span{margin-left:auto;font-size:12px;color:var(--muted)}.ingredient-library{margin-top:64px;border-top:1px solid var(--line);padding-top:7px}.ingredient-library .eyebrow{color:#6a8056;letter-spacing:2px;margin-bottom:12px}.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px;margin-top:29px}.journal-card{display:block;border:1px solid var(--line);background:white;border-radius:13px;overflow:hidden;transition:transform .2s}.journal-card:hover{transform:translateY(-4px)}.journal-art{height:185px;display:flex;align-items:center;justify-content:center;position:relative}.journal-art svg{height:145px;width:170px}.journal-art:after{content:'INGREDIENT NOTES';position:absolute;bottom:14px;left:20px;font-size:9px;letter-spacing:2px;opacity:.45}.journal-body{padding:23px}.journal-body small{color:#6a8056;font-size:10px}.journal-body h3{font-size:20px;margin:10px 0}.journal-body p{font-size:12px;color:#7d8275;line-height:1.9;margin:0}.nutrient-tags{display:flex;gap:7px;margin:17px 0 21px;flex-wrap:wrap}.nutrient-tags span{font-size:10px;padding:5px 8px;background:#f1f4e9;border-radius:4px;color:#61714f}.journal-bottom{display:flex;justify-content:space-between;font-size:11px;color:#7b816e}.journal-bottom b{color:#61714f}.journal-note{font-size:11px;line-height:1.8;color:#8a8e80;margin-top:19px}.ingredient-related{margin:24px 0;padding:18px;background:#eef2e5;border-radius:9px}.ingredient-related p{margin:0 0 10px}.ingredient-related a{display:inline-block;color:#526b3c;font-size:12px;padding:5px 10px;border:1px solid #d1dac3;border-radius:5px;margin:4px 5px 0 0}
@media(max-width:720px){.browse-tabs{flex-wrap:wrap;gap:9px}.browse-tabs a{flex:1;text-align:center;padding:13px 9px}.browse-tabs span{width:100%;text-align:center;margin:5px 0 0;font-size:10px}.ingredient-library{margin-top:38px}.journal-grid{grid-template-columns:1fr;gap:16px}.journal-card{display:grid;grid-template-columns:115px 1fr}.journal-art{height:100%;min-height:210px}.journal-art svg{width:100px;height:125px}.journal-art:after{display:none}.journal-body{padding:20px 17px}.journal-body h3{font-size:19px}.journal-body p{font-size:11px}.nutrient-tags{gap:4px;margin:12px 0}.nutrient-tags span{font-size:9px}.journal-bottom{font-size:10px}.detail-actions{flex-wrap:wrap}}

.recipe-video{margin:0 0 30px}.recipe-video>h3{margin-top:0;padding-right:28px}.recipe-video iframe{display:block}.recipe-video p{font-size:11px}.recipe-summary{padding-top:3px;margin-bottom:30px}.recipe-ingredients,.recipe-steps{margin-top:30px;border-top:1px solid var(--line);padding-top:14px}.recipe-ingredients .ingredient{font-size:14px;padding:13px 0}.recipe-steps .step{font-size:14px;line-height:2}.recipe-steps h3{margin-bottom:22px}
