:root{--p:#2d8a8d;--bg:#f5f7fa;--w:#fff;--t:#1a1a1a;--t2:#666;--b:#e0e0e0;--tag-bg:#f0f0f0;--font:sans-serif;--hover:#fafafa;--sub:#81c784;--tooltip-bg:#333;--tooltip-t:#fff}[data-theme=dark]{--p:#4db6ac;--bg:#121212;--w:#1e1e1e;--t:#e0e0e0;--t2:#a0a0a0;--b:#333;--tag-bg:#2c2c2c;--font:"Inter", system-ui, -apple-system, sans-serif;--hover:#252525;--sub:#66bb6a;--tooltip-bg:#eee;--tooltip-t:#121212}body{font-family:var(--font);color:var(--t);background-color:var(--bg);background-image:url(/backgroundday.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;min-height:100vh;margin:0;padding:20px;line-height:1.5;transition:color .3s,background-image .5s}[data-theme=dark] body{background-image:url(/background.jpg)}body:before{content:"";z-index:-1;pointer-events:none;background:#ffffff4d;transition:background .3s;position:fixed;inset:0}[data-theme=dark] body:before{background:#0009}[data-theme=dark] .card{background:#1e1e1ea8}.card{background:#ffffffa8}.container{max-width:1200px;margin:0 auto;position:relative}header{text-align:center;margin-bottom:30px;position:relative}h1{color:var(--p);text-shadow:0 2px 4px #0000004d;margin:0;font-size:2.2rem;display:inline-block}.theme-toggle{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:pointer;color:#fff;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;padding:5px;font-size:1.5rem;transition:transform .3s;position:absolute;top:0;right:0}.theme-toggle:hover{background:#ffffff4d;transform:rotate(20deg)scale(1.1)}.layout{grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (width<=768px){.layout{grid-template-columns:1fr}}.card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:20px;transition:background .3s;box-shadow:0 8px 24px #00000026}.scope-nav{background:var(--tag-bg);border-radius:8px;margin-top:20px;margin-bottom:20px;padding:4px;display:flex}.scope-btn{cursor:pointer;color:var(--t2);background:0 0;border:none;border-radius:6px;flex:1;padding:8px;font-weight:600;transition:all .2s}.scope-btn.active{background:var(--w);color:var(--p);box-shadow:0 2px 4px #0000001a}.filter-header{text-transform:uppercase;letter-spacing:1px;color:var(--t2);text-shadow:0 1px 2px #0000001a;border-bottom:1px solid var(--b);margin:25px 0 10px;padding-bottom:4px;font-size:.85rem;font-weight:700}.filter-header:first-of-type{margin-top:0}.tags{flex-wrap:wrap;gap:8px;min-height:20px;margin-bottom:10px;transition:opacity .3s;display:flex}.tag{cursor:pointer;background:var(--tag-bg);color:var(--t);box-sizing:border-box;border:1px solid #0000;border-radius:20px;padding:6px 14px;font-size:.9rem;transition:all .1s}.tag:hover{border-color:var(--p);transform:translateY(-1px);box-shadow:0 2px 5px #0000001a}.tag.c1{color:#1565c0;background:#e3f2fd}[data-theme=dark] .tag.c1{color:#90caf9;background:#1a3b5c;border:1px solid #1565c0}.tag.c1.active{background:#1565c0;color:#fff!important}.tag.c2{color:#c2185b;background:#fce4ec}[data-theme=dark] .tag.c2{color:#f48fb1;background:#4a1b32;border:1px solid #c2185b}.tag.c2.active{background:#c2185b;color:#fff!important}.tag.c3{color:#2e7d32;background:#e8f5e9}[data-theme=dark] .tag.c3{color:#a5d6a7;background:#1b3e20;border:1px solid #2e7d32}.tag.c3.active{background:#2e7d32;color:#fff!important}.tag.c4{color:#ef6c00;background:#fff3e0}[data-theme=dark] .tag.c4{color:#ffcc80;background:#4e2c0b;border:1px solid #ef6c00}.tag.c4.active{background:#ef6c00;color:#fff!important}.tag.c5{color:#7b1fa2;background:#f3e5f5}[data-theme=dark] .tag.c5{color:#ce93d8;background:#32193b;border:1px solid #7b1fa2}.tag.c5.active{background:#7b1fa2;color:#fff!important}.tag.ingredient{font-weight:500}.tag.ingredient.active{box-shadow:0 0 0 1px var(--t) inset;transform:scale(.98);border-color:var(--t)!important}.tag.volume{background:var(--tag-bg);color:var(--t2);border:1px solid var(--b);align-items:center;gap:6px;font-weight:600;display:flex}.tag.volume.active{color:#fff;background:#333;border-color:#333}[data-theme=dark] .tag.volume.active{color:#121212;background:#eee;border-color:#eee}.tag.strength{color:#fff;opacity:.6;border:none;font-weight:700;transition:opacity .2s,transform .2s}.tag.strength:hover{opacity:.8;transform:translateY(-1px)}.tag.strength.active{opacity:1;transform:scale(1.05);box-shadow:0 2px 8px #0003}.tag.strength.zero{background-color:#4fc3f7}.tag.strength.low{background-color:#81c784}.tag.strength.med{background-color:#ffb74d}.tag.strength.high{background-color:#e57373}.actions{flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;flex:1;min-width:80px;padding:12px;font-size:1rem;font-weight:700;transition:all .2s}.btn-primary{background:var(--p);color:#fff}.btn-primary:disabled{background:var(--b);color:var(--t2);cursor:not-allowed}.btn-secondary{background:var(--tag-bg);color:var(--t)}.toggle-wrapper{color:var(--t2);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;margin-right:10px;font-size:.9rem;display:flex}.toggle{background:var(--b);border-radius:20px;flex-shrink:0;width:36px;height:18px;transition:all .3s;position:relative}.toggle:after{content:"";background:var(--w);border-radius:50%;width:14px;height:14px;transition:all .3s;position:absolute;top:2px;left:2px}input[type=checkbox]{display:none}input:checked+.toggle{background:var(--p)}input:checked+.toggle:after{left:20px}.item{border:1px solid var(--b);color:inherit;border-radius:8px;align-items:flex-start;gap:15px;margin-bottom:10px;padding:15px;text-decoration:none;transition:all .2s;display:flex;position:relative}.item:hover{border-color:var(--p);background:var(--hover);transform:translate(4px)}.thumb{object-fit:cover;background:var(--b);border-radius:8px;flex-shrink:0;width:60px;height:60px}.info{flex:1;overflow:hidden}.name-row{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.name{color:var(--p);font-size:1.1rem;font-weight:700}.meta{color:var(--t2);font-size:.9rem;line-height:1.4}.badge{color:#fff;white-space:nowrap;border-radius:4px;margin-left:8px;padding:2px 6px;font-size:.75rem;font-weight:700}.badge.abv-zero{color:#01579b;background:#4fc3f7}.badge.abv-low{color:#1b5e20;background:#81c784}.badge.abv-med{color:#e65100;background:#ffb74d}.badge.abv-high{color:#fff;background:#e57373}.badge.sub{background:var(--sub);color:#1b5e20;cursor:help}.badge.sub:hover:after{content:attr(data-tooltip);background:var(--tooltip-bg);color:var(--tooltip-t);white-space:normal;z-index:10;pointer-events:none;border-radius:6px;width:max-content;max-width:250px;padding:8px 12px;font-size:.8rem;font-weight:400;line-height:1.4;position:absolute;bottom:120%;right:0;box-shadow:0 4px 12px #0003}.error-banner{color:#c62828;background:#ffebee;border-left:5px solid #c62828;border-radius:8px;margin-bottom:20px;padding:15px;display:block}.lucky-wrapper{z-index:10;position:absolute;top:20px;right:20px}.lucky-row{gap:6px;display:flex}.lucky-btn{background:var(--tag-bg);border:2px solid var(--p);color:var(--p);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1.2rem;transition:all .2s;display:flex}.lucky-btn:hover{background:var(--p);color:#fff;transform:rotate(15deg)scale(1.1);box-shadow:0 4px 10px #0000001a}.ai-overlay{z-index:100;background:#0000008c;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.ai-dialog{background:var(--w);color:var(--t);border-radius:12px;flex-direction:column;gap:14px;width:min(600px,100%);max-height:85vh;padding:20px;display:flex;box-shadow:0 16px 48px #00000059}.ai-dialog-header{justify-content:space-between;align-items:center;display:flex}.ai-dialog-title{color:var(--p);font-size:1.05rem;font-weight:700}.ai-close{cursor:pointer;color:var(--t2);background:0 0;border:none;border-radius:6px;padding:4px 8px;font-size:1.1rem}.ai-close:hover{background:var(--hover);color:var(--t)}.ai-form{flex-direction:column;gap:10px;display:flex}.ai-input{box-sizing:border-box;border:1px solid var(--b);background:var(--bg);width:100%;color:var(--t);resize:vertical;border-radius:8px;padding:10px 12px;font-family:inherit;font-size:.95rem}.ai-input:focus{border-color:var(--p);outline:none}.ai-actions{justify-content:flex-end;display:flex}.ai-loading{color:var(--t2);font-size:.9rem;font-style:italic}.ai-error{color:#c62828;background:#ffebee;border-left:4px solid #c62828;border-radius:8px;padding:10px 12px;font-size:.9rem}[data-theme=dark] .ai-error{color:#ef9a9a;background:#3a1a1a;border-left-color:#ef5350}.ai-response{flex-direction:column;gap:12px;display:flex;overflow-y:auto}.ai-response p{margin:0;line-height:1.6}.ai-suggestions{flex-direction:column;gap:10px;display:flex}