:root{color-scheme:dark;--bg:#0d0d14;--panel:#151520;--panel2:#1b1b29;--line:#29293a;--text:#f2f1f8;--muted:#9291a6;--purple:#9b7bff;--green:#55d6a0;--red:#ff788b}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.app-shell{min-height:100vh}.sidebar{width:238px;position:fixed;inset:0 auto 0 0;background:#11111a;border-right:1px solid var(--line);padding:27px 18px;display:flex;flex-direction:column;z-index:2}.brand{display:flex;align-items:center;gap:11px;font-size:16px;font-weight:750;letter-spacing:-.4px;margin:0 0 48px}.brand small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted);font-weight:700}.brand-mark{width:35px;height:35px;border-radius:11px;background:linear-gradient(145deg,#b49aff,#7652df);display:grid;place-items:center;color:white;font-size:19px;font-weight:800;box-shadow:0 6px 22px #8d6bff35}.nav-label,.eyebrow{font-size:9px;letter-spacing:1.8px;color:#77768d;font-weight:800}.nav-label{padding:0 12px 12px}.sidebar nav{display:grid;gap:6px}.sidebar nav a{padding:11px 13px;border-radius:9px;color:#a4a2b5;display:flex;gap:12px;align-items:center;font-size:13px}.sidebar nav a.active,.sidebar nav a:hover{background:#242136;color:#c5b5ff}.sidebar-bottom{margin-top:auto}.user-chip{display:flex;align-items:center;gap:10px;padding:13px 4px;border-top:1px solid var(--line)}.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#342b50;color:#c8b7ff;font-weight:800}.user-chip b,.user-chip small{display:block}.user-chip small{color:var(--muted);font-size:11px}.logout{background:none;border:0;color:var(--muted);padding:9px 5px;cursor:pointer}.main{margin-left:238px;padding:30px 38px 20px;max-width:1600px}.topbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:23px;margin-bottom:27px}.topbar h1{font-size:26px;letter-spacing:-.8px;margin:4px 0 0}.top-actions{display:flex;align-items:center;gap:18px}.today,.muted{color:var(--muted)}.today{font-size:12px}.welcome-row,.page-actions,.panel-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.welcome-row{margin-bottom:17px}.welcome-row h2,.panel h2,.form-panel h2{font-size:16px;margin:0 0 3px}.welcome-row p,.panel-head p{margin:0;font-size:12px}.text-link,.row-link{color:#b8a5ff;font-size:12px;font-weight:650}.button{display:inline-flex;justify-content:center;align-items:center;border:1px solid transparent;border-radius:8px;padding:10px 14px;font-size:12px;font-weight:700;cursor:pointer}.button.primary{background:var(--purple);color:#171222}.button.primary:hover{background:#b19aff}.button.secondary{background:#20202d;border-color:var(--line);color:#dddbea}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}.stat-card,.mini-stat,.panel,.form-panel{background:var(--panel);border:1px solid var(--line);border-radius:12px}.stat-card{padding:19px 20px;min-height:136px}.balance-card{background:linear-gradient(125deg,#28203f,#191724);border-color:#493b6b}.stat-top{display:flex;justify-content:space-between;color:#aaa8bb;font-size:12px}.stat-icon{font-size:18px;color:#c1adff}.stat-icon.green,.positive{color:var(--green)}.stat-icon.red,.negative{color:var(--red)}.stat-value{font-size:clamp(20px,2.2vw,28px);font-weight:750;letter-spacing:-1px;margin:15px 0 5px;overflow-wrap:anywhere}.stat-note{font-size:10px;color:var(--muted)}.month-grid{margin-bottom:24px}.mini-stat{padding:13px 16px;display:flex;flex-direction:column;gap:7px}.mini-stat span{color:var(--muted);font-size:11px}.mini-stat b{font-size:14px}.panel{padding:19px 20px}.panel-head{margin-bottom:17px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th{text-align:left;color:#77768d;font-size:9px;letter-spacing:1.1px;font-weight:800;padding:11px 10px;border-bottom:1px solid var(--line)}td{padding:13px 10px;border-bottom:1px solid #242432;color:#c7c5d2;font-size:12px}tbody tr:last-child td{border-bottom:0}.right{text-align:right}.transaction-title{display:flex;align-items:center;gap:10px}.transaction-title b,.transaction-title small{display:block}.transaction-title b{color:#eee;font-size:12px;max-width:280px;overflow:hidden;text-overflow:ellipsis}.transaction-title small{font-size:10px;color:var(--muted);margin-top:2px}.type-dot{width:8px;height:8px;border-radius:50%;background:var(--green)}.type-dot.expense{background:var(--red)}.amount{font-weight:700}.amount.income{color:var(--green)}.amount.expense{color:var(--red)}.row-link{margin-right:10px}.actions-cell{display:flex;align-items:center}.danger-link{border:0;background:none;color:#ff8292;font-size:11px;cursor:pointer}.empty{text-align:center;padding:38px 15px}.empty h3{margin:9px 0 4px;font-size:15px}.empty p{color:var(--muted);font-size:12px;margin:0 0 17px}.empty-icon{margin:auto;width:38px;height:38px;border-radius:12px;background:#29223d;color:#c5b3ff;display:grid;place-items:center;font-size:22px}.empty.compact{padding:24px}.pagination{padding:17px 8px 2px}.pagination nav{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.pagination nav span,.pagination nav a{padding:5px 9px}.page-actions{margin-bottom:18px}.page-actions p{margin:0}.filter-bar{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:16px;padding:13px;background:var(--panel);border:1px solid var(--line);border-radius:10px}.filter-bar input,.filter-bar select{width:auto;min-width:130px;flex:1}.filter-bar input:first-child{min-width:190px}input,select,textarea{width:100%;background:#101019;border:1px solid #343346;color:var(--text);border-radius:7px;padding:10px 11px;outline:none}input:focus,select:focus,textarea:focus{border-color:#9272ee;box-shadow:0 0 0 3px #9272ee20}label{display:grid;gap:7px;color:#c7c5d2;font-size:12px;font-weight:650;margin-bottom:15px}.form-panel{padding:23px;max-width:760px}.form-panel.narrow{max-width:500px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.full-span{grid-column:1/-1}.form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:10px}.alert{padding:12px 15px;border-radius:8px;margin-bottom:17px;font-size:12px}.alert.success{background:#15352c;color:#83e0b8;border:1px solid #245b49}.alert.error{background:#3a2028;color:#ffabb5;border:1px solid #693441}.alert ul{margin:5px 0 0;padding-left:18px}.two-col{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:16px}.category-list{display:grid}.category-row{display:flex;align-items:center;gap:11px;padding:12px 3px;border-bottom:1px solid var(--line)}.category-row:last-child{border:0}.category-badge{font-size:9px;font-weight:800;padding:5px 7px;border-radius:5px;background:#17382e;color:var(--green)}.category-badge.expense{background:#3a222a;color:var(--red)}.category-name{flex:1}.category-name b,.category-name small{display:block}.category-name small{font-size:10px;color:var(--muted)}.pad{padding:15px}.full{width:100%}footer{padding:27px 0 5px;text-align:center;color:#656478;font-size:10px}footer span{padding:0 5px}.auth-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 50% 0%,#29203f 0%,#0d0d14 55%)}.auth-card{width:min(100%,410px);background:#171722;border:1px solid var(--line);padding:30px;border-radius:15px;box-shadow:0 25px 90px #0007}.auth-brand{margin-bottom:35px}.auth-card h1{font-size:25px;margin:8px 0 4px}.auth-card>.muted{font-size:12px;margin:0 0 24px}.auth-card label{margin-top:15px}.check{display:flex;align-items:center;grid-template-columns:auto 1fr;font-weight:400}.check input{width:auto}.auth-foot{text-align:center;color:var(--muted);font-size:11px;margin:20px 0 0}.auth-foot a{color:#bba8ff}.form-error{color:#ff9daa;font-size:12px;margin:10px 0}.auth-card .button{margin-top:8px}.auth-card .eyebrow{display:block;margin-bottom:6px}
@media(max-width:900px){.sidebar{width:190px}.main{margin-left:190px;padding:25px 22px}.stats-grid{gap:9px}.stat-card{padding:15px}.stat-value{font-size:21px}}
@media(max-width:650px){.sidebar{position:static;width:auto;height:auto;padding:13px 16px;display:block;border-right:0;border-bottom:1px solid var(--line)}.brand{margin:0 0 12px}.nav-label,.sidebar-bottom{display:none}.sidebar nav{display:flex;gap:5px}.sidebar nav a{flex:1;justify-content:center;padding:9px 5px;font-size:11px}.main{margin:0;padding:20px 14px}.topbar{align-items:flex-end;padding-bottom:16px;margin-bottom:20px}.topbar h1{font-size:22px}.top-actions{gap:8px;flex-direction:column-reverse;align-items:flex-end}.today{font-size:10px}.stats-grid{grid-template-columns:1fr}.stat-card{min-height:110px}.month-grid{grid-template-columns:1fr}.two-col{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.full-span{grid-column:auto}.page-actions{align-items:flex-start;flex-direction:column}.filter-bar>*{min-width:calc(50% - 6px)!important}.filter-bar input:first-child{min-width:100%!important}.panel{padding:13px}.table-wrap{margin:0 -5px}.panel-head{align-items:flex-start}}

/* Transaction form refinement */
.form-panel{max-width:820px;padding:28px;background:linear-gradient(145deg,#171722,#14141e);box-shadow:0 14px 38px #0002}
.form-grid{column-gap:20px;row-gap:2px}
.form-grid label{gap:8px;margin-bottom:19px;color:#d0cede;font-size:12px}
.form-grid input,.form-grid select,.form-grid textarea{min-height:43px;border-color:#343448;background:#101019;transition:border-color .18s,box-shadow .18s,background .18s}
.form-grid input:hover,.form-grid select:hover,.form-grid textarea:hover{border-color:#51466f}
.form-grid textarea{min-height:112px;resize:vertical;line-height:1.6}
.amount-field{min-width:0}
.money-input-wrap{position:relative;display:flex;align-items:center}
.money-prefix{position:absolute;left:14px;color:#a99acb;font-size:13px;font-weight:750;pointer-events:none}
.money-input-wrap input{padding-left:43px;font-size:17px;font-weight:750;letter-spacing:.2px;font-variant-numeric:tabular-nums}
.field-hint{font-size:10px;font-weight:450;color:#858399;margin-top:-2px}
.form-actions{padding-top:8px;margin-top:3px;border-top:1px solid #29293a}
.form-actions .button{min-height:40px;padding-inline:17px}
.form-actions .button.primary{box-shadow:0 5px 18px #9b7bff25}
@media(max-width:650px){.form-panel{padding:18px}.form-grid{row-gap:0}.form-grid label{margin-bottom:15px}.form-actions{position:sticky;bottom:10px;background:#171722;padding:12px 0 0}}


/* Compact transaction form */
.form-panel{max-width:680px;padding:21px}
.form-grid{column-gap:16px;row-gap:0}
.form-grid label{gap:6px;margin-bottom:13px;font-size:11px}
.form-grid input,.form-grid select,.form-grid textarea{min-height:40px;padding:9px 10px;font-size:12px}
.form-grid select{cursor:pointer}
.form-grid textarea{min-height:88px;line-height:1.5}
.money-input-wrap .money-prefix{left:12px;font-size:12px}
.money-input-wrap input{padding-left:39px;font-size:15px}
.field-hint{font-size:9px}
.form-actions{padding-top:10px;margin-top:1px}
.form-actions .button{min-height:36px;padding:8px 14px}
@media(max-width:650px){.form-panel{padding:16px}.form-grid label{margin-bottom:12px}.form-grid textarea{min-height:82px}}


/* Keep transaction type dropdown aligned with the other form controls */
.form-grid select{width:100%;max-width:none;min-width:0;min-height:40px;display:block}


/* SonStore Finance: modern minimal visual system */
:root{
  --bg:#0b0c12;--panel:#13141d;--panel2:#191a25;--line:#262837;
  --text:#f1f0f7;--muted:#9293a8;--purple:#a18aff;
  --green:#62d6a5;--red:#f17f91;
}
body{background:radial-gradient(ellipse at 72% -18%,#211b35 0,transparent 38%),var(--bg);letter-spacing:-.08px}
.sidebar{background:rgba(16,17,25,.96);border-right-color:#242635;padding:24px 16px;backdrop-filter:blur(14px)}
.brand{margin-bottom:44px;gap:10px}
.brand-mark{border-radius:12px;box-shadow:0 4px 16px #8d6bff28}
.sidebar nav{gap:4px}
.sidebar nav a{min-height:40px;border:1px solid transparent;border-radius:9px;transition:background .16s,border-color .16s,color .16s}
.sidebar nav a:hover{background:#1b1b29;border-color:#29283a;color:#e0d8ff}
.sidebar nav a.active{background:#211d31;border-color:#302945;color:#c9baff}
.main{padding-top:27px}
.topbar{border-bottom-color:#252635;padding-bottom:20px;margin-bottom:24px}
.topbar h1{font-weight:720;letter-spacing:-1px}
.eyebrow{letter-spacing:2px}
.button{border-radius:9px;transition:transform .16s,background .16s,border-color .16s,box-shadow .16s}
.button:hover{transform:translateY(-1px)}
.button.primary{background:#a18aff;color:#171321;box-shadow:0 3px 12px #a18aff18}
.button.primary:hover{background:#b09cff;box-shadow:0 5px 18px #a18aff28}
.button.secondary{background:#1a1b26;border-color:#2b2d3d}
.button.secondary:hover{background:#222332;border-color:#3a3b50}
.stat-card,.mini-stat,.panel,.form-panel{background:linear-gradient(155deg,#151620,#12131b);border-color:#292b3b;border-radius:13px;box-shadow:0 8px 28px #00000012}
.stat-card{padding:18px 19px}
.balance-card{background:linear-gradient(135deg,#211c32,#171722 78%);border-color:#3a3152}
.stat-value{letter-spacing:-1.15px;font-variant-numeric:tabular-nums}
.panel{padding:18px 19px}
th{color:#85869b;letter-spacing:1px}
td{border-bottom-color:#222432;transition:background .14s}
tbody tr:hover td{background:#ffffff04}
input,select,textarea{background:#0f1018;border-color:#303244;border-radius:8px;transition:border-color .16s,box-shadow .16s,background .16s}
input:hover,select:hover,textarea:hover{border-color:#42445b}
input:focus,select:focus,textarea:focus{border-color:#9a83f5;box-shadow:0 0 0 3px #9a83f51c;background:#11121c}
.form-panel{box-shadow:0 12px 34px #00000018}
.form-grid label{color:#c9c8d6}
.form-grid input,.form-grid select,.form-grid textarea{border-color:#303244}
.form-grid input:hover,.form-grid select:hover,.form-grid textarea:hover{border-color:#45465e}
.form-actions{border-top-color:#292b3a}
.alert{border-radius:10px}
.category-row{border-bottom-color:#252635}
.auth-card{background:linear-gradient(155deg,#181923,#13141d);border-color:#2b2d3c;box-shadow:0 24px 70px #0008}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Daily Spend calendar */
.daily-month-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:0 0 18px}
.month-switcher{display:flex;align-items:center;gap:12px;margin-top:12px}
.month-switcher strong{min-width:145px;text-align:center;font-size:17px;letter-spacing:-.35px}
.month-switcher .button{min-width:36px;padding:7px 11px;font-size:19px;line-height:1}
.daily-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.daily-summary-grid .mini-stat{display:flex;flex-direction:column;gap:9px;padding:17px 18px}
.daily-summary-grid .mini-stat span{font-size:12px;color:#9293a8}
.daily-summary-grid .mini-stat strong{font-size:clamp(17px,2vw,23px);letter-spacing:-.7px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.income{color:#63d6a0!important}.expense{color:#f18b98!important}
.calendar-panel,.daily-transactions-panel{margin-bottom:18px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:17px}
.section-heading h2{font-size:16px;letter-spacing:-.25px;margin:0 0 5px}
.section-heading .muted{font-size:12px;margin:0}
.calendar-legend{display:flex;gap:13px;flex-wrap:wrap;color:#9293a8;font-size:11px}
.calendar-legend span{display:flex;align-items:center;gap:6px}
.legend-dot{width:7px;height:7px;border-radius:50%;display:inline-block}.income-bg{background:#63d6a0}.expense-bg{background:#f18b98}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}
.calendar-weekdays{margin-bottom:7px;text-align:center;color:#818298;font-size:10px;font-weight:700;letter-spacing:.7px;text-transform:uppercase}
.calendar-days{grid-auto-rows:minmax(105px,auto)}
.calendar-day{min-width:0;display:flex;flex-direction:column;gap:5px;padding:9px;border:1px solid #292b3b;border-radius:9px;background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008)),rgba(241,139,152,var(--expense-heat,0));text-decoration:none;color:#e7e5f0;transition:border-color .15s,transform .15s,background .15s}
.calendar-day:hover{border-color:#7665b8;transform:translateY(-1px)}
.calendar-day.is-today{outline:1px solid #a18aff;outline-offset:-1px}
.calendar-day.outside-month{opacity:.32}
.day-number{font-size:12px;font-weight:700;color:#d8d6e5}
.day-income,.day-expense,.day-count,.day-empty{font-size:10px;line-height:1.35;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.day-income{color:#63d6a0}.day-expense{color:#f18b98}.day-count,.day-empty{color:#85869b}
.daily-transactions-panel tr{scroll-margin-top:18px}
.daily-transactions-panel .empty{padding:28px 12px}
@media(max-width:760px){.daily-month-head{align-items:flex-start}.daily-summary-grid{grid-template-columns:1fr}.calendar-grid{gap:4px}.calendar-days{grid-auto-rows:minmax(82px,auto)}.calendar-day{padding:6px 5px;border-radius:7px;gap:4px}.day-number{font-size:11px}.day-income,.day-expense,.day-count,.day-empty{font-size:9px}.calendar-legend{display:none}.section-heading{align-items:flex-start}}
@media(max-width:420px){.calendar-days{grid-auto-rows:minmax(72px,auto)}.month-switcher{gap:7px}.month-switcher strong{min-width:115px;font-size:15px}}

/* Daily Spend: monthly income/expense comparison */
.spend-breakdown-panel{margin-bottom:18px}
.spend-breakdown{display:grid;grid-template-columns:minmax(190px,260px) minmax(0,1fr);align-items:center;gap:34px;padding:8px 8px 5px}
.pie-chart{width:min(100%,220px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin:auto;background:conic-gradient(var(--green) 0 var(--income-share),var(--red) var(--income-share) 100%);box-shadow:0 10px 35px #0003}
.pie-chart.pie-empty{background:conic-gradient(#343444 0 100%)}
.pie-hole{width:62%;aspect-ratio:1;border-radius:50%;background:#151520;border:1px solid #303044;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px}
.pie-hole small{font-size:10px;color:var(--muted);margin-bottom:5px}
.pie-hole strong{font-size:clamp(12px,1.4vw,17px);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.pie-details{display:grid;gap:0;max-width:620px}
.pie-detail-row{display:grid;grid-template-columns:minmax(130px,1fr) minmax(130px,auto) 58px;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);font-size:12px}
.pie-detail-row>span{display:flex;align-items:center;gap:9px;color:#c7c5d2}
.pie-detail-row strong{font-size:14px;text-align:right;font-variant-numeric:tabular-nums}
.pie-detail-row small{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.pie-net{display:flex;justify-content:space-between;gap:12px;padding-top:17px;color:var(--muted);font-size:12px}
.pie-net strong{font-size:15px}
@media(max-width:650px){.spend-breakdown{grid-template-columns:1fr;gap:18px}.pie-chart{width:175px}.pie-detail-row{grid-template-columns:minmax(100px,1fr) minmax(110px,auto) 48px;gap:8px}.pie-detail-row strong{font-size:12px}}