:root{--bg:#faf6f0;--surface:#fffdf9;--ink:#2d2016;--ink-soft:#6b5849;--ink-faint:#8a7563;--border:#e8ddd0;--accent:#6f4e37;--accent-dark:#543a28;--danger:#b3372f;--star:#e8a04c;--radius:12px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.app{max-width:720px;margin:0 auto;padding:1.5rem 1rem 4rem}.app-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.app-header h1{letter-spacing:-.02em;margin:0;font-size:1.5rem}.tabs{background:var(--surface);border:1px solid var(--border);border-radius:999px;gap:.4rem;padding:.25rem;display:flex}.tab{color:var(--ink-soft);background:0 0;border:none;border-radius:999px;padding:.4rem 1rem;font-weight:600}.tab.active{background:var(--accent);color:#fff}.header-right{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.user-chip{align-items:center;gap:.45rem;display:flex}.user-chip img{border:1.5px solid var(--border);border-radius:50%;width:30px;height:30px}.sync-banner{color:#7a4a12;background:#fdf0e4;border:1px solid #eac9a0;border-radius:10px;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;padding:.55rem .8rem;font-size:.9rem;display:flex}.sync-banner button{color:inherit;background:0 0;border:none;padding:.2rem;font-size:1rem}.signin{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:center;flex-direction:column;align-items:center;gap:.9rem;padding:3rem 1.5rem;display:flex}.signin-icon{font-size:3.5rem}.signin h2{margin:0;font-size:1.4rem}.signin-blurb{max-width:26rem;color:var(--ink-soft);margin:0}.signin-button{min-height:44px}.signin-error{color:var(--danger);margin:0;font-size:.9rem}.signin-fineprint{color:var(--ink-faint);margin:.5rem 0 0;font-size:.8rem}.log-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:1.25rem;padding:1.25rem;display:flex}.form-grid{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.field-wide{grid-column:1/-1}@media (width<=480px){.form-grid{grid-template-columns:1fr}}.field{flex-direction:column;gap:.35rem;min-width:0;display:flex}.field-label{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);font-size:.8rem;font-weight:700}.field input,.field select,.field textarea{font:inherit;color:var(--ink);border:1px solid var(--border);background:#fff;border-radius:8px;width:100%;padding:.55rem .7rem}.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:#0000}.field textarea{resize:vertical}.field-error{color:var(--danger);font-size:.85rem}.method-picker{flex-wrap:wrap;gap:.5rem;display:flex}.method-btn{border:1.5px solid var(--border);color:var(--ink-soft);background:#fff;border-radius:999px;padding:.5rem .9rem;font-weight:600}.method-btn.active{border-color:var(--accent);background:var(--accent);color:#fff}.method-icon{margin-right:.15rem}.roast-scale{flex-wrap:wrap;gap:.5rem;display:flex}.roast-stop{border:1.5px solid var(--border);color:var(--ink-soft);background:#fff;border-radius:999px;align-items:center;gap:.45rem;padding:.45rem .85rem;font-weight:600;display:flex}.roast-stop.active{border-color:var(--accent);background:var(--accent);color:#fff}.roast-dot{border:1.5px solid #fff9;border-radius:50%;width:16px;height:16px;box-shadow:inset 0 0 0 1px #0000001f}.brew-grid{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}.field-sublabel{color:var(--ink-faint);font-size:.75rem;font-weight:600}.serve-toggle{gap:.5rem;margin-top:.6rem;display:flex}.serve-btn{border:1.5px solid var(--border);color:var(--ink-soft);background:#fff;border-radius:999px;padding:.45rem 1rem;font-weight:600}.serve-btn.active{border-color:var(--accent);background:var(--accent);color:#fff}.wheel-wrap{flex-direction:column;align-items:center;gap:.6rem;display:flex}.flavor-wheel{width:100%;max-width:520px;height:auto}.wheel-seg{outline:none;transition:fill-opacity .12s}.wheel-seg.sub,.wheel-seg.cat{fill-opacity:.28}.wheel-seg:hover,.wheel-seg:focus-visible{fill-opacity:.7}.wheel-seg.sel{fill-opacity:1}.wheel-back{cursor:pointer;outline:none}.wheel-back:focus-visible circle{stroke:var(--accent);stroke-width:2px}.wheel-faded{cursor:pointer;outline:none;transition:fill-opacity .12s}.chip-row{flex-wrap:wrap;gap:.4rem;display:flex}.chip{color:#fff;text-shadow:0 1px 1px #00000040;border:none;border-radius:999px;padding:.2rem .65rem;font-size:.82rem;font-weight:600}.chip-removable:hover{filter:brightness(.85)}.chip-clear{color:var(--ink-faint);border:1px dashed var(--border);text-shadow:none;background:0 0}.stars{align-items:center;display:inline-flex}.star-cell{padding:0 .05rem;font-size:1.6rem;line-height:1;position:relative}.star-glyph{color:var(--border);display:inline-block;position:relative}.star-fill{width:0;color:var(--star);transition:width 80ms;position:absolute;top:0;left:0;overflow:hidden}.star-btn{background:0 0;border:none;padding:0;line-height:1}.star-btn:hover{transform:scale(1.12)}.star-btn:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:4px}.stars-value{color:var(--ink-faint);min-width:3.2rem;margin-left:.5rem;font-size:.9rem}.stars-compact{color:var(--ink-soft);white-space:nowrap;font-size:.95rem;font-weight:600}.star.filled{color:var(--star)}.form-actions{gap:.6rem;display:flex}.btn-primary{background:var(--accent);color:#fff;border:none;border-radius:10px;padding:.65rem 1.4rem;font-weight:700}.btn-primary:hover{background:var(--accent-dark)}.btn-ghost{color:var(--ink-soft);border:1px solid var(--border);background:0 0;border-radius:10px;padding:.6rem 1.1rem;font-weight:600}.btn-ghost:hover{border-color:var(--ink-faint);background:#fff}.btn-sm{padding:.3rem .7rem;font-size:.85rem}.btn-danger{color:var(--danger)}.btn-danger:hover{border-color:var(--danger)}.stats-row{grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1rem;display:grid}.stat{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);text-align:center;flex-direction:column;gap:.15rem;padding:.75rem;display:flex}.stat-value{font-size:1.15rem;font-weight:700}.stat-label{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);font-size:.75rem}.history-toolbar{flex-direction:column;gap:.6rem;margin-bottom:1rem;display:flex}.search-input{font:inherit;border:1px solid var(--border);color:var(--ink);background:#fff;border-radius:10px;padding:.55rem .8rem}.search-input:focus{outline:2px solid var(--accent);outline-offset:1px}.filter-row{flex-wrap:wrap;gap:.4rem;display:flex}.filter-btn{border:1px solid var(--border);color:var(--ink-soft);background:0 0;border-radius:999px;padding:.3rem .8rem;font-size:.85rem;font-weight:600}.filter-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.log-list{flex-direction:column;gap:.85rem;margin:0;padding:0;list-style:none;display:flex}.log-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:.6rem;padding:1rem 1.1rem;display:flex}.log-card-head{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.log-head-right{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:.2rem;display:flex}.freshness-badge{color:#fff;text-shadow:0 1px 1px #0003;border-radius:999px;padding:.15rem .6rem;font-weight:600}.log-title{margin:0;font-size:1.05rem}.log-sub{color:var(--ink-faint);margin:.1rem 0 0;font-size:.88rem}.log-meta{color:var(--ink-faint);flex-wrap:wrap;align-items:center;gap:.5rem .75rem;font-size:.85rem;display:flex}.method-badge,.info-badge{background:var(--bg);border:1px solid var(--border);color:var(--ink-soft);border-radius:999px;padding:.15rem .6rem;font-weight:600}.log-notes{color:var(--ink-soft);white-space:pre-wrap;margin:0;font-size:.92rem}.log-actions{justify-content:flex-end;gap:.4rem;display:flex}.no-matches{text-align:center;color:var(--ink-faint);padding:2rem 0}.history-footer{justify-content:center;gap:.6rem;margin-top:1.5rem;display:flex}.empty-state{text-align:center;color:var(--ink-soft);flex-direction:column;align-items:center;gap:.75rem;padding:3rem 1rem;display:flex}.empty-icon{font-size:3rem}.app-footer{text-align:center;color:var(--ink-faint);margin-top:2.5rem;font-size:.75rem}.app-footer a{color:inherit;text-underline-offset:2px;text-decoration:underline}.app-footer a:hover{color:var(--accent)}@media (width<=600px){.app{padding:.85rem .7rem 3rem}.app-header{margin-bottom:1rem}.app-header h1{font-size:1.25rem}.header-right{justify-content:space-between;width:100%}.tab{padding:.5rem .85rem}.log-form{padding:.9rem}.method-picker{grid-template-columns:1fr 1fr;display:grid}.method-btn{text-align:center;padding:.7rem .5rem}.star-cell{padding:0 .05rem;font-size:1.7rem}.field input,.field select,.field textarea{padding:.65rem .7rem;font-size:16px}.form-actions{position:sticky;bottom:.5rem}.form-actions .btn-primary{flex:1;padding:.85rem 1rem;box-shadow:0 4px 14px #2d201640}.stats-row{gap:.5rem}.stat{padding:.55rem .3rem}.stat-value{font-size:1rem}.filter-btn,.btn-sm{padding:.45rem .8rem}.log-actions .btn-sm{padding:.5rem .9rem}}