/* Cashflow System — bold editorial application theme */
:root{
  --gold:#d7a72f!important;--gold-l:#e3ba52!important;--gold-d:#a77809!important;
  --bg:#f4f4f1!important;--white:#fff!important;--bg3:#ecece8!important;--bg4:#dfdfd9!important;
  --text:#080808!important;--muted:#60605b!important;--dim:#92928b!important;
  --border:#d7d7d1!important;--border-acc:rgba(215,167,47,.45)!important;--bacc:rgba(215,167,47,.45)!important;
  --black:#080808!important;--rose:#d7a72f!important;--rose-bg:rgba(215,167,47,.09)!important;
  --font-d:'Inter',sans-serif!important;--font-b:'Inter',sans-serif!important;
  --fd:'Inter',sans-serif!important;--fb:'Inter',sans-serif!important;--fm:ui-monospace,SFMono-Regular,Menlo,monospace!important;
  --r:16px!important;
}
body{font-family:'Inter',sans-serif!important;color:#080808!important;background:#f4f4f1!important}

/* Sign in */
.shell{border-radius:28px!important;overflow:hidden!important;box-shadow:0 28px 90px rgba(0,0,0,.16)!important}
.left{background:#080808!important;padding:3.25rem!important}
.left::before{width:330px!important;height:330px!important;border:70px solid rgba(215,167,47,.08)!important;top:-110px!important;right:-130px!important}
.left::after{background:#d7a72f!important;border:0!important;width:120px!important;height:120px!important;bottom:-55px!important;left:-35px!important}
.logo,.sb-logo,.pg-title,.page-title,.right-title,.left-title{font-family:'Inter',sans-serif!important}
.logo{font-size:1.25rem!important;font-weight:900!important;letter-spacing:-.05em!important}
.left-title{font-size:3.6rem!important;font-weight:900!important;line-height:.88!important;letter-spacing:-.075em!important}
.left-title em{font-style:normal!important}
.right{padding:3.5rem!important}
.right-eyebrow{font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-weight:800!important;color:#896504!important}
.right-title{font-size:2.5rem!important;font-weight:900!important;letter-spacing:-.06em!important;line-height:1!important}
.rule{height:6px!important;width:64px!important;background:#d7a72f!important}
.finput,.btn-google{border-radius:13px!important;min-height:54px!important}
.finput{background:#f5f5f2!important;border-color:#d2d2cc!important}
.finput:focus{background:#fff!important;border-color:#080808!important;box-shadow:0 0 0 4px rgba(215,167,47,.2)!important}
.btn-sign{border-radius:999px!important;background:#080808!important;min-height:52px!important;font-weight:800!important}
.password-toggle{border-radius:9px!important}

/* App shells and navigation */
#sidebar,#sb{background:#ebe7de!important;border-right:1px solid #d1ccc1!important;color:#080808!important}
.sb-logo-wrap,.sb-top{border-color:#d1ccc1!important;background:#f4f1eb!important}
.sb-logo{font-size:1.18rem!important;font-weight:900!important;letter-spacing:-.045em!important;color:#080808!important}
.sb-prod,.sb-section,.sb-sec{color:#777169!important;font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-weight:800!important}
.sb-plan-tag,.sb-tag{border-radius:999px!important;background:#d7a72f!important;color:#080808!important;font-weight:800!important}
.sb-item,.nav-item{color:#57534c!important;border-left:0!important;margin:.12rem .7rem!important;padding:.72rem .8rem!important;border-radius:11px!important}
.sb-item:hover,.nav-item:hover{background:#ddd7cb!important;color:#080808!important}
.sb-item.active,.nav-item.on{background:#fff!important;color:#080808!important;border-left:0!important;font-weight:800!important;box-shadow:0 1px 5px rgba(0,0,0,.06)!important}
.sb-footer,.sb-foot{border-color:#d1ccc1!important;background:#f4f1eb!important}
.sb-biz,.sb-user,.sb-urole{color:#6f6960!important}
.sb-biz strong,.sb-uname{color:#080808!important}
.btn-upgrade,.btn-up{border-radius:999px!important;background:#d7a72f!important;color:#080808!important;font-weight:800!important}
.btn-sign-out,.btn-back-Studio{border-radius:999px!important;background:#fff!important}
.top-bar,.topbar{border-bottom:1px solid #d7d7d1!important;box-shadow:none!important;padding:1rem 2rem!important}
.page-title,.pg-title{font-weight:900!important;letter-spacing:-.04em!important}
.page-sub,.pg-sub{font-size:.68rem!important}
.top-badge,.tb-badge,.growth-trial-pill{border-radius:999px!important;font-weight:800!important}
.content{background:#f4f4f1!important}

/* Cards, summaries, reports and charts */
.kpi-card,.kpi,.sum-item,.chart-card,.table-card,.card,.rep-card,.db-greeting,.modal,.modal-box,.settings-section,.ins-card{border-color:#d7d7d1!important;border-radius:18px!important;box-shadow:none!important}
.kpi-card,.kpi{border-top:0!important;padding:1.35rem!important}
.kpi-card::before,.kpi::before{content:'';display:block;width:32px;height:5px;background:#d7a72f;margin-bottom:.8rem}
.kpi-label,.kpi-lbl,.sum-label,.sum-lbl,.db-section-label{font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-weight:800!important}
.kpi-val,.sum-val,.chart-card-title,.chart-title,.table-title,.card-title,.ch-title,.db-greet-h,.greet-h{font-family:'Inter',sans-serif!important;font-weight:850!important;letter-spacing:-.045em!important}
.kpi-val,.sum-val{font-variant-numeric:tabular-nums!important}
.table-card{border-left:0!important;overflow:hidden!important}
.table-header,.card-head{padding:1.1rem 1.25rem!important}
th{background:#080808!important;font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;font-weight:800!important}
td{background:#fff!important}
tr:hover td{background:#f1f1ed!important}
.sum-bar,.sumbar{gap:12px!important;background:transparent!important}
.sum-item,.sum-i{border:1px solid #d7d7d1!important;border-radius:16px!important}
.greeting{background:#080808!important;border-radius:20px!important}
.db-greeting{border-left:6px solid #d7a72f!important}
.db-greeting{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:1rem!important;padding:1rem 1.25rem!important;margin-bottom:1rem!important;background:#fff!important}
.db-greet-h{font-family:'Inter',sans-serif!important;font-size:clamp(1.25rem,2vw,1.65rem)!important;font-weight:900!important;letter-spacing:-.045em!important;color:#080808!important}
.db-greet-p{font-size:.7rem!important;color:#60605b!important;margin-top:.15rem!important}
.db-plan-pill{display:inline-flex!important;align-items:center!important;white-space:nowrap!important;border-radius:999px!important;background:#d7a72f!important;color:#080808!important;padding:.35rem .8rem!important;font-size:.56rem!important;font-weight:900!important;letter-spacing:.12em!important;text-transform:uppercase!important}

/* Controls and dialogs */
.btn-act,.btn-primary,.btn-save,.btn-black,.btn-add,.btn-dark{border-radius:999px!important;background:#080808!important;font-weight:800!important}
.btn-act-outline,.btn-outline,.btn-secondary{border-radius:999px!important}
input,select,textarea{border-radius:11px!important}
input:focus,select:focus,textarea:focus{border-color:#080808!important;box-shadow:0 0 0 4px rgba(215,167,47,.2)!important}
.modal-overlay{background:rgba(0,0,0,.58)!important;backdrop-filter:blur(9px)!important}
.modal,.modal-box{overflow:hidden!important}
.modal-head,.modal-header{border-bottom:1px solid #d7d7d1!important}
.pill{border-radius:999px!important}
#view-invoices .invoice-actions.clean{grid-template-columns:minmax(118px,1fr) repeat(3,minmax(64px,auto)) 42px!important;max-width:none!important}
#view-invoices .invoice-icon-action{font-size:.6rem!important;white-space:nowrap!important;padding:0 .55rem!important}
#view-invoices .invoice-more[open]{z-index:100!important}
#view-invoices tr:has(.invoice-more[open]),#view-invoices td:has(.invoice-more[open]),#view-invoices .table-wrap:has(.invoice-more[open]),#view-invoices .card:has(.invoice-more[open]){overflow:visible!important;position:relative!important;z-index:60!important}
#view-invoices .invoice-more-menu{z-index:200!important;min-width:150px!important;border-radius:10px!important}
.payroll-actions{display:flex!important;justify-content:flex-end!important;gap:.3rem!important;flex-wrap:wrap!important}

@media(max-width:760px){
  .shell{border-radius:0!important}
  .right{padding:1.35rem 1rem 2rem!important}
  .right-title{font-size:2.2rem!important}
  #sidebar,#sb{background:#ebe7de!important}
  .content{padding:1rem!important}
  .top-bar,.topbar{padding:.8rem 1rem!important}
  .kpi-card,.kpi,.sum-item,.sum-i,.chart-card,.table-card,.card,.rep-card{border-radius:14px!important}
}

/* Responsive density: laptop scaling and browser zoom */
@media(min-width:761px) and (max-width:1500px){
  :root{--sb:clamp(205px,16vw,230px)!important}
  .content{padding:1.15rem 1.25rem!important}
  .top-bar,.topbar{padding:.72rem 1.25rem!important;min-height:66px!important}
  .sb-logo-wrap,.sb-top{padding:1rem 1.05rem .8rem!important}
  .sb-nav{padding:.55rem 0!important}
  .sb-item,.nav-item{margin:.08rem .5rem!important;padding:.58rem .65rem!important;font-size:.74rem!important}
  .sb-section,.sb-sec{padding:.35rem 1rem .2rem!important;margin-top:.2rem!important}
  .sb-footer,.sb-foot{padding:.8rem 1rem!important}
  .kpi-grid,.kpi-row,.db-kpi-row{grid-template-columns:repeat(auto-fit,minmax(175px,1fr))!important;gap:.7rem!important;margin-bottom:1rem!important}
  .kpi-card,.kpi{padding:1rem!important;min-width:0!important}
  .kpi-val,.sum-val{font-size:clamp(1.15rem,1.6vw,1.55rem)!important;overflow-wrap:anywhere!important}
  .charts-row,.db-charts-row,.db-tables-row,.g2,.g2c{gap:.7rem!important;margin-bottom:1rem!important}
  .table-card,.card,.chart-card,.rep-card{margin-bottom:1rem!important}
  th{padding:.52rem .8rem!important}
  td{padding:.6rem .8rem!important}
}

@media(min-width:761px) and (max-width:1080px){
  .charts-row,.db-charts-row,.db-tables-row,.g2,.g2c,.debt-grid,.rep-grid,.settings-panel-grid{grid-template-columns:1fr!important}
  .g3,.db-growth-grid,.cli-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .sum-bar.c3,.sumbar.c3,.sumbar.c4{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .top-date,.tb-date{display:none!important}
}

/* Phone portrait: smaller chrome and denser summaries without crushed content. */
@media(max-width:760px){
  #sidebar,#sb{height:66px!important;border-top:1px solid #c9c4ba!important;box-shadow:0 -5px 18px rgba(0,0,0,.08)!important}
  .sb-nav{padding:.25rem .35rem!important;gap:.15rem!important}
  .sb-item,.nav-item{min-width:68px!important;flex-basis:68px!important;margin:0!important;padding:.3rem .25rem!important;border-radius:9px!important;font-size:.57rem!important}
  .sb-item.active,.nav-item.on{box-shadow:none!important;background:#fff!important}
  #main{height:100dvh!important}
  .top-bar,.topbar{min-height:58px!important;padding:.55rem .7rem!important}
  .page-title,.pg-title{font-size:1.08rem!important}
  .page-sub,.pg-sub{font-size:.6rem!important;max-width:190px!important}
  .content{padding:.65rem .55rem calc(76px + env(safe-area-inset-bottom))!important}
  .kpi-grid,.kpi-row,.db-kpi-row{gap:.48rem!important;margin-bottom:.7rem!important}
  .kpi-card,.kpi{padding:.72rem!important;min-height:auto!important}
  .kpi-card::before,.kpi::before{width:24px!important;height:4px!important;margin-bottom:.5rem!important}
  .kpi-val,.sum-val{font-size:1.08rem!important;line-height:1.15!important}
  .kpi-sub{font-size:.58rem!important}
  .sum-item,.sum-i{padding:.72rem!important}
  .table-header,.card-head{padding:.72rem .8rem!important}
  .modal-overlay,.mo{padding:.35rem!important}
  .db-greeting{align-items:flex-start!important;padding:.75rem .8rem!important}
  .db-greet-h{font-size:1.15rem!important}
  .db-greet-p{font-size:.6rem!important}
  .db-plan-pill{font-size:.48rem!important;padding:.28rem .55rem!important}
}

@media(min-width:430px) and (max-width:760px){
  .kpi-grid,.kpi-row,.db-kpi-row,.gm-strip,.gm-row2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* Phone landscape: prioritize visible working area and short navigation. */
@media(max-width:950px) and (max-height:600px) and (orientation:landscape){
  #sidebar,#sb{height:54px!important}
  .sb-nav{padding:.18rem .35rem!important;justify-content:flex-start!important}
  .sb-item,.nav-item{min-width:64px!important;flex-basis:64px!important;font-size:.52rem!important;gap:.05rem!important;padding:.2rem!important}
  .sb-icon,.nav-icon{font-size:.82rem!important}
  .top-bar,.topbar{min-height:48px!important;padding:.38rem .7rem!important;align-items:center!important}
  .page-title,.pg-title{font-size:.98rem!important}
  .page-sub,.pg-sub,.top-date,.tb-date{display:none!important}
  .top-bar-right,.tb-right{flex-direction:row!important;align-items:center!important}
  .content{padding:.5rem .55rem calc(62px + env(safe-area-inset-bottom))!important}
  .kpi-grid,.kpi-row,.db-kpi-row,.gm-strip,.gm-row2{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:.42rem!important}
  .kpi-card,.kpi{padding:.58rem .65rem!important}
  .kpi-card::before,.kpi::before{margin-bottom:.3rem!important;height:3px!important}
  .kpi-label,.kpi-lbl{font-size:.46rem!important;margin-bottom:.25rem!important}
  .kpi-val,.sum-val{font-size:.94rem!important}
  .kpi-sub{font-size:.52rem!important;margin-top:.2rem!important}
  .charts-row,.db-charts-row,.db-tables-row,.g2,.g2c,.debt-grid,.rep-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.5rem!important}
  .chart-area,.ch-wrap{height:150px!important}
  .table-header,.card-head{padding:.55rem .7rem!important}
  th,td{padding:.45rem .6rem!important}
  .mo,.modal-overlay{inset:0 0 54px!important;align-items:center!important}
  .mob,.modal,.modal-box{max-height:calc(100dvh - 62px)!important}
}
