:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#292038;background:#fff9f1}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}header{background:linear-gradient(115deg,#44206f,#8a3b9c);color:white;padding:22px max(20px,calc((100vw - 1050px)/2));display:flex;justify-content:space-between;align-items:center;gap:12px}header h1{margin:0;font-size:1.7rem}header p{margin:3px 0 0;opacity:.8;font-size:.85rem}.shell{max-width:1050px;margin:auto;padding:22px 16px 90px}.card{background:white;border:1px solid #eae3ed;border-radius:18px;padding:20px;box-shadow:0 4px 18px #2d1a3d09}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}.stat strong{font-size:2rem;display:block;color:#52247b}.stat span{color:#71677a;font-size:.82rem}.progress{height:10px;background:#eee6f0;border-radius:99px;overflow:hidden}.progress>div{height:100%;background:#08a5a1}.toolbar{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0}.toolbar input{flex:1;min-width:180px}input,select,textarea{border:1px solid #d7cedc;border-radius:10px;padding:11px;background:white;color:#292038;max-width:100%}button{border:0;border-radius:10px;padding:11px 15px;background:#512579;color:white;font-weight:650}button.secondary{background:#f0e8f6;color:#4d217a}button.ghost{background:transparent;border:1px solid #d6c7df;color:inherit}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:12px}.flavor{display:flex;flex-direction:column;gap:9px;min-height:160px}.flavor h3{margin:0;font-size:1.1rem}.flavor p{margin:0;color:#70657a;font-size:.82rem}.tag{display:inline-block;background:#f3e8fa;color:#67318a;border-radius:20px;padding:4px 9px;font-size:.72rem;font-weight:700}.tag.limited{background:#fff0d2;color:#95540b}.flavor .bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:center}.stars{color:#d38913;font-weight:700}.muted{color:#766b7d}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.tabs{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}.tabs button.active{background:#512579;color:white}.tabs button{background:#efe7f3;color:#552b73}.overlay{position:fixed;inset:0;background:#20152ab5;display:flex;align-items:center;justify-content:center;padding:14px;z-index:10}.modal{background:white;border-radius:20px;padding:24px;max-width:520px;width:100%;max-height:92vh;overflow:auto}.modal h2{margin-top:0}.field{display:flex;flex-direction:column;gap:6px;margin:12px 0}.field label{font-size:.87rem;font-weight:650}.field input,.field select,.field textarea{width:100%}.checks{display:flex;gap:18px;margin:12px 0;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:7px}.actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}.hint{font-size:.82rem;color:#756b7b}.error{color:#a5244c}.compare{width:100%;border-collapse:collapse}.compare th,.compare td{text-align:left;padding:11px;border-bottom:1px solid #eee5ef}.compare-wrap{overflow-x:auto}.auth{max-width:460px;margin:45px auto}.empty{text-align:center;padding:50px;color:#766b7d}@media(max-width:540px){header{padding:18px}header h1{font-size:1.35rem}.shell{padding:15px 12px 80px}.stat{padding:13px}.stat strong{font-size:1.6rem}.stats{gap:7px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.flavor{padding:14px;min-height:155px}.flavor h3{font-size:.98rem}.flavor button{padding:9px 10px;font-size:.85rem}.toolbar>*{flex:1}.toolbar input{flex-basis:100%}}

