/* Planio layout with a distinct green identity for the expense app. */
:root{--accent:#28724f;--accent-hover:#205c40;--accent-soft:#e7f2eb}
.form-error{color:#a51e2b}.notice.error{background:#fce9ec;color:#a51e2b}
.page-title-group{display:flex;align-items:center;gap:16px;min-width:0}.page-title-group h1{font-size:16px;font-weight:550;letter-spacing:-.3px;color:var(--ink)}
.main-content{container-type:inline-size}.page-actions{margin-bottom:18px}.heading-buttons{flex-wrap:wrap;justify-content:flex-end}.period-select{padding:9px 12px;border:1px solid var(--line);border-radius:7px;background:var(--paper);color:var(--ink);font-size:12px;max-width:175px}
.sidebar{overflow-y:auto}.sidebar-categories{max-height:300px;overflow:auto;flex-shrink:1;min-height:80px}.sidebar-bottom{padding-top:25px}.sidebar .brand-mark{padding-bottom:3px}.brand-mark{padding-bottom:3px}
.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:20px;align-items:start;margin-bottom:20px}.dashboard-column{display:grid;gap:16px;min-width:0}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 23px;border-bottom:1px solid var(--line)}.section-heading h2{font-size:14px;font-weight:550;color:var(--ink)}.section-heading>span{font-size:11px;color:var(--muted);text-align:right}
.chart-card .section-heading{border-bottom:0}.donut-wrap{position:relative;max-width:330px;width:100%;aspect-ratio:1;margin:0 auto 8px}.expense-donut{width:100%;height:100%;display:block;stroke:none}.expense-donut circle{fill:none;stroke-linecap:butt;transition:stroke-opacity .18s}.donut-center{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;pointer-events:none}.donut-center>span{font-size:11px;color:var(--muted);max-width:180px;text-align:center}.donut-center strong{font-size:29px;letter-spacing:-1px;font-weight:550;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}.donut-center small{font-size:11px;color:var(--muted)}.chart-footer{font-size:10px;color:var(--muted);padding:0 23px 22px;display:flex;align-items:center;justify-content:space-between;gap:10px}.chart-footer button{font-size:11px;color:var(--accent);text-decoration:underline}
.summary-category{display:grid;grid-template-columns:33px minmax(0,1fr) auto 13px;align-items:center;gap:10px;width:100%;text-align:left;padding:14px 20px 19px;border-top:1px solid var(--line);position:relative;background:white}.summary-category:hover,.summary-category.selected{background:#f8f8fa}.summary-category:first-of-type{border-top:0}.summary-category>svg{width:13px;height:13px;color:var(--muted)}.category-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;color:var(--category-color);background:color-mix(in srgb,var(--category-color) 14%,white)}.category-icon svg{width:17px;height:17px}.category-description{min-width:0}.category-description strong{display:block;font-size:12px;font-weight:500;line-height:1.4;color:var(--ink);overflow-wrap:anywhere}.category-description small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.category-amount{font-size:12px;font-weight:550;color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}.category-progress{position:absolute;left:20px;right:20px;bottom:7px;height:3px;background:#f0f0f3;border-radius:3px;overflow:hidden}.category-progress>span{display:block;height:100%;background:var(--category-color)}
.review-card{padding:19px 20px;border:1px solid var(--line);background:#ededf0;border-radius:12px;display:flex;align-items:center;gap:13px}.review-card h3{font-size:12px;font-weight:600;color:var(--ink)}.review-card p{font-size:11px;color:var(--muted);line-height:1.7;margin-top:5px}.review-card .button{margin-left:auto;flex-shrink:0}.review-icon{color:var(--accent)}.review-icon svg{width:22px;height:22px}
.expense-list{margin-top:20px}.expense-table-head,.expense-row{display:grid;grid-template-columns:90px minmax(0,1fr) 160px 125px 15px;align-items:center;gap:14px;padding:14px 23px}.expense-table-head{font-size:10px;color:var(--muted);background:#f7f7f8;border-bottom:1px solid var(--line)}.expense-row{width:100%;text-align:left;border-bottom:1px solid #e6e7eb;background:white;font-size:12px;min-height:63px}.expense-row:last-child{border-bottom:0}.expense-row:hover{background:#f8f8fa}.row-date{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.row-merchant{min-width:0}.row-merchant strong{font-size:12px;font-weight:500;color:var(--ink);display:block;overflow-wrap:anywhere}.row-merchant small{font-size:10px;color:var(--muted);line-height:1.7;display:block;margin-top:4px}.row-category{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted)}.row-category i{width:6px;height:6px;background:var(--category-color);border-radius:50%;flex-shrink:0}.row-amount,.amount{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.row-amount{color:var(--ink);font-weight:550}.expense-row>svg{width:13px;height:13px;color:var(--muted)}.text-action{padding:0;color:var(--accent);font-size:11px;text-decoration:underline}
.settings-card{padding-bottom:15px}.section-description{font-size:12px;line-height:1.8;padding:16px 23px;color:var(--muted);max-width:800px}.managed-row{display:flex;align-items:center;gap:12px;margin:0 23px;padding:15px 0;border-bottom:1px solid var(--line)}.managed-row strong{font-size:12px;font-weight:500;color:var(--ink)}.managed-row .button{margin-left:auto}.category-dot{width:8px;height:8px;border-radius:3px;flex-shrink:0}.rule-row small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.rule-row>.category-dot{margin-left:auto}.account-card{padding:23px}.account-card .button{margin-left:auto}.account-password{margin:0 23px;max-width:400px}.account-password h3{font-size:13px;font-weight:500;margin-bottom:8px}.import-history-row{display:flex;gap:14px;align-items:center;padding:18px 23px;border-bottom:1px solid var(--line)}.import-history-row>div{flex:1;min-width:0}.import-history-row strong{font-size:12px;font-weight:500;overflow-wrap:anywhere}.import-history-row small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.history-icon{color:var(--muted)}.history-amount{font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}.empty-icon{display:block;margin-bottom:18px;color:var(--muted)}.empty-icon svg{width:30px;height:30px}
.detail-open .main{margin-right:360px}.expense-detail{position:fixed;top:0;right:0;bottom:0;width:360px;background:white;border-left:1px solid var(--line);z-index:20;overflow-y:auto}.detail-heading{display:flex;align-items:center;justify-content:space-between;padding:22px;border-bottom:1px solid var(--line)}.detail-heading h2{font-size:13px;font-weight:550;color:var(--ink)}.detail-body{padding:24px 22px}.detail-date{font-size:11px;color:var(--muted)}.detail-body h3{font-size:20px;font-weight:500;color:var(--ink);line-height:1.45;overflow-wrap:anywhere;margin-top:9px}.detail-amount{font-size:28px;color:var(--ink);letter-spacing:-.8px;margin:12px 0;font-variant-numeric:tabular-nums}.detail-amount small{font-size:14px;color:var(--muted)}.detail-source{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);margin-bottom:26px}#expense-form{display:grid;gap:19px}.scope-field{border:0;padding:0;margin:0}.scope-field legend{font-size:11px;font-weight:500;color:var(--muted);padding:0;margin-bottom:8px}.scope-field label{display:flex;align-items:flex-start;gap:9px;padding:9px 0;font-size:12px;line-height:1.6}.scope-field input{margin:3px 0 0;flex:none}.scope-field small{display:block;font-size:10px;color:var(--muted);line-height:1.8;margin-top:4px}.scope-field:has(input:checked[value=all]){background:var(--accent-soft);margin:0 -10px;padding:10px;border-radius:7px}.detail-save{width:100%}.source-details{margin-top:25px;border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:11px}.source-details summary{cursor:pointer}.source-details dl{margin:15px 0 0;line-height:1.8}.source-details dt{font-weight:500;margin-top:10px}.source-details dd{margin:3px 0 0;overflow-wrap:anywhere}.detail-backdrop{display:none}
.auth-expense-preview{max-width:350px}.auth-expense-preview h3{margin-bottom:15px}.auth-preview-donut{width:190px;height:190px;border-radius:50%;background:conic-gradient(#58b8bd 0 38%,#8f7cce 38% 68%,#7299cb 68% 87%,#d89061 87%);margin:15px auto 25px;display:grid;place-items:center}.auth-preview-donut>span{width:146px;height:146px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;font-size:20px;color:var(--ink);font-weight:500}.auth-preview-donut small{font-size:10px;color:var(--muted);margin-top:5px;font-weight:400}.auth-preview-label{display:flex;gap:9px;align-items:center;font-size:11px;padding:11px 0;border-top:1px solid #ebecf0;color:var(--text)}.auth-preview-label>span{width:8px;height:8px;border-radius:50%;background:var(--c)}
.upload-area{display:flex;flex-direction:column;align-items:center;gap:14px}.upload-area>span:first-child svg{width:26px;height:26px;color:var(--muted)}.import-progress{margin:10px 0}.import-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.import-totals{display:grid;gap:13px;margin:20px 0}.import-totals>div{display:flex;justify-content:space-between;gap:15px;font-size:12px;line-height:1.7}.import-totals span{color:var(--muted)}.import-totals strong{color:var(--ink);font-weight:500;text-align:right}.import-valid{display:flex;gap:8px;align-items:center;color:#27603c;background:#edf5ef}.import-table .amount{white-space:nowrap}#category-form{display:grid;gap:18px}#category-form input[type=color]{height:44px;padding:5px;width:90px}.startup-error{padding:60px;max-width:750px}.startup-error h1{font-size:22px;margin-bottom:20px}.startup-error p{font-size:14px;line-height:1.9;color:var(--muted);margin-bottom:20px}#toast button{color:#fff;text-decoration:underline;text-underline-offset:3px;padding:4px 6px;font-size:12px}#toast.visible{pointer-events:auto;opacity:1;transform:translate(-50%,0)}#toast.error{background:#8f2030}
@container(max-width:780px){.expense-table-head,.expense-row{grid-template-columns:minmax(0,1fr) 120px 13px}.expense-table-head>span:first-child,.expense-table-head>span:nth-child(3),.row-date,.row-category{display:none}.heading-buttons{gap:7px}.page-title-group h1{font-size:14px}.export-button{display:none}.page-actions{flex-wrap:wrap}.heading-buttons{margin-left:auto}}
@media(max-width:1100px){.auth-main{padding:40px 8vw}.auth-art{padding:65px 35px}.main-content{padding:20px 24px}}
@media(max-width:900px){.detail-open .main{margin-right:0}.expense-detail{width:360px;max-width:100vw;z-index:30;box-shadow:-12px 0 40px #2021261c}.detail-backdrop:not([hidden]){display:block;position:fixed;inset:0;background:#20212635;z-index:25}.auth-main{padding:40px 6vw}.auth-art{padding:35px 20px}.auth-main h1{font-size:33px}}
@media(max-width:700px){#app.sidebar-open .main{margin-left:0}.sidebar{width:260px;z-index:45}.sidebar-backdrop:not([hidden]){display:block;position:fixed;inset:0;border:0;background:#20212645;z-index:40}.sidebar-categories{max-height:none;overflow:visible}.sidebar-bottom{margin-top:30px}.auth-layout{display:block}.auth-main{min-height:100vh;padding:35px 9vw}.auth-main>.brand{margin-bottom:48px}.auth-art{display:none}.auth-form{max-width:100%}.main-content{padding:14px}.page-actions{gap:12px}.page-title-group{gap:10px}.page-title-group h1{font-size:15px}.page-actions .heading-buttons{display:flex;width:100%;justify-content:space-between;margin-left:0}.heading-buttons .button{padding:10px 12px}.period-select{flex:1;max-width:none}.dashboard-grid{gap:14px}.section-heading{padding:18px}.summary-category{padding-left:17px;padding-right:17px;grid-template-columns:32px minmax(0,1fr) auto 12px;gap:9px}.category-progress{left:17px;right:17px}.chart-footer{padding-left:18px;padding-right:18px}.review-card{padding:17px 14px;gap:10px}.review-card .button{padding:9px 10px}.review-card p{font-size:10px}.expense-table-head,.expense-row{padding:15px 17px;gap:10px;grid-template-columns:minmax(0,1fr) auto 12px}.expense-row>svg{width:12px}.row-amount{font-size:12px}.expense-detail{width:100%;max-width:440px}.detail-body{padding:24px}.detail-heading{padding:20px 24px}.import-history-row{gap:10px;padding:17px;flex-wrap:wrap}.history-amount{margin-left:28px}.import-history-row .button{margin-left:auto}.managed-row{margin-left:18px;margin-right:18px}.section-description{padding:16px 18px}.account-card{padding:18px;flex-wrap:wrap}.account-password{margin:0 18px}.dialog-body{padding:20px}.import-totals>div{flex-direction:column;gap:3px}.import-totals strong{text-align:left}.import-table th,.import-table td{padding:9px 7px}.panel-dialog{max-height:92dvh}.source-details dd{font-size:12px}}
@media(max-width:360px){.summary-category{grid-template-columns:28px minmax(0,1fr) auto;gap:8px}.summary-category>svg{display:none}.category-icon{width:28px;height:28px}.category-amount{font-size:11px}.donut-center strong{font-size:25px}.review-card{flex-wrap:wrap}.review-card .button{margin-left:32px}}
@media(pointer:coarse){.scope-field label{min-height:44px}.icon-button,.text-action{min-height:40px}.summary-category{min-height:68px}}
@media(prefers-reduced-motion:reduce){.expense-donut circle{transition:none}}