:root{font-family:Segoe UI Variable Text,Aptos,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--bg: #f5f7fb;--bg-glow: rgba(73, 103, 255, .08);--surface: rgba(255, 255, 255, .97);--surface-solid: #ffffff;--surface-soft: #fafbfc;--surface-muted: #f1f4f8;--input-bg: #fbfcfe;--text: #172033;--text-strong: #111827;--text-secondary: #4f5d72;--text-muted: #667085;--border: #e2e7f0;--border-strong: #d6dee9;--accent: #5267da;--accent-strong: #4357c8;--accent-soft: #eef1ff;--primary: #192237;--primary-hover: #26314b;--focus: rgba(91, 110, 225, .18);--success-bg: #edf8f0;--success-text: #245b35;--danger: #ad3442;--danger-bg: #fff1f3;--warning-bg: #fff8e8;--warning-border: #f0d08a;--warning-text: #7a5310;--insight-bg: #f2f5ff;--positive: #a33d4b;--negative: #287a4b;--shadow: 0 12px 30px rgba(28, 39, 62, .08);--mobile-bar: rgba(255, 255, 255, .97);--chart-grid: rgba(93, 108, 135, .14);--chart-base: linear-gradient(180deg, #7182ef, #5267da);--chart-up: linear-gradient(180deg, #ef6a74, #d94755);--chart-down: linear-gradient(180deg, #55c98a, #2f9d67);--chart-flat: linear-gradient(180deg, #aab4c5, #7e8a9e);--chart-up-soft: #fff0f2;--chart-down-soft: #edf9f2;--chart-flat-soft: #f2f4f7;--total-card: linear-gradient(145deg, #1d2841, #2d3a58);--total-muted: #cbd3e2;color:var(--text);background:var(--bg)}:root[data-theme=dark]{--bg: #0f1420;--bg-glow: rgba(96, 116, 255, .11);--surface: rgba(24, 31, 47, .96);--surface-solid: #181f2f;--surface-soft: #141b29;--surface-muted: #20293a;--input-bg: #131a27;--text: #e8edf7;--text-strong: #f6f8fc;--text-secondary: #b8c2d2;--text-muted: #909bb0;--border: #2a3447;--border-strong: #344158;--accent: #8b9afa;--accent-strong: #a8b3ff;--accent-soft: #222d54;--primary: #6577e8;--primary-hover: #7889f0;--focus: rgba(139, 154, 250, .24);--success-bg: #173426;--success-text: #9ad7b1;--danger: #ff8995;--danger-bg: #3b2027;--warning-bg: #332a17;--warning-border: #65502a;--warning-text: #f2cb7b;--insight-bg: #1d2745;--positive: #ff9da7;--negative: #78d19a;--shadow: 0 16px 40px rgba(0, 0, 0, .22);--mobile-bar: rgba(24, 31, 47, .97);--chart-grid: rgba(180, 192, 216, .12);--chart-base: linear-gradient(180deg, #9eabff, #7183ef);--chart-up: linear-gradient(180deg, #ff9da7, #ef6f7b);--chart-down: linear-gradient(180deg, #79d8a4, #45b978);--chart-flat: linear-gradient(180deg, #8c98ab, #667286);--chart-up-soft: #3a2027;--chart-down-soft: #173427;--chart-flat-soft: #222b3b;--total-card: linear-gradient(145deg, #283451, #354463);--total-muted: #d4dced}*{box-sizing:border-box}html{min-width:320px;background:var(--bg)}body{margin:0;min-width:320px;min-height:100vh;overflow-x:clip;background:radial-gradient(circle at top left,var(--bg-glow),transparent 30rem),var(--bg);color:var(--text);transition:background-color .2s ease,color .2s ease}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}h1,h2,h3,strong,b,button{font-family:Segoe UI Variable Display,Aptos Display,Segoe UI Variable Text,Aptos,Inter,ui-sans-serif,system-ui,sans-serif}input,output,.total-value,.history-total,.kpi-card strong,.chart-tooltip b,.chart-label small,.chart-part-delta{font-variant-numeric:tabular-nums}.app-shell{width:min(1360px,calc(100% - 32px));margin:0 auto;padding:24px 0}.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:12px}.hero h1{max-width:760px;margin:6px 0;color:var(--text-strong);font-size:clamp(2rem,4vw,3.1rem);font-weight:760;line-height:1.03;letter-spacing:-.055em}.hero p{max-width:760px;margin:0;color:var(--text-secondary);font-size:.96rem;line-height:1.5}.eyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--accent);font-size:.75rem;font-weight:800;letter-spacing:.13em}.hero-actions{display:flex;flex:0 0 auto;align-items:center;gap:8px}.icon-button{display:grid;width:44px;height:44px;flex:0 0 auto;place-items:center;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-solid);color:var(--text-secondary);transition:background .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}.install-help{margin:10px 0 14px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-solid);color:var(--text-secondary);font-size:.9rem;line-height:1.5}.content-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(310px,.85fr);align-items:start;gap:18px}.panel,.total-card,.mini-card{border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:0 1px #ffffff05}.calculator-panel{padding:20px}.section-heading{display:flex;align-items:center;gap:11px;margin-bottom:15px}.section-heading h2{margin:0;color:var(--text-strong);font-size:1.05rem;font-weight:720;letter-spacing:-.015em}.section-heading h2:focus-visible{border-radius:4px;outline:3px solid var(--accent);outline-offset:3px}.section-heading span{display:block;margin-top:2px;color:var(--text-muted);font-size:.83rem}.section-icon{display:grid;width:38px;height:38px;flex:0 0 auto;place-items:center;border-radius:12px;background:var(--accent-soft);color:var(--accent)}.basics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.field{display:grid;min-width:0;gap:6px;margin-bottom:12px}.basics-grid .field,.field.compact,.note-field{margin-bottom:0}.field>label{display:flex;align-items:center;gap:7px;color:var(--text-secondary);font-size:.86rem;font-weight:680}.field small{color:var(--text-muted);font-weight:500}input,textarea{width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:12px;outline:none;background:var(--input-bg);color:var(--text);caret-color:var(--accent);transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}textarea{min-height:64px;resize:vertical;line-height:1.45}input:focus,textarea:focus{border-color:var(--accent);background:var(--surface-solid);box-shadow:0 0 0 3px var(--focus)}.utility-card input:read-only{cursor:default;background:var(--surface-muted);color:var(--text-secondary)}input[aria-invalid=true]{border-color:var(--danger)}.field-error{color:var(--danger);font-size:.74rem;font-weight:620}.input-suffix{position:relative;min-width:0}.input-suffix input{padding-right:78px}.input-suffix b{position:absolute;top:50%;right:12px;max-width:66px;transform:translateY(-50%);overflow:hidden;color:var(--text-muted);font-size:.79rem;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.month-input{position:relative;display:flex;min-width:0;min-height:44px;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:12px;background:var(--input-bg);color:var(--text);transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}.month-input>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.month-input>svg{flex:0 0 auto;color:var(--text-muted)}.month-input input{position:absolute;z-index:1;inset:0;height:100%;min-height:0;padding:0;border:0;opacity:0;cursor:pointer}.month-input:focus-within{border-color:var(--accent);background:var(--surface-solid);box-shadow:0 0 0 3px var(--focus)}.month-input input:focus{box-shadow:none}.utility-card{min-width:0;margin-bottom:10px;padding:13px;border:1px solid var(--border);border-radius:16px;background:var(--surface-soft)}.electric-card,.water-card{display:grid;grid-template-columns:minmax(210px,.75fr) minmax(280px,1.25fr);gap:9px 12px;align-items:center}.utility-title{grid-column:1 / -1;width:100%;display:flex;min-width:0;align-items:center;justify-content:space-between;gap:10px}.utility-name{display:flex;min-width:0;align-items:center;gap:9px}.utility-name strong{color:var(--text-strong);white-space:nowrap}.utility-amount{min-width:0;overflow:hidden;color:var(--text-secondary);font-size:.84rem;font-weight:760;text-overflow:ellipsis;white-space:nowrap}.utility-icon{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border:1px solid var(--border);border-radius:11px;background:var(--surface-solid);color:var(--text-secondary)}.segmented{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin:0;padding:3px;border-radius:11px;background:var(--surface-muted)}.segmented button{min-height:44px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--text-muted);font-size:.84rem;font-weight:700}.segmented button.active{background:var(--surface-solid);color:var(--text-strong);box-shadow:0 1px 5px #1f2b4117}.electric-fields,.meter-fields,.two-cols{display:grid;min-width:0;gap:10px}.electric-fields,.two-cols{grid-template-columns:repeat(2,minmax(0,1fr))}.meter-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.electric-card .mode-fields,.electric-card .calc-line,.water-card .mode-fields,.water-card .calc-line{grid-column:1 / -1}.mode-fields{animation:mode-in .18s ease-out}.legacy-note{grid-column:1 / -1;padding:9px 11px;border:1px solid var(--warning-border);border-radius:10px;background:var(--warning-bg);color:var(--warning-text);font-size:.78rem;font-weight:600;line-height:1.45}.calc-line{display:block;min-width:0;color:var(--text-muted);font-size:.83rem;line-height:1.4;overflow-wrap:anywhere}.calc-line strong{color:var(--text-strong)}.form-footer{display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:10px 12px;align-items:end}.note-field{grid-column:1;grid-row:1}.notice{grid-column:1 / -1;grid-row:2;margin:0;padding:10px 12px;border-radius:11px;background:var(--success-bg);color:var(--success-text);font-size:.84rem;font-weight:620}.form-actions{display:flex;grid-column:2;grid-row:1;flex-wrap:wrap;justify-content:flex-end;gap:8px}.primary-button,.secondary-button,.ghost-button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid transparent;border-radius:12px;font-weight:730;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}.primary-button{background:var(--primary);color:#fff}.secondary-button{border-color:var(--border-strong);background:var(--surface-solid);color:var(--text-strong)}.ghost-button{background:transparent;color:var(--text-secondary)}.install-button{flex:0 0 auto;white-space:nowrap}.storage-note{display:flex;align-items:flex-start;gap:10px}.storage-note>svg{flex:0 0 auto;color:var(--accent)}.storage-note strong{display:block;color:var(--text-secondary);font-size:.84rem;line-height:1.35}.storage-note span,.storage-note p{display:block;margin:3px 0 0;color:var(--text-muted);font-size:.79rem;line-height:1.4}.mobile-storage-note{display:none}.summary-column{position:sticky;top:22px;display:grid;height:max-content;align-self:start;align-content:start;gap:12px}.total-card{padding:22px;border-color:transparent;background:var(--total-card);color:#fff;box-shadow:var(--shadow)}.total-card h2{margin:0;color:#b8c2d6;font-size:.72rem;font-weight:800;letter-spacing:.13em}.total-value{display:block;overflow-wrap:anywhere;animation:total-change .18s ease-out}.total-card>strong{margin:7px 0 3px;font-size:clamp(2rem,3.5vw,2.7rem);font-weight:790;letter-spacing:-.045em;line-height:1.1}.total-card>p{margin:0;color:var(--total-muted);font-size:.88rem}.breakdown{display:grid;gap:8px;margin-top:18px;padding-top:15px;border-top:1px solid rgba(255,255,255,.14)}.breakdown div{display:flex;justify-content:space-between;gap:12px;font-size:.86rem}.breakdown span{color:#c3ccdc}.breakdown b{text-align:right;overflow-wrap:anywhere}.mini-card{padding:13px 14px}.analytics-panel{margin-top:16px;padding:20px}.analytics-header .section-heading{margin-bottom:13px}.kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}.kpi-card{min-width:0;padding:14px 15px;border:1px solid var(--border);border-radius:15px;background:var(--surface-soft)}.kpi-card>span{display:block;margin-bottom:7px;color:var(--text-muted);font-size:.76rem;font-weight:680}.kpi-card strong{display:block;overflow:hidden;color:var(--text-strong);font-size:clamp(1.18rem,2.5vw,1.55rem);font-weight:780;letter-spacing:-.025em;text-overflow:ellipsis;white-space:nowrap}.kpi-card small{display:flex;min-height:20px;align-items:center;gap:5px;margin-top:5px;color:var(--text-muted);font-size:.77rem}.kpi-card.comparison.up strong,.kpi-card.comparison.up small{color:var(--positive)}.kpi-card.comparison.down strong,.kpi-card.comparison.down small{color:var(--negative)}.anomaly-box{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;margin-bottom:12px;padding:12px 13px;border:1px solid var(--warning-border);border-radius:14px;background:var(--warning-bg);color:var(--warning-text)}.anomaly-box>svg{margin-top:1px}.anomaly-box strong{display:block;margin-bottom:3px;color:inherit;font-size:.86rem}.anomaly-box p{margin:2px 0 0;font-size:.79rem;line-height:1.45}.chart-insight{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;margin:0 0 10px;padding:10px 11px;border:1px solid var(--border);border-radius:12px;background:var(--insight-bg);color:var(--text-secondary)}.chart-insight>svg{margin-top:1px;color:var(--accent)}.chart-insight strong{display:block;margin-bottom:2px;color:var(--text-strong);font-size:.8rem}.chart-insight span{display:block;font-size:.76rem;line-height:1.45}.chart-card{padding:14px 15px 12px;border:1px solid var(--border);border-radius:16px;background:var(--surface-soft)}.chart-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.chart-heading strong{display:block;color:var(--text-strong);font-size:.92rem}.chart-heading>div{min-width:0}.chart-heading span{display:block;margin-top:2px;color:var(--text-muted);font-size:.76rem}.chart-heading>svg{color:var(--accent)}.chart-wrap{min-width:0}.chart-legend{display:flex;flex-wrap:wrap;align-items:center;gap:7px 14px;margin:0;color:var(--text-muted);font-size:.68rem;font-weight:650}.chart-legend span{display:inline-flex;align-items:center;gap:5px}.chart-legend-footer{margin-top:10px;padding-top:9px;border-top:1px solid color-mix(in srgb,var(--border) 70%,transparent)}.chart-legend-dot{width:8px;height:8px;flex:0 0 auto;border-radius:999px;background:var(--accent)}.chart-legend-dot.up{background:#d94755}.chart-legend-dot.down{background:#2f9d67}.chart-legend-dot.flat{background:#7e8a9e}:root[data-theme=dark] .chart-legend-dot.up{background:#ef6f7b}:root[data-theme=dark] .chart-legend-dot.down{background:#45b978}:root[data-theme=dark] .chart-legend-dot.flat{background:#8c98ab}.chart-plot{position:relative;min-height:250px;padding:12px 4px 0;overflow:visible}.chart-grid-lines{position:absolute;inset:12px 4px 44px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.chart-grid-lines span{border-top:1px dashed var(--chart-grid)}.chart-bars{position:absolute;inset:12px 4px 0;display:grid;grid-template-columns:repeat(var(--chart-columns, 12),minmax(28px,1fr));gap:clamp(5px,1.2vw,12px);align-items:end}.chart-column{display:grid;min-width:0;height:100%;grid-template-rows:minmax(0,1fr) 38px;align-items:end;gap:4px}.chart-focus{position:relative;display:flex;width:100%;height:100%;padding:0;align-items:flex-end;justify-content:center;border:0;border-radius:8px;outline:none;background:transparent;color:inherit}.chart-focus:focus-visible{box-shadow:0 0 0 3px var(--focus)}.chart-focus.is-active{z-index:9}.chart-focus.is-active .chart-bar{outline:2px solid var(--text-strong);outline-offset:3px;box-shadow:0 11px 26px #1c273e38;filter:saturate(1.08) brightness(1.03)}.chart-bar{width:min(40px,72%);height:var(--bar-height);min-height:8px;border-radius:8px 8px 4px 4px;background:var(--chart-base);box-shadow:0 8px 18px #5267da24;transition:filter .16s ease,box-shadow .16s ease,outline-color .16s ease;transform-origin:bottom;animation:bar-grow .35s ease-out}.chart-focus.trend-up .chart-bar{background:var(--chart-up);box-shadow:0 8px 18px #d9475529}.chart-focus.trend-down .chart-bar{background:var(--chart-down);box-shadow:0 8px 18px #2f9d6729}.chart-focus.trend-flat .chart-bar{background:var(--chart-flat);box-shadow:0 8px 18px #7e8a9e21}.chart-focus.trend-base .chart-bar{background:var(--chart-base)}.chart-label{display:grid;min-width:0;align-content:start;gap:1px;overflow:hidden;color:var(--text-muted);font-size:.68rem;text-align:center}.chart-label b{overflow:hidden;font-size:.68rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.chart-label small{overflow:hidden;font-size:.6rem;font-weight:720;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.chart-label.trend-up small{color:var(--positive)}.chart-label.trend-down small{color:var(--negative)}.chart-label.trend-flat small{color:var(--text-muted)}.chart-label.trend-base small{color:var(--accent)}.chart-tooltip{position:absolute;z-index:8;bottom:min(calc(var(--bar-height) + 8px),calc(100% - 8px));left:50%;display:none;width:max-content;max-width:220px;padding:9px 10px;transform:translate(-50%);border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-solid);box-shadow:var(--shadow);color:var(--text-secondary);font-size:.72rem;line-height:1.5;pointer-events:none}.chart-tooltip strong{display:block;margin-bottom:4px;color:var(--text-strong)}.chart-tooltip span{display:flex;justify-content:space-between;gap:14px}.chart-tooltip b{color:var(--text-strong)}.chart-tooltip-trend{display:block;margin-top:6px;padding-top:6px;border-top:1px solid var(--border);font-style:normal;font-weight:750}.chart-tooltip-trend.up{color:var(--positive)}.chart-tooltip-trend.down{color:var(--negative)}.chart-tooltip-trend.flat{color:var(--text-muted)}.chart-tooltip-trend.base{color:var(--accent)}.chart-focus:hover .chart-tooltip,.chart-focus:focus-visible .chart-tooltip{display:block}.chart-detail{display:grid;gap:10px;margin-top:10px;padding:12px;border:1px solid var(--border);border-radius:13px;background:var(--surface-solid)}.chart-detail.trend-up{border-color:color-mix(in srgb,var(--positive) 38%,var(--border))}.chart-detail.trend-down{border-color:color-mix(in srgb,var(--negative) 38%,var(--border))}.chart-detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.chart-detail-header span,.chart-detail-grid span{display:block;color:var(--text-muted);font-size:.7rem;font-weight:650}.chart-detail-header strong{display:block;margin-top:2px;color:var(--text-strong);font-size:.93rem}.chart-detail-total{text-align:right}.chart-detail-total strong{font-size:1.12rem}.chart-trend-badge{display:inline-flex;width:fit-content;min-height:32px;align-items:center;gap:6px;padding:6px 9px;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-size:.72rem}.chart-trend-badge strong{font-size:inherit}.chart-trend-badge.up{background:var(--chart-up-soft);color:var(--positive)}.chart-trend-badge.down{background:var(--chart-down-soft);color:var(--negative)}.chart-trend-badge.flat{background:var(--chart-flat-soft);color:var(--text-muted)}.chart-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.chart-detail-grid>div{min-width:0;padding:9px 10px;border-radius:10px;background:var(--surface-soft)}.chart-detail-grid strong{display:block;margin-top:3px;overflow-wrap:anywhere;color:var(--text-strong);font-size:.86rem}.chart-detail-grid small{display:block;margin-top:3px;color:var(--text-muted);font-size:.68rem;line-height:1.35}.chart-part-delta{font-weight:750}.chart-part-delta.up{color:var(--positive)}.chart-part-delta.down{color:var(--negative)}.chart-part-delta.flat{color:var(--text-muted)}.chart-driver-insight{display:flex;align-items:flex-start;gap:7px;padding:8px 9px;border-radius:10px;background:var(--insight-bg);color:var(--text-secondary);font-size:.72rem;line-height:1.45}.chart-driver-insight>svg{flex:0 0 auto;margin-top:1px;color:var(--accent)}.chart-driver-insight b{color:var(--text-strong)}.chart-detail-meta{display:flex;flex-wrap:wrap;gap:5px 12px;color:var(--text-muted);font-size:.72rem;line-height:1.4}.chart-detail-meta span:last-child{overflow-wrap:anywhere}.chart-share-button{display:inline-flex;width:max-content;min-height:38px;align-items:center;gap:7px;padding:0 11px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-soft);color:var(--text-secondary);font-size:.76rem;font-weight:700}.analytics-empty{display:grid;min-height:190px;place-items:center;align-content:center;gap:6px;color:var(--text-muted);text-align:center}.analytics-empty strong{color:var(--text-secondary)}.analytics-empty span{font-size:.82rem}.history-panel{margin-top:16px;padding:20px}.history-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:13px}.history-header .section-heading{min-width:0;margin-bottom:0}.history-all-time-total{flex:0 0 auto;color:var(--text-strong);font-size:clamp(1.02rem,2vw,1.35rem);font-weight:790;letter-spacing:-.025em;line-height:1.1;font-variant-numeric:tabular-nums;white-space:nowrap}.history-list{display:grid;gap:8px}.history-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft)}.history-main{min-width:0}.history-main strong{display:block;margin-bottom:3px;color:var(--text-strong)}.history-main span{display:block;overflow:hidden;color:var(--text-secondary);font-size:.81rem;text-overflow:ellipsis;white-space:nowrap}.history-main small{display:block;margin-top:4px;overflow-wrap:anywhere;color:var(--text-muted)}.history-main .meter-summary{color:var(--accent)}.history-total{color:var(--text-strong);font-size:1.02rem;font-weight:780;white-space:nowrap}.history-actions{display:flex;gap:6px}.history-actions button{display:grid;width:44px;height:44px;flex:0 0 auto;place-items:center;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface-solid);color:var(--text-secondary);transition:background .15s ease,border-color .15s ease,transform .1s ease}.history-actions button.danger{color:var(--danger)}.empty-state{display:grid;min-height:140px;place-items:center;align-content:center;gap:6px;color:var(--text-muted);text-align:center}.empty-state strong{color:var(--text-secondary)}.empty-state span{font-size:.84rem}.mobile-action-bar{display:none}button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}button:active{transform:translateY(1px)}@keyframes mode-in{0%{opacity:.6;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes total-change{0%{opacity:.72;transform:scale(.992)}to{opacity:1;transform:scale(1)}}@keyframes bar-grow{0%{transform:scaleY(.15);opacity:.45}to{transform:scaleY(1);opacity:1}}@media(hover:hover)and (pointer:fine){.primary-button:hover{background:var(--primary-hover)}.secondary-button:hover,.history-actions button:hover,.icon-button:hover,.ghost-button:hover,.chart-share-button:hover{background:var(--surface-muted)}.history-actions button.danger:hover{background:var(--danger-bg)}.segmented button:not(.active):hover{color:var(--text-strong)}}@media(min-width:721px){.chart-bars{--chart-columns: 12}}@media(max-width:1100px)and (min-width:961px){.form-footer{grid-template-columns:1fr}.note-field,.form-actions{grid-column:1;grid-row:auto}.form-actions{justify-content:flex-start}}@media(max-width:960px){html{scroll-padding-bottom:calc(24px + env(safe-area-inset-bottom))}.app-shell{width:min(calc(100% - 24px),760px);padding-top:22px;padding-bottom:calc(28px + env(safe-area-inset-bottom))}.content-grid{grid-template-columns:minmax(0,1fr)}.summary-column{display:none}.mobile-storage-note{display:flex;grid-column:1 / -1;margin-top:2px;padding:10px 12px;border-radius:12px;background:var(--surface-muted)}}@media(max-width:720px){.hero{align-items:flex-start;flex-direction:column;gap:12px}.hero-actions{width:100%}.install-button{flex:1 1 auto}.electric-card,.water-card{display:block}.utility-title,.segmented,.mode-fields{margin-bottom:10px}.meter-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.meter-fields .rate-field{grid-column:1 / -1}.form-footer{grid-template-columns:minmax(0,1fr)}.note-field,.form-actions,.notice{grid-column:1;grid-row:auto}.form-actions{justify-content:flex-start}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-card:last-child{grid-column:1 / -1}.chart-legend{gap:6px 10px;font-size:.64rem}.chart-plot{min-height:240px;overflow-x:auto;overflow-y:hidden;padding-bottom:2px}.chart-bars,.chart-grid-lines{min-width:max(100%,calc(var(--data-count, 6) * 58px))}.chart-tooltip{display:none!important}.chart-detail-grid{grid-template-columns:minmax(0,1fr)}.history-item{grid-template-columns:minmax(0,1fr) auto}.history-actions{grid-column:1 / -1}}@media(max-width:520px){.app-shell{width:min(calc(100% - 18px),100%);padding-top:18px}.hero h1{font-size:clamp(2rem,9vw,2.35rem);line-height:1.05}.hero p{font-size:.9rem}.calculator-panel,.analytics-panel,.history-panel{padding:16px;border-radius:18px}.section-heading{margin-bottom:13px}.kpi-grid{grid-template-columns:minmax(0,1fr)}.kpi-card:last-child{grid-column:auto}.chart-card{padding:13px 10px 10px}.chart-plot{min-height:232px}.chart-detail-header{align-items:flex-end}.chart-detail-total strong{font-size:1rem}.history-item{grid-template-columns:minmax(0,1fr);gap:9px}.history-total{grid-column:1}.history-main span{overflow:visible;white-space:normal}.history-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}.history-actions button{width:100%}}@media(max-width:420px){.form-actions{display:grid;grid-template-columns:minmax(0,1fr);width:100%}.primary-button,.secondary-button,.ghost-button{width:100%}}@media(max-width:380px){.basics-grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:350px){.electric-fields,.water-fields,.meter-fields{grid-template-columns:minmax(0,1fr)}.meter-fields .rate-field{grid-column:auto}.install-button{width:auto}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.total-card{position:relative;overflow:hidden;isolation:isolate}.total-card:after{position:absolute;z-index:0;width:180px;height:180px;right:-72px;bottom:-92px;border-radius:999px;content:"";opacity:0;filter:blur(3px);pointer-events:none;transition:opacity .24s ease,transform .24s ease}.total-card>*{position:relative;z-index:1}.total-card.trend-up:after{background:#ff5d6c33;opacity:1}.total-card.trend-down:after{background:#46c88033;opacity:1}.total-card.trend-flat:after{background:#aab4c51f;opacity:.75}.total-comparison{display:inline-flex;width:fit-content;max-width:100%;min-height:34px;align-items:center;gap:7px;margin-top:12px;padding:7px 10px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#ffffff12;color:var(--total-muted);font-size:.75rem;font-weight:720;line-height:1.35;animation:comparison-pop .34s cubic-bezier(.2,.8,.2,1)}.total-comparison svg{flex:0 0 auto}.total-comparison.up{border-color:#ff89953d;background:#d3394c2e;color:#ffb1ba}.total-comparison.down{border-color:#69d89e3d;background:#2b9d622e;color:#9ae1bb}.total-comparison.flat{color:#d3dae8}.selection-kpi-grid{grid-template-columns:repeat(auto-fit,minmax(175px,1fr));animation:analytics-cards-in .22s ease-out}.kpi-card{transition:border-color .18s ease,background .18s ease,transform .18s ease,box-shadow .18s ease}.kpi-card.selected-month-card{border-color:color-mix(in srgb,var(--accent) 38%,var(--border));background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface-soft))}.kpi-card.comparison.up,.kpi-card.utility-kpi.up{border-color:color-mix(in srgb,var(--positive) 34%,var(--border));background:color-mix(in srgb,var(--chart-up-soft) 72%,var(--surface-soft))}.kpi-card.comparison.down,.kpi-card.utility-kpi.down{border-color:color-mix(in srgb,var(--negative) 34%,var(--border));background:color-mix(in srgb,var(--chart-down-soft) 72%,var(--surface-soft))}.kpi-card.utility-kpi.up strong,.kpi-card.utility-kpi.up .kpi-delta{color:var(--positive)}.kpi-card.utility-kpi.down strong,.kpi-card.utility-kpi.down .kpi-delta{color:var(--negative)}.kpi-card.utility-kpi.flat .kpi-delta{color:var(--text-muted)}.kpi-card.utility-kpi.base .kpi-delta{color:var(--accent)}.kpi-card .kpi-delta{margin-top:1px;font-weight:760}.chart-floating-tooltip{position:fixed;z-index:99999;width:max-content;min-width:210px;max-width:min(250px,calc(100vw - 20px));padding:10px 11px;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface-solid);box-shadow:0 18px 45px #0000003d;color:var(--text-secondary);font-size:.73rem;line-height:1.5;pointer-events:none;animation:tooltip-in .12s ease-out}.chart-floating-tooltip.above{transform:translate(-50%,-100%)}.chart-floating-tooltip.below{transform:translate(-50%)}.chart-floating-tooltip strong{display:block;margin-bottom:4px;color:var(--text-strong)}.chart-floating-tooltip span{display:flex;justify-content:space-between;gap:18px}.chart-floating-tooltip b{color:var(--text-strong);font-variant-numeric:tabular-nums}.chart-floating-tooltip .chart-tooltip-trend{margin-top:6px}.back-to-top{position:fixed;z-index:30;right:max(18px,calc((100vw - 1360px)/2 - 58px));bottom:22px;display:grid;width:46px;height:46px;place-items:center;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-solid);box-shadow:var(--shadow);color:var(--text-strong);animation:back-top-in .2s ease-out;transition:transform .15s ease,background .15s ease,border-color .15s ease}@keyframes analytics-cards-in{0%{opacity:.7;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes comparison-pop{0%{opacity:.25;transform:translateY(4px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes tooltip-in{0%{opacity:0}to{opacity:1}}@keyframes back-top-in{0%{opacity:0;transform:translateY(8px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}@media(hover:hover)and (pointer:fine){.back-to-top:hover{background:var(--surface-muted);transform:translateY(-2px)}.kpi-card:hover{transform:translateY(-1px);box-shadow:0 8px 18px #1c273e0f}}@media(max-width:960px){.back-to-top{right:14px;bottom:calc(86px + env(safe-area-inset-bottom));width:44px;height:44px;border-radius:13px}}@media(max-width:720px){.selection-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.selection-kpi-grid{grid-template-columns:minmax(0,1fr)}.history-header{gap:10px}.history-all-time-total{font-size:1rem}.total-comparison{width:100%}}.system-banner{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 12px;padding:13px 15px;border:1px solid var(--border-strong);border-radius:16px;background:var(--surface-solid);box-shadow:0 8px 22px #1c273e0f}.system-banner-main{display:flex;min-width:0;align-items:flex-start;gap:11px}.system-banner-main>svg{flex:0 0 auto;margin-top:2px}.system-banner-main strong{display:block;margin-bottom:2px;color:var(--text-strong);font-size:.9rem}.system-banner-main p{margin:0;color:var(--text-secondary);font-size:.82rem;line-height:1.45}.system-banner-main small{display:block;margin-top:4px;color:var(--text-muted);font-size:.75rem;line-height:1.45}.system-banner-actions{display:flex;flex:0 0 auto;align-items:center;gap:7px}.in-app-browser-banner{border-color:var(--warning-border);background:var(--warning-bg)}.in-app-browser-banner .system-banner-main>svg,.in-app-browser-banner .system-banner-main strong{color:var(--warning-text)}.update-banner{border-color:color-mix(in srgb,var(--accent) 32%,var(--border));background:color-mix(in srgb,var(--accent-soft) 58%,var(--surface-solid))}.update-banner .system-banner-main>svg{color:var(--accent)}.update-banner.has-unsaved{border-color:var(--warning-border);background:color-mix(in srgb,var(--warning-bg) 72%,var(--surface-solid))}.update-banner.has-unsaved .system-banner-main>svg{color:var(--warning-text)}.compact-action,.update-now-button{min-height:40px;padding:9px 13px;white-space:nowrap;font-size:.8rem}.text-button{min-height:40px;padding:8px 10px;border:0;border-radius:10px;background:transparent;color:var(--text-secondary);font-size:.8rem;font-weight:700}@media(hover:hover)and (pointer:fine){.text-button:hover{background:#7f8ba01a;color:var(--text-strong)}}@media(max-width:720px){.system-banner{align-items:stretch;flex-direction:column;gap:10px;padding:12px;border-radius:14px}.system-banner-actions{width:100%}.system-banner-actions .compact-action{flex:1 1 auto}.update-now-button{width:100%;justify-content:center}}.meter-fields{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}.field-error{min-height:1.05rem;visibility:hidden;line-height:1.05rem}.field-error.is-visible{visibility:visible}input[aria-invalid=true],input[aria-invalid=true]:focus{border-color:var(--danger);box-shadow:none}.utility-summary{display:grid;min-width:0;margin-left:auto;justify-items:end;gap:2px}.fixed-rate{color:var(--text-muted);font-size:.78rem;font-weight:700;white-space:nowrap}@media(max-width:720px){.meter-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.utility-summary{gap:1px}}@media(max-width:420px){.utility-title{align-items:flex-start}.fixed-rate{white-space:normal;text-align:right}}@media(max-width:350px){.meter-fields{grid-template-columns:minmax(0,1fr)}}.basics-grid-single{grid-template-columns:minmax(0,1fr)}.settings-backdrop{position:fixed;z-index:100200;inset:0;display:grid;place-items:center;padding:20px;background:#080c1685;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overscroll-behavior:contain}.settings-dialog{width:min(560px,100%);max-height:calc(100dvh - 40px);overflow:auto;padding:20px;border:1px solid var(--border-strong);border-radius:22px;background:var(--surface-solid);box-shadow:0 24px 70px #070c1847;color:var(--text)}.settings-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}.settings-header>div:first-child{min-width:0}.settings-kicker{display:block;margin-bottom:4px;color:var(--accent);font-size:.68rem;font-weight:820;letter-spacing:.13em}.settings-header h2{margin:0;color:var(--text-strong);font-size:1.25rem;letter-spacing:-.025em}.settings-header p{margin:6px 0 0;color:var(--text-muted);font-size:.83rem;line-height:1.5}.settings-form{display:grid;gap:12px}.settings-form .field{margin:0}.settings-form .input-suffix input{min-height:48px}.settings-preview{display:grid;gap:3px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft)}.settings-preview>span{color:var(--text-muted);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.settings-preview>strong{color:var(--text-strong);font-size:1rem}.settings-preview>small{color:var(--text-secondary);font-size:.78rem;line-height:1.45}.settings-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:2px}@media(max-width:520px){.settings-backdrop{align-items:end;padding:10px}.settings-dialog{width:100%;max-height:calc(100dvh - 20px);padding:17px;border-radius:20px}.settings-actions{display:grid;grid-template-columns:1fr 1.35fr}.settings-actions .ghost-button,.settings-actions .primary-button{width:100%}}.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.hero h1{font-size:clamp(1.9rem,3.45vw,2.72rem)}.context-badge{display:inline-flex;width:fit-content;align-items:center;gap:6px;margin-top:7px;padding:5px 9px;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface-muted);color:var(--text-secondary);font-size:.76rem;font-weight:760;line-height:1.25}.form-context{border-color:color-mix(in srgb,var(--accent) 30%,var(--border));background:color-mix(in srgb,var(--accent-soft) 62%,var(--surface-soft));color:var(--accent-strong)}.stats-context{background:var(--surface-soft);color:var(--text-secondary)}.analytics-heading>div:last-child,.form-heading>div:last-child{min-width:0}.section-heading-compact{margin-bottom:12px}.heading-copy{display:flex;align-items:center;min-width:0}.section-heading-compact .context-badge{margin-top:0}.selection-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.kpi-card .kpi-month-title{color:var(--text-strong);font-size:.84rem;font-weight:780}.settings-data-section{display:grid;gap:10px;margin-top:4px;padding-top:15px;border-top:1px solid var(--border)}.settings-subheading strong{display:block;color:var(--text-strong);font-size:.94rem}.settings-subheading span{display:block;margin-top:3px;color:var(--text-muted);font-size:.8rem;line-height:1.45}.backup-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.backup-actions .secondary-button{min-width:0;justify-content:center}.backup-note{color:var(--text-muted);font-size:.76rem;line-height:1.45}.form-anomaly{margin:0 0 13px}.payment-field{display:flex;grid-column:1 / -1;align-items:end;gap:14px;padding:11px 12px;border:1px solid var(--border);border-radius:13px;background:var(--surface-soft)}.payment-toggle{display:inline-flex;min-height:44px;align-items:center;gap:9px;color:var(--text-strong);font-weight:720;cursor:pointer}.payment-toggle input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.payment-check{display:grid;width:25px;height:25px;place-items:center;border:1px solid var(--border-strong);border-radius:8px;background:var(--input-bg);color:transparent;transition:background .16s ease,border-color .16s ease,color .16s ease}.payment-toggle input:checked+.payment-check{border-color:var(--negative);background:color-mix(in srgb,var(--negative) 13%,var(--surface-solid));color:var(--negative)}.payment-toggle input:focus-visible+.payment-check{outline:3px solid var(--focus);outline-offset:2px}.payment-date{display:grid;min-width:180px;gap:5px;margin-left:auto}.payment-date label{color:var(--text-secondary);font-size:.8rem;font-weight:680}.payment-date input{display:block;width:100%;min-width:0;max-width:100%;min-height:44px;box-sizing:border-box;text-align:left;overflow:hidden}.payment-date input[type=date]{-webkit-appearance:none;appearance:none}.payment-date input[type=date]::-webkit-date-and-time-value{min-width:0;margin:0;text-align:left}.payment-date input[type=date]::-webkit-datetime-edit{min-width:0;padding:0}.payment-date input[type=date]::-webkit-calendar-picker-indicator{flex:0 0 auto;margin-left:auto}.payment-status{display:inline-flex;width:fit-content;align-items:center;gap:4px;padding:3px 7px;border-radius:999px;font-weight:720}.payment-status.paid{background:var(--chart-down-soft);color:var(--negative)}.payment-status.unpaid{background:var(--surface-muted);color:var(--text-muted)}.history-all-time-total{position:relative;padding:6px 8px;border:0;border-radius:10px;background:transparent}.history-all-time-total:after{position:absolute;z-index:30;right:0;bottom:calc(100% + 7px);width:max-content;max-width:210px;padding:7px 9px;transform:translateY(4px);border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-solid);box-shadow:var(--shadow);color:var(--text-secondary);content:attr(data-tooltip);font-size:.75rem;font-weight:650;opacity:0;pointer-events:none;transition:opacity .14s ease,transform .14s ease}.history-all-time-total:hover:after,.history-all-time-total:focus-visible:after{transform:translateY(0);opacity:1}.history-actions-mobile{display:none}.history-more{position:relative;min-width:0}.history-more summary{list-style:none}.history-more summary::-webkit-details-marker{display:none}.chart-floating-tooltip.is-pinned{border-color:color-mix(in srgb,var(--accent) 42%,var(--border-strong));box-shadow:0 20px 52px #00000047}.chart-tooltip-selection{display:block;margin-top:7px;padding-top:6px;border-top:1px solid var(--border);color:var(--accent);font-size:.7rem;font-weight:720}.chart-focus.is-active .chart-bar{animation:bar-select .18s ease-out}@keyframes bar-select{0%{transform:scaleY(.96) scaleX(.94)}to{transform:scaleY(1) scaleX(1)}}@media(max-width:960px){.selection-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.selection-kpi-grid,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-card:last-child{grid-column:auto}.kpi-card{padding:12px}.kpi-card>span,.kpi-card small,.section-heading>div:last-child>span,.chart-heading span,.chart-insight span,.history-main span,.history-main small,.storage-note span,.storage-note p{font-size:.82rem;line-height:1.42}.kpi-card strong{overflow:visible;font-size:clamp(1rem,5vw,1.28rem);text-overflow:clip;white-space:normal;overflow-wrap:anywhere}.chart-legend{font-size:.76rem;line-height:1.35}.chart-label b{font-size:.75rem}.chart-label small{font-size:.7rem}.payment-field{align-items:stretch;flex-direction:column;gap:8px}.payment-date{width:100%;min-width:0;max-width:100%;margin-left:0;overflow:hidden}.payment-date input[type=date]{height:48px;min-height:48px;max-width:100%;padding:10px 12px;border-radius:12px;font-size:16px;line-height:1.2}.history-actions-desktop{display:none}.history-actions-mobile{position:relative;display:grid;grid-column:1 / -1;grid-template-columns:1fr 1fr .9fr;gap:7px}.history-actions-mobile>button,.history-more>summary{display:flex;width:100%;min-height:42px;align-items:center;justify-content:center;gap:6px;padding:8px 10px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-solid);color:var(--text-secondary);font-size:.8rem;font-weight:700;cursor:pointer}.history-more-menu{position:absolute;z-index:25;right:0;bottom:calc(100% + 7px);display:grid;width:min(220px,calc(100vw - 50px));padding:6px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-solid);box-shadow:var(--shadow)}.history-more-menu button{display:flex;min-height:42px;align-items:center;gap:8px;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--text-secondary);text-align:left}.history-more-menu button.danger{color:var(--danger)}.backup-actions{grid-template-columns:minmax(0,1fr)}}@media(max-width:520px){.selection-kpi-grid,.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.context-badge{font-size:.78rem}.history-all-time-total{font-size:.98rem}}@media(max-width:350px){.selection-kpi-grid,.kpi-grid{gap:7px}.kpi-card{padding:10px}.kpi-card strong{font-size:.98rem}}:root{--station-cyan: #3ec6f2;--station-aqua: #43d3bc;--station-electric: #8da2ff;--station-violet: #8077ff;--station-room: #8b93a7;--station-glow: rgba(82, 103, 218, .16);--panel-highlight: rgba(255, 255, 255, .72)}:root[data-theme=dark]{--bg: #0b101b;--surface: rgba(17, 25, 40, .95);--surface-solid: #111a2a;--surface-soft: #0f1726;--surface-muted: #182238;--input-bg: #0d1625;--border: #27344b;--border-strong: #364761;--accent: #8ca2ff;--accent-strong: #b3c0ff;--accent-soft: #1c2a54;--primary: #6d80f3;--primary-hover: #8091fa;--station-cyan: #58d1ff;--station-aqua: #55dbb5;--station-electric: #9aaeff;--station-violet: #9488ff;--station-room: #8f9bad;--station-glow: rgba(92, 126, 255, .24);--panel-highlight: rgba(255, 255, 255, .045);--total-card: linear-gradient(145deg, #182742 0%, #22345a 56%, #2b365b 100%)}body{background:radial-gradient(circle at 10% -10%,color-mix(in srgb,var(--accent) 17%,transparent),transparent 34rem),radial-gradient(circle at 88% 8%,color-mix(in srgb,var(--station-cyan) 8%,transparent),transparent 28rem),var(--bg)}.app-shell{position:relative}.app-shell:before{position:fixed;inset:0;z-index:-1;pointer-events:none;content:"";opacity:.22;background-image:linear-gradient(color-mix(in srgb,var(--accent) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 8%,transparent) 1px,transparent 1px);background-size:42px 42px;-webkit-mask-image:linear-gradient(to bottom,#000,transparent 72%);mask-image:linear-gradient(to bottom,#000,transparent 72%)}.hero{position:relative;overflow:hidden;padding:17px 19px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));border-radius:20px;background:color-mix(in srgb,var(--surface) 93%,transparent);box-shadow:inset 0 1px 0 var(--panel-highlight),0 18px 52px #08101f14}.hero:after{position:absolute;top:-80px;right:12%;width:280px;height:180px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 17%,transparent),transparent 68%);content:"";pointer-events:none}.hero>*{position:relative;z-index:1}.hero h1{max-width:680px;font-size:clamp(1.8rem,3vw,2.48rem);letter-spacing:-.045em}.eyebrow{color:var(--station-electric)}.panel,.mini-card,.utility-card,.kpi-card,.chart-card,.history-item{box-shadow:inset 0 1px 0 var(--panel-highlight)}.panel{border-color:color-mix(in srgb,var(--border) 84%,var(--accent) 16%)}.module-kicker{display:inline-flex!important;margin:0 0 3px!important;color:var(--accent)!important;font-size:.62rem!important;font-weight:850!important;letter-spacing:.14em;line-height:1.2!important}.section-icon{position:relative;border:1px solid color-mix(in srgb,var(--accent) 22%,transparent);box-shadow:inset 0 0 18px color-mix(in srgb,var(--accent) 12%,transparent)}.section-icon:after{position:absolute;inset:-4px;border:1px solid color-mix(in srgb,var(--accent) 14%,transparent);border-radius:15px;content:"";opacity:0;transition:opacity .18s ease,transform .18s ease}.panel:hover .section-icon:after{opacity:1;transform:scale(1.03)}.context-badge{border-color:color-mix(in srgb,var(--accent) 34%,var(--border));box-shadow:inset 0 0 14px color-mix(in srgb,var(--accent) 8%,transparent)}.utility-card{position:relative;overflow:hidden;padding:17px;border-color:color-mix(in srgb,var(--border) 80%,var(--accent) 20%);background:linear-gradient(145deg,color-mix(in srgb,var(--surface-soft) 96%,transparent),color-mix(in srgb,var(--surface) 94%,transparent));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.utility-card:before{position:absolute;inset:0 auto 0 0;width:3px;background:var(--station-electric);box-shadow:0 0 18px color-mix(in srgb,var(--station-electric) 55%,transparent);content:""}.water-card:before{background:var(--station-aqua);box-shadow:0 0 18px color-mix(in srgb,var(--station-aqua) 55%,transparent)}.utility-name{align-items:center}.utility-copy{display:grid;gap:1px}.utility-copy small{color:var(--text-muted);font-size:.58rem;font-weight:850;letter-spacing:.13em}.utility-copy strong{font-size:1.02rem}.electric-card .utility-icon{color:var(--station-electric)}.water-card .utility-icon{color:var(--station-aqua)}.fixed-rate{padding:5px 8px;border:1px solid var(--border);border-radius:999px;background:var(--surface-muted);font-weight:760}.resource-hud{display:grid;gap:7px;margin:2px 0 11px}.resource-meta{display:flex;justify-content:space-between;gap:12px;color:var(--text-muted);font-size:.77rem}.resource-meta b{color:var(--text-secondary);font-weight:760}.resource-track{position:relative;height:7px;overflow:hidden;border:1px solid color-mix(in srgb,var(--border) 70%,transparent);border-radius:999px;background:var(--surface-muted)}.resource-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--station-electric),var(--station-cyan));box-shadow:0 0 16px color-mix(in srgb,var(--station-electric) 42%,transparent);transition:width .24s cubic-bezier(.2,.8,.2,1)}.water-card .resource-track i{background:linear-gradient(90deg,var(--station-aqua),var(--station-cyan));box-shadow:0 0 16px color-mix(in srgb,var(--station-aqua) 42%,transparent)}.calc-line strong{animation:hud-pop .2s ease-out}.total-card{border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);background:var(--total-card);box-shadow:inset 0 1px #ffffff14,0 20px 50px #070d1c33,0 0 0 1px #7891ff08}.total-card:before{position:absolute;inset:0;z-index:0;background:linear-gradient(115deg,transparent 20%,rgba(255,255,255,.045) 42%,transparent 58%);transform:translate(-110%);content:"";animation:station-scan 5.8s ease-in-out infinite;pointer-events:none}.total-card-topline{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.total-card-topline h2{margin-top:1px}.status-chip{display:inline-flex;min-height:27px;align-items:center;padding:5px 9px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#ffffff12;color:#dce5f8;font-size:.7rem;font-weight:820;white-space:nowrap}.status-chip.up{border-color:#ff899547;background:#ff89951f;color:#ffb0b8}.status-chip.down{border-color:#78d19a47;background:#78d19a1f;color:#9fe4b9}.hud-number{text-shadow:0 0 28px rgba(154,174,255,.18)}.monthly-usage-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px}.monthly-usage-item{display:flex;min-width:0;align-items:center;gap:9px;padding:10px 11px;border:1px solid rgba(255,255,255,.14);border-radius:13px;background:#070d1c33;box-shadow:inset 0 1px #ffffff0d}.monthly-usage-item.electric{border-color:color-mix(in srgb,var(--station-electric) 45%,transparent);background:color-mix(in srgb,var(--station-electric) 12%,rgba(7,13,28,.24))}.monthly-usage-item.water{border-color:color-mix(in srgb,var(--station-aqua) 45%,transparent);background:color-mix(in srgb,var(--station-aqua) 12%,rgba(7,13,28,.24))}.monthly-usage-icon{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border-radius:10px;background:#ffffff1a}.monthly-usage-item.electric .monthly-usage-icon{color:var(--station-electric)}.monthly-usage-item.water .monthly-usage-icon{color:var(--station-aqua)}.monthly-usage-copy{display:block;min-width:0}.monthly-usage-copy small{display:block;color:var(--total-muted);font-size:.67rem;font-weight:720;line-height:1.2}.monthly-usage-copy strong{display:block;margin-top:2px;color:#fff;font-size:1.05rem;font-weight:850;line-height:1.15;overflow-wrap:anywhere}.monthly-usage-copy em{color:#ffffffc7;font-size:.68rem;font-style:normal;font-weight:760}.allocation-panel{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:13px;margin-top:15px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:#070d1c29}.allocation-ring{display:grid;width:62px;height:62px;flex:0 0 auto;place-items:center;border-radius:50%;background:conic-gradient(var(--station-room) 0 var(--room-share),var(--station-electric) var(--room-share) calc(var(--room-share) + var(--electric-share)),var(--station-aqua) calc(var(--room-share) + var(--electric-share)) 100%);box-shadow:0 0 22px #5971e424}.allocation-ring:after{grid-area:1/1;width:44px;height:44px;border-radius:50%;background:#24334f;content:""}.allocation-ring span{z-index:1;grid-area:1/1;color:#f4f7ff;font-size:.72rem;font-weight:800}.allocation-legend{display:grid;gap:5px}.allocation-legend>span{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:7px;color:var(--total-muted);font-size:.73rem}.allocation-legend b{color:#fff;font-weight:780}.alloc-dot{width:7px;height:7px;border-radius:50%}.alloc-dot.room{background:var(--station-room)}.alloc-dot.electric{background:var(--station-electric)}.alloc-dot.water{background:var(--station-aqua)}.total-comparison{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.analytics-panel{position:relative;overflow:hidden}.analytics-panel:before{position:absolute;top:0;right:14%;width:220px;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 12px var(--accent);content:"";opacity:.55}.selection-kpi-grid{gap:11px}.kpi-card{position:relative;overflow:hidden;background:linear-gradient(145deg,var(--surface-soft),color-mix(in srgb,var(--surface) 96%,var(--accent) 4%));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;animation:card-sync .18s ease-out}.kpi-card:before{position:absolute;inset:0 auto 0 0;width:2px;background:color-mix(in srgb,var(--accent) 58%,transparent);content:""}.kpi-card.comparison.up:before{background:var(--positive)}.kpi-card.comparison.down:before{background:var(--negative)}.utility-kpi.up:before{background:var(--positive)}.utility-kpi.down:before{background:var(--negative)}.chart-card{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 17%,var(--border));background:linear-gradient(180deg,color-mix(in srgb,var(--surface-soft) 98%,transparent),var(--surface-soft))}.chart-card:after{position:absolute;top:82px;left:-25%;width:24%;height:1px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 60%,white),transparent);box-shadow:0 0 8px color-mix(in srgb,var(--accent) 38%,transparent);content:"";opacity:.35;animation:chart-scan 4.8s ease-in-out infinite;pointer-events:none}.chart-heading strong:before{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--station-cyan);box-shadow:0 0 12px var(--station-cyan);content:"";vertical-align:1px}.chart-focus.is-active .chart-bar{filter:saturate(1.08) brightness(1.06);box-shadow:0 0 0 2px color-mix(in srgb,white 85%,transparent),0 0 26px color-mix(in srgb,var(--accent) 55%,transparent);animation:checkpoint-pulse 2.2s ease-in-out infinite}.chart-column:after{display:block;width:5px;height:5px;margin:6px auto 0;border-radius:50%;background:var(--border-strong);content:""}.chart-column:has(.chart-focus.is-active):after{background:var(--accent);box-shadow:0 0 10px var(--accent)}.chart-insight{border-color:color-mix(in srgb,var(--accent) 22%,var(--border));background:linear-gradient(135deg,var(--insight-bg),color-mix(in srgb,var(--surface-soft) 94%,var(--accent) 6%))}.history-panel{position:relative;overflow:visible}.achievement-strip{display:flex;flex-wrap:wrap;gap:7px;margin:-2px 0 13px}.achievement-strip>span{display:inline-flex;min-height:30px;align-items:center;gap:6px;padding:5px 9px;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--accent-soft) 52%,var(--surface-soft));color:var(--text-secondary);font-size:.73rem;font-weight:680}.achievement-strip svg{color:var(--accent)}.achievement-strip b{color:var(--text-strong)}.history-list{gap:10px}.history-item.save-slot{position:relative;overflow:visible;border-color:color-mix(in srgb,var(--border) 84%,var(--accent) 16%);background:linear-gradient(145deg,var(--surface-soft),color-mix(in srgb,var(--surface) 97%,var(--accent) 3%));transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.history-title-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.notice{border-color:color-mix(in srgb,var(--accent) 26%,var(--border));box-shadow:0 10px 24px #0c162a14;animation:reward-pop .28s cubic-bezier(.2,.9,.2,1)}.primary-button,.secondary-button,.ghost-button,.icon-button,.history-actions button,.history-actions-mobile button,.history-more summary{transition:transform .12s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease,color .16s ease}.primary-button:active,.secondary-button:active,.ghost-button:active,.icon-button:active,.history-actions button:active,.history-actions-mobile button:active,.history-more summary:active{transform:scale(.975)}@media(hover:hover)and (pointer:fine){.utility-card:hover,.kpi-card:hover,.history-item.save-slot:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent) 35%,var(--border));box-shadow:inset 0 1px 0 var(--panel-highlight),0 14px 34px #101c3417}:root[data-theme=dark] .utility-card:hover,:root[data-theme=dark] .kpi-card:hover,:root[data-theme=dark] .history-item.save-slot:hover{box-shadow:inset 0 1px 0 var(--panel-highlight),0 16px 38px #0003,0 0 20px #5b75e80f}}@keyframes hud-pop{0%{opacity:.65;transform:translateY(2px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes station-scan{0%,68%,to{transform:translate(-115%);opacity:0}74%{opacity:.7}88%{transform:translate(125%);opacity:0}}@keyframes chart-scan{0%,15%{transform:translate(0);opacity:0}22%{opacity:.4}70%{transform:translate(620%);opacity:.25}78%,to{transform:translate(620%);opacity:0}}@keyframes checkpoint-pulse{0%,to{filter:saturate(1.05) brightness(1.04)}50%{filter:saturate(1.16) brightness(1.11)}}@keyframes card-sync{0%{opacity:.72;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes reward-pop{0%{opacity:0;transform:translateY(5px) scale(.985)}70%{opacity:1;transform:translateY(-1px) scale(1.005)}to{transform:translateY(0) scale(1)}}@media(max-width:960px){.content-grid{display:grid}.summary-column{display:grid;position:static;order:-1;gap:0}.summary-column .storage-note{display:none}.summary-column .total-card{margin-bottom:0}.calculator-panel{order:0}.total-card{padding:18px}.allocation-panel{grid-template-columns:auto 1fr}}@media(max-width:720px){.hero{padding:15px}.hero h1{font-size:clamp(1.75rem,8vw,2.15rem)}.resource-meta{font-size:.8rem}.utility-card{padding:15px}.utility-copy strong{font-size:1rem}.achievement-strip{gap:6px}.achievement-strip>span{font-size:.75rem}.chart-focus.is-active .chart-bar{animation-duration:2.5s}}@media(max-width:520px){.content-grid{gap:12px}.summary-column .total-card{border-radius:19px}.total-card>strong{font-size:clamp(2rem,11vw,2.7rem)}.monthly-usage-grid{gap:7px}.monthly-usage-item{gap:7px;padding:9px}.monthly-usage-icon{width:31px;height:31px}.monthly-usage-copy strong{font-size:.98rem}.allocation-panel{gap:10px;padding:10px}.allocation-ring{width:56px;height:56px}.allocation-ring:after{width:40px;height:40px}.resource-meta{flex-direction:column;gap:2px}.history-title-row{align-items:flex-start;flex-direction:column;gap:5px}.module-kicker{font-size:.6rem!important}.achievement-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.achievement-strip>span:last-child:nth-child(odd){grid-column:1 / -1}}@media(max-width:380px){.monthly-usage-grid{grid-template-columns:minmax(0,1fr)}.allocation-panel{grid-template-columns:1fr}.allocation-ring{margin:0 auto}.achievement-strip{grid-template-columns:minmax(0,1fr)}.achievement-strip>span:last-child:nth-child(odd){grid-column:auto}}@media(prefers-reduced-motion:reduce){.total-card:before,.chart-card:after,.chart-focus.is-active .chart-bar{animation:none!important}}.month-stepper{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:stretch;gap:8px;width:100%}.month-step-button{display:grid;width:44px;min-width:44px;min-height:44px;place-items:center;padding:0;border:1px solid var(--border-strong);border-radius:12px;background:var(--input-bg);color:var(--text-secondary);transition:transform .12s ease,background .15s ease,color .15s ease,box-shadow .15s ease}.month-step-button:hover{background:var(--surface-muted);color:var(--text-strong)}.month-step-button:active{transform:scale(.96)}.month-step-button:focus-visible{outline:3px solid var(--focus);outline-offset:1px}.month-stepper>input{min-width:0;width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:12px;background:var(--input-bg);color:var(--text)}.panel,.total-card,.mini-card,.utility-card,.kpi-card,.chart-card,.history-item,.storage-note,.payment-field,.settings-preview,.settings-data-section,.allocation-panel,.anomaly-box,.chart-insight{border:1px solid transparent!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--border) 88%,transparent),inset 0 1px 0 var(--panel-highlight);background-clip:padding-box}.resource-hud{display:none!important}.app-toast{position:fixed;z-index:100300;top:max(14px,calc(env(safe-area-inset-top) + 10px));right:max(16px,calc((100vw - 1360px)/2));display:flex;max-width:min(390px,calc(100vw - 32px));min-height:48px;align-items:center;gap:9px;padding:11px 14px;border-radius:14px;background:color-mix(in srgb,var(--surface-solid) 94%,var(--success-bg) 6%);box-shadow:0 16px 42px #0000002e;color:var(--text-strong);font-size:.88rem;font-weight:720;animation:app-toast-in .24s cubic-bezier(.2,.9,.2,1)}.app-toast svg{flex:0 0 auto;color:var(--negative)}@keyframes app-toast-in{0%{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:720px){.month-stepper{grid-template-columns:42px minmax(0,1fr) 42px;gap:7px}.month-step-button{width:42px;min-width:42px;min-height:46px}.month-input{min-height:46px}.app-toast{right:16px;left:16px;max-width:none}}@media(prefers-reduced-motion:reduce){.app-toast{animation:none}}.utility-section-title{display:inline-flex;align-items:center;color:var(--accent-strong);font-size:1.02rem;font-weight:800;letter-spacing:-.012em}.electric-section-title{color:var(--station-electric, var(--accent-strong))}.water-section-title{color:var(--station-aqua, var(--accent))}.section-title-accent{margin:0;color:var(--accent-strong)!important;font-size:1.08rem!important;font-weight:800!important;letter-spacing:-.018em}.history-section-heading{margin-bottom:0}@media(min-width:721px){.basics-grid-single{width:min(100%,520px);max-width:520px}.basics-grid-single .field{margin-bottom:0}.month-stepper{grid-template-columns:40px minmax(250px,1fr) 40px;gap:6px}.month-step-button{width:40px;min-width:40px;min-height:42px;border-radius:11px}.month-input{min-height:42px;padding:8px 11px}}.history-item.save-slot.is-latest{border-color:transparent!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--border) 88%,transparent),inset 0 1px 0 var(--panel-highlight)!important}.achievement-strip{align-items:center;gap:6px}.achievement-strip>span{min-height:28px;padding:4px 8px;white-space:nowrap}.app-footer{display:flex;min-height:54px;align-items:center;justify-content:center;padding:18px 16px calc(18px + env(safe-area-inset-bottom));color:var(--text-muted);font-size:.74rem;font-weight:620;letter-spacing:.02em;text-align:center}@media(max-width:520px){.achievement-strip{display:flex;flex-wrap:wrap}.achievement-strip>span,.achievement-strip>span:last-child:nth-child(odd){width:auto;grid-column:auto}.app-footer{padding-bottom:calc(88px + env(safe-area-inset-bottom))}}:root[data-theme=light]{--bg: #f7f9ff;--bg-glow: rgba(255, 120, 138, .12);--surface: rgba(255, 255, 255, .9);--surface-solid: #ffffff;--surface-soft: #fbfcff;--surface-muted: #f1f5ff;--accent: #6657e8;--accent-strong: #5140d3;--accent-soft: #eeeaff;--station-electric: #ffb000;--station-aqua: #14a9ed;--station-cyan: #37c9f6;--station-violet: #8a63f6;--station-room: #ff7b74;--panel-highlight: rgba(255, 255, 255, .96);--total-card: linear-gradient(135deg, #ff7a59 0%, #ff5478 45%, #7465f5 100%);--total-muted: rgba(255, 255, 255, .84);--shadow: 0 18px 44px rgba(74, 83, 130, .13)}:root[data-theme=light] body{background:radial-gradient(circle at 6% 3%,rgba(255,180,79,.22),transparent 24rem),radial-gradient(circle at 94% 8%,rgba(45,190,255,.18),transparent 27rem),radial-gradient(circle at 55% 45%,rgba(144,107,255,.09),transparent 34rem),linear-gradient(180deg,#fbfcff,#f5f8ff 48%,#fff9fb)}.colorful-hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(420px,1.35fr);align-items:center;gap:20px;min-height:244px}.hero-copy{min-width:0;padding:18px 4px 18px 8px}.hero-visual{position:relative;min-width:0;margin:0;overflow:hidden;border-radius:18px;aspect-ratio:3 / 1;box-shadow:0 18px 38px #3b5b961f}.hero-visual:after{position:absolute;inset:0;background:linear-gradient(110deg,rgba(255,255,255,.16),transparent 35%,transparent 68%,rgba(255,255,255,.18));content:"";pointer-events:none}.hero-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.015)}.colorful-hero .hero-actions{position:absolute;z-index:5;top:14px;right:14px;padding:5px;border:1px solid rgba(255,255,255,.72);border-radius:14px;background:#ffffffd1;box-shadow:0 10px 28px #30477524;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}:root[data-theme=light] .colorful-hero{border-color:#7a69eb2e;background:linear-gradient(135deg,#fff5ddf5,#f5f2fff2 48%,#e6f8fffa);box-shadow:0 20px 56px #4f5d9321}:root[data-theme=light] .colorful-hero:before{position:absolute;inset:0;background:radial-gradient(circle at 13% 22%,rgba(255,190,56,.22),transparent 24%),radial-gradient(circle at 85% 78%,rgba(37,180,255,.2),transparent 25%);content:"";pointer-events:none}:root[data-theme=light] .hero h1{background:linear-gradient(90deg,#ff8145,#ff5d73 44%,#6a5be7 82%);-webkit-background-clip:text;background-clip:text;color:transparent}:root[data-theme=light] .eyebrow{color:#6755dc}:root[data-theme=light] .calculator-panel{background:linear-gradient(150deg,#fffffffa,#f8f2fff5);box-shadow:inset 0 0 0 1px #8669e629,0 18px 42px #5b4e9717}:root[data-theme=light] .calculator-panel .section-icon{color:#7a5bef;background:linear-gradient(145deg,#f2eaff,#e9e6ff)}:root[data-theme=light] .section-title-accent{background:linear-gradient(90deg,#6354dd,#925ee8);-webkit-background-clip:text;background-clip:text;color:transparent}:root[data-theme=light] .basics-grid .field{max-width:640px}:root[data-theme=light] .month-step-button,:root[data-theme=light] .month-input{border-color:#6657e833;background:linear-gradient(180deg,#fff,#f7f5ff);box-shadow:0 6px 18px #6657e812}:root[data-theme=light] .electric-card{background:radial-gradient(circle at 89% 22%,rgba(255,196,41,.2),transparent 29%),linear-gradient(140deg,#fffdf3,#fff8d9 54%,#fff2c1);box-shadow:inset 0 0 0 1px #f6ae1b38,0 16px 34px #dea32617}:root[data-theme=light] .electric-card:before{width:4px;background:linear-gradient(180deg,#ffca3a,#ff8b24);box-shadow:0 0 18px #ffa41a61}:root[data-theme=light] .electric-card:after{position:absolute;z-index:0;top:18px;right:7%;width:82px;height:118px;clip-path:polygon(45% 0,100% 0,68% 39%,94% 39%,24% 100%,43% 55%,15% 55%);background:linear-gradient(180deg,#ffd037b8,#ff8b2459);filter:drop-shadow(0 0 14px rgba(255,183,25,.35));content:"";opacity:.34;pointer-events:none;animation:electric-flash 2.8s ease-in-out infinite}:root[data-theme=light] .electric-card .utility-icon{border-color:#f6ae1b40;background:#ffffffb8;color:#f59b0b;box-shadow:0 0 18px #ffb22324;animation:electric-icon-pulse 2.4s ease-in-out infinite}:root[data-theme=light] .electric-section-title,:root[data-theme=light] .electric-card .fixed-rate{color:#c87400}:root[data-theme=light] .water-card{background:radial-gradient(circle at 88% 22%,rgba(30,190,248,.18),transparent 28%),linear-gradient(140deg,#f3fdff,#e9faff,#dbf4ff);box-shadow:inset 0 0 0 1px #1fa4df33,0 16px 34px #30a0cd17}:root[data-theme=light] .water-card:before{width:4px;background:linear-gradient(180deg,#41d6da,#168eea);box-shadow:0 0 18px #199be24d}:root[data-theme=light] .water-card:after{position:absolute;z-index:0;right:-50px;bottom:-55px;width:280px;height:135px;border-radius:50%;background:radial-gradient(ellipse at 25% 20%,transparent 49%,rgba(53,202,242,.28) 50% 57%,transparent 58%),radial-gradient(ellipse at 55% 30%,transparent 50%,rgba(31,150,238,.2) 51% 58%,transparent 59%),linear-gradient(180deg,#4bd8f624,#1897e938);content:"";opacity:.75;pointer-events:none;animation:water-wave-drift 4.2s ease-in-out infinite}:root[data-theme=light] .water-card .utility-icon{border-color:#17a1e038;background:#ffffffbd;color:#129fe5;box-shadow:0 0 18px #26b8eb26;animation:water-icon-float 3s ease-in-out infinite}:root[data-theme=light] .water-section-title,:root[data-theme=light] .water-card .fixed-rate{color:#0b7fc0}:root[data-theme=light] .electric-card>*,:root[data-theme=light] .water-card>*{position:relative;z-index:2}:root[data-theme=light] .electric-card input{border-color:#eba62047;background:#ffffffc7}:root[data-theme=light] .water-card input{border-color:#1f9edd40;background:#fffc}:root[data-theme=light] .electric-card input:focus{border-color:#f4a20b;box-shadow:0 0 0 3px #f5a20b24}:root[data-theme=light] .water-card input:focus{border-color:#159fde;box-shadow:0 0 0 3px #159fde24}:root[data-theme=light] .payment-field{background:linear-gradient(145deg,#f2fff5,#e9fbef);box-shadow:inset 0 0 0 1px #40b1672e}:root[data-theme=light] .note-field textarea{border-color:#895ee733;background:linear-gradient(180deg,#fff,#faf7ff)}:root[data-theme=light] .storage-note{background:linear-gradient(135deg,#edf4ff,#f0edff);box-shadow:inset 0 0 0 1px #5869dc29}:root[data-theme=light] .total-card{border-color:#ffffff85!important;color:#fff;box-shadow:0 22px 54px #e5536638,0 12px 30px #6052d224}:root[data-theme=light] .total-card h2,:root[data-theme=light] .total-card strong,:root[data-theme=light] .total-card b{color:#fff}:root[data-theme=light] .total-card:before{background:linear-gradient(115deg,transparent 15%,rgba(255,255,255,.2) 42%,transparent 61%)}:root[data-theme=light] .allocation-panel{border-color:#ffffff57!important;background:#ffffff24;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}:root[data-theme=light] .monthly-usage-item{border-color:#ffffff61;background:#ffffff29;box-shadow:inset 0 1px #ffffff1f}:root[data-theme=light] .monthly-usage-icon{background:#fff3}:root[data-theme=light] .allocation-legend,:root[data-theme=light] .allocation-legend span,:root[data-theme=light] .breakdown span,:root[data-theme=light] .total-card small{color:#ffffffd9}:root[data-theme=light] .analytics-panel{background:radial-gradient(circle at 88% 8%,rgba(93,117,255,.13),transparent 25%),linear-gradient(145deg,#fbf8ff,#f2f5ff 52%,#eefaff);box-shadow:inset 0 0 0 1px #6758da24,0 18px 44px #57579614}:root[data-theme=light] .analytics-panel .section-icon{color:#7057e8;background:linear-gradient(145deg,#eee8ff,#e6e8ff)}:root[data-theme=light] .selected-month-card{background:linear-gradient(145deg,#eeeaff,#e7ecff);box-shadow:inset 0 0 0 1px #6758da2e,0 10px 24px #6758da14}:root[data-theme=light] .comparison.base,:root[data-theme=light] .comparison.flat{background:linear-gradient(145deg,#f1f4fb,#eef2f8)}:root[data-theme=light] .comparison.up{background:linear-gradient(145deg,#fff1f4,#ffe5ea);box-shadow:inset 0 0 0 1px #dc485c29}:root[data-theme=light] .comparison.down{background:linear-gradient(145deg,#effcf4,#e3f8eb);box-shadow:inset 0 0 0 1px #299d5c29}:root[data-theme=light] .electric-kpi{background:linear-gradient(145deg,#fffaf0,#fff0c9);box-shadow:inset 0 0 0 1px #eaa41d29}:root[data-theme=light] .water-kpi{background:linear-gradient(145deg,#effcff,#dff5ff);box-shadow:inset 0 0 0 1px #1f9cdc29}:root[data-theme=light] .chart-card{background:radial-gradient(circle at 90% 15%,rgba(64,193,246,.11),transparent 22%),linear-gradient(145deg,#fff,#f7f5ff 48%,#effaff);box-shadow:inset 0 0 0 1px #5b5cd224,0 16px 34px #46528c12}:root[data-theme=light] .chart-heading strong{color:#5341c8}:root[data-theme=light] .history-panel{background:radial-gradient(circle at 8% 5%,rgba(255,193,87,.12),transparent 21%),radial-gradient(circle at 96% 92%,rgba(84,194,248,.1),transparent 24%),linear-gradient(145deg,#fffdf9,#fff8f5 50%,#f7fbff);box-shadow:inset 0 0 0 1px #e5915121,0 18px 44px #78524a12}:root[data-theme=light] .history-panel .section-icon{color:#ed7d4e;background:linear-gradient(145deg,#fff1e5,#ffe8da)}:root[data-theme=light] .history-item{background:linear-gradient(135deg,#fff,#fff9f3);box-shadow:inset 0 0 0 1px #e292561c,0 9px 22px #6e5b5b0b}:root[data-theme=light] .history-item:nth-child(4n+2){background:linear-gradient(135deg,#fff,#f3faff);box-shadow:inset 0 0 0 1px #45a8e01a,0 9px 22px #4a68890b}:root[data-theme=light] .history-item:nth-child(4n+3){background:linear-gradient(135deg,#fff,#f6f4ff);box-shadow:inset 0 0 0 1px #735dda1a,0 9px 22px #5e4f8c0b}:root[data-theme=light] .history-item:nth-child(4n){background:linear-gradient(135deg,#fff,#f3fff7);box-shadow:inset 0 0 0 1px #41a7661a,0 9px 22px #4e7b590b}:root[data-theme=light] .achievement-strip>span{border-color:transparent;box-shadow:inset 0 0 0 1px #695cc91f;background:linear-gradient(135deg,#f6f1ff,#eff5ff)}:root[data-theme=light] .settings-dialog{background:radial-gradient(circle at 100% 0%,rgba(98,113,241,.12),transparent 25%),linear-gradient(145deg,#fff,#faf7ff 55%,#f1fbff)}:root[data-theme=light] .settings-preview{background:linear-gradient(135deg,#fff7e9,#f4efff);box-shadow:inset 0 0 0 1px #a170da21}:root[data-theme=light] .settings-data-section{background:linear-gradient(135deg,#f1fbff,#eff3ff);border-radius:14px;padding:14px}:root[data-theme=light] .app-footer{color:#7e719a}:root[data-theme=dark] .hero-visual{box-shadow:0 18px 42px #0000003d}:root[data-theme=dark] .hero-visual img{filter:brightness(.78) saturate(.82)}@keyframes electric-flash{0%,to{transform:translateZ(0) rotate(-2deg) scale(.96);opacity:.25}42%{transform:translate3d(-4px,3px,0) rotate(2deg) scale(1.04);opacity:.48}50%{opacity:.2}58%{opacity:.5}}@keyframes electric-icon-pulse{0%,to{transform:scale(1);box-shadow:0 0 14px #ffb2231f}50%{transform:scale(1.04);box-shadow:0 0 24px #ffb22340}}@keyframes water-wave-drift{0%,to{transform:translateZ(0) rotate(-2deg)}50%{transform:translate3d(-18px,-7px,0) rotate(2deg)}}@keyframes water-icon-float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@media(max-width:960px){.colorful-hero{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr)}}@media(max-width:720px){.colorful-hero{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:14px}.hero-copy{padding:6px 2px 0}.hero-visual{order:3;width:100%;border-radius:15px}.colorful-hero .hero-actions{position:static;order:2;width:100%;padding:0;border:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}:root[data-theme=light] .electric-card:after{right:3%;width:62px;height:92px}:root[data-theme=light] .water-card:after{right:-76px;bottom:-68px}}@media(max-width:520px){.hero-visual{aspect-ratio:2.45 / 1}.hero-visual img{object-position:52% center}:root[data-theme=light] .electric-card,:root[data-theme=light] .water-card{padding:15px}}@media(prefers-reduced-motion:reduce){:root[data-theme=light] .electric-card:after,:root[data-theme=light] .electric-card .utility-icon,:root[data-theme=light] .water-card:after,:root[data-theme=light] .water-card .utility-icon{animation:none!important}}:root[data-theme=light] .calculator-panel .section-title-accent{background:linear-gradient(90deg,#ff6f61,#8b5cf6);-webkit-background-clip:text;background-clip:text;color:transparent}:root[data-theme=light] .analytics-panel .section-title-accent{background:linear-gradient(90deg,#5b5eea,#2aa7e7);-webkit-background-clip:text;background-clip:text;color:transparent}:root[data-theme=light] .history-panel .section-title-accent{background:linear-gradient(90deg,#e97842,#ed5f7b);-webkit-background-clip:text;background-clip:text;color:transparent}:root[data-theme=light] .primary-button{border-color:transparent;background:linear-gradient(100deg,#ff8a38,#ff5e78 48%,#8064ef);box-shadow:0 10px 24px #ee5b6f2e}:root[data-theme=light] .secondary-button{border-color:#6f5cde29;background:linear-gradient(180deg,#fff,#f6f3ff);color:#5748c4}:root[data-theme=light] .ghost-button{color:#6c6187}@media(hover:hover)and (pointer:fine){:root[data-theme=light] .primary-button:hover{background:linear-gradient(100deg,#ff7c28,#f84e6c 48%,#7357e5);transform:translateY(-1px)}:root[data-theme=light] .electric-card:hover{box-shadow:inset 0 0 0 1px #f6ae1b4d,0 18px 38px #dea32624}:root[data-theme=light] .water-card:hover{box-shadow:inset 0 0 0 1px #1fa4df47,0 18px 38px #30a0cd21}}.hero-copy{overflow:visible}.hero h1{overflow:visible;padding-bottom:.11em;line-height:1.14}.month-picker-row{margin-top:2px}.month-picker-row .field{margin-bottom:0}.month-input{display:grid;grid-template-columns:minmax(0,1fr);place-items:center;padding-right:46px;padding-left:46px;text-align:center}.month-input>span{width:100%;text-align:center}.month-input>svg{position:absolute;right:14px;top:50%;transform:translateY(-50%)}.allocation-ring:after{box-shadow:inset 0 2px 7px #0000002e}.chart-heading strong:before{display:none!important;content:none!important}.chart-heading-title{display:inline-flex;align-items:center;gap:8px;color:var(--accent)}.chart-heading-title>svg{flex:0 0 auto;filter:drop-shadow(0 3px 7px color-mix(in srgb,var(--accent) 24%,transparent))}.chart-heading-title strong{margin:0}.panel,.total-card,.mini-card,.utility-card,.kpi-card,.chart-card,.history-item,.payment-field,.storage-note,.settings-preview,.settings-data-section,.allocation-panel,.anomaly-box{transform:translateZ(0);transform-style:preserve-3d;backface-visibility:hidden;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease,filter .2s ease}:root[data-theme=light] .panel,:root[data-theme=light] .mini-card,:root[data-theme=light] .utility-card,:root[data-theme=light] .kpi-card,:root[data-theme=light] .chart-card,:root[data-theme=light] .history-item,:root[data-theme=light] .payment-field,:root[data-theme=light] .storage-note,:root[data-theme=light] .settings-preview,:root[data-theme=light] .settings-data-section,:root[data-theme=light] .allocation-panel,:root[data-theme=light] .anomaly-box{box-shadow:inset 0 1px #fffffff5,inset 0 -1px #595d960e,0 2px 3px #4c527e0e,0 12px 26px #4a538218,0 28px 58px #5d5a8c0e!important}:root[data-theme=light] .total-card{box-shadow:inset 0 1px #ffffff85,inset 0 -2px #502d8f1f,0 4px 8px #e7506f1f,0 18px 38px #e04c7733,0 34px 70px #5c4bc621!important}:root[data-theme=dark] .panel,:root[data-theme=dark] .mini-card,:root[data-theme=dark] .utility-card,:root[data-theme=dark] .kpi-card,:root[data-theme=dark] .chart-card,:root[data-theme=dark] .history-item,:root[data-theme=dark] .payment-field,:root[data-theme=dark] .storage-note,:root[data-theme=dark] .settings-preview,:root[data-theme=dark] .settings-data-section,:root[data-theme=dark] .allocation-panel,:root[data-theme=dark] .anomaly-box{box-shadow:inset 0 1px #ffffff0e,inset 0 -1px #0003,0 3px 6px #0000002e,0 16px 34px #00000029!important}@media(hover:hover)and (pointer:fine){.utility-card:hover,.kpi-card:hover,.chart-card:hover,.history-item:hover,.payment-field:hover,.storage-note:hover,.settings-preview:hover,.settings-data-section:hover{transform:translate3d(0,-3px,0) rotateX(.25deg);filter:saturate(1.025)}:root[data-theme=light] .utility-card:hover,:root[data-theme=light] .kpi-card:hover,:root[data-theme=light] .chart-card:hover,:root[data-theme=light] .history-item:hover{box-shadow:inset 0 1px #fffffffa,inset 0 -1px #595d960d,0 5px 9px #4c527e12,0 18px 36px #4a538221,0 34px 70px #5d5a8c13!important}}@media(max-width:720px){.hero h1{padding-bottom:.08em;line-height:1.12}.month-input{padding-right:42px;padding-left:42px}}@media(prefers-reduced-motion:reduce){.panel,.total-card,.mini-card,.utility-card,.kpi-card,.chart-card,.history-item,.payment-field,.storage-note,.settings-preview,.settings-data-section,.allocation-panel,.anomaly-box{transition:none!important}}@media(hover:hover)and (pointer:fine){.electric-card:hover,.water-card:hover,:root[data-theme=light] .electric-card:hover,:root[data-theme=light] .water-card:hover,:root[data-theme=dark] .electric-card:hover,:root[data-theme=dark] .water-card:hover{transform:none!important;filter:none!important}:root[data-theme=light] .electric-card:hover{box-shadow:inset 0 1px #fffffff5,inset 0 0 0 1px #f6ae1b4d,0 8px 18px #dea3261a,0 22px 44px #dea32624!important}:root[data-theme=light] .water-card:hover{box-shadow:inset 0 1px #fffffff5,inset 0 0 0 1px #1fa4df47,0 8px 18px #30a0cd1a,0 22px 44px #30a0cd24!important}}:root[data-theme=light] .total-card .status-chip.up,:root[data-theme=light] .total-card .total-comparison.up{border-color:#d52e4e47!important;background:#fff0f4f5!important;color:#c82848!important;box-shadow:0 7px 18px #c7284821}:root[data-theme=light] .total-card .status-chip.down,:root[data-theme=light] .total-card .total-comparison.down{border-color:#18995247!important;background:#ebfff2f5!important;color:#13834b!important;box-shadow:0 7px 18px #13834b21}:root[data-theme=dark] .total-card .status-chip.up,:root[data-theme=dark] .total-card .total-comparison.up{border-color:#ff6c827a!important;background:#76162cb8!important;color:#ff9cac!important}:root[data-theme=dark] .total-card .status-chip.down,:root[data-theme=dark] .total-card .total-comparison.down{border-color:#4dd98970!important;background:#125c39b3!important;color:#8ce5b2!important}.rainfall-effect{position:fixed;z-index:90;inset:0;overflow:hidden;pointer-events:none;contain:strict}.raindrop{position:absolute;top:-48px;left:var(--rain-left);width:1.5px;height:var(--rain-length);border-radius:999px;background:linear-gradient(180deg,#fff0,#54aaebbf 38%,#2a7acff2);box-shadow:0 4px 8px #418ed62e;opacity:var(--rain-opacity);transform:rotate(8deg);animation:rain-fall var(--rain-duration) linear var(--rain-delay) infinite;will-change:transform}:root[data-theme=dark] .raindrop{background:linear-gradient(180deg,#fff0,#84c9ffa8 38%,#5aa7e9eb);box-shadow:0 4px 10px #5aa7e938}@keyframes rain-fall{0%{transform:translate3d(0,-12vh,0) rotate(8deg)}to{transform:translate3d(var(--rain-drift),116vh,0) rotate(8deg)}}@media(max-width:720px){.rainfall-effect .raindrop:nth-child(3n){display:none}}@media(prefers-reduced-motion:reduce){.rainfall-effect{display:none!important}}.history-pagination{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:14px;padding-top:12px;border-top:1px solid color-mix(in srgb,var(--border) 78%,transparent)}.history-page-button{display:grid;width:38px;height:38px;place-items:center;padding:0;border:1px solid color-mix(in srgb,var(--accent) 22%,var(--border));border-radius:11px;background:color-mix(in srgb,var(--surface-solid) 92%,var(--accent-soft) 8%);color:var(--text-secondary);box-shadow:0 5px 14px #131f3a12;transition:transform .12s ease,background .15s ease,color .15s ease,box-shadow .15s ease}.history-page-button:not(:disabled):hover{background:var(--accent-soft);color:var(--accent-strong);transform:translateY(-1px)}.history-page-button:not(:disabled):active{transform:scale(.96)}.history-page-button:disabled{box-shadow:none;opacity:.38}.history-page-button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.history-page-status{min-width:58px;color:var(--text-muted);font-size:.78rem;font-weight:700;text-align:center}.history-page-status b{color:var(--text-strong);font-size:.88rem}.app-footer{min-height:34px;padding-top:10px;padding-bottom:8px}@media(max-width:960px){.app-footer{min-height:30px;padding:8px 12px 0}}@media(max-width:520px){.history-pagination{margin-top:11px;padding-top:10px}.history-page-button{width:36px;height:36px}.app-footer{padding-bottom:0;margin-bottom:-4px}}@media(max-width:960px){.app-shell{padding-bottom:calc(82px + env(safe-area-inset-bottom))}}.flying-dinosaur{position:fixed;z-index:88;top:0;left:0;width:76px;height:76px;padding:0;border:0;background:transparent;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transform:translate3d(var(--dino-x),var(--dino-y),0);transition:transform var(--dino-duration) cubic-bezier(.32,.7,.28,1);will-change:transform;--dino-wing-border: rgba(38, 119, 73, .48);--dino-wing-from: rgba(217, 255, 225, .96);--dino-wing-to: rgba(105, 217, 145, .92);--dino-dead-bg: #26322b;filter:drop-shadow(0 9px 10px rgba(33,56,47,.22))}.flying-dinosaur.dino-variant-2{--dino-wing-border: rgba(111, 72, 178, .54);--dino-wing-from: rgba(239, 225, 255, .97);--dino-wing-to: rgba(178, 129, 235, .94);--dino-dead-bg: #44305c}.flying-dinosaur.dino-variant-3{--dino-wing-border: rgba(48, 121, 173, .55);--dino-wing-from: rgba(220, 246, 255, .97);--dino-wing-to: rgba(96, 183, 235, .94);--dino-dead-bg: #24475d}.flying-dinosaur:hover,.flying-dinosaur:focus-visible{outline:none;filter:drop-shadow(0 10px 13px rgba(33,56,47,.3))}.flying-dinosaur:focus-visible .flying-dinosaur-sprite{box-shadow:0 0 0 3px #6fe09966;border-radius:24px}.flying-dinosaur-sprite{position:relative;display:grid;width:100%;height:100%;place-items:center;animation:dino-flight-bob .72s ease-in-out infinite alternate;transform-origin:50% 58%}.dino-body{position:relative;z-index:3;display:block;font-size:48px;line-height:1;-webkit-user-select:none;user-select:none;filter:saturate(1.08)}.dino-variant-2 .dino-body{filter:hue-rotate(155deg) saturate(1.35) brightness(1.03)}.dino-variant-3 .dino-body{filter:hue-rotate(265deg) saturate(1.4) brightness(1.08)}.dino-wing{position:absolute;z-index:1;top:25px;width:30px;height:16px;border:2px solid var(--dino-wing-border);border-radius:76% 18% 70% 24%;background:linear-gradient(145deg,var(--dino-wing-from),var(--dino-wing-to));box-shadow:inset 0 0 0 2px #ffffff47;transform-origin:90% 50%;animation:dino-wing-flap .28s ease-in-out infinite alternate}.dino-wing-back{left:6px;opacity:.8;transform:rotate(18deg)}.dino-wing-front{right:5px;z-index:4;transform:scaleX(-1) rotate(18deg);transform-origin:10% 50%}.dino-dead-mark{position:absolute;z-index:6;top:15px;left:47px;display:none;width:18px;height:18px;place-items:center;border:2px solid rgba(255,255,255,.92);border-radius:999px;background:var(--dino-dead-bg);color:#fff;font-size:13px;font-weight:900;line-height:1;box-shadow:0 3px 8px #0000002e}.flying-dinosaur.is-flying-left .flying-dinosaur-sprite{transform:scaleX(-1)}.flying-dinosaur.is-falling{pointer-events:none;transition:none;animation:dino-fall-death 1.25s cubic-bezier(.52,.03,.86,.38) forwards;transform-origin:50% 58%}.flying-dinosaur.is-falling .flying-dinosaur-sprite{animation:none}.flying-dinosaur.is-falling .dino-wing{animation:none;opacity:.3}.flying-dinosaur.is-falling .dino-dead-mark{display:grid}@keyframes dino-fall-death{0%{transform:translate3d(var(--dino-x),var(--dino-y),0) rotate(0) scale(1);opacity:1;filter:grayscale(0) drop-shadow(0 9px 10px rgba(33,56,47,.22))}12%{transform:translate3d(var(--dino-x),calc(var(--dino-y) + 10px),0) rotate(35deg) scale(.98);opacity:1;filter:grayscale(.12) drop-shadow(0 10px 9px rgba(0,0,0,.18))}58%{transform:translate3d(var(--dino-x),calc(var(--dino-y) + 42vh),0) rotate(300deg) scale(.86);opacity:1;filter:grayscale(.28) drop-shadow(0 12px 8px rgba(0,0,0,.16))}84%{opacity:.9}to{transform:translate3d(var(--dino-x),calc(100vh + 120px),0) rotate(560deg) scale(.72);opacity:0;filter:grayscale(.5) drop-shadow(0 12px 8px rgba(0,0,0,.12))}}@keyframes dino-flight-bob{0%{translate:0 -4px;rotate:-2deg}to{translate:0 4px;rotate:2deg}}@keyframes dino-wing-flap{0%{rotate:-18deg;scale:1 .72}to{rotate:24deg;scale:1 1.08}}@media(max-width:720px){.flying-dinosaur{width:58px;height:58px;filter:drop-shadow(0 7px 8px rgba(33,56,47,.18))}.dino-body{font-size:38px}.dino-wing{top:19px;width:23px;height:13px}.dino-wing-back{left:2px}.dino-wing-front{right:1px}.dino-dead-mark{top:10px;left:36px;width:16px;height:16px;font-size:11px}}@media(prefers-reduced-motion:reduce){.flying-dinosaur,.flying-dinosaur-sprite,.dino-wing{animation:none!important;transition:none!important}}.settings-cloud-section{display:grid;gap:10px;padding:14px;border-radius:16px;background:color-mix(in srgb,var(--surface-soft) 92%,var(--accent-soft) 8%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--border) 86%,transparent)}.cloud-subheading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.cloud-heading-copy{display:flex;min-width:0;align-items:flex-start;gap:9px}.cloud-icon{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border-radius:11px;background:color-mix(in srgb,var(--accent-soft) 76%,var(--surface-solid));color:var(--accent)}.cloud-status-pill{display:inline-flex;min-height:28px;flex:0 0 auto;align-items:center;padding:4px 9px;border-radius:999px;background:var(--surface-muted);color:var(--text-muted);font-size:.72rem;font-weight:780;white-space:nowrap}.cloud-status-pill.synced{background:color-mix(in srgb,var(--success-bg) 84%,var(--surface-soft));color:var(--negative)}.cloud-status-pill.syncing,.cloud-status-pill.signing-in{background:color-mix(in srgb,var(--accent-soft) 82%,var(--surface-soft));color:var(--accent-strong)}.cloud-status-pill.error{background:var(--danger-bg);color:var(--danger)}.cloud-config-note,.cloud-auth-box,.cloud-account-box{display:grid;gap:10px;padding:11px 12px;border-radius:13px;background:color-mix(in srgb,var(--surface-solid) 88%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--border) 88%,transparent)}.cloud-config-note strong,.cloud-auth-box strong,.cloud-account-box strong{display:block;color:var(--text-strong);font-size:.84rem}.cloud-config-note span,.cloud-auth-box span,.cloud-account-box span{display:block;margin-top:2px;color:var(--text-muted);font-size:.76rem;line-height:1.45}.cloud-config-note code{padding:1px 4px;border-radius:5px;background:var(--surface-muted);color:var(--text-secondary);font-size:.72rem}.cloud-auth-box{grid-template-columns:minmax(0,1fr) auto;align-items:center}.cloud-account-main{display:flex;min-width:0;align-items:center;gap:10px}.cloud-avatar{display:grid;width:38px;height:38px;flex:0 0 auto;overflow:hidden;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent)}.cloud-avatar img{width:100%;height:100%;object-fit:cover}.cloud-actions{display:flex;flex-wrap:wrap;gap:7px}.cloud-actions button{min-height:40px}.cloud-message,.cloud-unsaved-note{display:block;color:var(--text-muted);font-size:.75rem;line-height:1.45}.cloud-message.synced{color:var(--negative)}.cloud-message.error{color:var(--danger)}.cloud-unsaved-note{color:var(--warning-text)}:root[data-theme=light] .settings-cloud-section{background:linear-gradient(135deg,#f5f8ff,#eefaff 54%,#f7f1ff);box-shadow:inset 0 0 0 1px #5d69d61c,0 10px 24px #5a68b40f}@media(max-width:520px){.cloud-subheading,.cloud-auth-box{grid-template-columns:minmax(0,1fr)}.cloud-subheading{display:grid}.cloud-status-pill{width:fit-content}.cloud-auth-box .secondary-button,.cloud-actions,.cloud-actions button{width:100%}.cloud-actions{display:grid;grid-template-columns:minmax(0,1fr)}}.cloud-status-pill.pending,.cloud-status-pill.offline{background:color-mix(in srgb,var(--warning-bg) 88%,var(--surface-soft));color:var(--warning-text)}.cloud-message.pending,.cloud-message.offline,.cloud-pending-note{display:block;color:var(--warning-text);font-size:.75rem;line-height:1.45}.auth-gate-page{position:relative;display:grid;min-height:100dvh;place-items:center;overflow:hidden;padding:28px;background:radial-gradient(circle at 15% 15%,rgba(255,184,92,.26),transparent 32%),radial-gradient(circle at 88% 20%,rgba(70,177,255,.24),transparent 34%),radial-gradient(circle at 62% 86%,rgba(155,103,255,.19),transparent 36%),linear-gradient(145deg,#f9fbff,#fff7f1,#f4f8ff)}:root[data-theme=dark] .auth-gate-page{background:radial-gradient(circle at 15% 15%,rgba(255,155,72,.12),transparent 34%),radial-gradient(circle at 88% 20%,rgba(70,177,255,.13),transparent 36%),radial-gradient(circle at 62% 86%,rgba(155,103,255,.12),transparent 38%),linear-gradient(145deg,#0e1522,#101827 52%,#0c1420)}.auth-gate-page .rainfall-effect{z-index:2;opacity:.78}.auth-gate-orb{position:absolute;z-index:1;width:360px;height:360px;border-radius:50%;filter:blur(18px);opacity:.45;pointer-events:none}.auth-gate-orb-one{top:-120px;left:-90px;background:#ff9f4c40}.auth-gate-orb-two{right:-110px;bottom:-130px;background:#529dff3d}.auth-gate-card{position:relative;z-index:5;display:grid;grid-template-columns:minmax(0,1.06fr) minmax(390px,.94fr);width:min(1040px,100%);min-height:590px;overflow:hidden;border:1px solid rgba(255,255,255,.82);border-radius:30px;background:#ffffffdb;box-shadow:0 34px 90px #223b662e,inset 0 1px #fffffff2;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}:root[data-theme=dark] .auth-gate-card{border-color:#839dc733;background:#131d2de0;box-shadow:0 38px 94px #0000006b,inset 0 1px #ffffff0d}.auth-gate-visual{position:relative;min-height:100%;overflow:hidden;background:linear-gradient(155deg,#fff4de,#eaf6ff 62%,#ecf3ff)}.auth-gate-visual:after{position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(19,35,65,.74) 100%);content:"";pointer-events:none}.auth-gate-visual img{width:100%;height:100%;min-height:590px;object-fit:cover;object-position:center;transform:scale(1.02)}.auth-gate-visual-copy{position:absolute;z-index:2;right:34px;bottom:32px;left:34px;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.24)}.auth-gate-visual-copy span{display:block;margin-bottom:7px;font-size:.76rem;font-weight:900;letter-spacing:.16em}.auth-gate-visual-copy strong{display:block;max-width:420px;font-size:clamp(1.42rem,2.4vw,2rem);line-height:1.15;letter-spacing:-.03em}.auth-gate-content{display:flex;flex-direction:column;justify-content:center;padding:clamp(32px,5vw,58px)}.auth-gate-brand{display:flex;align-items:center;gap:12px;margin-bottom:34px}.auth-gate-logo{display:grid;width:48px;height:48px;place-items:center;border-radius:15px;background:linear-gradient(145deg,#6b79ff,#9364f4);box-shadow:0 12px 26px #6b79ff47,inset 0 1px #ffffff59;color:#fff}.auth-gate-brand>div>span{display:block;color:var(--text-muted);font-size:.66rem;font-weight:850;letter-spacing:.13em}.auth-gate-brand>div>strong{display:block;margin-top:3px;color:var(--text-strong);font-size:1.18rem}.auth-gate-kicker{display:inline-flex;margin-bottom:10px;color:var(--accent);font-size:.72rem;font-weight:900;letter-spacing:.12em}.auth-gate-heading h1{margin:0;color:var(--text-strong);font-size:clamp(2rem,4vw,3rem);line-height:1.04;letter-spacing:-.05em}.auth-gate-heading p{margin:16px 0 0;color:var(--text-secondary);font-size:.95rem;line-height:1.65}.auth-gate-benefits{display:grid;gap:10px;margin:24px 0}.auth-gate-benefits span{display:flex;align-items:center;gap:9px;color:var(--text-secondary);font-size:.88rem;font-weight:700}.auth-gate-benefits svg{color:#5979ee}.google-login-button{display:grid;grid-template-columns:auto 1fr auto;min-height:56px;align-items:center;gap:12px;padding:10px 15px;border:1px solid color-mix(in srgb,var(--border-strong) 86%,#5b77ee 14%);border-radius:16px;background:var(--surface-solid);box-shadow:0 12px 28px #3046701f,inset 0 1px #ffffffbf;color:var(--text-strong);font:inherit;font-weight:800;cursor:pointer;transition:transform .14s ease,box-shadow .18s ease,border-color .18s ease}.google-login-button:hover:not(:disabled){transform:translateY(-2px);border-color:#5b77ee7a;box-shadow:0 18px 34px #30467029}.google-login-button:active:not(:disabled){transform:translateY(0) scale(.99)}.google-login-button:disabled{opacity:.66;cursor:wait}.google-login-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:50%;background:conic-gradient(from 20deg,#4285f4 0 25%,#34a853 25% 50%,#fbbc05 50% 75%,#ea4335 75% 100%);box-shadow:inset 0 0 0 6px #fff;color:#314057;font-size:.86rem;font-weight:900}.google-login-button>svg{color:var(--text-muted)}.auth-gate-note{margin:16px 2px 0;color:var(--text-muted);font-size:.74rem;line-height:1.55;text-align:center}.auth-gate-loading{display:flex;align-items:center;gap:12px;color:var(--text-secondary);font-weight:700}.auth-gate-loading i{width:22px;height:22px;border:3px solid color-mix(in srgb,var(--accent) 24%,transparent);border-top-color:var(--accent);border-radius:50%;animation:auth-spin .72s linear infinite}@keyframes auth-spin{to{transform:rotate(360deg)}}.auth-gate-error{display:flex;align-items:flex-start;gap:10px;padding:13px 14px;border:1px solid color-mix(in srgb,var(--danger) 30%,var(--border));border-radius:14px;background:color-mix(in srgb,var(--danger) 8%,var(--surface-solid));color:var(--danger)}.auth-gate-error strong,.auth-gate-error span{display:block}.auth-gate-error span{margin-top:3px;color:var(--text-secondary);font-size:.82rem;line-height:1.45}.auth-gate-error.compact{margin-top:12px;align-items:center;padding:10px 12px}.auth-gate-error.compact span{margin:0}.auth-gate-copyright{position:absolute;z-index:5;bottom:12px;color:var(--text-muted);font-size:.7rem}@media(max-width:820px){.auth-gate-page{padding:16px;align-items:start;overflow-y:auto}.auth-gate-card{grid-template-columns:1fr;min-height:auto;margin:8px 0 34px;border-radius:24px}.auth-gate-visual{min-height:220px}.auth-gate-visual img{min-height:220px;height:220px;object-position:center 47%}.auth-gate-visual-copy{right:22px;bottom:20px;left:22px}.auth-gate-visual-copy strong{font-size:1.25rem}.auth-gate-content{padding:28px 24px 30px}.auth-gate-brand{margin-bottom:24px}.auth-gate-heading h1{font-size:2rem}.auth-gate-heading p{font-size:.9rem}.auth-gate-copyright{position:relative;bottom:auto;margin-bottom:8px}}@media(max-width:480px){.auth-gate-page{padding:10px}.auth-gate-card{border-radius:20px}.auth-gate-visual,.auth-gate-visual img{min-height:178px;height:178px}.auth-gate-visual-copy span{font-size:.64rem}.auth-gate-visual-copy strong{font-size:1.08rem}.auth-gate-content{padding:23px 18px 24px}.auth-gate-logo{width:44px;height:44px}.google-login-button{min-height:54px}}@media(prefers-reduced-motion:reduce){.auth-gate-loading i{animation-duration:1.5s}.google-login-button{transition:none}}.sync-onboarding-backdrop{position:fixed;z-index:100260;inset:0;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 18% 18%,rgba(111,128,255,.22),transparent 34%),radial-gradient(circle at 82% 80%,rgba(55,197,255,.18),transparent 36%),#070b1694;-webkit-backdrop-filter:blur(10px) saturate(1.08);backdrop-filter:blur(10px) saturate(1.08);overscroll-behavior:contain}.sync-onboarding-dialog{position:relative;width:min(520px,100%);overflow:hidden;padding:24px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border-strong));border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface-solid) 96%,#7887ff 4%),var(--surface-solid));box-shadow:0 28px 90px #05091457,inset 0 1px #ffffff61;color:var(--text);animation:sync-onboarding-in .28s cubic-bezier(.2,.9,.2,1)}.sync-onboarding-dialog:before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,#7180ff,#7b5cff 46%,#45c8ff)}.sync-onboarding-visual{position:relative;display:grid;width:62px;height:62px;place-items:center;margin-bottom:17px;border-radius:20px;background:linear-gradient(145deg,#6378ff,#7c55e9 62%,#36bfee);box-shadow:0 14px 34px #5864eb47;color:#fff}.sync-onboarding-visual>span{position:relative;z-index:2;display:grid;place-items:center}.sync-onboarding-visual>i{position:absolute;width:7px;height:7px;border-radius:50%;background:#ffffffe0;box-shadow:0 0 12px #fffc;animation:sync-dot 1.4s ease-in-out infinite}.sync-onboarding-visual>i:nth-of-type(1){top:9px;right:10px}.sync-onboarding-visual>i:nth-of-type(2){right:8px;bottom:11px;animation-delay:.22s}.sync-onboarding-visual>i:nth-of-type(3){bottom:8px;left:12px;animation-delay:.44s}.sync-onboarding-kicker{display:block;margin-bottom:6px;color:var(--accent-strong);font-size:.68rem;font-weight:860;letter-spacing:.13em}.sync-onboarding-copy h2{margin:0;color:var(--text-strong);font-size:clamp(1.25rem,3vw,1.65rem);line-height:1.2;letter-spacing:-.03em}.sync-onboarding-copy p{margin:9px 0 0;color:var(--text-secondary);font-size:.88rem;line-height:1.58}.sync-onboarding-account{display:flex;align-items:center;gap:11px;margin-top:18px;padding:12px 13px;border-radius:15px;background:color-mix(in srgb,var(--surface-soft) 88%,var(--accent-soft) 12%);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--border) 85%,transparent)}.sync-onboarding-account>div:last-child{min-width:0}.sync-onboarding-account strong,.sync-onboarding-account span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sync-onboarding-account strong{color:var(--text-strong);font-size:.85rem}.sync-onboarding-account span{margin-top:2px;color:var(--text-muted);font-size:.75rem}.sync-onboarding-points{display:grid;gap:8px;margin-top:14px}.sync-onboarding-points span{display:flex;align-items:flex-start;gap:8px;color:var(--text-secondary);font-size:.78rem;line-height:1.45}.sync-onboarding-points svg{flex:0 0 auto;margin-top:1px;color:var(--negative)}.sync-onboarding-error{display:flex;align-items:flex-start;gap:8px;margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--danger-bg);color:var(--danger);font-size:.77rem;line-height:1.45}.sync-onboarding-error svg{flex:0 0 auto;margin-top:1px}.sync-onboarding-actions{display:grid;grid-template-columns:.78fr 1.35fr;gap:9px;margin-top:20px}.sync-onboarding-actions button{width:100%;min-height:46px}.sync-onboarding-actions .primary-button{background:linear-gradient(135deg,#6278ff,#7954e8 58%,#32b9e8);box-shadow:0 12px 28px #5c65e53d}.is-spinning{animation:auth-spin .72s linear infinite}:root[data-theme=light] .sync-onboarding-dialog{background:radial-gradient(circle at 100% 0,rgba(94,201,255,.1),transparent 34%),radial-gradient(circle at 0 100%,rgba(131,98,255,.1),transparent 34%),#fff;box-shadow:0 28px 90px #47529138,inset 0 1px #fff}@keyframes sync-onboarding-in{0%{opacity:0;transform:translateY(14px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes sync-dot{0%,to{transform:scale(.7);opacity:.42}50%{transform:scale(1.15);opacity:1}}@media(max-width:520px){.sync-onboarding-backdrop{align-items:end;padding:10px}.sync-onboarding-dialog{padding:21px 18px 18px;border-radius:22px}.sync-onboarding-visual{width:54px;height:54px;border-radius:17px;margin-bottom:14px}.sync-onboarding-actions{grid-template-columns:1fr}.sync-onboarding-actions .primary-button{grid-row:1}.sync-onboarding-actions .ghost-button{grid-row:2}}@media(prefers-reduced-motion:reduce){.sync-onboarding-dialog,.sync-onboarding-visual>i,.is-spinning{animation:none!important}}.auth-gate-card{animation:auth-card-enter .58s cubic-bezier(.22,.9,.34,1) both}.auth-gate-visual{animation:auth-visual-enter .72s cubic-bezier(.22,.9,.34,1) both}.auth-gate-content{animation:auth-content-enter .72s .08s cubic-bezier(.22,.9,.34,1) both}.auth-gate-visual:after{display:none}.auth-gate-visual-shade{position:absolute;inset:0;background:linear-gradient(180deg,#0c182e05 38%,#0c182e6b),linear-gradient(90deg,transparent 48%,rgba(255,255,255,.08));pointer-events:none}.auth-gate-visual-badge{position:absolute;z-index:2;left:30px;bottom:28px;display:inline-flex;align-items:center;min-height:32px;padding:7px 12px;border:1px solid rgba(255,255,255,.34);border-radius:999px;background:#0c182e47;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;font-size:.72rem;font-weight:900;letter-spacing:.16em;box-shadow:0 12px 30px #0611242e}.auth-gate-brand{margin-bottom:34px}.auth-gate-brand>div{display:flex;min-width:0;flex-direction:column}.auth-gate-brand>div>strong{order:1;margin:0;color:var(--text-strong);font-size:1.28rem;letter-spacing:-.025em}.auth-gate-brand>div>span{order:2;margin-top:2px;color:var(--text-muted);font-size:.72rem;font-weight:650;letter-spacing:0;text-transform:none}.auth-gate-heading h1{font-size:clamp(2.2rem,4vw,3.15rem);line-height:1.02;letter-spacing:-.055em}.auth-gate-heading p{max-width:390px;margin-top:13px;font-size:.94rem;line-height:1.55}.google-login-button{position:relative;overflow:hidden;margin-top:26px;min-height:58px;border-color:color-mix(in srgb,var(--border-strong) 70%,#5b77ee 30%);border-radius:17px;background:color-mix(in srgb,var(--surface-solid) 96%,#eef3ff 4%);box-shadow:0 16px 38px #3046701f,inset 0 1px #ffffffe6}.google-login-button:before{position:absolute;top:0;bottom:0;left:-38%;width:28%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);transform:skew(-18deg);content:"";opacity:0}.google-login-button:hover:not(:disabled):before{animation:auth-button-sheen .75s ease}.google-login-button:hover:not(:disabled){transform:translateY(-2px);border-color:color-mix(in srgb,#5b77ee 54%,var(--border-strong));box-shadow:0 20px 42px #3046702b,inset 0 1px #ffffffeb}.auth-gate-note{margin-top:14px;color:var(--text-muted);font-size:.72rem}@keyframes auth-card-enter{0%{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes auth-visual-enter{0%{opacity:0;transform:translate(-28px) scale(1.025)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes auth-content-enter{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}@keyframes auth-button-sheen{0%{left:-38%;opacity:0}28%{opacity:.72}to{left:118%;opacity:0}}@media(max-width:720px){.chart-plot{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 28%,transparent) transparent}.chart-bars,.chart-grid-lines{min-width:max(100%,calc(var(--data-count, 6) * 76px))}.chart-bars{gap:8px}.chart-column{min-width:68px;grid-template-rows:minmax(0,1fr) 48px;scroll-snap-align:center}.chart-label{overflow:visible;gap:2px;padding-inline:1px}.chart-label b,.chart-label small{overflow:visible;text-overflow:clip;white-space:nowrap}.chart-label b{font-size:.73rem}.chart-label small{font-size:.68rem;font-weight:800;letter-spacing:-.01em}.chart-bar{width:min(44px,72%)}}@media(max-width:480px){.auth-gate-page{padding:0;place-items:stretch}.auth-gate-card{width:100%;margin:0;border:0;border-radius:0;box-shadow:none;background:color-mix(in srgb,var(--surface-solid) 97%,transparent)}.auth-gate-visual,.auth-gate-visual img{min-height:206px;height:206px}.auth-gate-visual img{object-position:center 47%}.auth-gate-visual-badge{left:18px;bottom:16px;min-height:28px;padding:6px 10px;font-size:.63rem}.auth-gate-content{padding:30px 24px 34px;justify-content:flex-start}.auth-gate-brand{margin-bottom:38px}.auth-gate-heading h1{font-size:clamp(2.45rem,12vw,3rem)}.auth-gate-heading p{max-width:320px;margin-top:12px;font-size:.92rem}.google-login-button{margin-top:28px;min-height:58px}.auth-gate-copyright{padding-bottom:20px}}@media(prefers-reduced-motion:reduce){.auth-gate-card,.auth-gate-visual,.auth-gate-content,.google-login-button:before{animation:none!important}}.auth-gate-page .rainfall-effect{opacity:.36}.auth-gate-brand{gap:10px;margin-bottom:24px}.auth-gate-logo{width:44px;height:44px;border-radius:14px}.auth-gate-brand>div>strong{font-size:1.16rem}.auth-gate-brand>div>span{margin-top:1px;font-size:.68rem}.google-login-button{grid-template-columns:auto 1fr;min-height:56px;border-color:color-mix(in srgb,var(--border-strong) 74%,transparent);box-shadow:0 12px 28px #3046701a,inset 0 1px #ffffffc7}.google-login-button:hover:not(:disabled){border-color:color-mix(in srgb,var(--border-strong) 78%,#5b77ee 22%)}@media(max-width:480px){.auth-gate-page{min-height:100dvh;height:100dvh;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;padding:0}.auth-gate-page .rainfall-effect{opacity:.18}.auth-gate-card{display:flex;flex:1 1 auto;flex-direction:column;width:100%;min-height:0;margin:0;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}.auth-gate-visual{position:relative;z-index:1;flex:0 0 238px;min-height:238px;height:238px;overflow:hidden}.auth-gate-visual img{width:100%;min-height:238px;height:238px;object-position:center 47%}.auth-gate-visual-shade{background:linear-gradient(180deg,#08122305 28%,#0812232e 60%,#0e1522e0),linear-gradient(90deg,transparent 54%,rgba(255,255,255,.04))}:root:not([data-theme=dark]) .auth-gate-visual-shade{background:linear-gradient(180deg,#fff0 28%,#fafafc14 58%,#f8f9fcf0)}.auth-gate-visual-badge{left:18px;bottom:54px;min-height:26px;padding:5px 9px;font-size:.6rem;letter-spacing:.12em}.auth-gate-content{position:relative;z-index:3;flex:1 1 auto;justify-content:flex-start;min-height:0;margin-top:-64px;padding:24px 22px 20px;border-radius:28px 28px 0 0;background:color-mix(in srgb,var(--surface-solid) 96%,transparent);box-shadow:0 -18px 42px #0d182b1a;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}:root[data-theme=dark] .auth-gate-content{background:color-mix(in srgb,#101827 94%,transparent);box-shadow:0 -18px 42px #0000003d}.auth-gate-brand{margin-bottom:20px}.auth-gate-logo{width:40px;height:40px;border-radius:13px}.auth-gate-brand>div>strong{font-size:1.08rem}.auth-gate-brand>div>span{font-size:.64rem}.auth-gate-heading h1{font-size:clamp(2.625rem,11.5vw,3rem);line-height:1.02;letter-spacing:-.052em}.auth-gate-heading p{max-width:310px;margin-top:10px;font-size:.88rem;line-height:1.5}.google-login-button{width:100%;margin-top:22px;min-height:56px;gap:11px;padding:9px 14px;border-color:color-mix(in srgb,var(--border-strong) 64%,transparent);border-radius:16px}.google-login-mark{width:32px;height:32px}.auth-gate-error.compact{margin-top:10px}.auth-gate-copyright{position:relative;z-index:4;flex:0 0 auto;bottom:auto;width:100%;margin:0;padding:8px 16px calc(10px + env(safe-area-inset-bottom));text-align:center;font-size:.68rem}}@media(max-width:480px)and (max-height:760px){.auth-gate-visual,.auth-gate-visual img{flex-basis:220px;min-height:220px;height:220px}.auth-gate-content{margin-top:-72px;padding-top:20px}.auth-gate-brand{margin-bottom:16px}.auth-gate-heading h1{font-size:2.55rem}.auth-gate-heading p{font-size:.84rem}.google-login-button{margin-top:18px;min-height:54px}.auth-gate-copyright{padding-top:5px;padding-bottom:calc(7px + env(safe-area-inset-bottom))}}.quick-meter-entry{display:grid;gap:7px;margin:12px 0 14px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent-soft) 68%,transparent),transparent 62%),var(--surface-subtle);box-shadow:inset 0 1px #ffffff2e}.quick-meter-entry>label{color:var(--text-secondary);font-size:.84rem;font-weight:760}.quick-meter-entry input{min-height:46px;font-size:.96rem}.quick-meter-feedback{min-height:18px;color:var(--text-muted);font-size:.76rem;line-height:1.35}.quick-meter-feedback.has-values{color:var(--accent);font-weight:720}:root[data-theme=light] .quick-meter-entry{background:radial-gradient(circle at 8% 10%,rgba(116,85,255,.1),transparent 34%),linear-gradient(135deg,#faf7fffa,#f6fcfff5);box-shadow:0 10px 26px #5649a414,inset 0 1px #ffffffd9}@media(max-width:640px){.quick-meter-entry{margin:10px 0 12px;padding:10px 11px;border-radius:14px}.quick-meter-entry input{min-height:44px;font-size:16px}.quick-meter-feedback{font-size:.75rem}}.auth-gate-stage{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .24s ease}.auth-gate-stage img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.94) brightness(.76);transform:scale(1.03)}.auth-gate-stage-shade{position:absolute;inset:0;background:linear-gradient(180deg,#070e1a2e,#070e1aad),radial-gradient(circle at 50% 42%,transparent 0 28%,rgba(6,13,24,.32) 72%)}.auth-gate-dismissed .auth-gate-stage{opacity:1}.auth-gate-close{position:absolute;z-index:12;top:14px;right:14px;display:grid;width:38px;height:38px;place-items:center;border:1px solid color-mix(in srgb,var(--border-strong) 62%,transparent);border-radius:50%;background:color-mix(in srgb,var(--surface-solid) 88%,transparent);box-shadow:0 8px 22px #0d182b24;color:var(--text-secondary);cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:transform .14s ease,background .16s ease,color .16s ease}.auth-gate-close:hover{transform:scale(1.05);color:var(--text-strong)}.auth-gate-close:active{transform:scale(.97)}.auth-gate-reopen{position:relative;z-index:6;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:min(520px,calc(100% - 32px));padding:14px 16px;border:1px solid rgba(255,255,255,.26);border-radius:20px;background:#0e1828b3;box-shadow:0 24px 64px #00000047,inset 0 1px #ffffff14;color:#fff;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:auth-card-enter .3s ease both}.auth-gate-reopen>div{min-width:0}.auth-gate-reopen strong,.auth-gate-reopen span{display:block}.auth-gate-reopen strong{font-size:1rem}.auth-gate-reopen span{margin-top:2px;color:#ffffffad;font-size:.76rem}.auth-gate-reopen button{min-height:42px;padding:0 16px;border:0;border-radius:13px;background:linear-gradient(135deg,#6c79ff,#8b61ef);color:#fff;font:inherit;font-weight:850;cursor:pointer;box-shadow:0 10px 26px #665fee57}@media(min-width:821px){.auth-gate-card{width:min(940px,100%);min-height:520px;grid-template-columns:minmax(0,1fr) minmax(350px,.88fr)}.auth-gate-visual img{min-height:520px}.auth-gate-content{padding:clamp(30px,4vw,46px)}.auth-gate-brand{margin-bottom:24px}.auth-gate-heading h1{font-size:clamp(2rem,3.4vw,2.65rem)}.auth-gate-heading p{margin-top:10px}.google-login-button{margin-top:20px}}@media(max-width:480px){.auth-gate-page{min-height:100dvh;height:100dvh;display:grid;grid-template-rows:1fr auto;place-items:start center;overflow:hidden;padding:0}.auth-gate-card{align-self:start;display:flex;flex-direction:column;width:100%;min-height:0;margin:0;overflow:visible;border:0;border-radius:0;background:transparent;box-shadow:none}.auth-gate-close{position:fixed;top:calc(12px + env(safe-area-inset-top));right:12px;width:36px;height:36px;border-color:#ffffff40;background:#0912208c;color:#fff;box-shadow:0 10px 24px #00000038}.auth-gate-visual,.auth-gate-visual img{flex:0 0 190px;min-height:190px;height:190px}.auth-gate-visual img{object-position:center 45%}.auth-gate-visual-badge{left:16px;bottom:42px;min-height:24px;padding:4px 8px;font-size:.56rem}.auth-gate-content{position:relative;z-index:3;flex:0 0 auto;min-height:0;width:calc(100% - 20px);margin:-42px auto 0;padding:18px 18px 20px;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:24px;background:color-mix(in srgb,var(--surface-solid) 97%,transparent);box-shadow:0 20px 44px #0d182b24,inset 0 1px #ffffffb3;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}:root[data-theme=dark] .auth-gate-content{background:color-mix(in srgb,#101827 96%,transparent);box-shadow:0 20px 44px #00000047,inset 0 1px #ffffff0a}.auth-gate-brand{gap:9px;margin-bottom:14px}.auth-gate-logo{width:36px;height:36px;border-radius:12px}.auth-gate-logo svg{width:18px;height:18px}.auth-gate-brand>div>strong{font-size:1rem}.auth-gate-brand>div>span{font-size:.6rem;letter-spacing:.04em}.auth-gate-heading h1{font-size:2rem;line-height:1;letter-spacing:-.045em}.auth-gate-heading p{max-width:none;margin-top:7px;font-size:.8rem;line-height:1.4}.google-login-button{min-height:50px;margin-top:16px;padding:7px 12px;border-radius:15px;font-size:.92rem}.google-login-mark{width:30px;height:30px}.auth-gate-error,.auth-gate-error.compact{padding:9px 10px;font-size:.78rem}.auth-gate-copyright{position:relative;z-index:5;align-self:end;width:100%;margin:0;padding:8px 16px calc(10px + env(safe-area-inset-bottom));text-align:center;font-size:.66rem}.auth-gate-dismissed{grid-template-rows:1fr auto;place-items:center}.auth-gate-dismissed .auth-gate-copyright{align-self:end}.auth-gate-reopen{align-self:center;grid-template-columns:auto 1fr;width:calc(100% - 28px);padding:12px 13px}.auth-gate-reopen button{grid-column:1 / -1;width:100%;min-height:44px;margin-top:2px}}@media(max-width:480px)and (max-height:720px){.auth-gate-visual,.auth-gate-visual img{flex-basis:168px;min-height:168px;height:168px}.auth-gate-content{margin-top:-36px;padding:16px 16px 17px}.auth-gate-brand{margin-bottom:11px}.auth-gate-heading h1{font-size:1.85rem}.google-login-button{min-height:48px;margin-top:13px}}.guest-warning-backdrop{position:fixed;z-index:100500;inset:0;display:grid;place-items:center;padding:18px;background:#060d1994;-webkit-backdrop-filter:blur(12px) saturate(1.06);backdrop-filter:blur(12px) saturate(1.06)}.guest-warning-dialog{width:min(480px,100%);padding:22px;border:1px solid color-mix(in srgb,var(--border-strong) 72%,transparent);border-radius:24px;background:color-mix(in srgb,var(--surface-solid) 97%,transparent);box-shadow:0 28px 82px #03091657,inset 0 1px #ffffff80;color:var(--text);animation:guest-warning-in .24s cubic-bezier(.2,.88,.24,1) both}:root[data-theme=dark] .guest-warning-dialog{background:color-mix(in srgb,#111a2a 97%,transparent);box-shadow:0 30px 88px #0000007a,inset 0 1px #ffffff0d}.guest-warning-icon{display:grid;width:46px;height:46px;place-items:center;margin-bottom:15px;border-radius:15px;background:color-mix(in srgb,#f59e0b 14%,var(--surface-solid));color:#d97706;box-shadow:inset 0 0 0 1px color-mix(in srgb,#f59e0b 28%,transparent)}.guest-warning-copy h2{margin:0;color:var(--text-strong);font-size:1.35rem;line-height:1.16;letter-spacing:-.025em}.guest-warning-copy p{margin:10px 0 0;color:var(--text-secondary);font-size:.9rem;line-height:1.58}.guest-warning-copy strong{display:block;margin-top:12px;color:var(--text-strong);font-size:.84rem;line-height:1.48}.guest-warning-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.guest-warning-actions .ghost-button,.guest-warning-actions .primary-button{min-height:44px}@keyframes guest-warning-in{0%{opacity:0;transform:translateY(12px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}.google-login-button{border:1.5px solid transparent!important;background:linear-gradient(var(--surface-solid),var(--surface-solid)) padding-box,linear-gradient(135deg,#7594fff2,#bc8bffe6,#4ccbfff2,#7594fff2) border-box!important;box-shadow:0 0 18px #6b79ff26,inset 0 0 0 1px #ffffff2e!important}:root[data-theme=dark] .google-login-button{background:linear-gradient(#111b2b,#111b2b) padding-box,linear-gradient(135deg,#89a4fff2,#c492ffeb,#5bd3ffeb,#89a4fff2) border-box!important;box-shadow:0 0 20px #7180ff33,inset 0 0 0 1px #ffffff06!important}.google-login-button:hover:not(:disabled){border-color:transparent!important;box-shadow:0 0 24px #6b79ff3d,inset 0 0 0 1px #ffffff38!important}@media(max-width:480px){.auth-gate-page{min-height:100dvh;height:100dvh;display:grid;grid-template-rows:minmax(0,1fr) auto;place-items:center;overflow:hidden;padding:max(12px,env(safe-area-inset-top)) 12px 0}.auth-gate-card{align-self:center;display:flex;flex:0 1 auto;flex-direction:column;width:min(420px,100%);max-height:calc(100dvh - 72px - env(safe-area-inset-top) - env(safe-area-inset-bottom));margin:0;overflow:hidden;border:1px solid color-mix(in srgb,var(--border-strong) 58%,transparent);border-radius:28px;background:color-mix(in srgb,var(--surface-solid) 98%,transparent);box-shadow:0 24px 64px #0d182b2e,inset 0 1px #ffffff9e}:root[data-theme=dark] .auth-gate-card{background:color-mix(in srgb,#101827 97%,transparent);box-shadow:0 26px 68px #00000061,inset 0 1px #ffffff0a}.auth-gate-close{position:absolute;top:11px;right:11px;width:34px;height:34px;border-color:#ffffff4d;background:#0912208a;color:#fff;box-shadow:0 8px 20px #00000038}.auth-gate-visual,.auth-gate-visual img{flex:0 0 164px;min-height:164px;height:164px}.auth-gate-visual img{object-position:center 44%}.auth-gate-visual-badge{left:15px;bottom:24px;min-height:22px;padding:4px 8px;font-size:.54rem}.auth-gate-content{position:relative;z-index:3;flex:0 0 auto;width:100%;margin:0;padding:19px 18px 20px;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}:root[data-theme=dark] .auth-gate-content{background:transparent;box-shadow:none}.auth-gate-brand{gap:9px;margin-bottom:15px}.auth-gate-logo{width:36px;height:36px;border-radius:12px}.auth-gate-heading h1{font-size:clamp(1.9rem,9vw,2.25rem);line-height:1.03}.auth-gate-heading p{margin-top:7px;font-size:.8rem;line-height:1.4}.google-login-button{min-height:50px;margin-top:15px;padding:7px 12px;border-radius:15px;font-size:.92rem}.auth-gate-copyright{position:relative;align-self:end;width:100%;padding:7px 16px calc(9px + env(safe-area-inset-bottom));text-align:center;font-size:.66rem}.guest-warning-backdrop{padding:14px}.guest-warning-dialog{padding:19px;border-radius:21px}.guest-warning-copy h2{font-size:1.22rem}.guest-warning-copy p{font-size:.84rem}.guest-warning-actions{display:grid;grid-template-columns:1fr}.guest-warning-actions .primary-button{order:-1;width:100%}.guest-warning-actions .ghost-button{width:100%}}@media(max-width:480px)and (max-height:700px){.auth-gate-visual,.auth-gate-visual img{flex-basis:142px;min-height:142px;height:142px}.auth-gate-content{padding:15px 16px 16px}.auth-gate-brand{margin-bottom:11px}.auth-gate-heading h1{font-size:1.82rem}.google-login-button{min-height:47px;margin-top:12px}}@media(prefers-reduced-motion:reduce){.guest-warning-dialog{animation:none!important}}.resident-tools{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:6px;overflow-x:auto;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:18px;background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:0 10px 28px #2c365c14,inset 0 1px #ffffffa6;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);scrollbar-width:none}.resident-tools::-webkit-scrollbar{display:none}.resident-tool{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:0 13px;border:1px solid transparent;border-radius:13px;color:var(--text-secondary);background:transparent;font:inherit;font-size:.83rem;font-weight:780;cursor:pointer;transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease}.resident-tool.emergency{color:#c63f51;background:#f45b6e14}.resident-tool.fire{color:#d75b22;background:#ff804217}.resident-tool.saving{color:#8a6a00;background:#ffcb391f}.resident-tool.rules{color:#6048d6;background:#705bf114}.resident-tool.building{color:#1577b9;background:#39ade81a}:root[data-theme=dark] .resident-tool.emergency{color:#ff8997;background:#ff697d1a}:root[data-theme=dark] .resident-tool.fire{color:#ff9a69;background:#ff82461a}:root[data-theme=dark] .resident-tool.saving{color:#ffd76d;background:#ffd04a1a}:root[data-theme=dark] .resident-tool.rules{color:#a99cff;background:#8e7cff1a}:root[data-theme=dark] .resident-tool.building{color:#82d2ff;background:#47b1ec1f}@media(hover:hover){.resident-tool:hover{transform:translateY(-1px);border-color:currentColor;box-shadow:0 7px 17px color-mix(in srgb,currentColor 14%,transparent)}}.resident-tool:active{transform:translateY(1px) scale(.99)}.resident-tool:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 25%,transparent);outline-offset:2px}.info-hub-backdrop{position:fixed;inset:0;z-index:100020;display:grid;place-items:center;padding:22px;background:#080d1b94;-webkit-backdrop-filter:blur(12px) saturate(.9);backdrop-filter:blur(12px) saturate(.9);animation:info-hub-backdrop-in .16s ease-out}.info-hub-dialog{width:min(760px,100%);max-height:min(86vh,820px);overflow:hidden;border:1px solid color-mix(in srgb,var(--border) 92%,transparent);border-radius:26px;color:var(--text-primary);background:radial-gradient(circle at 95% 0%,var(--info-hub-glow, rgba(117, 92, 255, .12)),transparent 16rem),var(--surface);box-shadow:0 28px 80px #0a112347,inset 0 1px #ffffffb8;animation:info-hub-dialog-in .22s cubic-bezier(.2,.8,.2,1)}:root[data-theme=dark] .info-hub-dialog{box-shadow:0 32px 90px #00000080,inset 0 1px #ffffff12}.info-hub-dialog.tone-danger{--info-hub-glow: rgba(245, 76, 99, .17)}.info-hub-dialog.tone-fire{--info-hub-glow: rgba(255, 123, 54, .18)}.info-hub-dialog.tone-saving{--info-hub-glow: rgba(255, 196, 47, .18)}.info-hub-dialog.tone-rules{--info-hub-glow: rgba(111, 91, 239, .17)}.info-hub-dialog.tone-building{--info-hub-glow: rgba(45, 159, 232, .17)}.info-hub-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px 16px;border-bottom:1px solid color-mix(in srgb,var(--border) 78%,transparent)}.info-hub-title-wrap{display:flex;align-items:center;gap:12px;min-width:0}.info-hub-icon{display:grid;flex:0 0 auto;width:44px;height:44px;place-items:center;border-radius:14px;color:var(--accent);background:color-mix(in srgb,var(--accent) 11%,var(--surface));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 16%,transparent)}.tone-danger .info-hub-icon{color:#e44c61;background:#f452681a}.tone-fire .info-hub-icon{color:#ed6a2d;background:#ff7e3f1c}.tone-saving .info-hub-icon{color:#b98700;background:#ffc62e24}.tone-building .info-hub-icon{color:#167ec5;background:#38aff021}.info-hub-title-wrap h2{margin:0;color:var(--text-strong);font-size:1.16rem;line-height:1.25}.info-hub-title-wrap p{margin:3px 0 0;color:var(--text-muted);font-size:.82rem;line-height:1.4}.info-hub-body{max-height:calc(min(86vh,820px) - 82px);padding:18px 22px 24px;overflow-y:auto;overscroll-behavior:contain}.emergency-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.contact-card{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;padding:14px;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);border-radius:17px;background:color-mix(in srgb,var(--surface-muted) 72%,transparent)}.contact-card.primary-contact{background:color-mix(in srgb,#7a64f5 7%,var(--surface))}.contact-card>div{min-width:0}.contact-card span,.contact-card small{display:block;color:var(--text-muted)}.contact-card span{margin-bottom:3px;font-size:.76rem;font-weight:760}.contact-card strong{display:block;margin-bottom:3px;color:var(--text-strong);font-size:1.08rem}.contact-card small{font-size:.72rem;line-height:1.45}.contact-card small svg{margin-right:3px;vertical-align:-2px}.call-button{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:0 11px;border-radius:12px;color:#fff;background:linear-gradient(135deg,#6f5cf4,#8b71ff);box-shadow:0 8px 20px #644ded33;text-decoration:none;font-size:.78rem;font-weight:800}.emergency-numbers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}.emergency-numbers a{display:flex;align-items:center;gap:9px;min-width:0;padding:12px;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);border-radius:15px;color:inherit;background:var(--surface-muted);text-decoration:none}.emergency-numbers b{color:#e3485d;font-size:1.05rem}.emergency-numbers span{min-width:0;color:var(--text-secondary);font-size:.72rem;line-height:1.35}.info-note,.safety-callout,.rules-intro{display:flex;align-items:flex-start;gap:9px;margin-top:12px;padding:12px 13px;border-radius:14px;color:var(--text-secondary);font-size:.78rem;line-height:1.55}.info-note>svg,.safety-callout>svg,.rules-intro>svg{flex:0 0 auto;margin-top:2px}.danger-note{color:#9c3947;background:#eb496017}:root[data-theme=dark] .danger-note{color:#ff9eab}.safety-callout{margin-top:0;color:#a44924;background:#ff7a361c}:root[data-theme=dark] .safety-callout{color:#ffb28f}.safety-callout div{display:grid;gap:2px}.safety-callout strong{color:inherit}.safety-callout span{color:var(--text-secondary)}.guide-section{margin-top:16px}.guide-section h3,.extinguisher-grid h3,.saving-columns h3,.saving-card h3{margin:0 0 8px;color:var(--text-strong);font-size:.9rem}.guide-list{margin:0;padding-left:1.25rem;color:var(--text-secondary);font-size:.8rem;line-height:1.58}.guide-list li+li{margin-top:6px}.guide-list.compact{font-size:.77rem}.guide-list.bullets{padding-left:1.15rem}.extinguisher-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.extinguisher-grid article{padding:14px;border:1px solid color-mix(in srgb,#ef7135 20%,var(--border));border-radius:16px;background:color-mix(in srgb,#ff9a55 5%,var(--surface-muted))}.extinguisher-grid small{display:block;margin-top:10px;color:var(--text-muted);font-size:.68rem;line-height:1.45}.info-source-note{margin:16px 0 0;color:var(--text-muted);font-size:.68rem;line-height:1.5}.visual-grid{display:grid;gap:12px;margin-top:12px}.visual-grid.two-up{grid-template-columns:repeat(2,minmax(0,1fr))}.info-visual-card{overflow:hidden;margin:0;border:1px solid color-mix(in srgb,var(--border) 82%,transparent);border-radius:18px;background:var(--surface-muted);box-shadow:0 10px 24px #18234012}.info-visual-card.large-visual{margin-top:2px}.info-visual-card img{display:block;width:100%;height:auto;aspect-ratio:16 / 10;object-fit:cover;background:color-mix(in srgb,var(--surface) 86%,#eef2fb)}.info-visual-card.large-visual img{aspect-ratio:4 / 3;object-fit:contain}.info-visual-card figcaption{display:grid;gap:4px;padding:13px 14px 14px;color:var(--text-secondary);font-size:.77rem;line-height:1.5}.info-visual-card figcaption strong{color:var(--text-strong);font-size:.84rem}.resource-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.resource-link-grid a{display:flex;align-items:center;min-height:48px;padding:12px 13px;border:1px solid color-mix(in srgb,#32a7eb 18%,var(--border));border-radius:15px;color:var(--text-strong);background:color-mix(in srgb,#4bb6ef 7%,var(--surface-muted));text-decoration:none;font-size:.78rem;font-weight:750;line-height:1.45}.resource-link-grid a:hover{border-color:color-mix(in srgb,#32a7eb 48%,var(--border))}.building-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.building-point-card{padding:14px;border:1px solid color-mix(in srgb,#2d9fe8 18%,var(--border));border-radius:16px;background:color-mix(in srgb,#4db6ee 6%,var(--surface-muted))}.building-point-card h3{margin:0 0 8px;color:var(--text-strong);font-size:.9rem}.house-rules-list.compact-top{margin-top:0}.saving-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.saving-card{display:flex;align-items:center;gap:10px;padding:13px;border-radius:16px}.saving-card>svg{flex:0 0 auto}.saving-card h3{margin:0 0 2px}.saving-card p{margin:0;color:var(--text-muted);font-size:.72rem;line-height:1.4}.electric-saving{color:#c48a00;background:#ffca381f}.water-saving{color:#1599c5;background:#38bbe81c}.saving-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}.saving-note{color:#806300;background:#ffcd3a21}:root[data-theme=dark] .saving-note{color:#ffe08a}.rules-intro{margin-top:0;color:#6555ce;background:#705bf117}.house-rules-list{display:grid;gap:8px;margin:14px 0 0;padding-left:1.45rem;color:var(--text-secondary);font-size:.82rem;line-height:1.55}.house-rules-list li{padding-left:3px}.house-rules-list li::marker{color:var(--accent);font-weight:800}.rules-closing{display:grid;gap:6px;margin-top:16px;padding:14px;border-radius:15px;color:var(--text-secondary);background:var(--surface-muted);font-size:.78rem;line-height:1.5}.rules-closing strong{color:var(--text-strong)}.rules-closing a{color:var(--accent);font-weight:800;text-decoration:none}@keyframes info-hub-backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes info-hub-dialog-in{0%{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-width:720px){.resident-tools{position:relative;z-index:5;margin:-2px 0 10px;padding:5px;gap:5px;border-radius:15px}.resident-tool{min-height:38px;padding:0 10px;font-size:.76rem;border-radius:11px}.resident-tool svg{width:15px;height:15px}.info-hub-backdrop{align-items:end;padding:0}.info-hub-dialog{width:100%;max-height:min(88dvh,820px);border-radius:26px 26px 0 0;animation-name:info-hub-sheet-in}.info-hub-header{padding:16px 16px 13px}.info-hub-icon{width:40px;height:40px;border-radius:13px}.info-hub-title-wrap h2{font-size:1.05rem}.info-hub-title-wrap p{font-size:.74rem}.info-hub-body{max-height:calc(min(88dvh,820px) - 70px);padding:14px 16px calc(22px + env(safe-area-inset-bottom))}.emergency-grid,.extinguisher-grid,.saving-columns,.building-grid,.visual-grid.two-up,.resource-link-grid,.emergency-numbers{grid-template-columns:1fr}.emergency-numbers a{min-height:50px}.saving-grid{gap:7px}.saving-card{padding:11px}}@keyframes info-hub-sheet-in{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@media(max-width:390px){.resident-tool{padding-inline:9px}.resident-tool span{white-space:nowrap}.saving-grid{grid-template-columns:1fr}.contact-card{align-items:flex-start}}@media(prefers-reduced-motion:reduce){.info-hub-backdrop,.info-hub-dialog{animation:none!important}.resident-tool{transition:none!important}}.zoomable-app-image{cursor:zoom-in;transition:filter .16s ease,transform .16s ease,box-shadow .16s ease;-webkit-tap-highlight-color:transparent}.zoomable-app-image:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset:4px;border-radius:inherit}@media(hover:hover)and (pointer:fine){.zoomable-app-image:hover{filter:brightness(1.025) saturate(1.03)}}.image-lightbox-backdrop{position:fixed;inset:0;z-index:100080;display:grid;place-items:center;padding:18px;background:#050812e0;-webkit-backdrop-filter:blur(14px) saturate(.9);backdrop-filter:blur(14px) saturate(.9);animation:image-lightbox-in .16s ease-out}.image-lightbox{display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(1180px,100%);height:min(92dvh,900px);overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:#0d1320;box-shadow:0 36px 110px #00000094,inset 0 1px #ffffff14}.image-lightbox-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:0;padding:13px 14px 13px 18px;border-bottom:1px solid rgba(255,255,255,.09);color:#f7f9ff;background:#0d1320f0}.image-lightbox-title{display:grid;min-width:0;gap:2px}.image-lightbox-title strong{overflow:hidden;color:#fff;font-size:.9rem;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.image-lightbox-title span{color:#e4eaf8ab;font-size:.68rem;line-height:1.4}.image-lightbox-close{display:grid;flex:0 0 auto;width:42px;height:42px;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:13px;color:#fff;background:#ffffff0f;cursor:pointer}.image-lightbox-stage{position:relative;display:grid;min-width:0;min-height:0;place-items:center;overflow:hidden;padding:18px;contain:layout paint;background:radial-gradient(circle at 50% 45%,rgba(80,106,165,.16),transparent 48%),#080d17;cursor:zoom-in;touch-action:none;-webkit-user-select:none;user-select:none;isolation:isolate}.image-lightbox-stage.is-zoomed{cursor:grab}.image-lightbox-stage.is-zoomed:active{cursor:grabbing}.image-lightbox-image{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;object-position:center center;transform-origin:center center;transition:transform .14s ease-out;will-change:transform;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.image-lightbox-stage.is-zoomed .image-lightbox-image{transition:none}.image-lightbox-toolbar{display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(255,255,255,.09);background:#0d1320f5}.image-lightbox-toolbar button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:42px;min-height:40px;padding:0 12px;border:1px solid rgba(255,255,255,.13);border-radius:12px;color:#f8f9ff;background:#fff1;font:inherit;font-size:.84rem;font-weight:760;cursor:pointer}.image-lightbox-toolbar button:disabled{opacity:.36;cursor:default}.image-lightbox-toolbar>span{min-width:60px;color:#eff3ffd1;text-align:center;font-size:.77rem;font-variant-numeric:tabular-nums;font-weight:800}.image-lightbox-toolbar .image-lightbox-reset{min-width:124px}@keyframes image-lightbox-in{0%{opacity:0}to{opacity:1}}@media(max-width:720px){.image-lightbox-backdrop{padding:0}.image-lightbox{width:100%;height:100dvh;border:0;border-radius:0}.image-lightbox-header{padding:calc(10px + env(safe-area-inset-top)) 12px 10px 14px}.image-lightbox-title strong{font-size:.82rem}.image-lightbox-title span{font-size:.63rem}.image-lightbox-close{width:40px;height:40px;border-radius:12px}.image-lightbox-stage{padding:8px}.image-lightbox-toolbar{gap:7px;padding-inline:10px}.image-lightbox-toolbar button{min-width:40px;padding-inline:10px}.image-lightbox-toolbar .image-lightbox-reset{min-width:112px;font-size:.75rem}.image-lightbox-toolbar>span{min-width:52px}}@media(max-width:390px){.image-lightbox-title span{display:none}.image-lightbox-toolbar .image-lightbox-reset{min-width:44px;width:44px;padding:0;font-size:0}.image-lightbox-toolbar .image-lightbox-reset svg{margin:0}}@media(prefers-reduced-motion:reduce){.image-lightbox-backdrop{animation:none!important}.image-lightbox-image,.zoomable-app-image{transition:none!important}}@media(max-width:960px){.app-shell{padding-bottom:calc(10px + env(safe-area-inset-bottom))}}@media(max-width:520px){.app-footer{min-height:24px;margin:0;padding:6px 10px calc(4px + env(safe-area-inset-bottom))}}@media(min-width:721px){.image-lightbox-stage.is-zoomed{cursor:grab}.image-lightbox-stage.is-zoomed:active{cursor:grabbing}.image-lightbox-stage.is-zoomed .image-lightbox-image{pointer-events:none}}.payment-check svg,.payment-status svg,.achievement-strip svg{display:block;flex:0 0 auto}@media(hover:hover)and (pointer:fine){.payment-field:hover,.history-item:hover,.history-item.save-slot:hover{transform:none}}.total-card{touch-action:pan-y}.total-month-nav{display:grid;grid-template-columns:34px minmax(0,1fr) 34px;align-items:center;gap:7px;min-height:34px;margin-top:2px}.total-month-nav>p{margin:0;color:var(--total-muted);font-size:.88rem;font-weight:700;text-align:center}.total-month-nav-slot{display:grid;width:34px;height:34px;place-items:center}.total-month-arrow{display:grid;width:32px;height:32px;place-items:center;padding:0;border:1px solid rgba(255,255,255,.16);border-radius:10px;background:#ffffff17;color:#fff;box-shadow:inset 0 1px #ffffff14;transition:background .15s ease,transform .12s ease}.total-month-arrow:active{transform:scale(.94)}@media(hover:hover)and (pointer:fine){.total-month-arrow:hover{background:#ffffff29}}.history-item.save-slot{grid-template-columns:minmax(0,1fr) auto auto;gap:11px;padding:10px 12px}.history-title-row{gap:6px}.history-main strong{margin-bottom:0}.history-usage{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.history-main .history-usage-chip{display:inline-flex;width:fit-content;align-items:center;gap:4px;overflow:visible;padding:4px 7px;border:1px solid var(--border);border-radius:9px;font-size:.75rem;font-weight:680;line-height:1;text-overflow:clip;white-space:nowrap}.history-usage-chip b{color:var(--text-strong);font-size:.8rem;font-variant-numeric:tabular-nums}.history-main .history-usage-chip.electric{border-color:color-mix(in srgb,var(--station-electric) 30%,var(--border));background:color-mix(in srgb,var(--station-electric) 9%,var(--surface-solid));color:color-mix(in srgb,var(--station-electric) 76%,var(--text-secondary))}.history-main .history-usage-chip.water{border-color:color-mix(in srgb,var(--station-aqua) 30%,var(--border));background:color-mix(in srgb,var(--station-aqua) 9%,var(--surface-solid));color:color-mix(in srgb,var(--station-aqua) 76%,var(--text-secondary))}.history-main .payment-status{display:inline-flex;margin-top:6px;padding:3px 7px;font-size:.7rem;line-height:1.2}.history-total{font-size:.96rem}.history-actions-desktop button{width:38px;height:38px;border-radius:10px}@media(max-width:720px){.history-item.save-slot{grid-template-columns:minmax(0,1fr) auto;gap:9px}.history-actions-mobile{grid-column:1 / -1}}.trend-panel,.trend-panel .chart-card{padding:16px}.chart-heading-title{align-items:flex-start}.chart-heading-title h2{margin:0;color:var(--text-strong);font-size:1rem;line-height:1.2}.chart-heading-title h2:before{display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--station-cyan);box-shadow:0 0 12px var(--station-cyan);content:"";vertical-align:2px}.chart-heading-title>svg{margin-top:1px}.chart-heading-title span{margin-top:4px;font-size:.72rem}.chart-axis-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 6px 58px;color:var(--text-muted);font-size:.67rem;font-weight:730}.chart-plot{display:grid;min-height:286px;grid-template-columns:58px minmax(0,1fr);padding:0;overflow:visible}.chart-y-axis{display:flex;height:286px;align-items:flex-end;flex-direction:column;justify-content:space-between;padding:10px 8px 44px 0;border-right:1px solid color-mix(in srgb,var(--border) 82%,transparent)}.chart-y-axis small{color:var(--text-muted);font-size:.64rem;font-weight:690;font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}.chart-viewport{min-width:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.chart-canvas{position:relative;min-width:max(100%,calc(var(--data-count, 6) * 58px));height:286px}.chart-canvas .chart-grid-lines{inset:10px 6px 44px;min-width:0}.chart-canvas .chart-grid-lines span{border-top-style:solid;opacity:.72}.chart-canvas .chart-bars{inset:10px 6px 0;min-width:0}.chart-line-overlay,.chart-line-points{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.chart-line-overlay{z-index:10}.chart-line-points{z-index:12}.chart-line-overlay polyline{fill:none;stroke:color-mix(in srgb,var(--accent) 78%,#fff 22%);stroke-linecap:round;stroke-linejoin:round;stroke-width:2.1;vector-effect:non-scaling-stroke;filter:drop-shadow(0 2px 4px color-mix(in srgb,var(--accent) 30%,transparent))}.chart-line-points i{position:absolute;width:9px;height:9px;transform:translate(-50%,-50%);border:2px solid var(--surface-solid);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 65%,transparent),0 3px 8px #141f3a33}.chart-line-points i.is-active{width:12px;height:12px;background:var(--station-cyan);box-shadow:0 0 0 2px color-mix(in srgb,var(--station-cyan) 28%,transparent),0 0 14px color-mix(in srgb,var(--station-cyan) 55%,transparent)}.chart-x-axis-title{margin:4px 0 0 58px;color:var(--text-muted);font-size:.66rem;font-weight:730;text-align:center}.chart-legend-footer{margin-left:58px}.achievement-strip{grid-template-columns:minmax(0,max-content)}@media(max-width:720px){.trend-panel,.trend-panel .chart-card{padding:13px 10px 11px}.chart-plot{min-height:270px;grid-template-columns:52px minmax(0,1fr);overflow:visible}.chart-y-axis,.chart-canvas{height:270px}.chart-axis-caption,.chart-x-axis-title,.chart-legend-footer{margin-left:52px}.chart-canvas{min-width:max(100%,calc(var(--data-count, 6) * 62px))}}@media(max-width:420px){.chart-heading-title span{font-size:.66rem}.chart-axis-caption{align-items:flex-start;flex-direction:column;gap:2px}.chart-legend-footer{gap:6px 10px}}@media(max-width:520px){.total-month-nav{margin-top:4px}.history-item.save-slot{grid-template-columns:minmax(0,1fr) auto;align-items:start;padding:10px}.history-title-row{align-items:flex-start;gap:5px}.history-total{grid-column:2;grid-row:1;padding-top:1px;font-size:.9rem}.history-actions-mobile{grid-column:1 / -1}}