.auth h1{font-size:1.8rem;line-height:1.2;margin:12px 0}.auth-mark{font-size:2.5rem}.eyebrow{font-size:.75rem;letter-spacing:.12em;color:#67318a;font-weight:750}.auth-submit{width:100%;margin-top:8px}.auth-switch{border-top:1px solid #eee5ef;margin-top:24px;padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:12px}.auth-switch p{font-size:.9rem}.friend-section{margin-top:16px}.friend-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-top:1px solid #eee5ef;overflow-wrap:anywhere}.friend-row .actions{margin:0}.code-row{display:flex;gap:10px;margin:8px 0}.friend-code{font-family:monospace;font-size:1.15rem;letter-spacing:.05em;min-width:0;flex:1}.friend-picker{border:1px solid #eae3ed;border-radius:12px;margin:18px 0;padding:14px;display:flex;gap:16px;flex-wrap:wrap}.friend-picker label{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.compare caption{text-align:left;font-size:.85rem;color:#756b7b;padding:12px 0}.compare th[scope=row]{font-weight:500}button:disabled{opacity:.6;cursor:wait}button:focus-visible,input:focus-visible{outline:3px solid #08a5a1;outline-offset:3px}@media(max-width:540px){.auth{margin:20px auto}.friend-row{align-items:flex-start;flex-direction:column}.code-row{flex-wrap:wrap}.auth-switch{align-items:flex-start;flex-direction:column}.friend-picker{flex-direction:column}}

.tasting-entry{border-top:1px solid #eee5ef;padding:14px 0}.tasting-entry time{font-size:.82rem;color:#756b7b}.tasting-notes{white-space:pre-wrap;overflow-wrap:anywhere;margin-bottom:0}#clear-search:disabled{cursor:default}

[hidden]{display:none!important}

.dashboard-summary{margin:24px 0}.dashboard-summary h2{margin-bottom:6px}.dashboard-summary h3{font-size:1rem;margin:22px 0 10px}.dashboard-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}.dashboard-button{text-align:left;color:#512579;display:flex;flex-direction:column;gap:6px;min-height:130px;background:white;border:1px solid #dfd2e8}.dashboard-button strong{font-size:2rem;line-height:1.1}.dashboard-button span{font-size:.95rem}.dashboard-button small{font-weight:400;color:#756b7b;margin-top:auto}.dashboard-button:hover{background:#f7effc;border-color:#8957ab}.dashboard-button:focus-visible,.summary-flavor:focus-visible{outline:3px solid #08a5a1;outline-offset:3px}.summary-modal{max-width:680px}.summary-list{display:grid;gap:10px;margin-top:16px}.summary-flavor{display:flex;flex-direction:column;gap:9px;text-align:left;background:#fff9f1;color:#292038;border:1px solid #eae3ed;padding:16px}.summary-flavor>.row{width:100%}.summary-flavor .tag{align-self:flex-start}.summary-status{font-size:.85rem;font-weight:400}.summary-flavor:hover{background:#f3e8fa}@media(max-width:540px){.dashboard-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.dashboard-button{padding:15px;min-height:120px}.summary-modal{padding:18px}}

.dashboard-overview{padding:14px 18px}.dashboard-overview h2{font-size:1rem;margin:0 0 10px}.overview-counts{display:flex;flex-wrap:wrap;gap:8px 22px;margin:0}.overview-counts>div{display:flex;align-items:baseline;gap:8px}.overview-counts dt{font-size:.82rem;color:#71677a}.overview-counts dd{margin:0;font-size:1.05rem;font-weight:750;color:#512579}.overview-personal{border-top:1px solid #eee5ef;padding-top:9px;margin-top:9px}.dashboard-overview .hint{margin:9px 0 0;font-size:.75rem}@media(max-width:540px){.dashboard-overview{padding:12px}.overview-counts{gap:6px 16px}.overview-counts dt{font-size:.76rem}.overview-counts dd{font-size:1rem}}

.caffeine-badge{display:block;align-self:flex-start;font-size:.72rem;font-weight:600;color:#674478;background:#f1eaf6;border-radius:8px;padding:3px 7px}.caffeine-badge.caffeine-free{color:#22694b;background:#e7f6ed}.taste-profile{display:block;font-size:.8rem;color:#71677a;font-weight:400;overflow-wrap:anywhere}.shared-details{border-top:1px solid #eae3ed;border-bottom:1px solid #eae3ed;margin:16px 0;padding:8px 0}.shared-details h3{font-size:1rem}.field label select,.field label input{display:block;margin-top:6px;width:100%}

.flavor-photo{width:100%;height:130px;object-fit:contain;background:#f8f4fa;border-radius:12px}.modal>.flavor-photo,.photo-editor .flavor-photo{height:220px;margin:12px 0}.collection-note,.release-badge{display:block;font-size:.75rem;color:#695177}.release-badge{background:#fff0d2;padding:3px 6px;border-radius:5px;align-self:flex-start}.feature-tools{margin-top:20px}.feature-tools .actions{justify-content:flex-start}.feature-page{margin-top:16px}.feature-list{display:grid;gap:9px}.feature-flavor{display:flex;flex-direction:column;gap:6px;text-align:left}.feature-flavor span{font-size:.8rem;font-weight:400}.progress-list>div{display:flex;justify-content:space-between;border-bottom:1px solid #eee5ef;padding:8px 0;gap:12px}.progress-list dd{margin:0;font-weight:600}.comparison-insights{margin-top:25px;border-top:1px solid #eae3ed;padding-top:15px}.comparison-insights details{border-bottom:1px solid #eae3ed;padding:12px 0}.comparison-insights summary{cursor:pointer;font-weight:650}.comparison-insights li{padding:6px 0}.suggestion-controls{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:14px 0}.suggestion-controls select{margin-left:8px}.photo-editor{border-top:1px solid #eae3ed;margin-top:20px}.photo-choice{display:block;margin:12px 0;font-size:.85rem}.photo-choice input{display:block;width:100%;margin-top:6px}.tasting-entry p{white-space:pre-wrap;overflow-wrap:anywhere}.feature-page h2{font-size:1.4rem}@media(max-width:540px){.flavor-photo{height:100px}.feature-tools .actions button{flex:1 1 45%;font-size:.85rem}.progress-list{font-size:.85rem}}

/* Read-only facts in the flavor details dialog. */
.flavor-facts-panel{background:#faf7fc;border:1px solid #e8dfee;border-radius:14px;padding:18px;margin:20px 0}
.flavor-facts-panel h3{margin:0 0 16px;font-size:1rem}
.flavor-facts-list{margin:0;display:grid;gap:16px}
.flavor-fact-row{display:grid;gap:7px}
.flavor-fact-row dt{font-size:.75rem;font-weight:600;color:#74657d}
.flavor-fact-row dd{margin:0;color:#382644;font-size:.95rem;line-height:1.5;overflow-wrap:anywhere}
.flavor-facts-panel .caffeine-badge{display:inline-block;width:auto;padding:5px 10px;border-radius:999px;font-size:.8rem;line-height:1.35}
.flavor-facts-panel .flavor-taste-value{font-weight:500}
.flavor-facts-panel .facts-edit-hint{border-top:1px solid #e8dfee;padding-top:12px;margin:16px 0 0;font-size:.72rem;line-height:1.5;color:#7b6e83}
.flavor-facts-panel .facts-edit-hint strong{font-weight:500}
/* Loaded Tea inspired branding trial */
:root{--brand-purple:#5c20b5;--brand-deep:#3e087e;color:#342044;background:#eac0fa;font-family:"Avenir Next","Trebuchet MS",system-ui,sans-serif}
body{min-height:100vh;background:linear-gradient(160deg,#cce5ff 0%,#ded0ff 38%,#f1bafa 100%);background-attachment:fixed}
header{background:linear-gradient(110deg,#9812fc,#c30be6 48%,#f000b8);padding-top:25px;padding-bottom:25px;box-shadow:0 3px 0 #ffffff45}
header h1{font-weight:900;letter-spacing:-.045em;font-size:1.9rem;color:white}header p{opacity:1;color:#fff1ff}header .ghost{background:#ffffff12;border-radius:999px}
h1,h2,h3{color:var(--brand-deep);font-weight:850;letter-spacing:-.025em}
.shell{padding-top:26px}.card{border:2px solid #7138b4;border-radius:16px;box-shadow:0 5px 0 #6024aa0c}
.progress{height:12px;background:#eee2fc}.progress>div{background:linear-gradient(90deg,#7632db,#ed15b8)}
button{background:var(--brand-purple);border-radius:14px;font-weight:750;min-height:44px}
button:hover:not(:disabled){background:#49118e}
button.secondary,.tabs button{background:#f7eaff;color:#511595;border:1px solid #d9bcef}
button.secondary:hover:not(:disabled),.tabs button:hover:not(:disabled){background:#ecd4fc;color:#3e087e}
.tabs{gap:9px}.tabs button{border-radius:999px;padding:11px 17px}.tabs button.active{background:var(--brand-deep);color:white;border-color:var(--brand-deep)}
input,select,textarea{border:1.5px solid #ac81d1;color:#3e1764;background:white;border-radius:13px}
.toolbar{gap:10px;margin:22px 0}.toolbar select{border:2px solid #6928b8;border-radius:999px;font-size:.88rem}.toolbar input{border:2px solid #6928b8;border-radius:999px}.toolbar #clear-search{border-radius:999px}
.grid{gap:16px}.flavor{border:2px solid #6928b8;border-radius:13px;padding:17px;gap:12px;box-shadow:none}
.flavor h3{text-align:center;font-size:1.4rem;line-height:1.15;font-weight:900;color:var(--brand-purple);overflow-wrap:anywhere;margin:4px 0}
.flavor-photo{height:auto;aspect-ratio:1;object-fit:contain;background:white;border-radius:5px}
.flavor .taste-profile{text-align:center;color:#3b2c46;font-size:.87rem;line-height:1.5;min-height:2.7em}
.flavor .caffeine-badge{align-self:center;border:1px solid #d6b8ed;border-radius:999px;background:#f6ecff;color:#56218b;padding:4px 9px;font-size:.7rem}
.flavor .caffeine-badge.caffeine-free{background:#effaef;border-color:#b9daba;color:#256043}
.flavor .bottom{gap:7px;padding-top:5px}.flavor .bottom button{flex:1;border-radius:13px}.flavor .stars:empty{display:none}
.tag{background:#eee1ff;color:#59209a;font-size:.68rem}.tag.limited{background:#fff0d8;color:#814509}
.flavor .collection-note,.flavor>p{font-size:.78rem;line-height:1.5;color:#756080}
.dashboard-overview{background:#fffcff;border-color:#c4a1e1}.overview-counts dd,.stat strong{color:var(--brand-purple)}
.dashboard-button{color:var(--brand-deep);background:white;border:2px solid #ba91db}.dashboard-button:hover:not(:disabled){background:#f6eaff;color:var(--brand-deep)}
.summary-flavor{background:#faf2ff;color:#342044}.summary-flavor:hover:not(:disabled){background:#f0dfff;color:#342044}
.modal{border:2px solid #6928b8;box-shadow:0 16px 70px #30065940;border-radius:20px}.modal h2{font-weight:850;color:var(--brand-purple)}
.modal>.flavor-photo,.photo-editor .flavor-photo{height:220px;aspect-ratio:auto}
.flavor-facts-panel{background:#f8efff;border-color:#dfc5f0}.flavor-fact-row dd{color:#45205f}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #008a9d;outline-offset:3px}
.auth{border-color:#6928b8}.auth h1{color:var(--brand-deep)}
@media(max-width:540px){header{padding:22px 16px}header h1{font-size:1.45rem}header p{font-size:.8rem}header button{font-size:.82rem;padding:9px 12px}.shell{padding:18px 11px 80px}.grid{gap:10px}.flavor{padding:11px;gap:10px}.flavor h3{font-size:1.16rem;line-height:1.18}.flavor .taste-profile{font-size:.78rem}.flavor .tag{font-size:.61rem;padding:4px 6px}.flavor .caffeine-badge{font-size:.62rem;padding:4px 6px}.tabs button{padding:10px 13px;font-size:.88rem}.toolbar select{min-width:0;width:100%;font-size:.8rem;padding:11px 9px}.toolbar>*{flex:1 1 44%}.toolbar #search{flex-basis:100%}.flavor-facts-panel{padding:16px}}
/* Colorful passport sheet, with tried state displayed as visited. */
.passport-intro{text-align:center;padding:14px 12px 6px;color:#4b1a7b}
.passport-intro .eyebrow{font-size:.68rem;letter-spacing:.16em;margin:4px 0 10px}
.passport-intro h2{font-family:"Cooper Black",Georgia,serif;font-weight:900;font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.12;margin:0 0 12px;color:#400b7b}
.passport-intro>p{line-height:1.5;margin:8px 0}.passport-intro .hint{font-size:.78rem}
.passport-intro .passport-count{display:inline-block;border:1px solid #b78bd8;border-radius:999px;padding:7px 16px;background:#ffffffbf;font-size:.88rem;font-weight:750}
.passport-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;background:linear-gradient(145deg,#c5eff4,#cbb7ee);padding:18px;border:2px solid #a78bca;border-radius:18px;box-shadow:0 7px 0 #66359b15}
.passport-tile{--tile-color:#a6dded;background:var(--tile-color);color:#2d1740;border:2px solid #634a80;border-radius:13px;min-height:162px;min-width:0;padding:15px 10px 12px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;box-shadow:inset 0 0 0 3px #ffffff30}
.passport-orange{--tile-color:#ffc887}.passport-pink{--tile-color:#e9add4}.passport-yellow{--tile-color:#f6e68b}.passport-blue{--tile-color:#a6dded}
.passport-tile:hover:not(:disabled){background:var(--tile-color);border-color:#3f086e;box-shadow:inset 0 0 0 3px #ffffff60,0 4px 12px #44127725}
.passport-tile-name{font-family:"Cooper Black",Georgia,serif;font-weight:900;font-size:1.1rem;line-height:1.18;overflow-wrap:anywhere;margin:auto 0}
.passport-tile-category{font-size:.61rem;font-weight:600;opacity:.8;line-height:1.3}
.passport-visited{display:flex;align-items:center;gap:6px;width:100%;font-size:.73rem;font-weight:650;line-height:1.3;text-align:left}
.passport-check{flex:none;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:#fffdfb;border:1.5px solid #6b507e;border-radius:5px;color:#402061;font-weight:900;font-size:1rem}
.passport-drink{margin-left:auto;font-size:1rem}.passport-tile.is-visited{border-color:#47206c;box-shadow:inset 0 0 0 3px #ffffff70}
.passport-tile.is-visited .passport-check{background:#4e1c81;color:white;border-color:#4e1c81}.passport-grid>.empty{grid-column:1/-1}
@media(max-width:760px){.passport-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:12px}.passport-tile{min-height:150px;padding:12px 9px}.passport-tile-name{font-size:1.05rem}}
@media(max-width:420px){.passport-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}.passport-tile{min-height:155px}.passport-tile-name{font-size:1.12rem}}

.install-app-button{position:fixed;bottom:max(14px,env(safe-area-inset-bottom));right:14px;z-index:2;border:2px solid white;box-shadow:0 3px 14px #3e087e35;font-size:.82rem;padding:10px 16px;border-radius:999px}.install-help{border:2px solid #6928b8;border-radius:20px;max-width:440px;width:calc(100% - 32px);padding:24px;color:#382644}.install-help::backdrop{background:#20152ab5}.install-help p{line-height:1.6}.install-help h2{margin-top:0}

.caffeine-choices{border:1px solid #d9c2eb;border-radius:14px;padding:16px}.caffeine-choices legend{font-weight:700;color:#521394;padding:0 6px}.caffeine-choices .checks{flex-wrap:wrap}.caffeine-choices input{width:auto}.caffeine-choices .hint{margin-bottom:0}

.flavor-status-row{display:flex;align-items:center;justify-content:flex-start;flex-shrink:0;min-height:36px;margin:auto 0 0;padding-top:8px}.flavor .flavor-status-row + .bottom{margin-top:0}.flavor-owned{font-size:.82rem;color:#70657a}.flavor-tried-status{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border:1px solid #e7ddec;border-radius:10px;color:#766b7d;background:#faf8fc;font-size:.85rem}.flavor-tried-status.is-tried{background:#eee1fb;border-color:#bb91dc;color:#4e1c81;font-weight:800}.flavor-tried-status.is-tried .passport-check{background:#4e1c81;border-color:#4e1c81;color:white}

.flavor-inventory{white-space:nowrap}

/* Shared rows keep facts and inventory aligned across each row of cards. */
#grid.grid{grid-auto-rows:auto}
#grid.grid>.flavor{display:grid;grid-template-rows:subgrid;grid-row:span 8;row-gap:12px;align-items:start}
.flavor-caffeine-slot{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;min-height:60px}
.flavor-inventory-slot{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-height:1.5em}
#grid.grid>.flavor>.taste-profile{margin:0;min-height:3em}
#grid.grid>.flavor>.flavor-status-row{margin:0;padding-top:0;align-self:end}
#grid.grid>.flavor>.bottom{margin:0;align-self:end}

.dashboard-overview{width:fit-content;max-width:100%;margin:14px auto 18px;text-align:center;padding:14px 20px}
.dashboard-overview .overview-counts{justify-content:center}
.dashboard-overview .passport-count{display:block;width:fit-content;max-width:100%;margin:12px auto 0;padding:7px 16px;border:1px solid #b78bd8;border-radius:999px;background:#f5edfc;font-size:.88rem;font-weight:750;color:#4b1a7b}
.flavor-view-toggle{display:flex;width:fit-content;max-width:100%;margin:18px auto 6px;padding:4px;gap:4px;background:#fff;border:2px solid #6928b8;border-radius:999px}
.flavor-view-toggle button{border-radius:999px;background:transparent;color:#572184;min-width:110px;padding:10px 22px}
.flavor-view-toggle button[aria-pressed=true]{background:#4e1189;color:#fff}

.shell > .tabs{justify-content:center}

.tried-versions{border:1px solid #dacbea;border-radius:14px;padding:14px;margin:16px 0}.tried-versions legend{font-weight:700;color:var(--purple,#531da0)}.tried-versions .checks{gap:14px}.tried-versions .hint{margin-bottom:0}

.flavor .caffeine-badge.version-tried{font-weight:800}.version-tried-check{display:inline-block;font-weight:900;margin-left:2px}

.collection-overview-row{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;max-width:1080px;margin:14px auto 18px;align-items:start}
.collection-overview-row>.card{box-sizing:border-box;width:100%;min-width:0;margin:0;padding:14px 20px;text-align:center}
.collection-explore summary{font-size:1rem;font-weight:750;color:var(--brand-deep,#400b7b);cursor:pointer;padding:2px 0;list-style-position:inside}
.collection-explore summary:focus-visible{outline:3px solid #8957ab;outline-offset:5px;border-radius:6px}
.collection-explore .hint{font-size:.75rem;margin:10px 0}
.collection-explore .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 0}
.collection-explore .actions button{font-size:.8rem;padding:10px 8px;min-width:0;white-space:normal}
@media(min-width:900px){.collection-overview-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.collection-overview-row>.card{padding:12px}.collection-explore .actions button{font-size:.75rem}}
