:root{font-family:"Noto Sans Thai",Tahoma,system-ui,sans-serif;color:#173329;background:#f4f7f5;line-height:1.6;font-synthesis:none;color-scheme:light}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}main{max-width:1120px;margin:auto;padding:40px 28px}h1,h2,p{margin:0}h1{font-size:clamp(28px,4vw,40px);letter-spacing:-.025em}h2{font-size:20px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.15em;color:#29764e;margin-bottom:6px}.muted{color:#63796e;font-size:14px}.page-header,.section-heading,.toolbar-actions,.date-toolbar,.date-input-row,.form-actions{display:flex;align-items:center;gap:12px}.page-header{justify-content:space-between;margin-bottom:28px}.section-heading{justify-content:space-between;margin-bottom:18px}.section-heading h2{line-height:1.5}
:root{font-family:"Noto Sans Thai",Tahoma,system-ui,sans-serif;color:#173329;background:#f4f7f5;line-height:1.6;font-synthesis:none;color-scheme:light}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}main{max-width:1120px;margin:auto;padding:40px 28px}h1,h2,p{margin:0}h1{font-size:clamp(28px,4vw,40px);letter-spacing:-.025em}h2{font-size:20px}.dashboard-title{font-size:20px;font-weight:800;color:#29764e;margin:4px 0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.15em;color:#29764e;margin-bottom:6px}.muted{color:#63796e;font-size:14px}.page-header,.section-heading,.toolbar-actions,.date-toolbar,.date-input-row,.form-actions{display:flex;align-items:center;gap:12px}.page-header{justify-content:space-between;margin-bottom:28px}.section-heading{justify-content:space-between;margin-bottom:18px}.section-heading h2{line-height:1.5}
button,input{font:inherit}button{min-height:48px;border:1px solid transparent;border-radius:12px;padding:11px 18px;cursor:pointer;font-weight:700;white-space:nowrap}button:disabled{opacity:.55;cursor:wait}button:focus-visible,input:focus-visible{outline:3px solid #df9b20;outline-offset:3px}.primary{background:#176240;color:#fff;box-shadow:0 3px 8px #164e2515}.primary:hover{background:#104f33}.secondary{background:#e2f3e8;border-color:#97c7ab;color:#145c38}.quiet{background:#fff;color:#355d48;border-color:#d7e3da}.quiet:hover{background:#edf5ef}.icon-button{padding:8px 14px;background:#f2f6f3;color:#355d48}
.date-toolbar{justify-content:space-between;padding:20px 24px;background:#eaf3ed;border:1px solid #cbded0;border-radius:18px;margin-bottom:18px;flex-wrap:wrap}.date-label{display:block;font-size:18px;font-weight:800;color:#184d32;margin-bottom:8px}.date-input-row{flex-wrap:wrap}input[type=date]{min-height:52px;font-size:18px;font-weight:700;background:#fff;border:2px solid #5b9970;color:#163f29}#reportDate{min-width:185px;width:205px;margin:0}input[type=date]::-webkit-calendar-picker-indicator{padding:8px;cursor:pointer}.toolbar-actions{align-self:flex-end;flex-wrap:wrap}.status:not(:empty){padding:10px 0 18px;color:#175638}.error{padding:12px 16px;border-radius:10px;background:#fff0ee;color:#a02e21;margin:12px 0;font-size:14px}.badge{background:#e7efe9;border-radius:20px;padding:4px 12px;font-size:13px;color:#446753}
.cards{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px;margin-bottom:24px}.cards article{background:#fff;border:1px solid #e0e9e2;border-radius:18px;padding:24px;min-width:0}.cards span,.cards small{display:block}.cards span{font-weight:700;color:#587062}.cards strong{display:block;font-size:clamp(24px,3vw,34px);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;margin:10px 0 8px;line-height:1.3}.cards small{font-size:12px;color:#738678}.cards .balance{background:#184f36;border-color:#184f36;color:#fff}.balance span,.balance small{color:#d4e6d9}.income{color:#187247}.expense{color:#bd4e35}.panel{padding:24px;background:#fff;border:1px solid #e0e9e2;border-radius:18px}.transactions-panel{margin-bottom:24px}.breakdown{display:grid;grid-template-columns:1fr 1fr;gap:20px}.breakdown h2{margin-bottom:14px}.row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 0;border-top:1px solid #edf1ee}.row-main{display:flex;gap:12px;min-width:0;align-items:center}.row p{font-size:15px;font-weight:700;overflow-wrap:anywhere}.row small{color:#738678;font-size:12px}.row .amount{font-weight:800;font-size:16px;white-space:nowrap;font-variant-numeric:tabular-nums}.dot{flex-shrink:0;width:9px;height:9px;border-radius:50%;background:#bf674e}.dot.in{background:#359064}.empty{padding:32px 12px;text-align:center;color:#738678;font-size:14px}.empty strong{display:block;color:#496953;font-size:16px;margin-bottom:4px}footer{display:flex;justify-content:space-between;color:#819187;font-size:12px;margin-top:28px}
dialog{border:0;border-radius:22px;box-shadow:0 24px 90px #10241c40;width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 32px);padding:28px;color:#173329}dialog::backdrop{background:#152b2399}dialog .section-heading{margin-bottom:8px}.form-intro{margin-bottom:22px}fieldset{border:0;padding:0;margin:0}legend,label{font-weight:700;font-size:14px}input:not([type=radio]){width:100%;display:block;border:1px solid #bacfc0;border-radius:10px;padding:12px;margin:8px 0 16px;min-height:50px}input:disabled{opacity:.7;background:#f1f3f2}.kind-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0 20px}.kind-options label{display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;border:1px solid #c9d9ce;border-radius:10px;cursor:pointer}.kind-options label:has(:checked){background:#e7f2eb;border:2px solid #39845a;color:#125a33}.kind-options input{accent-color:#176240;width:18px;height:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-grid label{min-width:0}.form-grid input[type=date]{font-size:16px}#writeKey{margin-bottom:6px}.form-actions{justify-content:flex-end;border-top:1px solid #e2ebe5;padding-top:20px;margin-top:24px}
@media(max-width:720px){main{padding:24px 16px}.page-header{align-items:flex-start;flex-direction:column;gap:18px}.page-header .primary{width:100%}.date-toolbar{padding:18px;width:100%}.date-controls{width:100%}.date-input-row{gap:8px}#reportDate{flex:1;width:160px;min-width:150px}.date-input-row button{padding:10px 12px}.toolbar-actions{width:100%;justify-content:flex-end}.cards{grid-template-columns:1fr 1fr;gap:12px}.cards .balance{grid-column:1/-1}.cards article{padding:18px}.cards strong{font-size:25px}.cards small{font-size:11px}.breakdown{grid-template-columns:1fr}.panel{padding:18px}.row{gap:10px}.row .amount{font-size:14px}.row small{display:block}.row-main{gap:8px}.section-heading h2{font-size:18px}.section-heading>span.muted{font-size:12px}footer{gap:6px;flex-direction:column}dialog{padding:22px}.form-grid{grid-template-columns:1fr;gap:0}.form-actions button{flex:1}.date-input-row #today{flex-basis:100%}}
.period-buttons{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.period-buttons button[aria-pressed=true]{background:#176240;color:#fff}.live-panel{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:16px;background:white;border:1px solid #cfdfd3;border-radius:16px;margin-bottom:16px}.live-panel span{font-size:12px;color:#63796e}.live-panel strong{white-space:normal}.profit-heading{position:sticky;top:0;z-index:2;background:#f4f7f5;padding:12px 0;flex-wrap:wrap;border-bottom:1px solid #d9e4dc}.summary-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.profit-status{display:inline-flex;align-items:center;min-height:44px;padding:7px 18px;border:1px solid;border-radius:12px;font-weight:800;font-size:18px;white-space:nowrap}.profit-status.profit{color:#14532d;background:#dcfce7;border-color:#86c99e}.profit-status.loss{color:#991b1b;background:#fee2e2;border-color:#e8a3a3}.profit-status.neutral{color:#374151;background:#e5e7eb;border-color:#b8bec7}.cards .balance.loss{background:#8e2929;border-color:#8e2929}.balance.loss span,.balance.loss small{color:#ffe2e2}.cards .balance.neutral{background:#4b5563;border-color:#4b5563}.balance.neutral span,.balance.neutral small{color:#f0f2f5}
.insights{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.insights h2{margin-bottom:2px}.expense-chart{display:grid;grid-template-columns:minmax(190px,240px) 1fr;align-items:center;gap:30px;padding:8px 0}.donut{width:min(100%,230px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin:auto;position:relative;box-shadow:inset 0 0 0 1px #17332912}.donut:before{content:"";position:absolute;width:59%;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #1733290a}.donut>div{position:relative;z-index:1;text-align:center;max-width:130px}.donut strong,.donut small{display:block}.donut strong{font-size:20px;line-height:1.3;font-variant-numeric:tabular-nums}.donut small{font-size:11px;color:#738678}.chart-legend{min-width:0}.legend-row{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid #edf1ee}.legend-row:last-child{border-bottom:0}.legend-row>i{width:10px;height:10px;border-radius:50%;background:var(--legend-color)}.legend-row span strong,.legend-row span small{display:block;overflow-wrap:anywhere}.legend-row span strong{font-size:14px}.legend-row span small{font-size:11px;color:#738678}.legend-row>b{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
@media(max-width:720px){.insights{grid-template-columns:1fr}.expense-chart{grid-template-columns:1fr;gap:18px}.donut{width:210px}}
@page{size:A4 portrait;margin:12mm}@media print{body{background:#fff;color:#000;font-size:11px}main{padding:0;max-width:none}.page-header{margin-bottom:10px}h1{font-size:24px}h2{font-size:15px!important}.date-toolbar,.page-header button,.status,.error,dialog,footer,.page-header .muted,.eyebrow{display:none!important}.section-heading{margin:10px 0}.profit-heading{position:static;background:#fff}.profit-status{font-size:14px;min-height:0;padding:4px 10px}.cards{gap:8px;margin-bottom:12px;grid-template-columns:1.3fr 1fr 1fr}.cards article,.panel{box-shadow:none;border-radius:4px;padding:10px}.cards .balance,.cards .balance.loss,.cards .balance.neutral{background:#fff;color:#000;grid-column:auto}.balance span,.balance small,.balance.loss span,.balance.loss small,.balance.neutral span,.balance.neutral small{color:#333}.cards strong{font-size:19px}.transactions-panel{margin-bottom:12px}.row{padding:6px 0;break-inside:avoid}.row p,.row .amount{font-size:12px}.breakdown{grid-template-columns:1fr 1fr;gap:12px}.empty{padding:10px}.badge{background:none}}
/* Preview-matched dashboard layout */
body{background:#f7f8fa;color:#18202c}.goal-banner{display:flex;align-items:center;gap:14px;padding:14px 22px;margin-bottom:22px;border:1px solid #eadfbe;border-radius:14px;background:linear-gradient(90deg,#fff9e9,#faf7ee);color:#07833e}.goal-banner span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#e9f7ee}.goal-banner h1{font-size:clamp(20px,2.6vw,29px);letter-spacing:0}.dashboard-title{font-size:clamp(28px,4vw,42px);margin:0 0 16px;color:#1d2430}.date-toolbar{display:grid;grid-template-columns:auto minmax(160px,1fr) auto auto;gap:16px;padding:14px 18px;background:#fff;border:1px solid #d9dde3;border-radius:16px;box-shadow:0 2px 8px #26364a08}.date-trigger{display:flex;align-items:center;gap:10px;background:#fff;color:#252c36;padding-left:10px}.date-trigger span{font-size:18px}.date-toolbar input[type=date]{margin:0;min-height:48px;border:0;font-size:16px;color:#4c5969;background:#f7f8fa}.period-buttons{margin:0;flex-wrap:nowrap}.period-buttons button{min-width:118px}.period-buttons button[aria-pressed=true]{background:#00994c;box-shadow:0 8px 18px #00994c22}.reload-button{width:48px;padding:0;border:0;background:#fff;color:#273548;font-size:22px}.cards{grid-template-columns:1fr 1fr 1fr;margin:16px 0 14px}.cards article{position:relative;min-height:150px;padding:25px 26px 24px 165px;border-radius:18px}.cards article:before{position:absolute;left:24px;top:25px;display:grid;place-items:center;width:112px;height:100px;border-radius:50%;font-size:42px}.cards .income-card{background:linear-gradient(135deg,#f3fbf6,#fff);border-color:#d7ebdf}.cards .income-card:before{content:'↗';color:#079446;background:#e3f7e9}.cards .expense-card{background:linear-gradient(135deg,#fff4f4,#fff);border-color:#f0d9d9}.cards .expense-card:before{content:'↘';color:#e11922;background:#ffe4e4}.cards .balance,.cards .balance.loss,.cards .balance.neutral{background:linear-gradient(135deg,#f2f7ff,#fff);border-color:#d8e4f7;color:#1765d4}.cards .balance:before{content:'฿';color:#1765d4;background:#e1ecff}.cards .balance span,.cards .balance small,.cards .balance.loss span,.cards .balance.loss small,.cards .balance.neutral span,.cards .balance.neutral small{color:#3e5d87}.cards span{font-size:18px}.cards strong{font-size:clamp(27px,3vw,38px);margin:2px 0}.live-panel{display:grid;grid-template-columns:auto minmax(220px,1fr) minmax(220px,1fr) auto;gap:24px;padding:18px 28px;background:#f5fbf6;border-color:#d8e9dc}.live-panel>strong{font-size:22px;color:#098542}.profit-copy{display:flex;flex-direction:column;border-left:1px solid #d8e0da;padding-left:24px}.profit-copy .profit-status{padding:0;min-height:0;border:0;background:transparent;font-size:14px}.profit-copy>span:last-child{font-size:12px;color:#66736c}.profit-meter{height:7px;border-radius:9px;background:#e2e6e3;overflow:hidden}.profit-meter i{display:block;height:100%;border-radius:inherit;background:#059447}.live-panel>b{color:#078c42}.report-meta{display:none}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.transactions-panel{margin:0}.panel{border-color:#dcdfe4;box-shadow:0 2px 12px #20304708}.row{padding:11px 0}.row-main .dot{width:38px;height:38px;display:grid;place-items:center}.row-main .dot:after{content:'▣';color:#fff;font-style:normal;font-size:15px}.row-main p{font-size:14px}.transaction-side{display:flex;flex-direction:column;align-items:flex-end}.transaction-side small{color:#617082;font-size:11px}.expense-chart{grid-template-columns:minmax(220px,1fr) minmax(180px,.8fr)}.donut{width:min(100%,300px)}.report-actions{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.report-actions button{min-height:68px;font-size:20px;border-radius:14px}.print-button{background:#1878df;color:#fff;box-shadow:0 7px 18px #1878df2b}.primary{background:#00984b}.income-summary,footer{display:none!important}
@media(max-width:900px){.date-toolbar{grid-template-columns:1fr auto}.date-trigger{display:none}.date-toolbar input[type=date]{display:block}.period-buttons{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr)}.period-buttons button{min-width:0;padding:9px}.cards article{padding-left:110px}.cards article:before{left:18px;width:72px;height:72px}.dashboard-grid{grid-template-columns:1fr}.expense-chart{grid-template-columns:220px 1fr}.live-panel{grid-template-columns:1fr 1fr}.profit-meter{grid-column:1/-1}.live-panel>b{display:none}}
@media(max-width:620px){main{padding:18px 12px}.goal-banner{padding:10px 14px}.goal-banner h1{font-size:18px}.dashboard-title{font-size:30px}.date-toolbar{display:block}.date-toolbar input[type=date]{width:100%;margin-bottom:10px}.period-buttons{display:grid;grid-template-columns:1fr 1fr}.reload-button{display:none}.cards{grid-template-columns:1fr}.cards .balance{grid-column:auto}.cards article{min-height:112px;padding:18px 16px 18px 112px}.cards article:before{top:19px;width:70px;height:70px}.live-panel{grid-template-columns:1fr;padding:16px}.profit-copy{border:0;padding:0}.profit-meter{grid-column:auto}.expense-chart{grid-template-columns:1fr}.donut{width:235px}.report-actions{grid-template-columns:1fr}.report-actions button{min-height:58px}}