@font-face{font-family:Barlow;src:url('/fonts/Barlow-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url('/fonts/Barlow-SemiBold.ttf') format('truetype');font-weight:600 900;font-display:swap}
@font-face{font-family:'Barlow Condensed';src:url('/fonts/BarlowCondensed-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
:root{--bg:#edf2f5;--paper:#fff;--ink:#163149;--muted:#536777;--line:#d6e0e7;--green:#153f60;--lime:#c5dfea;--amber:#f5e6cb;--red:#a3382a;--navy:#102b46;--accent:#94550f;--radius:12px;--nav-width:248px}
*{box-sizing:border-box}html{scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Barlow,'Segoe UI',sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}a{color:inherit;text-underline-offset:4px}button{cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #b56b10;outline-offset:3px}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{min-width:0;max-width:100%}button{overflow-wrap:anywhere}h1,h2,h3,p{margin-top:0}h1{font:600 clamp(36px,3.8vw,58px)/1.04 'Barlow Condensed',sans-serif;letter-spacing:-.5px;margin:8px 0 14px}h2{font:600 29px/1.13 'Barlow Condensed',sans-serif;letter-spacing:0;margin-bottom:16px}h3{font:600 17px/1.4 Barlow,sans-serif;margin-bottom:6px}p{margin-bottom:16px}small{font-size:13px}svg{display:block}.uiIcon{width:21px;height:21px;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.skipLink{position:fixed;top:-100px;left:20px;z-index:100;background:white;padding:12px 20px}.skipLink:focus{top:12px}
/* Application navigation, deliberately scoped: recipe side panels are independent. */
#sidebar{width:var(--nav-width);background:var(--navy);color:#dbe7ef;position:fixed;inset:0 auto 0 0;padding:30px 18px 20px;display:flex;flex-direction:column;z-index:30;overflow-y:auto;overscroll-behavior:contain}.brand{text-decoration:none;display:flex;align-items:center;gap:11px;padding:0 10px;color:white;font-size:23px;font-weight:600;letter-spacing:.2px}.brand small{display:block;font-size:12px;font-weight:400;letter-spacing:0;color:#a9c1d2;margin-top:1px}.logo{display:grid;place-items:center;width:39px;height:44px;color:#f1c276;flex:none}.logo svg{width:36px;height:44px}.navlabel{font-size:13px;color:#96b1c5;margin:43px 14px 12px}#nav a{display:flex;gap:13px;align-items:center;text-decoration:none;padding:12px 14px;border-radius:7px;margin:4px 0;font-size:15px;min-height:48px}#nav a.active{background:#c5dfea;color:#102b46;font-weight:600}#nav a:hover:not(.active){background:#ffffff0d;color:white}.sidefoot{margin-top:auto;padding-top:32px;font-size:13px;color:#a9c1d2}.sidefoot a{display:flex;align-items:center;gap:12px;text-decoration:none;padding:10px 14px;min-height:44px;border-radius:6px}.sidefoot a:hover{background:#ffffff0d;color:white}.sidefoot .uiIcon{width:18px;height:18px}.sidefoot small{display:block;font-size:11px;padding:18px 14px 0;color:#a9c1d2}.shell{margin-left:var(--nav-width);min-height:100dvh;display:flex;flex-direction:column}.shell>header{position:sticky;top:0;z-index:20;background:#ffffffee;backdrop-filter:blur(12px);height:72px;display:flex;gap:16px;align-items:center;border-bottom:1px solid var(--line);padding:0 38px}.headerBrand{font:600 23px 'Barlow Condensed',sans-serif;color:var(--ink)}#crumb{font-size:14px;padding-left:16px;border-left:1px solid var(--line);color:var(--muted)}#saved{margin-left:auto;font-size:12px;color:var(--muted)}.shell>header .btn{min-width:44px;padding:8px}.menuToggle,.navClose{display:none}.navScrim{display:none}main{width:100%;max-width:1510px;margin:0 auto;flex:1;padding:34px 38px 64px;min-width:0}main:focus{outline:0}.shell>footer{border-top:1px solid var(--line);padding:20px 38px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:18px}#banner:empty{display:none}#banner{margin:20px 38px 0}.demoBanner{background:#fff4dd;color:#785015;border:1px solid #e7c991;border-radius:8px;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:14px}.demoBanner .btn{background:#fffaf0;border-color:#dabc85;color:#785015}
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:28px}.pagehead>div:first-child{min-width:0}.eyebrow{font-size:14px;font-weight:600;letter-spacing:0;color:var(--accent);text-transform:none}.lede{color:var(--muted);max-width:66ch;font-size:16px;margin-bottom:0;line-height:1.6}.pagehead .actions{margin:0;justify-content:flex-end;flex:none;max-width:48%}.btn{min-height:44px;border:1px solid #bfcdd7;border-radius:7px;background:white;color:var(--green);padding:10px 16px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:14px;font-weight:600;line-height:1.3;text-align:center}.btn:hover:not(:disabled){background:#eaf1f6;border-color:#7493a9}.btn.primary{background:var(--green);color:white;border-color:var(--green)}.btn.primary:hover:not(:disabled){background:#0b2e48;border-color:#0b2e48}.btn.danger{color:var(--red);border-color:#d8b8b2}.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:20px}.actions.end{justify-content:flex-end}.smallbtn{background:transparent;border:0;padding:10px 4px;min-height:44px;color:var(--green);font-size:14px;font-weight:600;text-decoration:underline;text-underline-offset:4px;line-height:1.3}.linkbtn{border:0;background:none;color:var(--green);font:inherit;font-weight:600;text-align:left;padding:4px 0;min-height:44px;line-height:1.4}.linkbtn:hover{text-decoration:underline}.subtle{color:var(--muted);font-size:14px}.subtitle{color:var(--muted);font-size:15px;margin-bottom:22px}.note{border-left:3px solid #c7a36d;padding-left:15px;font-size:14px;color:var(--muted);margin:22px 0;overflow-wrap:anywhere}.info{padding:14px 16px;border:1px solid #cbdde8;border-radius:7px;background:#edf5fa;font-size:14px;color:#335773;line-height:1.6}.warning,.inventory .low{color:#87500b;font-size:14px}.danger,.error{color:var(--red)}.error{font-size:14px;margin-top:18px}.error:empty{display:none}.callout{border:1px solid #e0c18f;border-left:4px solid #ad6b12;background:#fff6e7;border-radius:8px;padding:20px 24px;margin:24px 0;color:#704914}.callout p{font-size:14px;margin:8px 0}.callout h3{color:#704914}.callout ul{padding-left:20px;margin-bottom:0}.callout .subtle{color:#704914}
/* One quiet canvas, grouped operational surfaces. */
.card{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:24px;min-width:0}.cardtop{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.cardtop h3{margin:0}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start}.stack{display:grid;gap:20px;min-width:0;align-content:start}.sectionhead{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:32px 0 18px}.sectionhead h2{margin:0}.sectionhead small{font-size:13px;color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:white;border:1px solid var(--line);border-radius:10px;margin-bottom:30px;overflow:hidden}.stat{padding:21px 23px;min-width:0;border-right:1px solid var(--line)}.stat:last-child{border:0}.stat small{font-size:13px;color:var(--muted);display:block;text-transform:none}.stat strong{display:block;font:600 37px/1.2 'Barlow Condensed',sans-serif;letter-spacing:.1px;margin:7px 0 5px;overflow-wrap:anywhere}.stat span{font-size:12px;color:var(--muted)}.icon{width:42px;height:42px;display:grid;place-items:center;border-radius:8px;background:#edf3f7;color:#456881;font-size:24px;flex:none}.pill{display:inline-flex;align-items:center;font-size:12px;line-height:1.4;padding:5px 10px;border-radius:5px;background:#edf3f7;color:#3e617a;max-width:100%;overflow-wrap:anywhere}.pill.amber{background:#fff0d6;color:#805017}.module{display:flex;flex-direction:column;align-items:stretch}.module h2{font-size:31px}.module p{font-size:14px;color:var(--muted);line-height:1.6}.module .actions{margin-top:auto;padding-top:22px}.module .reading{padding-top:8px;margin-bottom:8px}.module .reading small{font-size:13px}.module .reading h3{margin-top:5px}.empty{text-align:center;padding:46px 25px}.empty .icon{margin:0 auto 18px;width:54px;height:54px;font-size:30px}.empty p{font-size:15px;color:var(--muted);max-width:55ch;margin:0 auto 22px}.hero{display:grid;grid-template-columns:1.3fr 1fr;border:1px solid #bbccd7;background:#dfeaf1;border-radius:14px;overflow:hidden;margin-bottom:30px;min-height:280px}.herotext{padding:34px}.herotext h2{font-size:37px;max-width:450px}.herotext p{font-size:15px;color:#3d5f77;max-width:52ch}.heroart{display:flex;align-items:center;justify-content:center;background:#d3e2eb;gap:12px}.tank{position:relative;width:70px;height:120px;background:#edf4f8;border:2px solid #7593a7;border-radius:18px 18px 30px 30px}.tank:before{content:'';position:absolute;left:15px;right:15px;top:-10px;height:8px;border:2px solid #7593a7;border-radius:3px}.tank:after{content:'';position:absolute;left:14px;right:14px;bottom:-24px;height:25px;border-left:3px solid #7593a7;border-right:3px solid #7593a7}.tank:nth-child(2){width:88px;height:155px}.tank span{position:absolute;top:40%;left:0;right:0;text-align:center;font-size:12px;font-weight:600;color:#4c6b80}
.batchRow{display:flex;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--line);min-width:0}.batchRow:last-child{border:0}.batchRow>div{min-width:0}.batchRow h3{margin-bottom:4px;overflow-wrap:anywhere}.batchRow p{font-size:13px;color:var(--muted);margin:0;overflow-wrap:anywhere}.batchRow .trailing{margin-left:auto;text-align:right;flex:none;max-width:40%}.batchRow .swatch{width:4px;height:48px;border-radius:3px;background:#c79547;flex:none}.badge{display:inline-flex;align-items:center;font-size:12px;font-weight:600;padding:5px 10px;background:#edf1f5;color:#516778;border-radius:5px;white-space:nowrap}.badge.fermenting{background:#e3f0e8;color:#2e6349}.badge.conditioning{background:#e5eef8;color:#365e8c}.badge.packaging{background:#efe7f6;color:#6b4384}.badge.brewing{background:#fff0d2;color:#82520f}.badge.completed{background:#e8edf0;color:#536777}.tankcard{position:relative}.tankcard .miniTank{width:68px;height:94px;position:relative;background:#f0f5f8;border:2px solid #7898ad;border-radius:15px 15px 24px 24px;margin:26px auto 40px}.miniTank:before{position:absolute;content:'';top:-9px;left:22px;right:22px;height:7px;border:2px solid #7898ad;border-radius:2px}.miniTank:after{position:absolute;content:'';height:18px;bottom:-19px;left:12px;right:12px;border-left:3px solid #7898ad;border-right:3px solid #7898ad}.miniTank .fill{position:absolute;bottom:7px;left:6px;right:6px;min-height:4px;background:#d7a34b;border-radius:3px 3px 15px 15px}.tankcard .reading{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;border-top:1px solid var(--line);padding-top:18px;margin:22px 0 15px}.reading small{font-size:12px;color:var(--muted)}.reading strong{display:block;font:600 25px 'Barlow Condensed',sans-serif}.tankcard .btn{padding:10px 12px}.task{display:flex;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);align-items:center;font-size:15px;min-height:52px}.task:last-child{border:0}.task.done{color:var(--muted)}.task.done>span{text-decoration:line-through}.task input{width:20px;height:20px;flex:none;accent-color:var(--green)}.task small{margin-left:auto;white-space:nowrap;color:var(--muted);font-size:12px}.task span{overflow-wrap:anywhere}
.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:22px}.toolbar input{flex:1;min-width:170px}.toolbar select{min-width:180px}.toolbar label{flex:1}.toolbar p{margin:0}.tablewrap{max-width:100%;overflow:auto;background:white;border:1px solid var(--line);border-radius:10px;overscroll-behavior-x:contain}table{width:100%;border-collapse:collapse;font-size:14px}th{text-align:left;color:#4a6478;font-size:13px;font-weight:600;background:#e7eef3;white-space:nowrap}td,th{padding:17px 20px;border-bottom:1px solid var(--line);vertical-align:top}tr:last-child td{border-bottom:0}td{color:var(--ink)}td:first-child{min-width:150px}td:first-child .linkbtn{font-size:15px}td small{color:var(--muted);font-size:12px}td .actions{gap:7px}.lastPurchase{display:block;font-size:12px;line-height:1.6;margin-top:9px;max-width:230px;color:var(--muted)}.tablewrap .actions .btn{font-size:13px;padding:9px 12px}.purchaseEntry{padding-bottom:16px;border-bottom:1px solid var(--line)}.purchaseEntry h3{margin:10px 0 6px}.purchaseEntry p{margin-bottom:6px}
input,select,textarea{width:auto;border:1px solid #b8c9d5;border-radius:6px;background:white;color:var(--ink);padding:11px 12px;min-height:46px;line-height:1.4;font-size:16px}input::placeholder,textarea::placeholder{color:#617788;opacity:1}input[type=checkbox]{width:21px;min-width:21px;height:21px;min-height:21px;accent-color:var(--green);margin:2px 0;flex:none}input[type=file]{white-space:normal;max-width:100%}label input,label select{width:100%;font-weight:400}textarea{width:100%;min-height:110px;resize:vertical}label{font-size:14px}label small{font-weight:400;color:var(--muted)}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.formgrid label,.field{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:600;min-width:0}.full{grid-column:1/-1}.formgrid .actions{margin-top:6px}.ingredientRow{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,.7fr) minmax(0,1.4fr) 44px;gap:10px;margin:16px 0;align-items:center}.ingredientRow input,.ingredientRow select{width:100%;min-width:0}.ingredientRow>button,.mashEditRow>button,.fermEditRow>button{border:1px solid #ddc7c2;background:#fff1ed;color:#983e2e;border-radius:6px;min-height:44px;min-width:40px;font-size:21px}.itemExtra{grid-column:1/-1;border-bottom:1px solid var(--line);padding:4px 0 14px;font-size:14px}.itemExtra .formgrid{margin-top:16px;grid-template-columns:repeat(3,minmax(0,1fr))}.mashEditRow,.fermEditRow{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,.8fr)) 44px;align-items:end;gap:10px;margin:15px 0}.fermEditRow{grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,.8fr)) 44px}.mashEditRow label,.fermEditRow label{font-size:13px}.mashEditRow input,.fermEditRow input{width:100%;margin-top:5px}.purchaseOption{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:12px!important;background:#edf4f8;border:1px solid #d1dfe9;padding:16px;border-radius:7px}.purchaseOption span{font-size:15px;font-weight:600}.purchaseOption small{display:block;font-size:13px;margin-top:5px;line-height:1.5}.importIngredient{background:#f7fafc;border:1px solid var(--line);border-radius:10px;padding:20px;margin-top:20px}.importAmount{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr) 100px 40px;gap:10px;align-items:center;font-size:14px;padding:14px 0;border-bottom:1px solid var(--line)}.importAmount span{font-size:13px;color:var(--muted)}.importAmount input{width:100%;min-width:0}.importWarnings{font-size:14px;color:#795018;background:#fff5e2;border:1px solid #e6c997;padding:18px;border-radius:8px}.importWarnings li{margin:7px 0}.recipeActions{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 25px}.recipeTargets{display:flex;flex-wrap:wrap;gap:12px 24px;padding:20px 24px;border:1px solid var(--line);border-radius:8px;background:white;font-size:14px;margin-bottom:16px}.recipeTargets b{margin-left:6px}.checklist{padding-left:22px}.checklist li{margin-bottom:12px}
.kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:white;border:1px solid var(--line);border-radius:10px;margin:25px 0;overflow:hidden}.kpi>div{padding:18px 20px;min-width:0;border-right:1px solid var(--line)}.kpi>div:last-child{border:0}.kpi small{display:block;font-size:13px;color:var(--muted);margin-bottom:7px}.kpi strong{font:600 30px/1.2 'Barlow Condensed',sans-serif;overflow-wrap:anywhere}.phasebar{display:flex;gap:6px;margin:24px 0}.phasebar span{flex:1;text-align:center;font-size:13px;padding:10px 4px;color:#526d80;background:#dee7ee;border-radius:5px;min-width:0}.phasebar span.done{color:#345b45;background:#dcebe2}.phasebar span.active{color:white;background:var(--green);font-weight:600}.tabs{display:flex;gap:26px;overflow:auto;max-width:100%;border-bottom:1px solid #bfcfdc;margin:28px 0;scrollbar-width:thin}.tabs button{flex:none;border:0;border-bottom:3px solid transparent;min-height:48px;padding:12px 0;background:transparent;color:var(--muted);font-size:15px;white-space:nowrap}.tabs button.active{border-bottom-color:var(--green);font-weight:600;color:var(--green)}.chart{width:100%;height:185px;overflow:visible}.chart text{font:12px Barlow,sans-serif;fill:#4f6576}.chart .line{fill:none;stroke:#27658d;stroke-width:2.5}.chart .area{fill:#c5dfea;opacity:.6}.chart line{stroke:#d6e0e7;stroke-width:1}.timeline{border-left:2px solid #cedce7;margin-left:5px;padding-left:22px}.timeline>div{position:relative;margin-bottom:24px;font-size:15px;overflow-wrap:anywhere}.timeline>div:before{content:'';position:absolute;left:-28px;top:8px;width:10px;height:10px;border:2px solid white;border-radius:50%;background:#62869f}.timeline small{display:block;font-size:12px;color:var(--muted);margin-top:6px}.code{font:13px/1.7 ui-monospace,monospace;background:#edf3f7;padding:18px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:6px}.boardgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.daycolumn{background:#e1e9ef;padding:18px;border:1px solid #cedbe5;border-radius:10px;min-width:0}.daycolumn h3{font-size:15px;font-weight:600;margin-bottom:20px;text-transform:none;letter-spacing:0}.daycolumn .card{padding:16px;margin-top:12px;border-top:3px solid #82a1b7}.daycolumn:nth-child(2) .card{border-top-color:#c68a35}.daycolumn:nth-child(3) .card{border-top-color:#69987b}.daycolumn .card p{margin:8px 0}.boardgrid .subtle{font-size:13px}.checkstep{display:flex;gap:13px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line);min-height:54px}.checkstep:last-child{border:0}.checkstep div{min-width:0}.checkstep h3{font-size:15px;overflow-wrap:anywhere}.checkstep p{white-space:pre-line;font-size:14px;margin-bottom:0;color:var(--muted);overflow-wrap:anywhere}.checkstep input{margin-top:3px}.brewHead{display:flex;justify-content:space-between;margin:28px 0 18px}.brewHead h2{font-size:34px;margin-bottom:7px}.brewLayout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:24px;align-items:start;margin-top:24px}.brewLayout>aside{display:grid;min-width:0;position:static;width:auto;padding:0;background:none;color:inherit;inset:auto;z-index:auto}.brewStep{border-left:4px solid #b4c7d5}.brewStep.running{border-color:#ad7327;background:#fffcf6}.brewStep .eyebrow{font-size:13px;color:var(--muted);margin-bottom:7px}.brewStep.running .eyebrow{color:#855309}.brewStep h2{font-size:29px;margin-bottom:0}.brewTarget{white-space:pre-line;margin-bottom:18px}.brewValues{display:flex;gap:12px 22px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px;margin-top:18px;font-size:14px}.brewValues b{font-weight:600}.stamp{font-size:12px;margin:16px 0 0}.brewStep .note{margin-bottom:0}.brewLayout aside>.card>summary{font-weight:600}.brewLayout .actions{margin-top:16px}
/* Dialogs stay inside the visual viewport and can scroll above on-screen keyboards. */
dialog{width:min(860px,calc(100vw - 48px));max-width:860px;max-height:calc(100dvh - 48px);overflow-y:auto;overscroll-behavior:contain;border:1px solid #b6c8d5;border-radius:14px;padding:32px;background:#f8fafc;color:var(--ink);box-shadow:0 20px 80px #0c294438}dialog::backdrop{background:#0e2944b8;backdrop-filter:blur(3px)}dialog h2{font-size:34px;margin-right:42px;margin-bottom:25px}dialog:has(.close){padding-top:27px}.close{position:sticky;float:right;top:0;z-index:4;display:grid;place-items:center;border:1px solid #b9cbd8;background:white;border-radius:7px;width:44px;height:44px;font-size:29px;color:var(--ink);line-height:1}#confirm{max-width:520px}#confirm h2{margin-right:0}#confirm .actions{justify-content:flex-end}#toast{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:80;max-width:calc(100vw - 32px);width:max-content;padding:14px 20px;border:1px solid #ffffff30;background:#153f60;color:white;border-radius:8px;box-shadow:0 7px 28px #102b4626;font-size:15px;display:none}.number{font-variant-numeric:tabular-nums}details>summary{cursor:pointer;font-size:15px;min-height:40px;padding:8px 0}details[open]>summary{margin-bottom:12px}.metric{font-size:30px}.progress{height:6px;background:#e1e9ef;border-radius:4px;overflow:hidden}.progress>div{height:100%;background:#638ba5}.costtotal{font:600 36px 'Barlow Condensed',sans-serif}#printRecipe,.printonly{display:none}
.displayMode #sidebar,.displayMode .shell>header,.displayMode .shell>footer,.displayMode #banner{display:none}.displayMode .shell{margin:0;background:#102b46;color:#eef5fa;min-height:100dvh}.displayMode main{max-width:1600px;padding:36px}.displayMode .card{background:#193b57;border-color:#365b76;color:#f1f6fa}.displayMode .subtle,.displayMode .lede,.displayMode .reading small{color:#b9ccdb}.displayMode .eyebrow{color:#f1c276}.displayMode .reading strong{font-size:34px}.displayMode .badge{background:#c5dfea;color:#153f60}.displayMode .btn{background:#244b69;color:white;border-color:#6e8ca3}.displayMode .miniTank{background:#224b68}.displayMode .tankcard .reading{border-color:#365b76}
@media(min-width:1700px){main{padding-top:44px}.pagehead h1{font-size:62px}}
@media(max-width:1250px){:root{--nav-width:224px}.shell>header{padding:0 26px}main{padding:28px 26px 50px}.shell>footer{padding:20px 26px}#banner{margin:18px 26px 0}.pagehead{flex-wrap:wrap;align-items:start}.pagehead .actions{max-width:none;justify-content:flex-start}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stats .stat{padding:20px}.boardgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.brewLayout{grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr)}.split{gap:20px}.card{padding:22px}.brand{font-size:21px}}
@media(max-width:1024px){:root{--nav-width:248px}#sidebar{width:min(310px,calc(100vw - 48px));transform:translateX(-101%);visibility:hidden;transition:transform .18s ease,visibility .18s;padding-top:28px;z-index:61}.shell{margin-left:0}.menuToggle{display:inline-flex;flex:none;background:transparent}.navClose{display:grid;place-items:center;position:absolute;right:12px;top:9px;width:44px;height:44px;min-height:44px;font-size:23px;background:transparent;color:#c5dfea;border:0;border-radius:5px}.brand{padding-top:18px}.navOpen #sidebar{transform:translateX(0);visibility:visible}.navOpen{overflow:hidden}.navOpen .navScrim{display:block;position:fixed;inset:0;z-index:60;background:#102b468c;border:0;padding:0;width:100%;height:100dvh}.shell>header{height:68px;padding:0 26px;gap:13px}.headerBrand{font-size:25px}#crumb{padding-left:13px}.brewLayout{grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr)}.sidefoot{padding-top:24px}.navlabel{margin-top:28px}.grid{gap:18px}.card{padding:24px}}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.split,.brewLayout{grid-template-columns:1fr}.brewLayout>aside{grid-row:1}.brewLayout>aside .card:has(.checkstep){display:block}.brewLayout>aside .checkstep{padding:13px 0}.kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi>div:nth-child(2){border-right:0}.kpi>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.pagehead{gap:18px}.pagehead .actions{width:100%}.pagehead .actions .btn{flex:0 1 auto}.phasebar{gap:4px}.phasebar span{font-size:12px}.heroart{padding:30px 15px}.herotext{padding:28px}.hero{grid-template-columns:1.3fr 1fr}.formgrid{gap:18px}.mashEditRow{grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,.8fr)) 44px}.mashEditRow label:nth-child(4){grid-column:1/3}.mashEditRow>button{grid-column:4;grid-row:1}.inventory table,.costTable table{display:block}.inventory thead,.costTable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.inventory tbody,.costTable tbody{display:grid;gap:16px;background:var(--bg)}.inventory.tablewrap,.costTable.tablewrap{border:0;border-radius:0;overflow:visible;background:none}.inventory tr,.costTable tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:white;border:1px solid var(--line);border-radius:10px;padding:4px 20px}.inventory td,.costTable td{display:block;min-width:0;border:0;padding:14px 0}.inventory td:first-child,.costTable td:first-child{grid-column:1/-1;border-bottom:1px solid var(--line);min-width:0}.inventory td:last-child{grid-column:1/-1;border-top:1px solid var(--line)}td[data-label]:not(:first-child):before{content:attr(data-label);display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}.inventory .lastPurchase{max-width:none}.inventory td:nth-child(4){grid-column:1/-1;border-top:1px solid var(--line)}.inventory td .actions{margin:0;gap:10px}.inventory td:first-child .linkbtn{font-size:18px;min-height:44px}.inventory td:last-child:before{display:none}.inventory tr:has(td[colspan]){display:block}.inventory td[colspan]:before{display:none}}
@media(max-width:560px){html{scroll-padding-top:76px}.shell>header{height:62px;padding:0 16px;gap:10px}#crumb{font-size:13px;padding-left:10px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.headerBrand{display:none}#saved{font-size:11px;white-space:nowrap;margin-left:auto}.shell>header .btn{padding:9px;min-width:44px}main{padding:24px 16px 40px}.shell>footer{padding:20px 16px;font-size:12px}.shell>footer span{display:none}#banner{margin:14px 16px 0}.demoBanner{align-items:flex-start;font-size:13px;padding:12px;gap:12px}.demoBanner .btn{padding:8px 10px;min-width:90px;font-size:12px}.pagehead{margin-bottom:24px;gap:17px}h1{font-size:41px;line-height:1.06;margin:8px 0 12px}h2{font-size:28px}.eyebrow{font-size:13px}.lede{font-size:15px}.pagehead .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pagehead .actions>.btn.primary{grid-column:1/-1}.pagehead .actions>.badge{justify-self:start;align-self:center}.pagehead .actions>.btn:only-child{grid-column:1/-1}.btn{padding:11px 13px;font-size:14px;min-height:46px;white-space:normal}.actions{gap:9px}.stats{margin-bottom:25px}.stat{padding:17px!important}.stat strong{font-size:32px}.stat small{font-size:12px}.stat span{font-size:12px;line-height:1.4;display:block}.grid,.grid.two{grid-template-columns:1fr;gap:16px}.card{padding:20px}.sectionhead{align-items:flex-start;margin-top:27px}.sectionhead h2{font-size:27px}.sectionhead>a{font-size:13px;flex:none;padding:5px 0}.split,.stack{gap:16px}.hero{grid-template-columns:1fr}.herotext{padding:25px}.heroart{display:none}.herotext h2{font-size:34px}.batchRow{gap:12px;align-items:flex-start}.batchRow .trailing{max-width:35%}.batchRow p{font-size:12px}.batchRow .linkbtn{font-size:16px}.batchRow .swatch{height:42px;margin-top:6px}.badge{font-size:11px;padding:5px 8px}.task{flex-wrap:wrap;column-gap:11px;row-gap:3px}.task span{flex:1;min-width:150px}.task small{margin-left:32px;width:calc(100% - 32px)}.toolbar{gap:10px}.toolbar input,.toolbar select{width:100%;min-width:0;flex:1 1 100%}.toolbar .field{flex:1 1 100%}.formgrid{grid-template-columns:minmax(0,1fr);gap:17px}.full{grid-column:1/-1}.ingredientRow{grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr) 44px;gap:9px;padding:12px 0;border-bottom:1px solid var(--line)}.ingredientRow .stepinput{grid-column:1/3;grid-row:2}.ingredientRow>button{grid-column:3;grid-row:1/3}.ingredientRow select{font-size:15px}.itemExtra .formgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mashEditRow,.fermEditRow{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px;padding:14px 0;border-bottom:1px solid var(--line);gap:10px}.mashEditRow label:first-child,.fermEditRow label:first-child{grid-column:1/3}.mashEditRow label:nth-child(4){grid-column:1/3}.mashEditRow>button,.fermEditRow>button{grid-column:3;grid-row:1}.mashEditRow input,.fermEditRow input{font-size:16px}.recipeActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.recipeActions .btn{font-size:13px}.recipeTargets{padding:16px;gap:12px 22px}.importAmount{grid-template-columns:minmax(0,1fr) 90px 35px}.importAmount>span{grid-row:2;grid-column:1/-1}.importIngredient{padding:16px}.kpi>div{padding:15px}.kpi small{font-size:12px}.kpi strong{font-size:28px}.phasebar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.phasebar span{font-size:12px;padding:9px 5px}.tabs{gap:22px;margin:24px 0;font-size:14px}.tabs button{font-size:14px;min-height:46px}.boardgrid{grid-template-columns:1fr}.daycolumn{padding:17px}.daycolumn h3{margin-bottom:13px}.brewLayout{gap:16px}.brewHead h2{font-size:32px}.brewStep h2{font-size:27px}.brewStep .cardtop{align-items:flex-start;gap:10px}.brewStep .pill{font-size:13px;white-space:nowrap}.brewLayout .actions{display:grid;grid-template-columns:1fr}.brewLayout .btn{justify-content:flex-start}.brewValues{gap:10px 16px}.brewLayout>aside{grid-row:auto}.brewLayout>aside .checkstep{padding:16px 0}.brewTarget{font-size:14px}.stamp{line-height:1.7}.inventory tr,.costTable tr{padding:3px 17px}.inventory .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.inventory .actions .smallbtn{justify-self:start}.inventory td:nth-child(3){padding-left:12px}.inventory th,.inventory td{font-size:14px}.inventory .actions .btn{padding:9px;font-size:13px}.purchaseOption{padding:14px}.purchaseOption small{font-size:13px}dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:12px;padding:20px;margin:auto}dialog:has(.close){padding-top:18px}dialog h2{font-size:30px;margin-right:44px;margin-bottom:24px}.close{top:0}.formgrid>.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;padding-top:10px}.formgrid>.actions button{width:100%}#confirm .actions{display:grid;grid-template-columns:1fr 1fr}dialog .tablewrap th,dialog .tablewrap td{padding:12px;font-size:13px}dialog .tablewrap table{min-width:450px}.displayMode main{padding:24px 16px}.displayMode .pagehead .actions{display:flex;flex-wrap:wrap}.displayMode .grid{grid-template-columns:1fr}#toast{bottom:max(16px,env(safe-area-inset-bottom));font-size:14px;padding:12px 16px}.lastPurchase{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{#sidebar,.shell>header,.shell>footer,.navScrim,.btn,.smallbtn,.toolbar,.close,#toast{display:none!important}.shell{margin:0}main{padding:0}body{background:white}.card,.stat{break-inside:avoid}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.printonly{display:block}body.recipePrint>*:not(#printRecipe){display:none!important}body.recipePrint #printRecipe{display:block;padding:20px;font:12px/1.4 Barlow,sans-serif}body.recipePrint #printRecipe h1{font-size:29px}body.recipePrint #printRecipe h2{font-size:22px;margin-top:22px}body.recipePrint #printRecipe table{width:100%}dialog[open]{position:static;max-height:none;width:auto;max-width:none;box-shadow:none}.brewLayout{display:block}.brewLayout>aside{display:block}}
@media(min-width:1025px){.shell>header .menuToggle{display:none}}
@media(max-width:1024px){.shell>header .menuToggle{display:inline-flex}}
.timerPanel{margin:22px 0 26px;border-top:4px solid #c28b38}.timerPanel .cardtop h2{margin-bottom:8px}.timerPanel .cardtop p{margin:0}.timerHint{max-width:85ch;margin:16px 0}.timerGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}.timerTile{border:1px solid var(--line);border-radius:8px;padding:18px;background:#f5f8fa;min-width:0}.timerTile h3{font-size:15px;overflow-wrap:anywhere}.timerClock{display:block;font:600 40px/1.2 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums;margin:12px 0 5px}.timerTile.due{background:#fff1d4;border-color:#ad6b12}.timerTile.due .timerClock{color:#84520d}.timerTile .actions{margin-top:12px}.timerAlerts{position:fixed;bottom:18px;right:18px;z-index:70;width:min(490px,calc(100vw - 36px));max-height:40dvh;overflow:auto;padding:20px;border:2px solid #ae701c;border-radius:12px;background:#fff3db;box-shadow:0 10px 40px #102b4640;color:#63420f}.timerAlerts[hidden]{display:none}.timerAlerts h2{font-size:27px;margin-bottom:12px}.timerAlerts>div{display:flex;gap:14px;align-items:center;justify-content:space-between;padding:10px 0;border-top:1px solid #d6b982;font-size:14px}.timerAlerts a{overflow-wrap:anywhere}.timerAlerts .btn{flex:none}.comparisonGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:25px 0}.comparisonItem{background:#f1f6f9;border:1px solid var(--line);border-radius:8px;padding:20px;min-width:0}.comparisonItem>div{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:15px}.comparisonItem span{font-size:13px;color:var(--muted)}.comparisonItem strong{display:block;font:600 26px/1.2 'Barlow Condensed',sans-serif;color:var(--ink);margin:6px 0 12px;overflow-wrap:anywhere}.comparisonItem p{margin:0}.audit{background:#eef4f8;border:1px solid var(--line);border-radius:7px;padding:8px 14px;margin-top:12px}.audit p{font-size:14px}.auditRow{display:grid;grid-template-columns:1fr 2fr;gap:12px;border-top:1px solid var(--line);padding:10px 0;font-size:14px;white-space:pre-line}.auditRow span{overflow-wrap:anywhere}@media(max-width:1000px){.timerGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.timerGrid,.comparisonGrid{grid-template-columns:1fr}.timerPanel .actions{display:grid;grid-template-columns:1fr}.timerTile .actions{display:flex}.timerPanel .btn{justify-content:flex-start}.timerAlerts{right:10px;bottom:10px;width:calc(100vw - 20px);padding:15px;max-height:35dvh}.timerAlerts>div{flex-wrap:wrap}.comparisonItem{padding:17px}.comparisonItem strong{font-size:24px}.auditRow{grid-template-columns:1fr;gap:5px}}
/* Device-local preferences; the working palette keeps its brewery identity in both modes. */
.preferencePanel{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,1fr);gap:28px;margin-bottom:26px;align-items:center}.preferencePanel p{margin:0}.preferencePanel h2{margin-bottom:10px}.unitToggle{font-variant-numeric:tabular-nums;min-width:48px}.themeToggle{font-size:22px;line-height:1}.fermentationDashboard{margin-bottom:26px}.fermentationControls{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);gap:28px;align-items:center}.fermentationControls h2{margin-bottom:10px}.fermentationControls p{margin:0}.stabilityPanel{margin:18px 0;border-left:4px solid #6c8c9f}.stabilityPanel h3{font-size:20px;margin:14px 0 8px}.stabilityPanel .note{margin-bottom:0}.fermentationCharts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.chartPanel{padding:20px}.chartPanel .cardtop{margin-bottom:10px;align-items:flex-start}.chartPanel .cardtop h3{margin:0}.chartPanel .cardtop strong{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:17px}.fermentationChart{width:100%;height:auto;display:block;min-height:160px;overflow:visible}.fermentationChart path{fill:none;stroke:#27658d;stroke-width:2.5}.fermentationChart circle{fill:#27658d}.fermentationChart.temp path{stroke:#9b6617}.fermentationChart.temp circle{fill:#9b6617}.fermentationChart.battery path{stroke:#397856}.fermentationChart.battery circle{fill:#397856}.fermentationChart line{stroke:var(--line);stroke-width:1}.fermentationChart text{font:15px Barlow,sans-serif;fill:var(--muted)}.chartEmpty{padding:30px 10px;min-height:150px;display:grid;place-items:center;text-align:center;font-size:14px;color:var(--muted)}.brokerStatus{margin-bottom:24px}.brokerStatus h2{font-size:28px}.brokerStatus p{margin:0}.deviceMetrics{display:flex;gap:28px;margin:20px 0 24px}.deviceMetrics span{font-size:13px;color:var(--muted)}.deviceMetrics b{display:block;font:600 28px 'Barlow Condensed',sans-serif;color:var(--ink);margin-top:5px}.deviceCard .formgrid{border-top:1px solid var(--line);padding-top:22px}
:root{--button-bg:#153f60;--button-text:#fff}.btn.primary{background:var(--button-bg);border-color:var(--button-bg);color:var(--button-text)}
:root[data-theme="dark"]{--bg:#10202d;--paper:#192f40;--ink:#e4edf4;--muted:#b1c4d3;--line:#3c5569;--green:#a1cde9;--accent:#efc17a;--button-bg:#2b688e;--button-text:#fff;--red:#ffb5a3;color-scheme:dark}
:root[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
:root[data-theme="dark"] .shell>header{background:#142a3bee}
:root[data-theme="dark"] .card,:root[data-theme="dark"] .stats,:root[data-theme="dark"] .kpi,:root[data-theme="dark"] .recipeTargets,:root[data-theme="dark"] .tablewrap,:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea{background:var(--paper);color:var(--ink)}
:root[data-theme="dark"] .btn,:root[data-theme="dark"] .close{background:#203c50;color:#d9eaf6;border-color:#617f94}
:root[data-theme="dark"] .btn:hover:not(:disabled){background:#2b4d65;border-color:#9cb9cc}
:root[data-theme="dark"] .btn.primary{background:var(--button-bg);color:var(--button-text);border-color:#5492b6}
:root[data-theme="dark"] .btn.primary:hover:not(:disabled){background:#347aa4}
:root[data-theme="dark"] .btn.danger{color:var(--red);border-color:#98695c}
:root[data-theme="dark"] .info,:root[data-theme="dark"] .purchaseOption,:root[data-theme="dark"] .importIngredient,:root[data-theme="dark"] .comparisonItem,:root[data-theme="dark"] .timerTile,:root[data-theme="dark"] .audit,:root[data-theme="dark"] .code{background:#203c50;border-color:#4c6a80;color:#d3e5f2}
:root[data-theme="dark"] dialog{background:#142a3b;color:var(--ink);border-color:#6b879c}
:root[data-theme="dark"] .pill,:root[data-theme="dark"] .icon{background:#28465b;color:#c4e1f5}
:root[data-theme="dark"] th{background:#233e52;color:#d0e1ee}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea{border-color:#6d899f}
:root[data-theme="dark"] input::placeholder,:root[data-theme="dark"] textarea::placeholder{color:#afc1cf}
:root[data-theme="dark"] .callout,:root[data-theme="dark"] .importWarnings,:root[data-theme="dark"] .demoBanner,:root[data-theme="dark"] .timerTile.due,:root[data-theme="dark"] .timerAlerts{background:#443824;border-color:#b88d49;color:#ffe0a7}
:root[data-theme="dark"] .callout p,:root[data-theme="dark"] .callout h3,:root[data-theme="dark"] .callout .subtle,:root[data-theme="dark"] .warning,:root[data-theme="dark"] .inventory .low,:root[data-theme="dark"] .timerTile.due .timerClock{color:#ffe0a7}
:root[data-theme="dark"] .badge{background:#354d60;color:#d7e6f1}
:root[data-theme="dark"] .badge.fermenting{background:#244b3e;color:#bfe9cf}
:root[data-theme="dark"] .badge.conditioning{background:#2a4665;color:#d0e4ff}
:root[data-theme="dark"] .badge.brewing{background:#534020;color:#ffe0a1}
:root[data-theme="dark"] .badge.packaging{background:#513960;color:#ead2fa}
:root[data-theme="dark"] .phasebar span{background:#2a4356;color:#c6dae8}
:root[data-theme="dark"] .phasebar span.done{background:#2d5142;color:#c5e9d6}
:root[data-theme="dark"] .phasebar span.active{background:#316e93;color:white}
:root[data-theme="dark"] .daycolumn{background:#172e40;border-color:var(--line)}
:root[data-theme="dark"] .brewStep.running{background:#3c3528;border-color:#c39554}
:root[data-theme="dark"] .brewStep.running .eyebrow{color:#f3cf93}
:root[data-theme="dark"] .tankcard .miniTank{background:#28485e;border-color:#81a2ba}
:root[data-theme="dark"] .chart .line,:root[data-theme="dark"] .fermentationChart path{stroke:#98c9eb}
:root[data-theme="dark"] .chart .area{fill:#3d6e90}
:root[data-theme="dark"] .fermentationChart circle{fill:#98c9eb}
:root[data-theme="dark"] .fermentationChart.temp path{stroke:#efc17a}
:root[data-theme="dark"] .fermentationChart.temp circle{fill:#efc17a}
:root[data-theme="dark"] .fermentationChart.battery path{stroke:#9ad6b2}
:root[data-theme="dark"] .fermentationChart.battery circle{fill:#9ad6b2}
:root[data-theme="dark"] .chart text{fill:var(--muted)}
:root[data-theme="dark"] .hero{background:#24475e;border-color:#617f94}
:root[data-theme="dark"] .herotext p{color:#d0e1ee}
:root[data-theme="dark"] .heroart{background:#1b374c}
:root[data-theme="dark"] .tank{background:#36566b;border-color:#9ab8cc}
:root[data-theme="dark"] .tank span{color:#e1edf6}
:root[data-theme="dark"] .inventory tr,:root[data-theme="dark"] .costTable tr{background:var(--paper)}
:root[data-theme="dark"] .ingredientRow>button,:root[data-theme="dark"] .mashEditRow>button,:root[data-theme="dark"] .fermEditRow>button{background:#513c38;color:#ffd0c2;border-color:#9c796f}
:root[data-theme="dark"] .skipLink{background:var(--paper)}
@media(max-width:1250px){.fermentationCharts{grid-template-columns:1fr}.fermentationChart{max-height:250px}.fermentationControls{grid-template-columns:1fr}.preferencePanel{grid-template-columns:1fr}.chartPanel{padding:24px}}
@media(max-width:560px){.shell>header{gap:6px}.shell>header #saved{display:none}.shell>header #crumb{flex:1;margin-right:auto;padding-left:5px}.shell>header .btn{min-width:44px;width:44px;padding:8px}.fermentationControls{padding:20px;gap:18px}.fermentationCharts{gap:16px}.chartPanel{padding:18px}.fermentationChart{min-height:130px}.preferencePanel{gap:20px}.stabilityPanel .note{font-size:13px}.deviceMetrics{gap:22px}}
@media print{:root[data-theme="dark"]{--bg:#fff;--paper:#fff;--ink:#163149;--muted:#536777;--line:#d6e0e7;color-scheme:light}.themeToggle,.unitToggle{display:none!important}}
.fermentationCharts{grid-template-columns:1fr}.fermentationChart{max-height:250px}.fermentationChart text{font-size:14px}.chartMount{min-width:0;width:100%}
/* iPad / installed PWA: preserve zoom, touch targets and all four safe areas. */
:root{--page-pad:38px;--header-height:72px;--visual-height:100dvh}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-height) + env(safe-area-inset-top) + 20px)}
.shell>header{height:calc(var(--header-height) + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);padding-right:max(var(--page-pad),env(safe-area-inset-right));padding-left:max(var(--page-pad),env(safe-area-inset-left))}
main{padding-left:max(var(--page-pad),env(safe-area-inset-left));padding-right:max(var(--page-pad),env(safe-area-inset-right))}
.shell>footer{padding-bottom:calc(20px + env(safe-area-inset-bottom));padding-left:max(var(--page-pad),env(safe-area-inset-left));padding-right:max(var(--page-pad),env(safe-area-inset-right))}
#sidebar{padding-top:calc(30px + env(safe-area-inset-top));padding-bottom:calc(20px + env(safe-area-inset-bottom));padding-left:max(18px,env(safe-area-inset-left))}
.navClose{top:calc(9px + env(safe-area-inset-top))}
#toast{bottom:calc(18px + env(safe-area-inset-bottom));max-width:calc(100vw - 32px - env(safe-area-inset-left) - env(safe-area-inset-right))}
.timerAlerts{bottom:calc(18px + env(safe-area-inset-bottom));right:calc(18px + env(safe-area-inset-right))}
dialog{max-height:calc(min(100dvh,var(--visual-height)) - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain;scroll-padding:24px}
.pwaPanel{margin-bottom:26px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;align-items:start}
.pwaIntro{display:flex;align-items:flex-start;gap:20px}.pwaIntro h2{margin:8px 0 12px}.pwaIntro p{margin-bottom:0}.pwaIcon{border-radius:16px;flex:none;box-shadow:0 5px 18px #102b461a}.pwaInstructions ol{padding-left:22px;font-size:15px;margin:18px 0}.pwaInstructions li{padding-left:5px;margin:10px 0}.pwaInstructions .note{margin-bottom:0}.pwaStatus{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:13px}.pwaStatus span:first-child{font-weight:600;color:var(--green)}
#pwaNotices{margin:0 var(--page-pad)}.pwaNotice{display:flex;gap:18px;align-items:center;justify-content:space-between;padding:16px 20px;margin-top:18px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px;background:var(--paper);font-size:14px}.pwaNotice span{display:block;color:var(--muted)}.pwaNotice .btn{flex:none}.pwaPanel [hidden],#pwaNotices [hidden]{display:none!important}
@media(max-width:1100px){.pwaPanel{grid-template-columns:1fr;gap:24px}}
@media(max-width:1024px){:root{--header-height:68px;--page-pad:26px}#sidebar{padding-top:calc(28px + env(safe-area-inset-top))}}
@media(max-width:560px){:root{--header-height:62px;--page-pad:16px}.pwaIntro{gap:16px}.pwaIntro .pwaIcon{width:56px;height:56px;border-radius:13px}.pwaIntro .eyebrow{font-size:12px}.pwaNotice{flex-direction:column;align-items:stretch;gap:12px}.pwaNotice .btn{width:100%}.pwaPanel{gap:18px}}
@media(pointer:coarse){input,select,textarea,.ingredientRow select{font-size:16px}summary{min-height:44px;align-content:center}.task{min-height:48px}}
@media(display-mode:standalone){body{min-height:100dvh}}
@media print{.pwaPanel,#pwaNotices{display:none!important}}

.keyboardOpen dialog[open]{top:calc(var(--visual-offset-top,0px) + 14px + env(safe-area-inset-top));bottom:auto;margin-top:0;margin-bottom:0}
.timerDevice{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px;padding-top:24px;border-top:1px solid var(--line)}.timerDevice>div{min-width:0}.timerDevice p{margin:10px 0 0;font-size:13px}.timerDevice [hidden]{display:none!important}.timerDevice .btn{width:100%}@media(max-width:1100px){.timerDevice{grid-template-columns:1fr}}
/* A quiet account entrance and narrowly scoped, read-only display shares. */
.loginPage{min-height:100dvh;display:grid;align-items:center;padding:max(28px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background:#102b46;color:#e4edf4}.loginLayout{padding:0;max-width:1050px;display:grid;grid-template-columns:1.1fr 1fr;gap:70px;align-items:center}.loginStory{padding:30px 0}.loginStory img{border-radius:16px;margin-bottom:30px}.loginStory .eyebrow{color:#efc17a;font-size:12px;letter-spacing:1px}.loginStory h1{font-size:clamp(48px,6vw,76px);line-height:1.04;margin:20px 0 26px}.loginStory>p:not(.eyebrow){max-width:36ch;color:#b9cfdf;font-size:18px}.loginStory .loginFoot{font-size:13px!important;margin-top:45px}.loginCard{color:#163149;padding:36px}.loginCard h2{font-size:38px;margin-top:10px}.loginCard .stack{gap:20px}.loginCard [hidden],.accessPanel [hidden]{display:none!important}.rememberChoice{display:flex;gap:12px;align-items:center;font-size:14px}.loginHelp{margin:24px 0 0;font-size:13px}.loginCard .info p{margin:12px 0 0;overflow-wrap:anywhere}.accessPanel{margin-bottom:28px}.accessPanel .cardtop{align-items:flex-start}.accessPanel .cardtop h2{margin:6px 0}.accessPanel .cardtop p{margin:0}.accessPanel .split{margin-top:24px;gap:36px}.accessPanel .note{margin:0}.accessRow{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid var(--line)}.accessRow p{margin:6px 0 0}.accessRow .actions{margin:0;flex:none}.accessRow h3{overflow-wrap:anywhere}.newShare{margin-top:22px;padding:20px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px}.newShare input{width:100%;font-size:14px;margin-bottom:14px}.sideLogout{margin-left:14px;color:#c5dfea}.sharedPage{min-height:100dvh}.shareHeader{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:36px max(28px,env(safe-area-inset-right)) 0 max(28px,env(safe-area-inset-left));max-width:1510px;margin:auto}.shareHeader h1{font-size:clamp(34px,4vw,54px);margin:10px 0 12px}.shareHeader p{color:var(--muted);font-size:14px}.shareHeader .actions{margin:0;flex:none}.sharedPage main{padding:22px 28px}.shareFooter{padding:20px 28px calc(20px + env(safe-area-inset-bottom));text-align:center;color:var(--muted);font-size:13px}.sharedTank .badge{margin-bottom:18px}.sharedTank h2{font-size:34px}.sharedTank .reading{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;border-top:1px solid var(--line);padding-top:20px;margin:22px 0}.sharedTasks{margin-top:24px}.invalidShare{max-width:600px;color:#163149}.invalidShare h1{font-size:46px;margin-top:24px}@media(max-width:820px){.loginLayout{max-width:560px;grid-template-columns:1fr;gap:26px}.loginStory{padding:0}.loginStory img{width:56px;height:56px;margin-bottom:14px}.loginStory h1{font-size:50px;margin:14px 0 20px}.loginStory .loginFoot{display:none}.loginStory>p:not(.eyebrow){font-size:16px}.loginCard{padding:26px}.accessRow{align-items:flex-start;flex-direction:column}.accessRow .actions{flex-wrap:wrap}.shareHeader{flex-direction:column;align-items:flex-start;gap:12px}.shareHeader .actions{width:100%}.sharedPage .grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.loginPage{padding:22px 16px}.loginStory h1{font-size:43px}.loginCard{padding:22px}.loginCard h2{font-size:32px}.accessPanel .cardtop{flex-direction:column}.accessPanel .split{gap:28px}.newShare{padding:15px}.sharedPage .grid{grid-template-columns:1fr}.sharedPage main{padding:20px 16px}.shareHeader{padding:24px 16px 0}.shareHeader .actions{display:grid;grid-template-columns:1fr 1fr}.shareFooter{padding-left:16px;padding-right:16px}}
.sharedTank h2,.sharedTank h3,.shareHeader h1{overflow-wrap:anywhere}

/* Fermenter display: instrument readings first, connection history below. */
.cellarCard{min-width:0;text-align:left}.cellarCard h2{font-size:1.55rem}.cellarCard>h3{font-size:1.45rem;margin:22px 0 8px}.cellarMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 12px;margin:24px 0}.cellarMetric{min-width:0}.cellarMetric small{display:block;color:var(--muted);line-height:1.4}.cellarMetric strong{display:block;font-size:1.6rem;font-weight:600;font-variant-numeric:tabular-nums;margin:5px 0}.cellarMetric small:last-child:not(:first-child){font-size:.75rem}.cellarCard progress{width:100%;height:8px;accent-color:var(--accent,#52a0bd)}.cellarCard>p{overflow-wrap:anywhere}.cellarSensor{border-top:1px solid var(--line,#35465a);margin-top:22px;padding-top:22px}.cellarSensor .cellarMetric strong{font-size:1.2rem}.cellarStability{font-weight:600;line-height:1.5}.cellarTrend svg{display:block;width:100%;height:auto;max-height:120px;color:var(--accent,#4fa1c2)}.cellarTrend path{fill:none;stroke:currentColor;stroke-width:2;vector-effect:non-scaling-stroke}.cellarTrend circle{fill:currentColor}.cellarTrend{margin-top:18px}.displayMode .grid,.sharedPage #sharedContent>.grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,410px),1fr));align-items:start}.cellarCard .cardtop{gap:10px;flex-wrap:wrap}.cellarCard .warning{font-size:.9rem;line-height:1.5}
@media(max-width:520px){.cellarMetrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.cellarMetric strong{font-size:1.45rem}.cellarCard{padding:20px}.displayMode main{padding:16px}.cellarSensor .cellarMetrics{grid-template-columns:repeat(3,minmax(0,1fr))}.cellarSensor .cellarMetric strong{font-size:1rem}}

/* The vessel is the primary object; instrumentation stays behind a disclosure. */
.cellarVessel{display:flex;flex-direction:column;align-items:center;margin:12px 0 4px}.cellarVessel svg{width:min(100%,230px);height:265px;overflow:visible}.cellarVessel .vesselOutline{stroke:#546f83;stroke-width:1.7}.cellarVessel .vesselLegs{stroke:#839bad;stroke-width:9;stroke-linecap:round;fill:none}.cellarVessel .vesselPipe{stroke:#8fa7b8;stroke-width:7;stroke-linejoin:round;stroke-linecap:round;fill:none}.cellarVessel .vesselShine{stroke:white;stroke-opacity:.4;stroke-width:7;stroke-linecap:round;fill:none}.cellarVessel .vesselVolume{fill:#fff;font:600 17px Barlow,sans-serif}.vesselCaption{margin:0!important;font-variant-numeric:tabular-nums}.cellarCard>h3{margin:14px 0 4px;text-align:center;font-size:1.25rem}.cellarCard>h3+p{text-align:center;margin-bottom:8px}.cellarCompact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));text-align:center;gap:14px;padding:18px 0 12px}.cellarCompact .cellarMetric strong{font-size:1.6rem}.cellarDetails{border-top:1px solid var(--line);margin-top:12px;padding-top:4px}.cellarDetails>summary{cursor:pointer;min-height:44px;padding:12px 0;font-size:14px;color:var(--muted)}.cellarDetails>p{margin-top:14px}.cellarCard .vesselWave{animation:vesselSway 5s ease-in-out infinite alternate}.cellarCard .vesselBubble{fill:#ffe7a0;fill-opacity:0;animation:vesselRise 7s ease-in infinite}.displayMode .grid,.sharedPage #sharedContent>.grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr))}
@keyframes vesselSway{from{transform:translate(-8px,0)}to{transform:translate(8px,1px)}}
@keyframes vesselRise{0%,15%{transform:translateY(0);fill-opacity:0}30%{fill-opacity:.6}85%,100%{transform:translateY(var(--bubble-rise,-70px));fill-opacity:0}}
@media(prefers-reduced-motion:reduce){.cellarCard .vesselWave,.cellarCard .vesselBubble{animation:none}.cellarCard .vesselBubble{fill-opacity:.3}}
@media(max-width:520px){.cellarVessel svg{height:240px}.cellarCompact .cellarMetric strong{font-size:1.4rem}}
.settingsLayout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:start}.settingsNav{display:flex;flex-direction:column;gap:6px;position:sticky;top:96px}.settingsNav a{padding:13px 16px;min-height:46px;border-radius:7px;text-decoration:none;font-weight:600;color:var(--muted)}.settingsNav a[aria-current=page]{background:var(--lime);color:var(--navy)}.settingsContent{min-width:0}.settingsContent .accessPanel{margin:0}.settingsContent .accessPanel>form{margin:22px 0}.beerShareUrl{width:100%}.beerProfile{max-width:850px;margin:12px auto 40px;padding:clamp(22px,4vw,48px)}.beerProfile h2{font-size:clamp(28px,5vw,50px)}.beerMetrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;margin:36px 0}.beerMetrics small{color:var(--muted)}.beerMetrics strong{display:block;font-size:clamp(24px,4vw,38px);font-variant-numeric:tabular-nums}@media(max-width:850px){.settingsLayout{grid-template-columns:1fr;gap:22px}.settingsNav{position:static;flex-direction:row;flex-wrap:wrap;gap:5px}.settingsNav a{border:1px solid var(--line);font-size:14px;padding:11px 13px}}@media(max-width:430px){.beerMetrics{gap:20px}.settingsNav{display:grid;grid-template-columns:1fr 1fr}}
.cellarVessel .vesselModelLegs{stroke:#8da3b3;stroke-width:8;fill:none;stroke-linecap:round}.cellarVessel .vesselCasterStem{stroke:#8da3b3;stroke-width:5;fill:none}.cellarVessel .vesselRim{stroke:#587386;stroke-width:3}.cellarVessel .vesselHandle{stroke:#728c9f;stroke-width:4;fill:none;stroke-linejoin:round;stroke-linecap:round}.cellarVessel .vesselAirlock{stroke:#93b9c8;stroke-width:4;stroke-opacity:.85;fill:none;stroke-linejoin:round;stroke-linecap:round}.cellarVessel .vesselTap{stroke:#708b9e;stroke-width:7;fill:none;stroke-linejoin:round}.cellarVessel .vesselValveHandle{stroke:#245c87;stroke-width:5;fill:none;stroke-linecap:round}.tankDesignPreview{display:flex;justify-content:center;min-width:0;border:1px solid var(--line);border-radius:9px;background:var(--bg);padding:12px}.tankDesignPreview .cellarVessel{margin:0}.tankDesignPreview .cellarVessel svg{height:230px;width:200px}.tankDesignPreview .vesselCaption{font-size:13px}
.displayMode .cellarCard{--muted:#b9ccdb;--line:#365b76;--accent:#f1c276}.displayMode .cellarCard .warning{color:#ffe0a7}
/* Product identity and critical device state share the existing brewery palette. */
.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.inventoryProduct{display:flex;align-items:center;gap:16px;min-width:220px}.ingredientThumb{width:64px;height:64px;object-fit:contain;flex:none;border-radius:8px;border:1px solid var(--line);background:#fff;padding:5px}.ingredientPlaceholder{display:grid;place-items:center;background:var(--bg);color:var(--muted)}.articleNumber{display:block;margin-top:3px;overflow-wrap:anywhere}.ingredientImageEditor{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.ingredientImageEditor label{min-width:0}.ingredientImageEditor input[type=file]{width:100%;padding:10px}.ingredientImageEditor [data-image-status]{grid-column:1/-1;margin:0}.ingredientImagePreview img{display:block;object-fit:contain;border:1px solid var(--line);border-radius:8px;background:#fff;padding:6px}.ingredientImageEditor [data-image-remove]{justify-self:start}
.contactLost,.badge.contactLost{color:#9d251f;background:#fff0ee;border:1px solid #e8b3ae;border-radius:6px;font-weight:600;padding:7px 10px;line-height:1.4}.deviceLost{border-color:#c9574d;box-shadow:inset 4px 0 #bb3e32}.tankEndDate{font-size:14px;font-weight:600;margin:8px 0 18px}.deviceCard .cardtop{align-items:flex-start;gap:12px;flex-wrap:wrap}.deviceCard .contactLost{white-space:normal}.deviceCard .actions{justify-content:flex-end}.dashboardOverview .sectionhead h2{font-size:25px}.pagehead .lede:empty{display:none}
:root[data-theme=dark] .contactLost,:root[data-theme=dark] .badge.contactLost{color:#ffbcb5;background:#482722;border-color:#a95e56}:root[data-theme=dark] .deviceLost{border-color:#d7857b;box-shadow:inset 4px 0 #dc8176}.displayMode .contactLost{color:#ffbcb5;background:#482722;border-color:#a95e56}
@media(max-width:600px){.ingredientImageEditor{grid-template-columns:minmax(0,1fr) 96px}.inventoryProduct{gap:12px;min-width:0}.ingredientThumb{width:52px;height:52px}.dashboardOverview .sectionhead{gap:10px}.deviceCard .actions .btn{width:100%}}

.ingredientImageError{display:block;max-width:34ch;margin-top:8px;color:var(--red);line-height:1.45}.ingredientImageEditor [data-image-status]{overflow-wrap:anywhere}

/* Scale controls share the app typography, surface palette and touch targets. */
.scaleSectionHead{margin-top:0}.scaleSecret{display:grid;gap:16px;margin-top:24px;padding:20px;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px}.scaleSecret[hidden]{display:none}.scaleSecret h3,.scaleSecret p{margin-bottom:0}.scaleSecret input{width:100%;font-size:16px}.scaleHelp{margin-top:20px}.scaleHelp summary{cursor:pointer;padding:10px 0}.scaleHelp p{margin-top:12px;max-width:70ch}.scaleDevice,.scaleResult{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:22px 0;border-top:1px solid var(--line)}.scaleDevice:first-child,.scaleResult:first-child{border-top:0}.scaleDevice p,.scaleResult p{margin-bottom:8px}.scaleResult{grid-template-columns:minmax(0,1fr) minmax(170px,1fr) auto}.scaleDevice h3,.scaleResult h3,.scaleReading{overflow-wrap:anywhere}.scaleReading{margin:0}.scaleReading strong{display:block;font:600 29px/1.2 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums}.scaleReading span{display:block;font-size:13px;color:var(--muted);margin-top:6px}.scaleDevice .badge{margin-left:8px}.scaleStatus{margin-bottom:0}.scalePanel>p{max-width:75ch}
@media(max-width:1100px){.scaleResult{grid-template-columns:minmax(0,1fr) minmax(150px,1fr)}.scaleResult>.btn{grid-column:1/-1;justify-self:start}}
@media(max-width:600px){.scaleDevice,.scaleResult{grid-template-columns:minmax(0,1fr);gap:14px}.scaleDevice .actions{display:flex;flex-wrap:wrap}.scaleSecret{padding:16px}.scaleSecret .actions{display:grid;grid-template-columns:1fr}.scaleReading strong{font-size:27px}}

.guidedHeading{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:18px}.guidedHeading h2{font-size:clamp(30px,4vw,44px);max-width:26ch}.guidedHeading p{margin-bottom:8px}.guidedHeading>a{font-size:14px;flex:none}.guidedBrew>progress{width:100%;height:8px;accent-color:var(--green);display:block;margin-bottom:24px}.guidedCurrent{border-top:4px solid var(--accent);margin-bottom:20px}.guidedCurrent form{margin-top:20px}.guidedCurrent label{min-width:0}.guidedTarget{font-size:21px;margin-bottom:18px}.guidedTarget strong{font-size:34px;font-family:'Barlow Condensed',sans-serif}.guidedScale,.guidedManual{margin:20px 0}.guidedScale summary,.guidedManual summary{cursor:pointer;padding:12px 0;font-weight:600}.guidedChecklist{margin:24px 0;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);padding:20px}.guidedChecklist summary{cursor:pointer;font-weight:600}.guidedChecklist ol{list-style:none;padding:0;margin:16px 0 0}.guidedChecklist li{display:flex;gap:14px;padding:13px 0;border-bottom:1px solid var(--line)}.guidedChecklist li>span{min-width:28px;font-weight:600}.guidedChecklist small{display:block;color:var(--muted);margin-top:4px}.guidedChecklist .done>span{color:var(--green)}.guidedChecklist .current{font-weight:600}.guidedChecklist .locked{color:var(--muted)}.guidedAddition{padding:20px 0;border-top:1px solid var(--line);margin-top:20px}.guidedAddition .formgrid{margin-top:10px}.guidedCurrent .purchaseOption{align-items:center}.guidedCurrent input[type=checkbox]{width:22px;height:22px;flex:none}.guidedCurrent form>.btn{min-height:48px}@media(max-width:650px){.guidedHeading{flex-direction:column;gap:8px}.guidedCurrent{padding:20px}.guidedChecklist{padding:16px}.guidedCurrent .formgrid{grid-template-columns:minmax(0,1fr)}}
