@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap";:root{--paper:#f1f0e2;--card:#fbfaf2;--ink:#1f2a1c;--ink-soft:#5b6558;--sage:#4f6f52;--sage-deep:#3a5340;--sage-light:#e3ebdc;--mustard:#e3a72b;--mustard-soft:#f6e4bb;--brick:#c1502e;--line:#dcd8c6;--radius-lg:22px;--radius-md:14px;--radius-sm:9px;--shadow:0 8px 20px -10px #1f2a1c40;--font-display:"Space Grotesk", sans-serif;--font-body:"Inter", sans-serif;--font-mono:"IBM Plex Mono", monospace}*{box-sizing:border-box;min-width:0;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-body);color:var(--ink);background:var(--paper);overflow-x:hidden}button{cursor:pointer;font-family:inherit}input{font-family:inherit}.app-frame{background:var(--paper);flex-direction:column;width:100%;min-height:100dvh;display:flex;position:relative}@media (width>=600px){body{background:#dad5c2;justify-content:center;padding:32px 0;display:flex}.app-frame{border-radius:28px;max-width:430px;min-height:calc(100vh - 64px);overflow:hidden;box-shadow:0 30px 60px -25px #00000080}}.screen{flex:1;animation:.2s fadeIn;overflow-y:auto}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.topbar{justify-content:space-between;align-items:flex-end;padding:34px 20px 16px;display:flex}.brand-mark{font-family:var(--font-display);letter-spacing:.02em;color:var(--sage);margin-bottom:10px;font-size:12px;font-weight:700;display:block}.topbar .eyebrow{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sage-deep);margin-bottom:4px;font-size:11px;display:block}.topbar h1{font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.05}.icon-btn{background:var(--card);border:1px solid var(--line);cursor:pointer;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.icon-btn svg{width:18px;height:18px}.section-title{font-family:var(--font-display);color:var(--ink-soft);margin:6px 2px 2px;font-size:14px;font-weight:700}.divider{background:var(--line);height:1px}.primary-btn{background:var(--sage);color:var(--paper);border-radius:var(--radius-sm);font-family:var(--font-display);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;width:100%;padding:15px;font-size:14.5px;font-weight:600;display:flex}.primary-btn.added{background:var(--ink)}.empty-state{text-align:center;color:var(--ink-soft);padding:70px 30px 40px}.empty-state .emoji{margin-bottom:14px;font-size:40px}.empty-state h3{font-family:var(--font-display);color:var(--ink);margin-bottom:6px;font-size:17px}.empty-state p{font-size:13px;line-height:1.5}.recipe-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer;align-items:center;gap:12px;margin-bottom:12px;padding:12px;transition:box-shadow .15s,transform .15s;display:flex}.recipe-card:active{transform:scale(.98)}.recipe-card.selected{border-color:var(--sage);box-shadow:0 0 0 2px var(--sage-light) inset}.thumb{border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;font-size:24px;display:flex}.card-body{flex:1;min-width:0}.card-body h3{font-family:var(--font-display);margin-bottom:4px;font-size:15.5px;font-weight:600}.card-meta{color:var(--ink-soft);align-items:center;gap:8px;font-size:12px;display:flex}.add-btn{border:1.5px solid var(--sage);width:34px;height:34px;color:var(--sage);background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;transition:all .15s;display:flex}.add-btn.added{background:var(--sage);color:var(--paper);border-color:var(--sage)}.reco-section{padding:6px 0 18px}.reco-label{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--brick);align-items:center;gap:6px;padding:0 20px 10px;font-size:11px;display:flex}.reco-scroll{scrollbar-width:none;gap:12px;padding:0 20px 4px;display:flex;overflow-x:auto}.reco-scroll::-webkit-scrollbar{display:none}.reco-card{background:var(--ink);width:168px;color:var(--paper);border-radius:var(--radius-md);cursor:pointer;flex:none;padding:14px}.reco-thumb{border-radius:10px;justify-content:center;align-items:center;width:100%;height:64px;margin-bottom:10px;font-size:26px;display:flex}.reco-card h3{font-family:var(--font-display);margin-bottom:6px;font-size:14.5px;font-weight:600;line-height:1.2}.reco-why{color:#c7cdbf;font-size:10.5px;line-height:1.3}.detail-hero{justify-content:center;align-items:center;height:210px;font-size:64px;display:flex;position:relative}.back-btn{cursor:pointer;z-index:5;background:#ffffffd9;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;display:flex;position:absolute;top:34px;left:18px}.back-btn svg{width:16px;height:16px}.detail-body{flex-direction:column;gap:22px;padding:20px;display:flex}.detail-body h2{font-family:var(--font-display);margin-bottom:6px;font-size:24px;font-weight:700}.detail-meta{color:var(--ink-soft);font-size:12.5px;font-family:var(--font-mono);align-items:center;gap:14px;display:flex}.rating-row{align-items:center;gap:10px;margin-top:10px;display:flex}.cooked-tag{font-family:var(--font-mono);color:var(--sage-deep);background:var(--sage-light);border-radius:20px;padding:3px 8px;font-size:11px}.ingredient-list{flex-direction:column;gap:9px;display:flex}.ingredient-row{justify-content:space-between;align-items:center;padding:2px 0;font-size:14px;display:flex}.ingredient-row .qty{font-family:var(--font-mono);color:var(--sage-deep);font-size:13px;font-weight:600}.step-list{flex-direction:column;gap:14px;display:flex}.step-row{gap:12px;display:flex}.step-num{font-family:var(--font-display);color:var(--paper);background:var(--sage);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:13px;font-weight:700;display:flex}.step-row p{color:var(--ink-soft);padding-top:2px;font-size:13.5px;line-height:1.5}.import-body{flex-direction:column;gap:16px;padding:24px 20px 40px;display:flex}.import-option{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius-md);cursor:pointer;align-items:flex-start;gap:14px;padding:18px;display:flex}.import-option .icon{background:var(--sage-light);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:17px;display:flex}.import-option h3{font-family:var(--font-display);margin-bottom:4px;font-size:15px}.import-option p{color:var(--ink-soft);font-size:12.5px;line-height:1.4}.form-card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius-md);flex-direction:column;gap:10px;padding:16px;display:flex}.form-card label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-top:6px;font-size:10.5px}.form-card label:first-child{margin-top:0}.form-card input,.form-card select,.form-card textarea{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:10px;width:100%;padding:12px 13px;font-size:14px}.form-card input:focus,.form-card select:focus,.form-card textarea:focus{outline:2px solid var(--sage);outline-offset:1px}.v2-note{color:var(--ink-soft);font-size:11.5px;font-style:italic;line-height:1.5}.manual-form{flex-direction:column;gap:10px;display:flex}.emoji-picker{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.emoji-option{aspect-ratio:1;border:1.5px solid var(--line);background:var(--paper);border-radius:12px;justify-content:center;align-items:center;font-size:20px;transition:all .12s;display:flex}.emoji-option.selected{border-color:var(--sage);background:var(--sage-light);transform:scale(1.06)}.emoji-custom{color:var(--ink-soft);font-weight:700}.emoji-input{border:1px solid var(--line);text-align:center;background:var(--paper);border-radius:10px;width:100%;padding:10px 12px;font-size:18px}.section-header{align-items:baseline;gap:8px;margin:4px 2px 0;display:flex}.section-header-title{font-family:var(--font-display);font-size:15px;font-weight:700}.section-header-count{font-family:var(--font-mono);color:var(--sage-deep);background:var(--sage-light);border-radius:20px;padding:1px 8px;font-size:11px}.ingredient-cards{flex-direction:column;gap:10px;display:flex}.ingredient-card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius-md);flex-direction:column;gap:10px;padding:14px;display:flex}.ingredient-card-top{align-items:center;gap:8px;display:flex}.ingredient-name-input{border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:10px;flex:1;min-width:0;padding:11px 12px;font-size:14.5px;font-weight:600}.ingredient-name-input:focus{outline:2px solid var(--sage);outline-offset:1px}.remove-btn{background:var(--paper);width:30px;height:30px;color:var(--brick);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.remove-btn svg{width:14px;height:14px}.ingredient-card-qty{gap:8px;display:flex}.ingredient-card-qty input{border:1px solid var(--line);background:var(--paper);min-width:0;color:var(--ink);border-radius:9px;flex:1;padding:9px 10px;font-size:13px}.ingredient-card-qty input:focus{outline:2px solid var(--sage);outline-offset:1px}.rayon-picker{scrollbar-width:none;gap:6px;padding-bottom:2px;display:flex;overflow-x:auto}.rayon-picker::-webkit-scrollbar{display:none}.rayon-pill{border:1.5px solid var(--line);background:var(--paper);color:var(--ink-soft);font-family:var(--font-mono);white-space:nowrap;border-radius:20px;flex-shrink:0;padding:6px 12px;font-size:11px;font-weight:600;transition:all .12s}.rayon-pill.active{border-color:#0000}.step-cards{flex-direction:column;gap:10px;display:flex}.step-form-card{background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius-md);align-items:flex-start;gap:10px;padding:12px;display:flex}.step-form-num{font-family:var(--font-display);color:var(--paper);background:var(--sage);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;margin-top:2px;font-size:12.5px;font-weight:700;display:flex}.step-form-card textarea{border:1px solid var(--line);background:var(--paper);min-width:0;color:var(--ink);resize:vertical;border-radius:9px;flex:1;padding:9px 11px;font-family:inherit;font-size:13.5px}.step-form-card textarea:focus{outline:2px solid var(--sage);outline-offset:1px}.add-dashed-btn{color:var(--sage-deep);border-radius:var(--radius-md);font-family:var(--font-mono);background:0 0;border:1.5px dashed #c9c4b0;padding:12px;font-size:12px;font-weight:600}.save-btn{margin-top:10px}.save-btn:disabled{opacity:.5}.courses-progress{padding:2px 20px 22px}.progress-top{justify-content:space-between;align-items:baseline;margin-bottom:9px;display:flex}.progress-top .n{font-family:var(--font-display);color:var(--ink);font-size:13.5px;font-weight:600}.progress-top .pct{font-family:var(--font-mono);color:var(--sage-deep);font-size:11.5px;font-weight:600}.progress-track{background:var(--line);border-radius:8px;height:8px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--sage) 0%, var(--sage-deep) 100%);border-radius:8px;height:100%;transition:width .3s}.courses-list{flex-direction:column;gap:20px;padding:0 20px 28px;display:flex}.rayon-chip{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em;border-radius:20px;align-items:center;gap:6px;margin-bottom:10px;padding:5px 11px 5px 8px;font-size:10.5px;font-weight:600;display:inline-flex}.item-card{background:var(--card);border-radius:var(--radius-md);border:1px solid var(--line);overflow:hidden}.check-row{cursor:pointer;border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:13px 15px;font-size:14px;transition:background .15s;display:flex}.check-row:last-child{border-bottom:none}.check-row:active{background:var(--sage-light)}.check-row .box{border:1.7px solid #c9c4b0;border-radius:7px;flex-shrink:0;justify-content:center;align-items:center;width:21px;height:21px;transition:all .15s;display:flex}.check-row .box svg{opacity:0;width:12px;height:12px;transition:all .15s;transform:scale(.5)}.check-row.checked .box{background:var(--sage);border-color:var(--sage)}.check-row.checked .box svg{opacity:1;transform:scale(1)}.check-row.checked .label{color:#b5b0a0}.check-row .label{flex:1;font-weight:500}.check-row .qty{font-family:var(--font-mono);color:var(--ink-soft);background:var(--paper);border-radius:6px;padding:3px 8px;font-size:12px;font-weight:600}.check-row.checked .qty{opacity:.5}.bottom-nav{background:var(--ink);width:100%;padding:12px 20px calc(20px + env(safe-area-inset-bottom,0px));z-index:40;border-top:1px solid #ffffff0f;flex-shrink:0;justify-content:space-around;align-items:center;display:flex}.nav-item{color:#8b9284;cursor:pointer;font-size:10.5px;font-family:var(--font-mono);flex-direction:column;align-items:center;gap:4px;display:flex;position:relative}.nav-item.active{color:var(--mustard)}.nav-item svg{width:20px;height:20px}.nav-badge{background:var(--brick);color:#fff;width:16px;height:16px;font-size:9px;font-weight:700;font-family:var(--font-body);border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;top:-4px;right:-10px}.nav-fab{background:var(--mustard);width:50px;height:50px;color:var(--ink);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;margin-top:-26px;font-size:24px;display:flex;box-shadow:0 8px 18px -6px #e3a72bb3}