:root{--text:#2c2a30;--text-muted:#6b6375;--bg:#f6f5f8;--panel-bg:#fff;--border:#e2e0e6;--accent:#7c3aed;--accent-hover:#6d28d9;--danger:#dc2626;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font:15px/1.5 var(--sans)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#e5e3e8;--text-muted:#9ca3af;--bg:#16171d;--panel-bg:#1f2028;--border:#2e303a;--accent:#a78bfa;--accent-hover:#c4b5fd}}*{box-sizing:border-box}body{margin:0}#root{min-height:100svh}button{font:inherit;cursor:pointer;border:1px solid var(--border);background:var(--panel-bg);color:var(--text);border-radius:6px;padding:6px 12px}button:hover{border-color:var(--accent)}button:disabled{opacity:.6;cursor:default}input,select,textarea{font:inherit;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:6px;width:100%;padding:6px 8px}input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:-1px}img{max-width:100%}.center-screen{justify-content:center;align-items:center;min-height:100svh;display:flex}.login-card{text-align:center;border:1px solid var(--border);background:var(--panel-bg);border-radius:12px;padding:40px}.login-card h1{margin:0 0 4px}.login-card p{color:var(--text-muted);margin:0 0 24px}.discord-login{color:#fff;background:#5865f2;border-radius:8px;padding:10px 20px;font-weight:600;text-decoration:none;display:inline-block}.discord-login:hover{background:#4752c4}.app{flex-direction:column;height:100svh;display:flex}.app-header{border-bottom:1px solid var(--border);background:var(--panel-bg);flex-shrink:0;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex}.app-header h1{margin:0;font-size:18px}.header-left{align-items:center;gap:12px;display:flex}.burger-btn{background:0 0;border:none;padding:4px 8px;font-size:20px;line-height:1;display:none}.user-box{color:var(--text-muted);align-items:center;gap:12px;display:flex}.load-error{color:#991b1b;background:#fee2e2;padding:8px 20px}.app-body{flex:1;min-height:0;display:flex}.sidebar{border-right:1px solid var(--border);background:var(--panel-bg);flex-direction:column;flex-shrink:0;gap:24px;width:280px;padding:16px;display:flex;overflow-y:auto}.sidebar h2{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin:0 0 8px;font-size:13px}.section-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.section-header h2{margin:0}.type-list,.recipe-list{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex}.type-list li{cursor:pointer;border-radius:6px;padding:6px 8px}.type-list li:hover{background:var(--bg)}.type-list li.active{background:var(--accent);color:#fff}.new-type-form{gap:6px;margin-top:8px;display:flex}.recipe-list li{border-radius:6px;align-items:center;gap:4px;display:flex}.recipe-list li.active{background:var(--bg)}.recipe-list-row{cursor:pointer;flex:1;align-items:center;gap:8px;min-width:0;padding:6px 8px;display:flex}.recipe-list-row img{object-fit:contain;width:24px;height:24px}.recipe-list-row span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.recipe-list .empty{color:var(--text-muted);padding:6px 8px}.delete-btn{color:var(--text-muted);background:0 0;border:none;padding:4px 8px;font-size:18px;line-height:1}.delete-btn:hover{color:var(--danger);border:none}.main-panel{flex:1;padding:24px;overflow-y:auto}.empty-panel{color:var(--text-muted);text-align:center;margin-top:80px}.recipe-form{flex-direction:column;gap:16px;max-width:760px;margin:0 auto;display:flex}.recipe-form-header{justify-content:space-between;align-items:center;display:flex}.recipe-form-header h2{margin:0}.recipe-form>label{color:var(--text-muted);flex-direction:column;gap:4px;font-size:13px;display:flex}.field-row{flex-wrap:wrap;gap:16px;display:flex}.field-row>label{color:var(--text-muted);flex-direction:column;flex:1;gap:4px;min-width:140px;font-size:13px;display:flex}.field-row>label.checkbox{flex-direction:row;flex:none;align-items:center;gap:8px}.field-row>label.checkbox input{width:auto}.field-row>label.radio{flex-direction:row;flex:none;align-items:center;gap:6px}.field-row>label.radio input{width:auto}fieldset{border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:12px;padding:16px;display:flex}fieldset legend{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;padding:0 6px;font-size:13px}.ingredient-row{align-items:center;gap:8px;display:flex}.ingredient-row .item-picker{flex:1}.amount-input{flex:none;width:80px}.form-errors{color:#991b1b;background:#fee2e2;border-radius:6px;margin:0;padding:10px 16px}.recipe-form-actions{justify-content:flex-end;gap:8px;display:flex}button.danger{border-color:var(--danger);color:var(--danger)}button.danger:hover{background:var(--danger);color:#fff}.recipe-form-actions button[type=submit]{background:var(--accent);color:#fff;border-color:var(--accent)}.recipe-form-actions button[type=submit]:hover{background:var(--accent-hover)}.item-picker{position:relative}.item-picker-selected{border:1px solid var(--border);cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:4px 8px;display:flex}.item-picker-selected img{object-fit:contain;width:24px;height:24px}.item-picker-selected span:first-of-type{flex:1}.item-picker-change{color:var(--text-muted);font-size:12px}.item-picker-dropdown{z-index:20;background:var(--panel-bg);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:6px;max-height:320px;padding:8px;display:flex;position:absolute;top:calc(100% + 4px);left:0;right:0;box-shadow:0 8px 24px #00000026}.item-picker-dropdown ul{flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.item-picker-dropdown li{cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;display:flex}.item-picker-dropdown li:hover{background:var(--bg)}.item-picker-dropdown li img{object-fit:contain;width:22px;height:22px}.item-picker-noimg{background:var(--border);border-radius:4px;width:22px;height:22px;display:inline-block}.item-picker-label{flex:1}.item-picker-name{color:var(--text-muted);font-size:12px}.item-picker-empty{color:var(--text-muted);cursor:default}.item-picker-empty:hover{background:0 0}.sidebar-backdrop{display:none}@media (width<=768px){.burger-btn{display:inline-block}.app-body{position:relative}.sidebar{z-index:30;width:85vw;max-width:320px;transition:transform .2s;position:fixed;top:56px;bottom:0;left:0;transform:translate(-100%);box-shadow:8px 0 24px #00000026}.sidebar.open{transform:translate(0)}.sidebar-backdrop{z-index:20;background:#0006;display:block;position:fixed;inset:56px 0 0}.main-panel{padding:16px}}