:root{--paper:#f5f4ef;--card:#fff;--ink:#0f172a;--ink2:#334155;--ink3:#64748b;--hair:#e8e6df;--hair2:#d6d3ca;--sage:#10b981;--sageSoft:#f0fdf4;--clay:#ef4444;--claySoft:#fef2f2;--brand:#3b82f6;--brandSoft:#eff6ff}html,body,#root{max-width:100vw;overflow-x:clip}html,body{background:var(--paper);color:var(--ink);transition:background-color .25s,color .25s}::selection{background:var(--brandSoft);color:var(--brand)}input,textarea,select{caret-color:var(--ink);color:var(--ink)}input::placeholder,textarea::placeholder{color:var(--ink3);opacity:.6}body{padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}@media (width<=768px){.responsive-grid-2{grid-template-columns:1fr!important}.responsive-grid-4{grid-template-columns:1fr 1fr!important;gap:8px!important}.responsive-grid-3{gap:6px!important}}@media (width<=360px){.responsive-grid-4{grid-template-columns:1fr!important}}@media (width<=420px){.dashboard-hero-grid{grid-template-columns:1fr!important;gap:8px!important}.dashboard-hero-arrow{transform:rotate(90deg)}}@media (width<=768px){.app-header{gap:8px;flex-direction:column!important;align-items:stretch!important;padding:10px 12px!important}.app-header-title{justify-content:flex-start}.app-header-title>div:nth-child(2)>div:first-child{font-size:14px!important}.app-header-title>div:nth-child(2)>div:last-child{display:none}.app-header-title>div:first-child{width:28px!important;height:28px!important;font-size:14px!important}.app-header-actions{-webkit-overflow-scrolling:touch;margin-left:-8px;margin-right:-8px;padding-bottom:4px;padding-left:8px;padding-right:8px;overflow:auto hidden;flex-wrap:nowrap!important;gap:6px!important}.app-header-actions::-webkit-scrollbar{display:none}.app-header-actions>*{white-space:nowrap;flex-shrink:0;padding:5px 10px!important;font-size:11px!important}.app-tabs{-webkit-overflow-scrolling:touch;overflow:auto hidden;padding:0 8px!important}.app-tabs::-webkit-scrollbar{display:none}.app-tabs button{white-space:nowrap;flex-shrink:0;padding:10px 12px!important;font-size:12px!important}.month-selector{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin-left:-8px;margin-right:-8px;padding-bottom:4px;padding-left:8px;padding-right:8px;overflow:auto hidden;flex-wrap:nowrap!important}.month-selector::-webkit-scrollbar{display:none}.month-selector button{scroll-snap-align:center;flex-shrink:0;padding:6px 12px!important;font-size:13px!important}.month-selector button[data-active=true]{box-shadow:0 2px 6px #3b82f64d}.savings-detail{flex-direction:column!important;align-items:stretch!important;gap:10px!important;padding:12px!important}.savings-detail>div{width:100%;flex:none!important}.savings-detail>div:last-child{justify-content:space-between!important}.filter-row{flex-wrap:wrap;gap:4px!important}.filter-row button{padding:4px 10px!important;font-size:11px!important}.filter-row>span{font-size:11px!important}.responsive-grid-4>div,.responsive-grid-3>div,.stats-2col>div{box-shadow:none!important;padding:7px 10px!important}.responsive-grid-4>div>div:first-child,.responsive-grid-3>div>div:first-child,.stats-2col>div>div:first-child{margin-bottom:2px!important}.responsive-grid-4>div>div:first-child>span:first-child,.responsive-grid-3>div>div:first-child>span:first-child,.stats-2col>div>div:first-child>span:first-child{font-size:10px!important}.responsive-grid-4>div>div:first-child>span:last-child,.responsive-grid-3>div>div:first-child>span:last-child,.stats-2col>div>div:first-child>span:last-child{font-size:12px!important}.responsive-grid-4>div>div:last-child,.responsive-grid-3>div>div:last-child,.stats-2col>div>div:last-child{font-size:13px!important;font-weight:700!important}.responsive-table,.responsive-table tbody{width:100%;display:block}.responsive-table thead{display:none}.responsive-table tr{background:var(--card);box-sizing:border-box;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;width:100%;margin-bottom:6px;padding:8px 10px;display:flex;box-shadow:0 1px 2px #0000000a;border:1px solid var(--hair)!important;cursor:default!important}.responsive-table td{flex-shrink:0;align-items:center;min-height:0;display:inline-flex;text-align:left!important;vertical-align:middle!important;border:none!important;margin:0!important;padding:0!important}.responsive-table td[data-label]:not([data-label=""]):before{content:attr(data-label);color:var(--ink3);text-transform:uppercase;letter-spacing:.3px;margin-right:4px;font-size:10px;font-weight:700}.responsive-table td[data-label=drag],.responsive-table td[data-total]{display:none!important}.responsive-table td[data-label=name]{flex:1 1 0;min-width:80px}.responsive-table td[data-label=name]:before{display:none}.responsive-table td[data-label=name] input{background:0 0;border:none;flex:1;font-weight:600;width:100%!important;min-width:0!important;padding:4px 2px!important;font-size:14px!important}.responsive-table td[data-label=paid]{flex:none}.responsive-table td[data-label=paid]:before{display:none}.responsive-table td[data-label=del]{flex:none;margin-left:auto!important}.responsive-table td[data-label=del]:before{display:none}.responsive-table td input[type=number]{text-align:right;width:80px!important;min-width:0!important;padding:3px 5px!important;font-size:13px!important}.responsive-table td .inline-num,.responsive-table td .inline-num input{width:auto!important;min-width:0!important}.responsive-table td select{max-width:110px;padding:3px 6px!important;font-size:12px!important}.responsive-table td[data-label=freq]{flex-wrap:wrap;flex-basis:100%}.responsive-table td[data-label=freq]>div{width:100%}.app-shell{padding:8px!important}}.add-form{flex-direction:column!important;align-items:stretch!important}.add-form>*{flex:none!important;width:100%!important}.add-form>div:last-child{justify-content:flex-end;gap:8px;flex-direction:row!important}.add-form>div:last-child button{flex:0 auto;min-width:100px}@media (width>=769px){.add-form{max-width:480px;gap:10px!important}}@media (width<=768px){.hide-on-mobile{display:none!important}.app-tabs button,.month-selector button,.filter-row button,.app-header-actions>button,.add-form button{min-height:44px}input,select,textarea{font-size:16px!important}}
