/* Maláta, réz és borostyán: világos és sötét sörfőzőműhely. */
:root{color-scheme:light;--malt:#a16b20;--hop:#627344;--brew-start:#f6e7c9;--brew-end:#fff7e9}
.chart svg text{font-size:12px}
.theme-toggle{min-height:34px;padding:7px 11px;font-size:12px}
#theme-icon{font-size:19px;line-height:1}
.rule-sg{font-size:13px;color:#7d6e5b;margin-top:12px;line-height:1.8}
#cancel-rule-edit{margin-top:10px}
.process-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;border-radius:6px;padding:5px 9px;margin:12px 0 0 47px;background:#f2f0ed;color:#90806c}
.process-badge.cooling{background:#e9f3f7;color:#427b9c}
.process-badge.heating{background:#fff0e2;color:#ab6635}
.process-icon{font-size:17px;line-height:1}
.metric-detail{white-space:normal;line-height:1.7;min-height:18px}
.metric-label{gap:8px;line-height:1.5}
.fan-selector small{font-size:11px}
.fan-selector span{min-width:0}
.rule-state{font-size:11px}
.nav-link{min-width:0}
@media(min-width:641px){.sidebar{width:252px}.workspace{margin-left:252px}}
@media(min-width:641px) and (max-width:1150px){.sidebar{width:228px;padding-left:14px;padding-right:14px}.workspace{margin-left:228px}.nav-link{font-size:14px;padding-left:12px;padding-right:12px}.brand{font-size:23px;gap:9px}}
@media(max-width:900px){.metric-label{font-size:12px}.metric-detail{font-size:11px}.metric-value{font-size:38px}}
@media(max-width:640px){#theme-label{display:none}.theme-toggle{width:32px;min-height:32px;padding:5px}.topbar{padding-left:17px;padding-right:17px}.topbar-right{gap:8px}.breadcrumb{font-size:11px}.breadcrumb>span{margin:0 4px}.mode-badge{font-size:9px;padding:5px 6px}.avatar{display:none}.topbar-user{display:none}.nav-link{font-size:11px}.chart svg text{font-size:11px}.metric-label{font-size:12px}.metric-detail{font-size:11px}.metric-value{font-size:37px}.brew-banner p{font-size:11px}.brew-banner h2{font-size:18px}.brew-status{font-size:10px}.rule-sg{font-size:12px}.fan-selector small{font-size:10px}.form-actions{flex-wrap:wrap}.form-actions .button{font-size:12px}.chart-footer>span{font-size:10px}.automation-callout h3{font-size:15px}.automation-callout p{font-size:12px}.sidebar{padding-top:20px}.metric-grid{align-items:stretch}}
[data-theme="dark"]{color-scheme:dark;--ink:#f1e5d1;--text:#e9ddcc;--muted:#bca991;--paper:#191512;--card:#251f1a;--line:#493c30;--accent:#d49b42;--light:#40301f;--danger:#f0b6a5;--malt:#e5b466;--hop:#b2bd7c;--brew-start:#402c1a;--brew-end:#30251b;--sb-bg:#211912;--sb-text:#efece9;--sb-muted:#aea294;--sb-brand:#e6b868;--sb-link:#d4cec7;--sb-link-hover:#ffffff0a;--sb-active-bg:#f1ede91a;--sb-active-text:#fff;--sb-icon:#ccc3b9;--sb-icon-active:#e1b568;--sb-count-bg:#ffffff16;--sb-border:#e3dbd11f}

[data-dark] .avatar{background:#41382e;border-color:#5f5345;color:#e3d9cd}
[data-dark] .breadcrumb strong{color:#e3dcd3}
[data-dark] .eyebrow{color:#ada193}
[data-dark] .button.secondary{background:#3c2e22;border-color:#6a5035;color:#f0d9b6}
[data-dark] .button.primary{color:#25190e}
[data-dark] .mode-badge{background:#3a342c;border-color:#584d3f;color:#d1c4b3}
[data-dark] .mode-badge.demo{background:#40351f;border-color:#716039;color:#e6c286}
[data-dark] .notice{background:#342f20;border-color:#615333;color:#e0cf9f}
[data-dark] .error-banner{background:#3d2922;border-color:#805447;color:#f0b6a5}
[data-dark] .brew-banner:after{border-color:#8e7c6722}
[data-dark] .brew-banner .eyebrow,[data-dark] .brew-banner p{color:#b5a694}
[data-dark] .brew-emblem{background:#51381e;border-color:#846032}
[data-dark] .brew-emblem svg{stroke:#efc478}
[data-dark] .brew-status{background:#393026;border-color:#685845;color:#dac9b5}
[data-dark] .metric-card,[data-dark] .rule-card{background:var(--card);border-color:var(--line)}
[data-dark] .metric-label,[data-dark] .metric-detail,[data-dark] .metric-value small{color:#b8ab9a}
[data-dark] .metric-symbol{color:#c4b29c}
[data-dark] .device-icon,[data-dark] .count-tag,[data-dark] .small-label,[data-dark] .section-icon{background:#433a2e;border-color:#5d5041;color:#ccbdaa}
[data-dark] .device-stats{color:#d0c2b1}
[data-dark] .device-stats small,[data-dark] .field-hint,[data-dark] .device-top p,[data-dark] .chart-legend{color:#b1a494}
[data-dark] .device-panel-link{background:#302920;border-color:var(--line);color:#ccbaa3}
[data-dark] .chart-footer{border-color:var(--line);color:#b2a595}
[data-dark] .chart svg line{stroke:#4f463c}
[data-dark] .chart svg text{fill:#b9ac9b}
[data-dark] .chart svg path[stroke="#b17a27"]{stroke:#efb54e}
[data-dark] .chart svg path[stroke="#63849b"]{stroke:#9dc5dd}
[data-dark] .chart svg path[stroke="#6f7f3a"]{stroke:#b2bd7c}
[data-dark] .text-link{color:#d5c2aa}
[data-dark] .automation-callout{background:#322c24;border-color:var(--line)}
[data-dark] .automation-callout p,[data-dark] .subtle-note{color:#b3a492}
[data-dark] .callout-icon{background:#493d2f;color:#d1bca3}
[data-dark] input:not([type=checkbox]):not([type=radio]),[data-dark] select,[data-dark] textarea{background:#262018;border-color:#605344;color:#e6dbce}
[data-dark] input::placeholder,[data-dark] textarea::placeholder{color:#9c8d7b}
[data-dark] .temperature-input{border-color:#605344}
[data-dark] .current-values{background:#3e352a;color:#d4c2ac}
[data-dark] .fan-selector span{background:#322a21;border-color:#605344;color:#e1d4c4}
[data-dark] .fan-selector small{color:#b8a793}
[data-dark] .fan-selector input:checked+span{background:#514433;border-color:#baa386;box-shadow:0 0 0 1px #baa386}
[data-dark] .form-result{background:#433729;color:#dccab5}
[data-dark] .form-result.error{background:#452d24;color:#f0b6a5}
[data-dark] .details-panel pre,[data-dark] .query-panel pre{background:#241e17;border-color:var(--line);color:#d3c6b5}
[data-dark] .details-panel summary{color:#d5c4af}
[data-dark] .stability-banner{background:#3c342a;border-color:#5a4c3a}
[data-dark] .stability-banner p,[data-dark] .sample-timeline span{color:#c3b29d}
[data-dark] .sample-timeline b{background:#4b3e2e;border-color:#826f57;color:#e3d2be}
[data-dark] .sample-timeline i{background:#6f5e49}
[data-dark] .rule-condition{background:#332b21;border-color:#705e48}
[data-dark] .rule-condition p,[data-dark] .rule-condition small,[data-dark] .rule-condition>span{color:#bbaa96}
[data-dark] .rule-sg,[data-dark] .rule-destination,[data-dark] .rule-message,[data-dark] .rule-next{color:#bfb09d}
[data-dark] .rule-state{background:#463b2e;color:#dbcebd}
[data-dark] .rule-state.armed,[data-dark] .rule-state.completed{background:#574632;color:#e6d4bf}
[data-dark] .rule-state.uncertain{background:#504021;color:#edd399}
[data-dark] .sample-progress span{background:#4c4134}
[data-dark] .sample-progress span.filled{background:#e4b465}
[data-dark] .rule-actions,[data-dark] .info-row{border-color:var(--line)}
[data-dark] .get-badge{background:#4a3d2c;color:#e0ceb8}
[data-dark] .event-row span,[data-dark] .info-row p,[data-dark] .explanation-panel>p{color:#c2b29e}
[data-dark] .toast{background:#574733;color:#f5f0ea}
[data-dark] .toast.error{background:#794b3b}
[data-dark] .process-badge{background:#433a2f;color:#d3c2ae}
[data-dark] .process-badge.cooling{background:#263e49;color:#a4d2e8}
[data-dark] .process-badge.heating{background:#4a3421;color:#f0c18d}

/* Vonalas alapanyag-ikonok és a műhely hangsúlyai. */
.icon-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.brew-icon{display:inline-block;width:24px;height:24px;flex-shrink:0;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.malt-icon{color:var(--malt)}
.hop-icon{color:var(--hop)}
.heading-with-icon{display:flex;align-items:center;gap:10px}
.ingredients{display:flex;align-items:center;gap:13px}
.ingredients .brew-icon{width:32px;height:36px}
.ingredients>span{font-size:15px;color:#a89478}
.sidebar .malt-icon{color:#e5b466}
.sidebar .hop-icon{color:#b2bd7c}
.sidebar .nav-link.active{background:#dba54a1c;box-shadow:inset 3px 0 #dba54a}
.brew-banner,[data-dark] .brew-banner{border-color:var(--line)}
.brew-emblem,[data-dark] .brew-emblem{color:var(--malt)}
.brew-emblem svg,[data-dark] .brew-emblem svg{stroke:currentColor}
.callout-icon .brew-icon{width:27px;height:29px}
.brew-fact dt .brew-icon{width:17px;height:19px;margin-right:5px}
.metric-symbol .brew-icon{width:23px;height:25px}
[data-dark] .legend-sg:before{background:#efb54e}
[data-dark] .legend-temp:before{background:#9dc5dd}
[data-dark] .legend-abv:before{background:#b2bd7c}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accent)}
@media(max-width:640px){.sidebar .nav-link.active{box-shadow:inset 0 -2px #dba54a}.heading-with-icon{gap:7px}.heading-with-icon>.brew-icon{width:20px;height:23px}}

/* Az aktuális főzet adatai. */
.brew-banner{display:block}
.brew-heading{display:flex;align-items:center;gap:19px;position:relative;z-index:1}
.brew-title{min-width:0;flex:1;overflow-wrap:anywhere}
.brew-banner .brew-style{font-size:15px;line-height:1.5;max-width:none;margin-top:8px}
.brew-style>span{font-size:12px;margin-right:7px;color:var(--muted)}
.brew-style strong{font-weight:550;color:var(--text)}
.brew-facts{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:18px 14px;margin:22px 0 0;padding-top:19px;border-top:1px solid var(--line);position:relative;z-index:1}
.brew-fact{min-width:0}
.brew-fact dt{font-size:12px;color:var(--muted);line-height:1.5}
.brew-fact dd{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:21px;font-weight:550;line-height:1.4;font-variant-numeric:tabular-nums;color:var(--text);overflow-wrap:anywhere}
.brew-fact dd small{font-size:12px;font-weight:400;margin-left:5px;color:var(--muted)}
.brew-fact[data-brew-fact="date"] dd{font-size:15px;min-height:30px}
.beer-color{display:block;width:28px;height:28px;flex-shrink:0;overflow:visible}
.beer-color circle{stroke:#98876f;stroke-width:1}
@media(max-width:1200px){.brew-facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:640px){.brew-heading{gap:12px;flex-wrap:wrap;align-items:flex-start}.brew-title{flex:1 1 calc(100% - 55px)}.brew-banner .brew-title p{max-width:none}.brew-heading .brew-status{max-width:none;margin-left:55px}.brew-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:17px;padding-top:17px}.brew-fact dd{font-size:23px}.brew-fact dt{font-size:13px}.brew-banner .brew-style{font-size:14px}}

/* Az OG–SG változás és az alkohol kialakulásának szemléltetése. */
.overview-grid{grid-template-columns:minmax(0,1.85fr) minmax(310px,1fr);align-items:start;gap:20px}
body[data-view="overview"] .page-heading{margin-bottom:18px}
body[data-view="overview"] #page-subtitle{display:none}
.overview-primary,.overview-summary{min-width:0;display:flex;flex-direction:column;gap:16px}
.overview-primary .chart{height:clamp(220px,28vh,300px);min-height:220px;overflow:hidden}
.overview-summary .brew-banner,.overview-summary .metric-grid,.overview-primary .fermentation-panel{margin:0}
.overview-summary .brew-banner{padding:18px}
.overview-summary .brew-heading{gap:12px;flex-wrap:wrap;align-items:flex-start}
.overview-summary .brew-emblem{width:43px;height:50px;border-radius:10px}
.overview-summary .brew-emblem svg{width:32px;height:32px}
.overview-summary .brew-title{flex:1 1 calc(100% - 55px)}
.overview-summary .brew-banner h2{font-size:23px}
.overview-summary .brew-style{font-size:14px}
.overview-summary .brew-status{margin-left:55px;max-width:none;font-size:11px}
.overview-summary .brew-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px;padding-top:15px}
.overview-summary .metric-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.overview-summary .metric-card{padding:12px 10px}
.overview-summary .metric-label{font-size:11px;min-height:34px}
.overview-summary .metric-symbol{display:none}
.overview-summary .metric-value{font-size:27px;letter-spacing:-.8px;margin-top:5px}
.overview-summary .metric-value small{font-size:11px;margin-left:3px}
.overview-summary .metric-detail{font-size:10px;line-height:1.5;margin-top:5px}
.overview-primary .fermentation-flow{gap:9px;grid-template-columns:1fr 24px 1.25fr 24px 1fr;padding-left:18px;padding-right:18px}
.event-row.success{border-left:3px solid var(--malt)}
.event-row.success span{color:var(--text)}
@media(max-width:1023px){.overview-grid{grid-template-columns:minmax(0,1fr)}}
.fermentation-panel{margin-bottom:23px}
.fermentation-panel .panel-heading{flex-wrap:wrap}
.fermentation-change{font-size:12px;color:var(--muted);padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:var(--paper)}
.fermentation-flow{display:grid;grid-template-columns:1fr 32px 1.25fr 32px 1fr;align-items:center;gap:16px;max-width:850px;margin:0 auto;padding:5px 24px 17px}
.fermentation-stage{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.fermentation-ingredient{display:grid;place-items:center;width:49px;height:49px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--malt);margin-bottom:16px}
.fermentation-ingredient .brew-icon{width:30px;height:32px}
.fermentation-kicker{font-size:10px;letter-spacing:1.2px;color:var(--muted);line-height:1.6}
.fermentation-number{display:block;font-size:37px;font-weight:600;letter-spacing:-1px;color:var(--ink);line-height:1.4;font-variant-numeric:tabular-nums}
.fermentation-number small{font-size:14px;font-weight:400;letter-spacing:0;margin-left:5px;color:var(--muted)}
.fermentation-stage p{font-size:12px;color:var(--muted);line-height:1.7;margin-top:5px}
.fermentation-arrow{font-size:33px;color:var(--malt);text-align:center;opacity:.75}
.fermentation-alcohol .fermentation-number{color:var(--malt);font-size:47px}
.fermentation-vessel{width:180px;height:159px;max-width:100%;overflow:visible;margin-top:1px}
#fermentation-process{position:relative;overflow:hidden}
.fermentation-flow,.fermentation-progress{position:relative;z-index:1}
.fermentation-backdrop{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:0;opacity:.06}
.fermentation-backdrop svg.fermentation-vessel{width:auto;height:116%;max-width:none;margin:0}
.vessel-liquid{opacity:.65}
.vessel-surface{fill:var(--malt);fill-opacity:.3;stroke:var(--malt);stroke-width:1}
.vessel-outline{fill:none;stroke:var(--malt);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.vessel-bubbles{fill:var(--card);fill-opacity:.55;stroke:var(--malt);stroke-width:1.5}
.vessel-yeast{fill:var(--ink);fill-opacity:.4}
.fermentation-progress{margin:0 24px 22px;padding-top:17px;border-top:1px solid var(--line)}
.fermentation-progress-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-size:14px;line-height:1.6}
.fermentation-progress-heading>span{color:var(--muted);font-size:12px}
.fermentation-progress-heading>span strong{font-size:14px;font-weight:550;color:var(--text);margin-left:5px}
.fermentation-track{height:12px;border-radius:6px;background:var(--line);overflow:hidden;margin-top:13px}
.fermentation-track svg{display:block;width:100%;height:100%}
.fermentation-track-fill{fill:var(--malt)}
.fermentation-track.unavailable{background:repeating-linear-gradient(120deg,var(--paper),var(--paper) 8px,var(--line) 8px,var(--line) 10px)}
.fermentation-track-labels{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);margin-top:8px}
.fermentation-note{color:var(--muted);font-size:11px;margin-top:11px;line-height:1.7}
@media(max-width:640px){.fermentation-flow{grid-template-columns:1fr 1.15fr 1fr;gap:7px;padding:8px 15px 19px}.fermentation-arrow{display:none}.fermentation-kicker{font-size:9px;letter-spacing:.5px;min-height:29px;display:flex;align-items:center;justify-content:center}.fermentation-number{font-size:23px;letter-spacing:-.5px}.fermentation-number small{font-size:10px;margin-left:3px}.fermentation-alcohol .fermentation-number{font-size:31px}.fermentation-stage p{font-size:10px}.fermentation-ingredient{width:40px;height:40px;margin-bottom:12px}.fermentation-ingredient .brew-icon{width:25px;height:27px}.fermentation-vessel{height:auto;width:130px}.fermentation-progress{margin:0 18px 19px}.fermentation-progress-heading{flex-wrap:wrap;gap:4px;font-size:13px}.fermentation-change{font-size:11px}.fermentation-panel .panel-heading{gap:11px}}

/* Képes eszközválasztás. */
#devices-list{display:grid;gap:12px;padding:0 16px 18px}
button.device-row{display:block;width:100%;margin:0;padding:15px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text);text-align:left;transition:border-color .15s,background .15s}
button.device-row:hover{border-color:#b38950;background:#fcf3e3}
button.device-row.selected{border:2px solid #b47b2b;padding:14px;background:#fcf0d9}
.device-picture{display:flex;align-items:center;justify-content:center;flex:0 0 94px;width:94px;height:104px;padding:5px;background:#fff;border-radius:9px;overflow:hidden}
.device-picture img{display:block;flex:none;width:auto;max-width:none;height:100%;object-fit:contain}
.device-identity{min-width:0;overflow-wrap:anywhere}
.device-identity strong{font-size:16px}
.device-type{display:block;margin-top:6px;font-size:12px;color:var(--muted);line-height:1.5}
.device-selection{display:block;margin-top:10px;font-size:12px;color:#885b22;font-weight:600}
button.device-row .device-stats{margin:15px 0 0;gap:18px;flex-wrap:wrap}
button.device-row .field-hint{display:block;margin-top:12px;font-size:12px}
button.device-row .process-badge{margin-left:0}
[data-dark] button.device-row:hover{background:#34291f;border-color:#b58b57}
[data-dark] button.device-row.selected{background:#3b2b1b;border-color:#e2ae5b}
[data-dark] .device-selection{color:#eac583}
@media(max-width:640px){.device-picture{flex-basis:85px;width:85px;height:98px}}

/* Interaktív erjedési grafikon. */
.chart-panel .panel-heading{flex-wrap:wrap}
.chart-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-left:auto}
.chart-actions #history-period{max-width:none;min-width:99px}
#chart-fullscreen{min-height:35px;font-size:12px}
#chart-fullscreen>span:first-child{font-size:19px;line-height:1}
.chart{position:relative;min-height:var(--sg-min-height,220px)}
.chart>svg{min-height:var(--sg-min-height,220px)}
.chart svg .chart-axis-sg{fill:#b17a27}
[data-dark] .chart svg .chart-axis-sg{fill:#efb54e}
.chart>svg{display:block;outline-offset:-3px}
.chart-tooltip{position:absolute;top:8px;left:8px;z-index:3;min-width:218px;max-width:calc(100% - 12px);padding:13px 15px;background:#fffef9;color:#4a3523;border:1px solid #dfc9a7;border-radius:10px;box-shadow:0 7px 25px #3a271826;pointer-events:none;font-size:13px;line-height:1.65;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.chart-tooltip-time{display:block;font-size:12px;color:#7c6f5e;border-bottom:1px solid #e5e1db;padding-bottom:8px;margin-bottom:7px}
.chart-tooltip-row{display:flex;align-items:baseline;justify-content:space-between;gap:18px}
.chart-tooltip-row strong{font-size:14px;font-weight:600}
.chart-tooltip-raw-time{display:block;font-size:10px;color:#9a8b78;max-width:290px;margin-top:9px;line-height:1.6}
.chart-help{padding:0 24px 12px;color:var(--muted);font-size:11px;line-height:1.7}
.chart svg .chart-crosshair{stroke:#9b7b50;stroke-width:1;stroke-dasharray:4 4;pointer-events:none}
.chart-dot{stroke:var(--card);stroke-width:2;pointer-events:none}
.chart-dot-sg{fill:#b17a27}.chart-dot-temp{fill:#63849b}.chart-dot-abv{fill:#6f7f3a}
.chart-cursor{pointer-events:none}
[data-dark] .chart-tooltip{background:#3a2a1d;color:#f6e9d1;border-color:#a17a47;box-shadow:0 7px 25px #0005}
[data-dark] .chart-tooltip-time{color:#d0c1ae;border-color:#615546}
[data-dark] .chart-tooltip-raw-time{color:#b4a694}
[data-dark] .chart svg .chart-crosshair{stroke:#d6b982}
[data-dark] .chart-dot-sg{fill:#efb54e}[data-dark] .chart-dot-temp{fill:#9dc5dd}[data-dark] .chart-dot-abv{fill:#b2bd7c}
body.chart-fullscreen{overflow:hidden}
.chart-panel:is(:fullscreen,.chart-expanded){display:flex;flex-direction:column;background:var(--card);color:var(--text);width:100%;height:100%;border:0;border-radius:0;min-width:0;min-height:0}
.chart-panel.chart-expanded{position:fixed;inset:0;z-index:1000;height:100vh;height:100dvh}
.chart-panel:is(:fullscreen,.chart-expanded) .panel-heading{flex-shrink:0;padding:24px 30px 16px}
.chart-panel:is(:fullscreen,.chart-expanded) .chart-toolbar{flex-shrink:0;padding:0 30px 14px}
.chart-panel:is(:fullscreen,.chart-expanded) .chart{flex:1 1 0;height:auto;min-height:140px;margin:0 20px;overflow:auto}
.chart-panel:is(:fullscreen,.chart-expanded) .chart-footer{flex-shrink:0;padding:15px 30px}
.chart-panel:is(:fullscreen,.chart-expanded) .chart-help{flex-shrink:0;padding:6px 30px 12px}
@media(max-width:640px){.chart-actions{width:100%;justify-content:space-between;margin:0;gap:9px}.chart-panel .panel-heading{align-items:flex-start;gap:16px}#chart-fullscreen{font-size:12px}.chart-help{font-size:11px;padding:0 18px 12px}.chart-tooltip{min-width:205px;padding:10px 12px}.chart-tooltip-row strong{font-size:13px}.chart-tooltip-time{font-size:11px}.chart-tooltip-raw-time{font-size:9px}.chart-panel:is(:fullscreen,.chart-expanded) .panel-heading{padding:18px 18px 14px}.chart-panel:is(:fullscreen,.chart-expanded) .chart-toolbar{padding:0 18px 12px}.chart-panel:is(:fullscreen,.chart-expanded) .chart{margin:0 6px}.chart-panel:is(:fullscreen,.chart-expanded) .chart-footer{padding:12px 18px}.chart-panel:is(:fullscreen,.chart-expanded) .chart-help{padding:5px 18px 9px}}
@media(max-height:500px){.chart-panel:is(:fullscreen,.chart-expanded) .panel-heading{padding:9px 18px;gap:8px}.chart-panel:is(:fullscreen,.chart-expanded) .panel-heading p{display:none}.chart-panel:is(:fullscreen,.chart-expanded) .chart-toolbar{padding:0 18px 5px;flex-direction:row}.chart-panel:is(:fullscreen,.chart-expanded) .chart-actions{width:auto;margin-left:auto}.chart-panel:is(:fullscreen,.chart-expanded) .chart{min-height:100px}.chart-panel:is(:fullscreen,.chart-expanded) .chart-help{padding:2px 18px;font-size:10px}.chart-panel:is(:fullscreen,.chart-expanded) .chart-footer{padding:6px 18px}}

/* Tömör eszközválasztó; a mérések a közös összesítőben szerepelnek. */
.overview-summary #devices-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0 12px 14px}
.overview-summary button.device-row{display:flex;flex-direction:column;align-items:flex-start;padding:12px}
.overview-summary button.device-row.selected{padding:11px}
.overview-summary .device-top{align-self:stretch;flex-direction:column;align-items:flex-start;gap:9px;position:relative}
.overview-summary .device-picture{align-self:center;width:65px;height:70px;flex-basis:auto}
.overview-summary .device-online{position:absolute;right:0;top:3px}
.overview-summary .device-identity{align-self:stretch}
.overview-summary .device-identity strong{display:block;text-align:center;font-size:14px}
.overview-summary .device-type{font-size:10px}
.overview-summary .device-selection{font-size:10px;margin-top:7px}
.overview-summary button.device-row .field-hint{font-size:10px}
@media(max-width:640px){.overview-primary .fermentation-flow{grid-template-columns:1fr 1.15fr 1fr;gap:7px;padding-left:15px;padding-right:15px}.overview-primary .chart{height:220px}.overview-grid{gap:16px}.overview-summary .brew-title p{max-width:none}.overview-summary .metric-value{font-size:27px}.overview-primary .chart-panel .panel-heading{padding:17px 18px 12px;gap:12px}}

/* Folyamatábra, majd grafikon: tömör áttekintés. */
.overview-primary .fermentation-panel .panel-heading{padding:13px 18px 8px;gap:8px}
.overview-primary .fermentation-panel .panel-heading p{display:none}
.overview-primary .fermentation-flow{padding:0 18px 6px;gap:8px}
.overview-primary .fermentation-ingredient,.overview-primary .fermentation-stage p{display:none}
.overview-primary .fermentation-kicker{font-size:9px;letter-spacing:.7px;min-height:0}
.overview-primary .fermentation-number{font-size:29px}
.overview-primary .fermentation-alcohol .fermentation-number{font-size:35px}
.overview-primary .fermentation-vessel{width:95px;height:75px}
.overview-primary .fermentation-progress{margin:0 18px 12px;padding-top:8px}
.overview-primary .fermentation-progress-heading{font-size:12px}
.overview-primary .fermentation-track{height:7px;margin-top:6px}
.overview-primary .fermentation-track-labels{font-size:10px;margin-top:5px}
.overview-primary .fermentation-note{font-size:10px;margin-top:5px}
.overview-primary .fermentation-change{font-size:10px;padding:4px 7px}
.overview-primary .chart{height:clamp(180px,24vh,250px);min-height:180px}
.settings-panel{max-width:680px}
.settings-panel .check-label{line-height:1.6}
.settings-current{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:12px 14px;margin:18px 0;font-size:14px;color:var(--text)}
@media(max-width:640px){
 .sidebar nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;overflow:visible}
 .sidebar .nav-link{position:relative;min-width:0;flex-direction:column;white-space:normal;text-align:center;justify-content:flex-start;padding:10px 2px;font-size:9px;line-height:1.35;gap:5px;overflow-wrap:anywhere}
 .sidebar .nav-count{position:absolute;top:4px;right:2px;font-size:8px;padding:1px 3px}
 .overview-primary .fermentation-panel .panel-heading{padding:11px 14px 7px;flex-wrap:nowrap}
 .overview-primary .fermentation-panel h2{font-size:15px}
 .overview-primary .fermentation-change{display:none}
 .overview-primary .fermentation-flow{padding:0 14px 5px;gap:5px}
 .overview-primary .fermentation-number{font-size:23px}
 .overview-primary .fermentation-alcohol .fermentation-number{font-size:29px}
 .overview-primary .fermentation-vessel{width:63px;height:48px}
 .overview-primary .fermentation-progress{margin:0 14px 10px;padding-top:6px}
 .overview-primary .fermentation-note{line-height:1.5;font-size:9px}
 .overview-primary .chart-panel .panel-heading{padding:13px 16px 10px;gap:9px}
 .overview-primary .chart-panel .panel-heading p{display:none}
 .overview-primary .chart-toolbar{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;padding:0 16px 10px}
 .overview-primary .chart-toolbar .inline-label{font-size:0;gap:0}
 .overview-primary .chart-toolbar select{font-size:12px;max-width:138px}
 .overview-primary .chart-legend{font-size:10px;gap:10px}
 .overview-primary .chart-actions{justify-content:flex-start}
 .overview-primary #refresh-chart{font-size:0;width:35px;padding:6px;min-height:35px}
 .overview-primary #refresh-chart>span{font-size:20px}
 .overview-primary #chart-fullscreen-label{display:none}
 .overview-primary #chart-fullscreen{width:35px;padding:6px}
 .chart-panel:is(:fullscreen,.chart-expanded) .chart-actions #refresh-chart{font-size:12px;width:auto;padding:6px 10px}
 .chart-panel:is(:fullscreen,.chart-expanded) #chart-fullscreen-label{display:inline}
 .chart-panel:is(:fullscreen,.chart-expanded) #chart-fullscreen{width:auto;padding:6px 10px}
 .chart-panel:is(:fullscreen,.chart-expanded) .chart-toolbar .inline-label{font-size:11px;gap:8px}
 .settings-panel .panel-heading{padding:18px}
}
.overview-primary .fermentation-flow{grid-template-columns:1fr 24px 1.6fr 24px 1fr}
.overview-primary .fermentation-current{align-items:center;text-align:center;justify-content:center}
.overview-primary .fermentation-vessel{width:75px;height:65px;margin-top:6px}
.overview-primary .chart-panel .panel-heading p{display:none}
@media(min-width:641px) and (max-width:1350px){
 .overview-primary #refresh-chart{font-size:0;width:35px;padding:6px;min-height:35px}
 .overview-primary #refresh-chart>span{font-size:20px}
 .overview-primary #chart-fullscreen-label{display:none}
 .overview-primary #chart-fullscreen{width:35px;padding:6px}
 .chart-panel:is(:fullscreen,.chart-expanded) .chart-actions #refresh-chart{font-size:12px;width:auto;padding:6px 10px}
 .chart-panel:is(:fullscreen,.chart-expanded) #chart-fullscreen-label{display:inline}
 .chart-panel:is(:fullscreen,.chart-expanded) #chart-fullscreen{width:auto;padding:6px 10px}
}
@media(max-width:640px){
 .overview-primary .fermentation-flow{grid-template-columns:1fr 1.15fr 1fr}
 .overview-primary .fermentation-current{padding-right:0;align-items:center;text-align:center;min-height:0}
 .overview-primary .fermentation-vessel{position:static;transform:none;width:58px;height:40px}
}
body[data-view="overview"] main{padding-top:24px}
body[data-view="overview"] .page-heading{margin-bottom:14px}
.overview-primary{gap:12px}
.overview-primary .fermentation-panel .panel-heading{padding-top:11px}
.fermentation-abv-inline{display:flex;align-items:baseline;gap:6px;margin-top:2px;color:var(--muted);font-size:11px;line-height:1.5}
.fermentation-abv-inline #fermentation-abv{font-size:17px;color:var(--malt);letter-spacing:0;line-height:1.4}
.fermentation-abv-inline #fermentation-abv small{font-size:11px;margin-left:2px}
.overview-primary .fermentation-progress{margin-bottom:8px}
body[data-view="overview"] main{padding-top:22px}
@media(max-width:640px){.overview-primary .chart{height:180px}}
/* A képernyőméret-váltás ne animálja a feliratok méretét és a térközöket. */
.nav-link{transition:background-color .16s,color .16s,box-shadow .16s}
.button{transition:background-color .15s,border-color .15s,color .15s,filter .15s}
@media(max-width:640px){.sidebar .nav-link{font-size:10px}}
@media(max-width:640px){
 body[data-view="overview"] main{padding-top:16px}
 body[data-view="overview"] #page-title{font-size:clamp(22px,6vw,28px)}
 body[data-view="overview"] #page-eyebrow{margin-bottom:6px}
 body[data-view="overview"] .page-heading{margin-bottom:10px;gap:12px}
}
@media(max-width:640px){.overview-primary{gap:10px}.overview-primary .fermentation-panel .panel-heading{padding-bottom:5px}}
.overview-primary .fermentation-arrow{font-size:23px;line-height:1}
.brand{position:relative;display:inline-flex;align-self:center;align-items:center;justify-content:center;gap:0;padding:0;color:var(--sb-text)}
.brand-logo{display:grid;place-items:center;width:150px;height:150px;border-radius:20px}
.brand-logo svg,.brand-logo img{width:150px;height:150px;display:block}
.brand-title{position:absolute;left:50%;transform:translate(-50%,-4px);top:calc(100% + 8px);display:flex;flex-direction:column;gap:3px;background:var(--card);color:var(--text);border:1px solid var(--line);border-radius:9px;padding:9px 13px;font-size:15px;font-weight:650;letter-spacing:-.4px;white-space:nowrap;box-shadow:0 12px 28px #00000038;opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .16s,transform .16s;z-index:30}
.brand-title small{font-size:9px;letter-spacing:2px;font-weight:500;color:var(--muted)}
.brand:hover .brand-title,.brand:focus-visible .brand-title{opacity:1;transform:translate(-50%,0)}
.app-version{display:flex!important;align-items:center;gap:6px;margin-top:7px;font-variant-numeric:tabular-nums}
.beta-tag{font-size:8px;font-weight:700;letter-spacing:1px;padding:2px 5px;border-radius:4px;background:var(--sb-brand);color:var(--sb-bg);line-height:1}
.single-value{font-size:14px;font-weight:600;color:var(--text)}
label>.single-value{margin-top:9px}
.inline-label .single-value{font-size:12px;font-weight:600;color:var(--text)}
.refresh-countdown{position:fixed;top:0;left:0;right:0;width:100%;height:3px;z-index:60;background:transparent;pointer-events:none}
.refresh-countdown-bar{display:block;height:100%;width:100%;background:var(--malt)}
.theme-picker{display:inline-flex;align-items:center}
.theme-select{font-size:12px;padding:7px 10px;min-height:34px;max-width:150px;background:var(--card);border:1px solid var(--line);border-radius:7px;color:var(--text)}
.list-heading-actions{display:flex;align-items:center;gap:14px}
.events-pager{display:flex;align-items:center;justify-content:center;gap:16px;padding:16px 24px;border-top:1px solid var(--line)}
.events-pager .muted{min-width:56px;text-align:center}
.rule-dialog{border:none;border-radius:var(--radius);padding:0;width:min(520px,calc(100% - 32px));max-width:520px;background:var(--card);color:var(--text);box-shadow:0 24px 60px #00000040}
.rule-dialog::backdrop{background:#1c140bb3}
.rule-dialog .modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 24px;border-bottom:1px solid var(--line)}
.rule-dialog .modal-head h2{font-size:18px}
.modal-close{background:transparent;border:0;font-size:16px;color:var(--muted);width:32px;height:32px;min-height:32px;border-radius:7px;display:grid;place-items:center;padding:0}
.modal-close:hover{background:var(--paper);color:var(--text)}
.rule-dialog form{padding:4px 24px 22px;max-height:min(76vh,760px);overflow:auto}
.rule-dialog label:not(.check-label){display:block;font-size:13px;font-weight:600;margin:16px 0 8px}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}
@media(max-width:640px){.rule-dialog{width:calc(100% - 20px)}.modal-actions{flex-direction:column-reverse}.modal-actions .button{width:100%}}
/* Oktoberfest téma: bajor kék-fehér, sörarany kiemelésekkel. */
[data-theme="oktoberfest"]{color-scheme:light;--ink:#13315c;--text:#1b2a41;--muted:#5b6b82;--paper:#eef3fb;--card:#e9f1fc;--line:#cfe0f3;--accent:#1763b8;--light:#e3ecfa;--danger:#c0392b;--malt:#c98a1f;--hop:#6f8f3a;--brew-start:#dce9fb;--brew-end:#ffffff;--sb-bg:#0a3d7a;--sb-text:#eef4fc;--sb-muted:#a9c2e4;--sb-brand:#f2c14e;--sb-link:#d6e4f7;--sb-link-hover:#ffffff17;--sb-active-bg:#ffffff28;--sb-active-text:#fff;--sb-icon:#bcd2ee;--sb-icon-active:#f2c14e;--sb-count-bg:#ffffff28;--sb-border:#ffffff2b}

[data-theme="oktoberfest"] .sidebar .nav-link.active{background:#f2c14e24;box-shadow:inset 3px 0 #f2c14e}
[data-theme="oktoberfest"] .sidebar .malt-icon{color:#f2c14e}
[data-theme="oktoberfest"] .sidebar .hop-icon{color:#bcd2ee}
[data-theme="oktoberfest"] .mode-badge{background:#e3ecfa;border-color:#c2d5ef;color:#1763b8}

[data-theme="forest"]{color-scheme:dark;--ink:#e8f0e2;--text:#dbe7d3;--muted:#9bb08f;--paper:#0f1710;--card:#18231a;--line:#2f4133;--accent:#5fa352;--light:#24341f;--danger:#f0b6a5;--malt:#e0b15a;--hop:#9cc06a;--brew-start:#1a2a18;--brew-end:#13200f;--sb-bg:#0c1a0f;--sb-text:#e6f0e2;--sb-muted:#9fb79a;--sb-brand:#8fcf6a;--sb-link:#cfe3c8;--sb-link-hover:#ffffff10;--sb-active-bg:#8fcf6a22;--sb-active-text:#fff;--sb-icon:#b7ceae;--sb-icon-active:#8fcf6a;--sb-count-bg:#ffffff14;--sb-border:#ffffff1f}
[data-theme="sunset"]{color-scheme:dark;--ink:#f3e2d6;--text:#ecd9cc;--muted:#b89a8a;--paper:#1a1013;--card:#241519;--line:#3e2a2c;--accent:#e06a35;--light:#33201f;--danger:#f0b6a5;--malt:#e8a24a;--hop:#b2a85c;--brew-start:#2a1618;--brew-end:#1c1012;--sb-bg:#1e0f16;--sb-text:#f6e6ee;--sb-muted:#c3a3b3;--sb-brand:#f2a35a;--sb-link:#e6cdda;--sb-link-hover:#ffffff10;--sb-active-bg:#f2a35a22;--sb-active-text:#fff;--sb-icon:#d3b5c6;--sb-icon-active:#f2a35a;--sb-count-bg:#ffffff14;--sb-border:#ffffff1f}
[data-theme="nordic"]{color-scheme:light;--ink:#1d2730;--text:#273744;--muted:#5f6e7a;--paper:#eef2f5;--card:#ffffff;--line:#d5dee5;--accent:#2f6f8f;--light:#dfe8ee;--amber:#d9a441;--danger:#c0392b;--malt:#b8863a;--hop:#6f8f6a;--brew-start:#dde8ef;--brew-end:#ffffff;--sb-bg:#243542;--sb-text:#eef4f8;--sb-muted:#a6b7c3;--sb-brand:#6fb6d6;--sb-link:#d4e2ea;--sb-link-hover:#ffffff12;--sb-active-bg:#6fb6d624;--sb-active-text:#fff;--sb-icon:#bccdd8;--sb-icon-active:#6fb6d6;--sb-count-bg:#ffffff1c;--sb-border:#ffffff24}
[data-theme="forest"] .sidebar .nav-link.active{background:#8fcf6a24;box-shadow:inset 3px 0 #8fcf6a}
[data-theme="sunset"] .sidebar .nav-link.active{background:#f2a35a26;box-shadow:inset 3px 0 #f2a35a}
[data-theme="nordic"] .sidebar .nav-link.active{background:#6fb6d626;box-shadow:inset 3px 0 #6fb6d6}

/* Az automatikus szabály legutóbbi mintája és következő időpontja. */
.chart-rule-sampling{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 16px;margin:12px 0 0;font-size:11px;line-height:1.6}
.chart-rule-sampling>div{min-width:0}
.chart-rule-sampling dt{color:var(--muted);margin-bottom:3px}
.chart-rule-sampling dd{margin:0;color:var(--text);font-weight:600;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
@media(max-width:640px){.chart-rule-sampling{grid-template-columns:1fr;gap:7px}.chart-rule-sampling>div{display:flex;justify-content:space-between;gap:12px}.chart-rule-sampling dt{margin:0}.chart-rule-sampling dd{text-align:right}}

/* Felhasználói fiókok */
.account-info{display:grid;gap:10px;margin:16px;overflow-wrap:anywhere}
.account-user{display:grid;gap:12px;padding:22px 0;border-top:1px solid var(--line);margin-top:22px}
#account-dialog{width:min(460px,calc(100vw - 32px))}
#account-dialog form{display:grid;gap:16px}
#account-dialog::backdrop{background:rgba(0,0,0,.85)}
#users-list strong{overflow-wrap:anywhere}

#brew-settings,#users-settings{margin-bottom:24px}
#invite-url-label,#users-result{margin:16px 24px}