:root{--bg: #faf9f7;--surface: #ffffff;--text: #1a1a1a;--muted: #5c5c5c;--border: #e5e2dc;--accent: #c45d3a;--accent-hover: #a84d30;--danger: #b33;--radius: 8px;--shadow: 0 1px 3px rgba(0, 0, 0, .08);font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5;color:var(--text);background:var(--bg)}@media(prefers-color-scheme:dark){:root{--bg: #121212;--surface: #1e1e1e;--text: #f0f0f0;--muted: #a0a0a0;--border: #333;--accent: #e07a5a;--accent-hover: #f09070;--danger: #f66;--shadow: 0 1px 3px rgba(0, 0, 0, .4)}}*{box-sizing:border-box}body{margin:0;min-height:100vh}#app{min-height:100vh;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:var(--shadow)}.logo{font-size:1.25rem;font-weight:700;color:var(--text);text-decoration:none}.header-auth{display:flex;align-items:center;gap:.75rem;font-size:.9rem}.header-user{color:var(--muted);max-width:14rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-panel{max-width:24rem;margin:2rem auto 0}.auth-lead{color:var(--muted);margin:0 0 1.25rem}.auth-form.hidden{display:none}.auth-status{margin-top:1rem;color:var(--muted)}.auth-status.error{color:var(--danger)}.auth-links{margin:.75rem 0 0}.auth-link{background:none;border:none;padding:0;font:inherit;color:var(--accent);cursor:pointer;text-decoration:underline}.auth-link:hover{color:var(--accent-hover)}.app-nav{display:flex;gap:.75rem}.app-main{flex:1;max-width:52rem;width:100%;margin:0 auto;padding:1.5rem}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:.9rem;cursor:pointer;text-decoration:none}.btn:hover{border-color:var(--muted)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn-danger{color:var(--danger);border-color:var(--danger)}.btn-ghost{border:none;background:transparent;color:var(--muted)}.page-title{margin:0 0 1rem;font-size:1.75rem}.search-input{width:100%;padding:.6rem .75rem;margin-bottom:1rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:1rem}.recipe-list{list-style:none;padding:0;margin:0}.recipe-list li{margin-bottom:.5rem}.recipe-list a{display:block;padding:.85rem 1rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:var(--text);box-shadow:var(--shadow)}.recipe-list a:hover{border-color:var(--accent)}.recipe-list .meta{font-size:.85rem;color:var(--muted);margin-top:.25rem}.empty-state{text-align:center;padding:3rem 1rem;color:var(--muted)}.empty-state .btn{margin-top:1rem}.section{margin-bottom:1.5rem}.section h2{font-size:1.1rem;margin:0 0 .5rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600}.introduction{white-space:pre-wrap;background:var(--surface);padding:1rem;border-radius:var(--radius);border:1px solid var(--border)}.ingredient-list,.step-list{margin:0;padding-left:1.25rem}.ingredient-list li,.step-list li{margin-bottom:.35rem}.form-group{margin-bottom:1rem}.form-group label{display:block;font-weight:600;margin-bottom:.35rem;font-size:.9rem}.form-group input,.form-group textarea,.form-group select{width:100%;padding:.5rem .75rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit}.form-group textarea{min-height:6rem;resize:vertical}.list-editor{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:.5rem}.list-editor-row{display:flex;gap:.5rem;margin-bottom:.5rem;align-items:flex-start}.list-editor-row input{flex:1;padding:.4rem .5rem;border:1px solid var(--border);border-radius:4px;background:var(--bg);color:var(--text);font:inherit}.list-editor-row .row-actions{display:flex;flex-direction:column;gap:2px}.list-editor-row .row-actions button{padding:.15rem .4rem;font-size:.75rem;border:1px solid var(--border);background:var(--bg);cursor:pointer;border-radius:3px}.import-actions{display:flex;gap:.75rem;margin-top:1.5rem;flex-wrap:wrap}.drop-zone{border:2px dashed var(--border);border-radius:var(--radius);padding:2rem;text-align:center;color:var(--muted);margin-bottom:1rem;cursor:pointer}.drop-zone.dragover{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}.drop-zone input{display:none}.loading{text-align:center;padding:2rem;color:var(--muted)}.detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.detail-actions{display:flex;gap:.5rem}.source-badge{display:inline-block;font-size:.75rem;padding:.15rem .5rem;border-radius:4px;background:var(--border);color:var(--muted);text-transform:uppercase;margin-left:.5rem}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);background:var(--text);color:var(--bg);padding:.75rem 1.25rem;border-radius:var(--radius);box-shadow:var(--shadow);z-index:100;max-width:90vw}.error{color:var(--danger)}.hidden{display:none!important}
