:root{--paper: #f5f4ef;--card: #ffffff;--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{overflow-x:clip;max-width:100vw}html,body{background:var(--paper);color:var(--ink);transition:background-color .25s ease,color .25s ease}::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 (max-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 (max-width: 360px){.responsive-grid-4{grid-template-columns:1fr!important}}@media (max-width: 420px){.dashboard-hero-grid{grid-template-columns:1fr!important;gap:8px!important}.dashboard-hero-arrow{transform:rotate(90deg)}}@media (max-width: 768px){.app-header{flex-direction:column!important;align-items:stretch!important;gap:8px;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{flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px;margin-left:-8px;margin-right:-8px;padding-left:8px;padding-right:8px;gap:6px!important}.app-header-actions::-webkit-scrollbar{display:none}.app-header-actions>*{flex-shrink:0;white-space:nowrap;font-size:11px!important;padding:5px 10px!important}}@media (max-width: 768px){.app-tabs{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding:0 8px!important}.app-tabs::-webkit-scrollbar{display:none}.app-tabs button{flex-shrink:0;padding:10px 12px!important;font-size:12px!important;white-space:nowrap}}@media (max-width: 768px){.month-selector{flex-wrap:nowrap!important;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:4px;margin-left:-8px;margin-right:-8px;padding-left:8px;padding-right:8px}.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}}@media (max-width: 768px){.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}}@media (max-width: 768px){.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}}@media (max-width: 768px){.responsive-grid-4>div,.responsive-grid-3>div,.stats-2col>div{padding:7px 10px!important;box-shadow:none!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}}@media (max-width: 768px){.responsive-table,.responsive-table tbody{display:block;width:100%}.responsive-table thead{display:none}.responsive-table tr{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:var(--card);border:1px solid var(--hair)!important;border-radius:8px;padding:8px 10px;margin-bottom:6px;box-shadow:0 1px 2px #0000000a;cursor:default!important;width:100%;box-sizing:border-box}.responsive-table td{display:inline-flex;align-items:center;padding:0!important;border:none!important;margin:0!important;text-align:left!important;vertical-align:middle!important;min-height:0;flex-shrink:0}.responsive-table td[data-label]:not([data-label=""]):before{content:attr(data-label);font-size:10px;font-weight:700;color:var(--ink3);text-transform:uppercase;letter-spacing:.3px;margin-right:4px}.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{flex:1;width:100%!important;min-width:0!important;font-weight:600;font-size:14px!important;border:none;background:transparent;padding:4px 2px!important}.responsive-table td[data-label=paid]{flex:0 0 auto}.responsive-table td[data-label=paid]:before{display:none}.responsive-table td[data-label=del]{flex:0 0 auto;margin-left:auto!important}.responsive-table td[data-label=del]:before{display:none}.responsive-table td input[type=number]{width:80px!important;min-width:0!important;padding:3px 5px!important;text-align:right;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;font-size:12px!important;padding:3px 6px!important}.responsive-table td[data-label=freq]{flex-basis:100%;flex-wrap:wrap}.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{flex-direction:row!important;justify-content:flex-end;gap:8px}.add-form>div:last-child button{flex:0 1 auto;min-width:100px}@media (min-width: 769px){.add-form{max-width:480px;gap:10px!important}}@media (max-width: 768px){.hide-on-mobile{display:none!important}}@media (max-width: 768px){.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}}