:root{--ink:#15211d;--muted:#65716d;--green:#173f35;--green2:#245f4e;--cream:#f5f2e9;--paper:#fffefa;--line:#d8ddd8;--gold:#e5a728;--red:#9b3d34;--shadow:0 12px 34px rgba(21,33,29,.09);font-family:Inter,ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--cream);font-size:17px}
*{box-sizing:border-box}body{margin:0;min-height:100vh;padding-bottom:92px;background:radial-gradient(circle at 90% -10%,#dce9df 0,transparent 34%),var(--cream)}button,input,textarea{font:inherit}button{cursor:pointer}.topbar{height:74px;padding:10px max(18px,env(safe-area-inset-left));display:flex;align-items:center;gap:12px;background:rgba(245,242,233,.92);border-bottom:1px solid rgba(21,33,29,.1);position:sticky;top:0;z-index:5;backdrop-filter:blur(14px)}.topbar>div:nth-child(2){display:flex;flex-direction:column;font-size:1.05rem}.topbar span{font-size:.78rem;color:var(--muted)}.brand-mark{height:46px;width:46px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-weight:900;font-size:.72rem;letter-spacing:.05em;border:3px solid var(--gold)}.offline-badge{margin-left:auto!important;padding:5px 9px;border-radius:999px;background:#eee0bc;color:#6d5118;font-size:.72rem!important;font-weight:800}main{width:min(920px,100%);margin:auto;padding:24px 18px 36px}.view{display:none}.view.active{display:block}h1{font-size:clamp(1.8rem,6vw,2.6rem);line-height:1.05;margin:0 0 6px;letter-spacing:-.035em}h2{font-size:1.2rem;margin:0 0 8px}.muted{color:var(--muted);margin:0;line-height:1.45}.intro-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}.panel{background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:18px}.inputs-panel{padding:20px}.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}label{display:block;color:#34413d;font-weight:700;font-size:.88rem;position:relative}input,textarea{width:100%;border:1.5px solid #c9cfca;background:#fff;border-radius:12px;padding:13px 14px;margin-top:7px;color:var(--ink);font-size:1rem;outline:none}input:focus,textarea:focus{border-color:var(--green2);box-shadow:0 0 0 3px rgba(36,95,78,.14)}.unit{position:absolute;right:13px;bottom:14px;font-size:.83rem;color:var(--muted);pointer-events:none}.quiet-button,.icon-button{border:0;background:transparent;color:var(--green2);font-weight:800;padding:8px}.schedule-picker,.outcome-field{border:0;margin:22px 0 0;padding:0}.schedule-picker legend,.outcome-field legend{font-weight:850;margin-bottom:9px}.segmented{background:#ecece5;border-radius:13px;padding:4px;display:grid;grid-template-columns:1fr 1fr;gap:4px}.segmented label{margin:0}.segmented input{position:absolute;opacity:0;pointer-events:none}.segmented span{display:block;text-align:center;padding:10px 8px;border-radius:10px}.segmented input:checked+span{background:white;box-shadow:0 2px 8px rgba(0,0,0,.09);color:var(--green);font-weight:900}.date-label{margin-top:15px}.result-card{background:linear-gradient(145deg,#173f35,#0e2c25);color:white;border-radius:24px;padding:22px;margin-top:18px;box-shadow:0 16px 38px rgba(23,63,53,.22)}.result-head{display:flex;align-items:end;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.16)}.result-head>div{display:flex;flex-direction:column}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:.68rem!important;font-weight:900;color:var(--gold)}.result-head strong{font-size:1.65rem;margin-top:3px}.result-head>span{font-size:.9rem;color:#d5e5df}.ingredient-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-top:18px}.ingredient-grid div{display:flex;flex-direction:column}.ingredient-grid span{font-size:.76rem;color:#bdd0ca}.ingredient-grid strong{font-size:1.18rem;margin-top:4px}.ingredient-grid small{font-size:.65rem;color:#bdd0ca;margin-top:2px}.yeast-result{background:rgba(229,167,40,.13);border:1px solid rgba(229,167,40,.35);border-radius:12px;padding:9px;margin:-9px}.timeline-panel{margin-top:18px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-title span{font-size:.75rem;color:var(--green2);font-weight:800}.timeline{list-style:none;margin:18px 0 0;padding:0}.timeline li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-top:1px solid #e6e8e3}.timeline li span{font-size:.88rem;color:#56625e}.timeline li strong{text-align:right;font-size:.95rem}.learning-note{border-radius:12px;padding:11px 13px;background:#eef4f1;color:#31594e;font-size:.78rem}.bottom-nav{position:fixed;z-index:10;bottom:0;left:0;right:0;height:78px;padding:7px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,1fr);background:rgba(255,254,250,.96);border-top:1px solid var(--line);backdrop-filter:blur(16px)}.bottom-nav button{border:0;background:transparent;color:#78827f;font-size:.67rem;font-weight:750;display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px}.bottom-nav button span{font-size:1.3rem;line-height:1}.bottom-nav button.active{color:var(--green);font-weight:900}.timer-card{margin:28px auto 20px;max-width:540px;padding:35px 20px;background:var(--green);color:white;border-radius:28px;text-align:center;box-shadow:0 18px 44px rgba(23,63,53,.25)}.timer-display{font-size:clamp(4.3rem,18vw,7.3rem);font-weight:800;letter-spacing:-.065em;font-variant-numeric:tabular-nums}.timer-presets{display:flex;justify-content:center;gap:8px;margin:14px 0 26px}.timer-presets button{border:1px solid rgba(255,255,255,.25);background:transparent;color:white;border-radius:999px;padding:8px 12px}.timer-presets button.selected{background:white;color:var(--green);font-weight:900}.timer-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.primary,.secondary,.accent-button,.file-button{border-radius:12px;padding:13px 16px;border:0;font-weight:900;text-align:center}.primary{background:var(--gold);color:#30240c}.secondary,.file-button{background:#e9edea;color:var(--green)}.timer-card .secondary{background:rgba(255,255,255,.13);color:white;border:1px solid rgba(255,255,255,.24)}.compact{padding:10px 13px;font-size:.85rem}.temp-check{max-width:540px;margin:auto}.temp-check input{padding-right:45px}.temp-check span{position:absolute;right:18px;bottom:14px}.refine-panel{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px}.refine-panel p{margin:0;color:var(--muted);font-size:.85rem}.accent-button{background:var(--green);color:white;min-width:190px}.accent-button:disabled{opacity:.38;cursor:not-allowed}.experience-list{display:grid;gap:12px;margin-top:16px}.experience-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;grid-template-columns:1fr auto;gap:8px 16px}.experience-card h3{margin:0;font-size:1rem}.experience-card p{grid-column:1/-1;margin:3px 0 0;color:var(--muted);font-size:.82rem}.experience-card .meta{color:var(--muted);font-size:.76rem}.outcome{font-size:.73rem;font-weight:900;border-radius:999px;padding:6px 10px;height:max-content}.outcome.spot{background:#dcefe7;color:#18543e}.outcome.under{background:#edf0f5;color:#485778}.outcome.over{background:#f4e0dc;color:#7e332c}.empty-state{text-align:center;color:var(--muted);padding:45px 12px}.standards,.settings-actions{margin-top:20px}.standards dl{margin:10px 0 0}.standards dl div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-top:1px solid #e6e8e3}.standards dt{color:var(--muted)}.standards dd{margin:0;font-weight:850;text-align:right}.settings-actions{display:grid;gap:10px}.file-button{cursor:pointer}.file-button input{display:none}.danger-link{border:0;background:transparent;color:var(--red);font-weight:850;padding:12px}.storage-note{text-align:center;color:var(--muted);font-size:.78rem;line-height:1.45;padding:0 18px}dialog{width:min(640px,calc(100% - 24px));max-height:calc(100vh - 32px);border:0;border-radius:24px;padding:0;box-shadow:0 30px 80px rgba(0,0,0,.28);background:var(--paper)}dialog::backdrop{background:rgba(7,20,16,.62);backdrop-filter:blur(3px)}dialog form{padding:22px}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start}.dialog-head h2{font-size:1.5rem;margin-top:3px}.icon-button{font-size:1.8rem;line-height:1}.dialog-fields{margin-top:18px}.outcome-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.outcome-options input{position:absolute;opacity:0}.outcome-options span{display:grid;place-items:center;text-align:center;min-height:55px;padding:7px;border:1px solid var(--line);border-radius:11px;font-size:.78rem}.outcome-options input:checked+span{background:#e4eee9;border-color:var(--green2);color:var(--green);box-shadow:0 0 0 1px var(--green2)}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.change-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0}.change-grid div{padding:13px;background:#eef4f1;border-radius:12px}.change-grid span{display:block;color:var(--muted);font-size:.75rem}.change-grid strong{display:block;margin-top:3px}.fine-print{color:var(--muted);font-size:.76rem;line-height:1.4}.toast{position:fixed;z-index:30;left:50%;bottom:94px;transform:translate(-50%,20px);background:#17241f;color:white;padding:11px 16px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s;white-space:nowrap;max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:640px){main{padding:20px 14px 32px}.field-grid{grid-template-columns:1fr}.ingredient-grid{grid-template-columns:1fr 1fr;gap:20px 10px}.yeast-result{margin:-7px;padding:7px}.refine-panel{align-items:stretch;flex-direction:column}.accent-button{width:100%}.dialog-fields{grid-template-columns:1fr 1fr}.outcome-options{grid-template-columns:1fr}.experience-card{grid-template-columns:1fr auto}}@media(max-width:390px){:root{font-size:16px}.dialog-fields{grid-template-columns:1fr}.intro-row{align-items:center}.bottom-nav button{font-size:.62rem}}
.stage-check{padding:14px;border:1px solid var(--line);border-radius:14px}.stage-check+.stage-check{margin-top:12px}.stage-check legend{padding:0 6px}.adjustment-field{width:min(220px,100%);margin-top:11px}.segmented{grid-template-columns:repeat(3,1fr)}
.used-button{width:100%;margin-top:16px;font-size:1rem}.experience-card[data-id]{cursor:pointer}.experience-card[data-id]:hover{border-color:var(--green2)}.experience-card .recipe-line{color:var(--ink);font-weight:750;line-height:1.55}.outcome.awaiting{background:#fff0c8;color:#6d5118}.record-dates{margin:8px 0 0;color:var(--muted);font-size:.8rem;line-height:1.45}.recipe-snapshot{margin:14px 0 18px;padding:15px;border-radius:14px;background:#eef4f1;border:1px solid #d4e2dc}.recipe-snapshot h3{margin:0 0 10px;font-size:1rem}.recipe-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 14px}.recipe-grid div{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid rgba(23,63,53,.12);padding-bottom:5px}.recipe-grid span{color:var(--muted);font-size:.78rem}.recipe-grid strong{font-size:.82rem;text-align:right}.recipe-schedule{margin:11px 0 0;font-size:.76rem;color:#31594e;line-height:1.5}.delete-button{border:1px solid #d7aaa4;background:#fff5f3;color:var(--red);border-radius:12px;padding:12px 14px;font-weight:850}.dialog-spacer{flex:1}.yeast-override{margin-top:18px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#f8faf8}.check-row{display:flex;align-items:center;gap:10px;cursor:pointer}.check-row input{width:20px;height:20px;margin:0;accent-color:var(--green)}#customYeastWrap{margin-top:13px;max-width:240px}
@media(max-width:430px){.recipe-grid{grid-template-columns:1fr}}