@import "https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Inter:wght@400;600&display=swap";:root{--slate-900:#0f172a;--slate-800:#1e293b;--slate-700:#334155;--slate-600:#475569;--slate-500:#8895ab;--slate-400:#94a3b8;--slate-300:#cbd5e1;--white:#fff;--amber:#f59e0b;scrollbar-color:var(--slate-600) var(--slate-800);caret-color:var(--amber);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){:root{--slate-900:#0a0e1a;--slate-800:#141824;--slate-700:#1f2937;--slate-600:#374151;--slate-500:#4b5563;--slate-400:#9ca3af;--slate-300:#d1d5db;--white:#f9fafb;--amber:#fbbf24;scrollbar-color:var(--slate-600) var(--slate-800);caret-color:var(--amber);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*,:before,:after{box-sizing:border-box}html{overflow-x:clip}body{background:var(--slate-900);color:var(--white);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6}.screen{min-height:100vh}p{text-wrap:pretty}h1,h2,h3{text-wrap:balance}::selection{background:var(--amber);color:var(--slate-900)}:focus-visible{outline:2px solid var(--amber);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--slate-800)}::-webkit-scrollbar-thumb{background:var(--slate-600);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--slate-500)}.app-container{max-width:1440px;min-height:100vh;margin:0 auto;padding:48px 64px}.header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.app-title{letter-spacing:.02em;text-transform:uppercase;color:var(--white);font-family:Barlow Condensed,sans-serif;font-size:28px;font-weight:700}.button{border:1px solid var(--slate-400);min-width:44px;min-height:44px;color:var(--white);cursor:pointer;text-transform:uppercase;letter-spacing:.02em;background:0 0;padding:10px 20px;font-family:Inter,sans-serif;font-size:14px;font-weight:600;transition:all .2s cubic-bezier(.19,1,.22,1)}@media (prefers-reduced-motion:no-preference){.button{transition:all .2s cubic-bezier(.19,1,.22,1)}}.button:hover{background:var(--amber);border-color:var(--amber);color:var(--slate-900)}.button:disabled{opacity:.4;cursor:not-allowed}.button:disabled:hover{border-color:var(--slate-400);color:var(--white);background:0 0}.button-secondary{border-color:var(--slate-600);color:var(--slate-300)}.button-secondary:hover{background:var(--slate-700);border-color:var(--slate-500);color:var(--white)}.button-danger{color:#ef4444;border-color:#ef4444}.button-danger:hover{color:var(--white);background:#ef4444;border-color:#ef4444}.search-bar{width:100%;max-width:600px;margin-bottom:32px}.search-input{background:var(--slate-800);border:1px solid var(--slate-600);width:100%;min-height:44px;color:var(--white);padding:12px 16px;font-family:Inter,sans-serif;font-size:max(1rem,16px);transition:border-color .2s cubic-bezier(.19,1,.22,1)}.search-input::placeholder{color:var(--slate-400)}.search-input:hover{border-color:var(--slate-500)}.search-input:focus{border-color:var(--amber)}.recipe-table{width:100%}.table-header{border-bottom:1px solid var(--slate-700);grid-template-columns:1fr 150px 120px;gap:24px;margin-bottom:8px;padding:12px 16px;display:grid}.table-header-cell{letter-spacing:.05em;text-transform:uppercase;color:var(--slate-400);font-family:Barlow Condensed,sans-serif;font-size:12px;font-weight:600}.table-header-cell:nth-child(2),.table-header-cell:nth-child(3){text-align:right}.recipe-row{border-bottom:1px solid var(--slate-700);cursor:pointer;grid-template-columns:1fr 150px 120px;align-items:center;gap:24px;min-height:44px;padding:16px;transition:background .15s cubic-bezier(.19,1,.22,1);display:grid}@media (prefers-reduced-motion:no-preference){.recipe-row{transition:background .15s cubic-bezier(.19,1,.22,1)}}.recipe-row:hover{background:var(--slate-800)}.recipe-name{letter-spacing:.02em;text-transform:uppercase;color:var(--white);font-family:Barlow Condensed,sans-serif;font-size:18px;font-weight:600}.recipe-cuisine{color:var(--amber);text-align:right;font-family:Barlow Condensed,sans-serif;font-size:16px;font-weight:600}.recipe-ingredients-count{color:var(--slate-300);text-align:right;font-variant-numeric:tabular-nums;font-family:Inter,sans-serif;font-size:14px}.empty-state{text-align:center;padding:80px 20px}.empty-message{letter-spacing:.05em;text-transform:uppercase;color:var(--slate-500);margin-bottom:24px;font-family:Barlow Condensed,sans-serif;font-size:20px;font-weight:600}.detail-container{max-width:900px}.detail-header{justify-content:space-between;align-items:flex-start;margin-bottom:40px;display:flex}.detail-title{letter-spacing:.02em;text-transform:uppercase;color:var(--white);margin-bottom:8px;font-family:Barlow Condensed,sans-serif;font-size:32px;font-weight:700}.detail-meta{color:var(--slate-400);margin-bottom:12px;font-family:Inter,sans-serif;font-size:14px}.detail-cuisine{color:var(--amber);font-family:Barlow Condensed,sans-serif;font-size:16px;font-weight:600}.detail-description{color:var(--slate-300);font-family:Inter,sans-serif;font-size:16px;line-height:1.6}.detail-actions{gap:12px;display:flex}.detail-section{border-bottom:1px solid var(--slate-700);margin-bottom:40px;padding-bottom:40px}.detail-section:last-child{border-bottom:none}.section-heading{letter-spacing:.05em;text-transform:uppercase;color:var(--slate-400);margin-bottom:20px;font-family:Barlow Condensed,sans-serif;font-size:16px;font-weight:600}.ingredients-list{list-style:none}.ingredients-list li{color:var(--white);padding:8px 0 8px 24px;font-family:Inter,sans-serif;font-size:16px;position:relative}.ingredients-list li:before{content:"•";color:var(--amber);font-weight:700;position:absolute;left:0}.steps-list{counter-reset:step-counter;list-style:none}.steps-list li{color:var(--white);counter-increment:step-counter;padding:12px 0 12px 40px;font-family:Inter,sans-serif;font-size:16px;position:relative}.steps-list li:before{content:counter(step-counter);background:var(--slate-700);width:28px;height:28px;color:var(--amber);border-radius:50%;justify-content:center;align-items:center;font-size:14px;font-weight:600;display:flex;position:absolute;left:0}.form-container{max-width:700px}.form-title{letter-spacing:.02em;text-transform:uppercase;color:var(--white);margin-bottom:32px;font-family:Barlow Condensed,sans-serif;font-size:28px;font-weight:700}.form-group{margin-bottom:24px}.form-label{letter-spacing:.05em;text-transform:uppercase;color:var(--slate-400);margin-bottom:8px;font-family:Barlow Condensed,sans-serif;font-size:13px;font-weight:600;display:block}.form-input,.form-textarea,.form-select{background:var(--slate-800);border:1px solid var(--slate-600);width:100%;min-height:44px;color:var(--white);padding:12px 16px;font-family:Inter,sans-serif;font-size:max(1rem,16px);transition:border-color .2s cubic-bezier(.19,1,.22,1)}.form-input:hover,.form-textarea:hover,.form-select:hover{border-color:var(--slate-500)}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--amber)}.form-textarea{resize:vertical;min-height:100px;line-height:1.6}.form-select{cursor:pointer}.form-error{color:#ef4444;margin-top:6px;font-family:Inter,sans-serif;font-size:13px}.dynamic-list{margin-top:12px}.dynamic-list-item{align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.dynamic-list-input{flex:1}.button-small{min-width:auto;padding:8px 16px;font-size:13px}.form-actions{border-top:1px solid var(--slate-700);gap:12px;margin-top:40px;padding-top:24px;display:flex}@media (width<=768px){.app-container{padding:32px 24px}.header{flex-direction:column;align-items:flex-start;gap:20px}.app-title{font-size:24px}.table-header{grid-template-columns:1fr 100px;gap:16px}.table-header-cell:nth-child(3){display:none}.recipe-row{grid-template-columns:1fr 100px;gap:16px}.recipe-ingredients-count{display:none}.recipe-name{font-size:16px}.recipe-cuisine{font-size:14px}.detail-header{flex-direction:column}.detail-title{margin-bottom:16px;font-size:24px}.detail-actions{width:100%}.detail-actions .button{flex:1}.form-actions{flex-direction:column}.form-actions .button{width:100%}}@media (width<=480px){.app-container{padding-inline:1rem}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}@media (width<=480px){body,.container,[class*=container],section,header,footer,nav,main,article{padding-inline:max(1rem,16px)}}p,li,dt,dd,blockquote,figcaption,td,th{max-width:min(75ch,100%)}
