:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#172033;background:#f5f7fb}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}main{width:min(100%,1100px);min-height:100vh;margin:auto;padding:3rem 1.5rem}header{display:flex;justify-content:space-between;align-items:end;gap:1rem}h1,h2,h3,p{margin-top:0}h1{margin-bottom:0;font-size:2.25rem}h2{margin-bottom:.3rem}h3{margin-bottom:.5rem}p{color:#64748b}.eyebrow{color:#2563eb;font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.09em}.app-shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;display:flex;flex-direction:column;height:100vh;padding:2rem 1rem;background:#fff;border-right:1px solid #dbe3f0}.sidebar-brand{display:grid;gap:.35rem;padding:0 .75rem 1.5rem}.sidebar nav{display:grid;gap:.25rem}.sidebar nav button,.link{color:#64748b;border:0;background:transparent;padding:.75rem;text-align:left;cursor:pointer}.sidebar nav button.active{color:#1d4ed8;background:#eff6ff;font-weight:700}.account{display:grid;gap:.35rem;margin-top:auto;padding:.75rem;color:#64748b;font-size:.9rem;border-top:1px solid #dbe3f0}.account .link{padding:.25rem 0;color:#1d4ed8}.menu-toggle{display:none}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:1.25rem}.section-title p{margin:0}.list-actions{display:flex;justify-content:flex-end;margin:-.5rem 0 1.25rem}.letter-navigation{position:fixed;z-index:5;right:1rem;bottom:1rem;display:flex;flex-direction:column;gap:.2rem;max-height:calc(100vh - 2rem);padding:.4rem;overflow-y:auto;background:#ffffffeb;border:1px solid #dbe3f0;border-radius:12px;box-shadow:0 4px 16px #17255418}.letter-navigation button{min-width:2.25rem;padding:.35rem .5rem;color:#1d4ed8;background:#fff;border-color:#bfdbfe}.beer-list{display:grid;gap:.7rem;padding-bottom:5rem}.filter-controls{position:fixed;z-index:6;bottom:1rem;left:calc(50% + 120px);transform:translate(-50%)}.filter-toggle{display:flex;align-items:center;gap:.4rem;padding:.45rem .7rem;color:#475569;background:#ffffffeb;border-color:#dbe3f0;box-shadow:0 2px 8px #17255418}.filter-toggle svg{width:1rem;height:1rem;fill:currentColor}.filter-panel{position:absolute;bottom:calc(100% + .5rem);left:50%;display:grid;gap:.65rem;width:min(320px,calc(100vw - 2rem));padding:1rem;background:#fff;border:1px solid #dbe3f0;border-radius:12px;box-shadow:0 8px 24px #17255422;transform:translate(-50%)}.filter-panel label{display:grid;gap:.25rem;color:#475569;font-size:.85rem}.abv-range{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.beer-row,.panel,.modal{background:#fff;border:1px solid #e4eaf3;border-radius:14px;box-shadow:0 2px 4px #17255408}.beer-row-summary{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.25rem;color:#172033;background:#fff;border:0;border-radius:14px;text-align:left}.beer-row-summary:hover{background:#f8fafc}.beer-row-summary h3{margin:.25rem 0 0}.beer-row-facts,.beer-details-facts{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.75rem;color:#64748b;font-size:.9rem}.beer-details-facts{justify-content:flex-start}.quantity{background:#dbeafe;color:#1d4ed8;border-radius:99px;padding:.25rem .6rem}.beer-details{max-height:calc(100vh - 2rem);overflow-y:auto}.beer-details h4{margin:0 0 .3rem}.beer-details p{margin:0;font-size:.9rem}.actions{display:flex;flex-wrap:wrap;gap:.5rem}button{background:#2563eb;border:1px solid #2563eb;color:#fff;border-radius:8px;padding:.55rem .8rem;cursor:pointer}button.secondary{color:#1d4ed8;background:#fff;border-color:#bfdbfe}button.danger{background:#dc2626;border-color:#dc2626}button:hover{filter:brightness(.96)}.panel{margin-top:1.5rem;padding:1.25rem}.panel-action{margin-top:1.25rem}.compact-form{display:flex;flex-wrap:wrap;gap:.7rem;align-items:center}.compact-form h3{width:100%}.beer-form{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}input,select,textarea{width:100%;border:1px solid #cbd5e1;border-radius:8px;padding:.6rem .7rem;background:#fff}textarea{min-height:5rem;resize:vertical}.beer-form textarea{grid-column:span 3}.compact-form input,.compact-form select{width:auto;flex:1 1 160px}.description{white-space:pre-wrap}.modal-backdrop{position:fixed;z-index:10;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:1rem;background:#17255480}.modal{position:relative;width:min(100%,440px);display:grid;gap:1rem;padding:1.5rem}.modal-close{position:absolute;top:.75rem;right:.75rem;display:grid;place-items:center;width:2rem;height:2rem;padding:0;color:#64748b;background:transparent;border:0}.modal-close svg{width:1.25rem;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2}.modal.beer-form{width:min(100%,720px);max-height:calc(100vh - 2rem);overflow-y:auto}.modal h3{margin:0}.modal label{display:grid;gap:.4rem;color:#475569}.chart-heading{display:flex;justify-content:space-between;align-items:start;gap:1rem}.chart-controls{display:flex;flex-wrap:wrap;align-items:end;gap:.5rem}.chart-controls label{display:grid;gap:.25rem;color:#64748b;font-size:.8rem}.chart-controls input{width:auto}.chart-container{overflow-x:auto}.style-chart{display:block;min-width:680px;width:100%;height:280px}.chart-axis{stroke:#cbd5e1}.chart-label{fill:#64748b;font-size:10px}.chart-tooltip rect{fill:#172554}.chart-tooltip text{fill:#fff;font-size:10px}.chart-legend{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin-top:.75rem;color:#475569;font-size:.85rem}.chart-legend span{display:flex;align-items:center;gap:.35rem}.chart-legend i{width:.75rem;height:.75rem;border-radius:2px}.stat,.user-row{display:flex;justify-content:space-between;padding:.75rem 0;border-bottom:1px solid #edf1f7}.user-identity{display:grid;gap:.15rem}.user-identity span{color:#64748b;font-size:.9rem}.stat:last-child,.user-row:last-child{border:0}.empty{grid-column:1/-1;text-align:center;padding:2rem}.toast{position:fixed;right:1.5rem;bottom:1.5rem;background:#172554;color:#fff;padding:.8rem 1rem;border-radius:8px;box-shadow:0 8px 24px #17255444}.login,.centered{display:grid;place-items:center}.login>div{width:min(100%,380px);background:#fff;padding:2rem;border-radius:16px;box-shadow:0 10px 35px #17255418}.login form{display:grid;gap:.8rem;margin-top:1.5rem}.notice{color:#b91c1c;margin:1rem 0 0}@media(max-width:700px){.app-shell{display:block}.sidebar{position:fixed;z-index:20;top:0;left:0;width:min(82vw,280px);transform:translate(-100%);transition:transform .2s ease;box-shadow:8px 0 24px #17255422}.sidebar.open{transform:translate(0)}.menu-toggle{display:block}main{padding:1.5rem 1rem}header{align-items:start}.beer-form{grid-template-columns:1fr}.beer-form textarea{grid-column:auto}.beer-row-summary{align-items:start;flex-direction:column}.beer-row-facts{justify-content:start}.chart-heading{flex-direction:column}.filter-controls{left:50%}}.checkout-history{display:grid;gap:.4rem;margin:0;padding:0;list-style:none}.checkout-history li{display:flex;justify-content:space-between;gap:1rem;color:#475569;font-size:.9rem}.checkout-history li span:last-child{text-align:right}.top-statistics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}.top-statistics-chart h3{margin-bottom:1rem}.top-statistics-chart ol{display:grid;gap:.65rem;margin:0;padding:0;list-style:none}.top-statistics-chart li{display:grid;grid-template-columns:minmax(6rem,1fr) minmax(4rem,2fr) auto;align-items:center;gap:.65rem}.top-statistics-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#475569;font-size:.9rem}.top-statistics-bar{height:.65rem;overflow:hidden;background:#dbe3f0;border-radius:999px}.top-statistics-bar i{display:block;height:100%;min-width:.25rem;background:#2563eb;border-radius:inherit}.top-statistics-chart strong{min-width:1.5rem;text-align:right}@media(max-width:700px){.top-statistics{grid-template-columns:1fr;gap:1.5rem}}.seasonal-chart-container{overflow-x:auto}.seasonal-view-toggle{display:flex;gap:.5rem;margin-bottom:1rem}.seasonal-heatmap{display:grid;grid-template-columns:8rem repeat(12,minmax(2.4rem,1fr));gap:.25rem;min-width:38rem;align-items:center}.seasonal-heatmap>strong:not(.seasonal-style-label){text-align:center;color:#64748b;font-size:.75rem}.seasonal-style-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#475569;font-size:.85rem}.seasonal-heatmap.by-month .seasonal-style-label{text-align:center;font-size:.75rem}.seasonal-heatmap-cell{min-height:2.25rem;display:grid;place-items:center;color:#172033;background:#f1f5f9;border-radius:4px;font-size:.8rem}.seasonal-chart-caption{margin:.8rem 0 0;font-size:.85rem}.suggestions{display:grid;gap:.75rem;margin:0 0 1.5rem;padding:1.25rem;background:#eff6ff;border:1px solid #bfdbfe;border-radius:14px}.suggestions h3,.suggestions p{margin:0}.suggestions .beer-list{grid-template-columns:repeat(3,minmax(0,1fr));padding:0}.suggestions .beer-row-summary{align-items:flex-start;flex-direction:column;padding:.85rem}.suggestions .beer-row-facts{justify-content:flex-start;gap:.45rem}@media(max-width:700px){.suggestions .beer-list{grid-template-columns:1fr}}