/* Video reference refinements. Shared across all five screens. */
:root{--bg:#edf4ee;--panel:#fcfefd;--lime:#b3ff3e;--ink:#173527;--muted:#8c9c93;--line:#eaf0ec}.app{grid-template-columns:72px minmax(0,1fr);gap:18px;padding:18px;max-width:none;transition:grid-template-columns .22s}.sidebar-expanded .app{grid-template-columns:242px minmax(0,1fr)}#sidebar{padding:27px 12px 18px;border-radius:26px;background:#f5fbf5;border:0;height:calc(100vh - 36px);top:18px;overflow:visible}.brand{padding:0;justify-content:center;height:28px;gap:13px;font-size:21px;letter-spacing:0}.brand-symbol{width:23px;height:23px;display:grid;grid-template-columns:repeat(2,1fr);gap:3px;flex-shrink:0}.brand-symbol i{border-radius:50%;background:#173527}.brand-name{display:none}.sidebar-expanded .brand{justify-content:flex-start;padding-left:15px}.sidebar-expanded .brand-name{display:block}#sidebar nav{margin-top:32px}.nav-link{position:relative;display:flex;align-items:center;justify-content:center;width:100%;gap:11px;height:43px;padding:10px 12px;margin:3px 0;color:#688572;border-radius:9px;font-size:12px;text-align:left;white-space:nowrap}.nav-link svg{width:18px;height:18px}.nav-link>span,.nav-link>small,.nav-link>svg:last-child:not(:first-child){display:none}.nav-link.active{background:transparent;color:#456c4e;font-weight:400}.nav-link:hover,.nav-link:focus-visible{background:#eaf6e9}.nav-link:after{content:attr(data-tooltip);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:#1b3928;color:white;box-shadow:0 4px 12px #17352718;padding:6px 9px;border-radius:5px;font-size:10px;z-index:60;opacity:0;pointer-events:none;transition:opacity .1s}.nav-link:hover:after,.nav-link:focus-visible:after{opacity:1}.sidebar-expanded .nav-link{justify-content:flex-start}.sidebar-expanded .nav-link>span{display:inline}.sidebar-expanded .nav-link>svg:last-child:not(:first-child){display:block;margin-left:auto;width:12px;height:12px}.sidebar-expanded .nav-link>small{display:block}.sidebar-expanded .nav-link:after{display:none}.sidebar-expanded .nav-link.active{background:#eef7ed}.inbox-count{background:#ec3370!important;color:white;border-radius:50%!important;padding:3px!important;font-size:8px!important;margin-left:auto!important}.submenu{display:none;margin:3px 0 7px 23px;padding-left:9px;border-left:1px solid #d8e8da}.sidebar-expanded #payments-toggle[aria-expanded=true]+.submenu{display:grid;gap:3px}.submenu button{position:relative;text-align:left;padding:6px 13px;border-radius:20px;font-size:11px;color:#607e67}.submenu button.selected{color:#233c1c;background:var(--lime);font-weight:600}.submenu button.selected:before{content:'';position:absolute;width:3px;height:10px;left:7px;top:8px;border-radius:4px;background:#1d4728}.submenu button:hover{background:#e5f1df}.sidebar-bottom{display:none}.sidebar-expanded .sidebar-bottom{display:block}.pro-card{padding:15px 12px}.pro-card h3{font-size:12px}.pro-card p{font-size:10px}.help-link{align-items:center;justify-content:flex-start;gap:8px;padding:18px 5px 0}#sidebar .pro-icon{padding:7px;margin-bottom:10px}.workspace{border-radius:26px;overflow:visible;min-width:0}header{height:96px;border:0;padding:0 30px;position:relative;z-index:20}.header-left{gap:13px}.header-title{font-size:25px;letter-spacing:-.8px;line-height:1.2;font-weight:650}.header-right{gap:13px}.icon-btn{border:1px solid var(--line);height:34px;width:34px;background:var(--surface)}.icon-btn svg{width:16px;height:16px}#menu-toggle{background:var(--lime);border-color:var(--lime)}.sidebar-expanded #menu-toggle{background:var(--surface);border-color:#dde8de}#menu-toggle[aria-expanded=true] svg{transform:none}.search{border-radius:30px;padding:8px 12px;background:#f4f7f3;gap:12px}.search input{font-size:11px;width:200px}.search svg{width:15px;height:15px}.profile{border:1px solid transparent;border-radius:30px;padding:4px 5px 4px 9px;font-size:11px;gap:9px;white-space:nowrap}.profile svg{width:12px;height:12px;color:#7d9083}.profile .avatar{width:31px;height:31px;border:2px solid #e6eee4}.profile-name{display:block!important}.profile:hover,.profile[aria-expanded=true],.icon-btn[aria-expanded=true]{outline:2px solid #8cc65c;outline-offset:1px}.popover-anchor{position:relative}.top-popover{position:absolute;right:0;top:calc(100% + 12px);width:330px;background:var(--surface);border:1px solid var(--line);border-radius:19px;padding:16px;box-shadow:0 13px 22px #17352722;z-index:80;color:var(--ink);text-align:left}.top-popover[hidden]{display:none}.popover-heading{display:flex;justify-content:space-between;align-items:center;padding:0 1px 11px;border-bottom:1px solid var(--line);gap:8px}.popover-heading h2{font-size:12px}.popover-heading p{font-size:10px;color:var(--muted);margin-top:4px}.popover-heading .tag{border:0;font-size:9px}.bookmark-list{padding:6px 0}.bookmark-item{display:flex;align-items:center;gap:10px;padding:11px 4px;width:100%;text-align:left;border-radius:8px}.bookmark-item:hover,.popover-option:hover{background:var(--soft)}.bookmark-item>svg{padding:5px;box-sizing:content-box;background:var(--soft);border-radius:6px;width:15px;height:15px;color:#607e67;flex-shrink:0}.bookmark-item strong{font-size:11px;font-weight:500;display:block;line-height:1.4}.bookmark-item small{font-size:9px;color:var(--muted);display:block;margin-top:3px}.bookmark-item small.danger{color:#ca426e}.bookmark-item small.income{color:#298a65}.popover-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:13px;font-size:10px;color:var(--muted);margin-top:6px;gap:10px}.popover-footer button{font-size:10px;color:var(--ink)}.popover-footer .logout{display:flex;gap:11px;align-items:center;color:#c72862;padding:5px 4px;width:100%;border-radius:7px}.logout:hover{background:#fff1f5}.logout svg{width:16px;height:16px}.profile-popover{width:310px}.profile-summary{display:flex;gap:12px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}.profile-summary .avatar{width:45px;height:45px;font-size:14px}.profile-summary strong{display:block;font-size:12px}.profile-summary small{display:block;font-size:10px;color:var(--muted);margin:4px 0 6px}.pro-badge{display:inline-block;background:var(--lime);color:#1c3c20;font-size:9px;border-radius:12px;padding:4px 8px;font-weight:600}.profile-options{display:grid;padding:10px 0 3px}.popover-option{width:100%;display:flex;align-items:center;gap:10px;border-radius:7px;padding:10px 7px;font-size:11px;text-align:left}.popover-option svg{width:17px;height:17px;color:#809889}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:22px 0;font-size:12px}.invoice-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:20px 0;font-size:12px}.invoice-row small{display:block;color:var(--muted);font-size:10px;margin-top:6px}.form-stack select{padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--soft);color:var(--ink);width:100%}main{padding:0 30px 15px}.page-heading{padding-top:14px}body[data-page=dashboard] .page-heading{display:none}.stats-grid{gap:16px;margin-bottom:24px}.stat{padding:19px 18px 17px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}.stat-top>span:first-child{font-size:11px;color:var(--ink);gap:7px}.stat-top>span:first-child svg{display:none}.stat-top>span:first-child:before{content:'';width:6px;height:6px;border-radius:50%;background:#83cf54;flex-shrink:0}.stat:first-child .stat-top>span:first-child:before,.stat:nth-child(3) .stat-top>span:first-child:before{background:#24482e}.stat h2{font-size:25px;font-weight:600;margin:12px 0 6px}.stat p{font-size:10px;color:#88968d}.stat p:first-letter{color:#289b71}.change{font-size:10px;background:#f0fff7;color:#23977a;border-radius:2px}.stat:nth-child(2) .change{color:#d2386a;background:#fff0f5}.stat:nth-child(2) p{color:#ce3b6d}.dashboard-grid{grid-template-columns:minmax(0,2.05fr) minmax(260px,1fr);gap:23px}.panel{border-radius:18px;padding:20px;border-color:var(--line)}.panel-heading{margin-bottom:15px}.panel-heading h2{font-size:13px;font-weight:600}.cash-panel{position:relative}.cash-panel .panel-heading{margin-bottom:7px;min-height:25px}.cash-controls{position:absolute;right:20px;top:30px;display:flex;align-items:center;gap:15px}.legend{font-size:10px;gap:12px}.legend span:first-child{color:#88bc62}.legend span:last-child{color:#274a35}.balance-row small,.savings-total small{font-size:10px;color:var(--muted)}.balance-row h3,.savings-total h3{font-size:23px;margin-top:3px;font-weight:600}.select-wrap{position:relative;display:inline-flex;align-items:center;background:#f1f6f2;border:1px solid var(--line);border-radius:6px;color:var(--ink)}.select-wrap select{appearance:none;background:transparent;border:0;padding:6px 24px 6px 9px;font:inherit;font-size:10px;color:inherit;border-radius:6px;cursor:pointer;max-width:150px}.select-wrap svg{position:absolute;right:7px;width:11px;height:11px;pointer-events:none}.reference-chart{position:relative;height:254px;padding:24px 0 26px;margin-top:23px;outline-offset:4px}.reference-chart>svg{height:100%;width:100%;overflow:visible}.reference-chart .chart-labels{left:0;top:7px;bottom:44px;font-size:10px;pointer-events:none}.reference-chart .chart-days{font-size:10px;margin-top:15px;padding:0 10px}.chart-days .current{color:var(--ink);font-weight:600}.reference-chart .chart-tip{top:32px;left:54%;transform:translateX(-50%);padding:9px 11px;border-radius:6px;pointer-events:none;white-space:nowrap}.reference-chart .chart-tip small{font-size:8px}.reference-chart .chart-tip strong{font-size:12px;margin-top:5px}.reference-rings{display:block;width:144px;height:144px;margin:8px auto 21px}.expense-total{margin-top:4px;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:12px}.expense-total>small{font-size:10px;color:var(--muted)}.expense-total>div{display:flex;align-items:center;gap:10px;margin-top:3px}.expense-total strong{font-size:23px;font-weight:600}.expense-legend{gap:10px;font-size:10px}.expense-legend>div{gap:12px;align-items:center}.expense-legend>div>span{margin-right:auto;color:var(--ink)}.expense-legend>div:first-child span{color:var(--ink)}.expense-legend>div>span:first-letter{color:#284c30}.expense-legend small{font-size:10px;color:var(--muted)}.expense-legend strong{font-size:10px}.transaction-controls{display:flex;align-items:center;gap:8px}.filter-button{display:grid;place-items:center;width:29px;height:29px;border-radius:6px;border:1px solid var(--line);background:#f2f7f3;color:#698271}.filter-button svg{width:16px;height:16px}.filter-active{background:#dff5be}.filter-popover{width:175px;top:calc(100% + 8px);padding:7px;border-radius:10px}.recent-panel .panel-heading{margin-bottom:19px}.recent-panel table{white-space:nowrap}.recent-panel th{font-size:10px;padding-bottom:12px}.recent-panel td{font-size:10px;padding-top:16px;padding-bottom:16px}.recent-panel td>strong{font-size:11px;font-weight:500;color:var(--ink)}.recent-panel td>small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.recent-panel td .tag{background:#eaf5eb;color:#28422c;border:0;border-radius:1px;font-size:8px;padding:3px 6px;white-space:normal;display:inline-block;max-width:175px}.recent-panel .status{background:#23492c;color:#f3fff0;border-radius:12px;font-size:8px;padding:3px 8px}.recent-panel .status.pending{background:var(--lime);color:#173b20}.recent-panel .expense.amount{color:#ce3569}.saving-panel{display:flex;flex-direction:column}.saving-panel .savings-total{padding-bottom:22px}.saving-panel .goal{margin-bottom:23px}.saving-panel .goal>div:first-child{font-size:11px;margin-bottom:6px}.saving-panel .goal>div>span{font-size:10px;color:var(--ink);font-weight:600}.saving-panel .progress{height:6px;border-radius:0;background:#e7f3e9}.saving-panel .progress i{border-radius:0;background:linear-gradient(to right,#274a30 0 65%,#8ad14a 65%)}.saving-panel .goal>small{font-size:9px;margin-top:6px}.saving-panel .panel-foot{margin-top:auto;padding-top:16px;font-size:10px}.saving-panel .panel-foot strong{font-size:10px}.saving-panel .text-link{color:var(--ink);font-size:10px}footer{font-size:9px;border:0;margin-top:5px;padding-bottom:22px}.footer-status{font-size:8px}.dark .search,.dark .select-wrap,.dark .filter-button{background:var(--soft)}.dark #sidebar{background:var(--surface)}.dark .brand-symbol i{background:#c6e4be}.dark .nav-link{color:#a4bcaa}.dark .nav-link:hover,.dark .sidebar-expanded .nav-link.active{background:#2b4432}.dark .recent-panel td .tag{background:#2d4834;color:#d5e8d8}.dark .change{background:#24412f;color:#a8dbad}.dark .stat:nth-child(2) .change{background:#4a2b35;color:#eea1b9}.dark .expense-legend span{color:var(--ink)}.dark .reference-chart svg g{stroke:#304638}
@media(min-width:1500px){.app{grid-template-columns:80px minmax(0,1fr);padding:22px;gap:22px}.sidebar-expanded .app{grid-template-columns:260px minmax(0,1fr)}header{height:105px;padding:0 34px}main{padding:0 34px 20px}.stat{padding:22px}.stat h2{font-size:28px}.reference-chart{height:300px}.reference-rings{width:164px;height:164px;margin-top:14px}.panel{padding:23px}.cash-controls{right:23px;top:34px}.dashboard-grid{gap:25px}.nav-link{height:48px}#sidebar{top:22px;height:calc(100vh - 44px)}}
@media(max-width:1150px){.app{grid-template-columns:64px minmax(0,1fr);gap:14px;padding:14px}.sidebar-expanded .app{grid-template-columns:210px minmax(0,1fr)}#sidebar{padding-left:8px;padding-right:8px;top:14px;height:calc(100vh - 28px)}header{height:86px;padding:0 22px}.header-title{font-size:22px}.header-right{gap:9px}.search input{width:140px}main{padding:0 22px 15px}.stat{padding:16px 13px}.stat h2{font-size:23px}.stat-top>span:first-child{font-size:10px}.stat .change{font-size:8px}.stat p{font-size:8px}.dashboard-grid{grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:16px}.panel{padding:17px}.cash-controls{right:17px;top:26px;gap:10px}.cash-controls .legend{font-size:8px;gap:8px}.reference-chart{height:235px}.expense-legend{font-size:9px}.reference-rings{width:130px;height:130px}.recent-panel td{font-size:9px}.recent-panel td>strong{font-size:10px}.recent-panel th{font-size:9px}.profile-name{font-size:10px}.profile{gap:6px}.sidebar-expanded .pro-card{padding:12px 10px}}
@media(max-width:900px){.app,.sidebar-expanded .app{grid-template-columns:minmax(0,1fr);padding:12px}#sidebar{position:fixed;left:12px;top:12px;bottom:12px;width:224px;height:auto;transform:translateX(-260px);padding:25px 14px;z-index:70;overflow-y:auto;overflow-x:hidden}.menu-open #sidebar{transform:translateX(0)}#sidebar .brand{justify-content:flex-start;padding-left:12px}#sidebar .brand-name{display:block}#sidebar .nav-link{justify-content:flex-start}#sidebar .nav-link>span,#sidebar .nav-link>small{display:inline}#sidebar .nav-link:after{display:none}#sidebar .nav-link>svg:last-child:not(:first-child){display:block;margin-left:auto;width:12px}#sidebar #payments-toggle[aria-expanded=true]+.submenu{display:grid}#sidebar .sidebar-bottom{display:block;padding-top:25px}#sidebar .nav-link.active{background:#eaf5e8}.menu-open .overlay{z-index:60}.profile-name{display:block!important}.top-popover{width:310px}.profile-popover{width:290px}.filter-popover{width:175px}.dashboard-grid{grid-template-columns:minmax(0,1.9fr) minmax(220px,1fr)}.header-right{gap:8px}.search input{width:130px}}
@media(max-width:640px){.app,.sidebar-expanded .app{padding:8px}.workspace{border-radius:20px}header{height:82px;padding:0 15px;gap:6px;flex-wrap:wrap;align-content:center;row-gap:10px}.header-left{gap:8px}.header-title{font-size:18px;letter-spacing:-.5px}.header-right{gap:6px}.icon-btn{width:29px;height:29px}#search-form{position:absolute;left:15px;right:15px;bottom:12px}.search{padding:6px 10px;height:28px;width:100%;justify-content:space-between}.search input{width:100%;font-size:10px}.profile{gap:4px;padding:2px}.profile-name{display:none!important}.profile .avatar{width:27px;height:27px}.profile>svg{display:none}.header-right .search input{width:100%;font-size:10px}.header-right .search{padding:6px 10px}.header-left,.header-right{align-self:flex-start}header{height:110px;padding-top:16px;padding-bottom:48px}.top-popover{position:fixed;right:18px;top:68px;width:min(330px,calc(100vw - 36px));max-height:calc(100dvh - 90px);overflow-y:auto;border-radius:15px}.filter-popover{position:absolute;top:calc(100% + 8px);right:0;width:175px;max-height:none}.profile-popover{width:min(310px,calc(100vw - 36px))}main{padding:0 14px 10px}.stats-grid{gap:10px;margin-bottom:16px}.stat{padding:14px 12px;border-radius:13px}.stat-top>span:first-child{font-size:10px}.stat h2{font-size:25px;margin:10px 0 6px}.stat .change{font-size:8px}.stat p{font-size:9px}.dashboard-grid{grid-template-columns:minmax(0,1fr);gap:16px}.dashboard-grid>.panel:nth-child(3){order:0}.panel{padding:17px 14px;border-radius:15px}.cash-controls{top:24px;right:14px;gap:8px}.cash-controls .legend{font-size:7px;gap:7px}.select-wrap select{font-size:9px;padding:6px 20px 6px 7px}.cash-controls .select-wrap select{max-width:95px}.panel-heading h2{font-size:12px}.reference-chart{height:227px;margin-top:23px}.reference-chart .chart-tip small{font-size:6px}.reference-chart .chart-tip strong{font-size:10px}.reference-chart .chart-tip{padding:7px}.reference-chart .chart-labels,.reference-chart .chart-days{font-size:9px}.reference-rings{width:160px;height:160px;margin:10px auto 20px}.expense-legend{font-size:11px;gap:12px}.expense-legend small,.expense-legend strong{font-size:10px}.recent-panel td{padding:14px 9px;font-size:9px}.recent-panel td>small{font-size:9px}.recent-panel td .tag{font-size:8px;min-width:110px}.recent-panel th{font-size:9px}.saving-panel .goal{margin-bottom:25px}.saving-panel .panel-foot{margin-top:15px}.saving-panel .goal>div:first-child{font-size:12px}.saving-panel .goal>small{font-size:10px}footer{margin:10px 14px 0;font-size:8px;padding-bottom:18px}.footer-status{display:none}.page-heading{padding-top:7px}.invoice-row{flex-wrap:wrap}.invoice-row .btn{font-size:10px}.cash-panel .panel-heading{margin-bottom:7px}}
@media(prefers-reduced-motion:reduce){.app,.nav-link:after{transition:none}}
.stat .change{display:inline-flex;align-items:center;gap:3px}.stat .change svg{width:9px;height:9px;transform:rotate(-45deg)}.stat:nth-child(2) .change svg{transform:rotate(45deg)}.expense-legend>div:nth-child(2)>span::first-letter{color:#7ec84a}.expense-legend>div:nth-child(3)>span::first-letter{color:#bce9bd}