@font-face{font-family:Inter;src:url('assets/inter-regular.ttf')}
@font-face{font-family:Inter;src:url('assets/inter-medium.ttf');font-weight:500}
@font-face{font-family:Inter;src:url('assets/inter-semibold.ttf');font-weight:600 800}

:root{--canvas:#f6f6f7;--surface:#fff;--ink:#232426;--muted:#76777e;--line:#ececee;--accent:#ef5b25;--orange-pale:#fff1e9;--green:#47755a;--radius:12px;--body:14px;--ease:cubic-bezier(.2,.7,.2,1)}

*{box-sizing:border-box}
body{margin:0;background:var(--canvas);font:var(--body)/1.5 Inter,-apple-system,BlinkMacSystemFont,Arial,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit}
button,a,input,textarea{ -webkit-tap-highlight-color:transparent}
button{cursor:pointer;border:0;color:inherit;background:none}
a{color:inherit;text-decoration:none}
button{transition:background .16s,color .16s,transform .12s}
button:active:not(:disabled){transform:scale(.98)}
button:disabled{opacity:.5;cursor:default}
button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input:focus,textarea:focus{outline:0;border-color:#a3a3a9;box-shadow:0 0 0 3px #ef5b2515}
::selection{background:#ffddcc}
h1,h2,h3,p{margin:0}
h1{font-size:29px;font-weight:600;letter-spacing:-1.1px;line-height:1.25}
h2{font-size:16px;font-weight:600;letter-spacing:-.35px}
h3{font-size:14px;font-weight:500}
small{font-size:12px}
svg{width:18px;height:18px;stroke-width:1.65;flex:none;vertical-align:middle}
span[x-html]{display:inline-flex;align-items:center;justify-content:center}
 [x-cloak]{display:none!important}
.sidebar{width:222px;position:fixed;left:0;top:0;bottom:0;background:#fdfdfd;border-right:1px solid #e9e9ec;padding:30px 18px 20px;display:flex;flex-direction:column;z-index:10}
.brand{display:flex;align-items:baseline;font-size:32px;font-weight:600;line-height:1;letter-spacing:-1.6px;margin:2px 12px 36px}
.brand-dot{color:var(--accent)}
.brand-sub{font-weight:500;letter-spacing:2.2px;font-size:9px;margin-left:10px;color:#7a7b82}
.workspace{display:flex;align-items:center;gap:8px;margin:0 10px 32px;font-size:12px;font-weight:500}
.workspace-dot{height:7px;width:7px;border-radius:50%;background:#303234}
.plan{font-size:9px;letter-spacing:.4px;border:1px solid #dddde2;border-radius:4px;color:#76777e;padding:1px 4px;margin-left:auto}
.nav-label{font-size:10px;letter-spacing:1px;color:#898a91;margin:0 13px 12px}
.sidebar nav{display:flex;flex-direction:column;gap:5px}
.sidebar nav a,.settings-nav{display:flex;align-items:center;height:43px;border-radius:7px;gap:12px;padding:0 13px;font-size:13px;color:#72737b;font-weight:500}
.sidebar nav a:hover,.settings-nav:hover{background:#f4f4f5;color:var(--ink)}
.sidebar nav a.active,.settings-nav.active{background:#efeff0;color:#242528}
.sidebar nav a.active svg{stroke-width:2}
.sidebar nav a.active:before{content:'';width:3px;height:17px;background:var(--accent);border-radius:2px;position:absolute;left:18px}
.nav-count{font-size:10px;margin-left:auto;border-radius:5px;background:#e5e5e8;min-width:19px;text-align:center;line-height:18px;font-weight:500}
.sidebar-bottom{margin-top:auto}
.settings-nav{width:100%}
.sidebar-divider{height:1px;background:var(--line);margin:20px 5px}
.profile{display:flex;align-items:center;text-align:left;width:100%;gap:10px;padding:1px 7px}
.profile img,.owner img,.settings-user img{width:30px;height:30px;border-radius:50%;object-fit:cover;flex-shrink:0}
.profile b{font-size:12px;font-weight:500;display:block}
.profile small{display:block;font-size:11px;color:#85858d;margin-top:1px}
.profile>span:last-child{margin-left:auto;color:#85858d}
.profile svg{width:15px}
.app-main{margin-left:222px}
.topbar{height:64px;border-bottom:1px solid #e9e9ec;background:#fcfcfd;display:flex;align-items:center;justify-content:space-between;padding:0 32px}
.breadcrumbs{display:flex;align-items:center;gap:15px;color:#8a8b91;font-size:12px}
.breadcrumbs b{color:#46474c;font-weight:500}
.breadcrumbs svg{width:17px}
.breadcrumb-divider,.top-divider{width:1px;height:16px;background:#dedee2}
.slash{color:#c1c1c7}
.top-actions{display:flex;align-items:center;gap:18px}
.connection{display:flex;align-items:center;gap:7px;color:#7d7e84;font-size:11px}
.live-dot{display:inline-block;width:6px;height:6px;background:#7e9d84;border-radius:50%;flex:none}
.live-dot.paused{background:var(--accent)}
.icon-btn{height:32px;width:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;color:#878890;position:relative;flex:none}
.icon-btn:hover{background:#f0f0f3;color:var(--ink)}
.icon-btn.small{width:27px;height:27px}
.icon-btn.small svg{width:16px;height:16px}
.notification-dot{position:absolute;right:7px;top:6px;background:var(--accent);border:2px solid #fff;width:7px;height:7px;border-radius:50%}
main{max-width:1600px;margin:0 auto;padding:30px 32px 0}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}
.page-heading p{font-size:13px;color:#80818a;margin-top:8px}
.heading-actions{display:flex;gap:10px;align-items:center}
.button{height:37px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 13px;border-radius:7px;font-weight:500;font-size:12px;white-space:nowrap;position:relative}
.button svg{width:15px;height:15px}
.primary{background:#26272a;color:white;border:1px solid #26272a;box-shadow:0 1px 2px #0000000a}
.primary:hover{background:#424347}
.secondary{background:white;border:1px solid #dfdfe4;box-shadow:0 1px 2px #00000003;color:#4f5056}
.secondary:hover{background:#f9f9fa;border-color:#c8c8ce}
.date-control{position:relative}
.date-control .button{font-size:11px;gap:9px}
.date-control .button svg:last-child{width:12px}
.dropdown{position:absolute;z-index:20;background:#fff;border:1px solid #e9e9ec;box-shadow:0 8px 26px #27272a1a;border-radius:8px;padding:5px;right:0;top:44px;min-width:190px}
.dropdown button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:9px 10px;font-size:12px;border-radius:4px}
.dropdown button:hover{background:#f3f3f5}
.dropdown svg{width:14px}
.panel{background:var(--surface);border:1px solid #e8e8ec;border-radius:var(--radius);box-shadow:0 2px 2px #25252a01}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.panel-heading-right{display:flex;align-items:center;gap:10px}
.currency{font-size:10px;color:#8d8e96;background:#f4f4f6;padding:2px 5px;border-radius:4px}
.overview-top{display:grid;grid-template-columns:minmax(0,1.88fr) minmax(300px,1fr);gap:20px}
.collections{padding:18px 22px 0;min-width:0}
.collections .panel-heading h2{font-size:14px}
.finance-metrics{display:flex;justify-content:space-between;gap:28px;margin-top:15px}
.metric-label{font-size:11px;color:#7e7e87;display:flex;gap:6px;align-items:center}
.legend-dot{height:5px;width:5px;border-radius:50%;display:inline-block;flex:none}
.orange{background:var(--accent)}
.gray{background:#d7d7dd}
.main-number{font-size:44px;letter-spacing:-1.9px;line-height:1.25;margin-top:5px;font-weight:500}
.comparison{display:flex;align-items:center;gap:4px;font-size:10px;color:#8b8b93;margin-top:5px;white-space:nowrap}
.comparison svg{width:13px;height:13px;color:#50805f}
.comparison strong{color:#4a7758;font-weight:500;margin-right:3px}
.secondary-metrics{display:flex;gap:27px;padding-top:3px}
.metric-link{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:0}
.metric-link .metric-label{gap:5px;white-space:nowrap}
.metric-link .metric-label svg{width:11px;height:11px;color:#a8a8b0}
.metric-link>strong{font-size:25px;letter-spacing:-.6px;margin-top:8px;font-weight:500}
.metric-link>small{color:#898992;font-size:9px;margin-top:4px;white-space:nowrap}
.metric-link.overdue>strong{color:#d75c32}
.chart-header{display:flex;justify-content:space-between;font-size:10px;color:#8a8a92;margin-top:24px;margin-bottom:9px}
.chart-header>span{color:#777881}
.chart-header>div{display:flex;gap:12px;font-size:9px}
.chart-header>div>span{display:flex;align-items:center;gap:5px}
.chart{height:117px;display:flex;gap:12px;position:relative;transition:opacity .2s}
.chart-y{display:flex;flex-direction:column;justify-content:space-between;color:#9b9ba2;font-size:9px;width:28px;padding:0 0 19px}
.plot{position:relative;flex:1}
.gridlines{position:absolute;inset:5px 0 20px;display:flex;flex-direction:column;justify-content:space-between}
.gridlines i{height:1px;width:100%;border-top:1px dashed #ececef}
.bar-groups{display:flex;justify-content:space-around;gap:10px;height:100%;position:relative}
.bar-group{padding:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;position:relative;flex:1;height:100%;max-width:85px}
.bars{display:flex;gap:5px;align-items:flex-end;height:96px;width:100%;justify-content:center}
.bar{width:20px;max-width:35%;border-radius:3px 3px 0 0;display:block;min-height:2px;transition:height .3s,background .15s}
.bar.previous{background:#e8e8ed}
.bar.current{background:#f5b29a}
.bar.current.last-bar,.bar-group:hover .bar.current,.bar-group:focus-visible .bar.current{background:var(--accent)}
.week-label{font-size:9px;color:#9b9ca3;display:block;height:20px;padding-top:5px;white-space:nowrap}
.chart-tooltip{position:absolute;z-index:2;bottom:98px;background:#27282c;color:white;border-radius:5px;padding:7px 10px;box-shadow:0 3px 8px #0002;min-width:90px;pointer-events:none;font-size:10px;display:flex;justify-content:space-between;gap:12px}
.chart-tooltip b{font-weight:400;color:#ccc}
.collection-footer{border-top:1px solid #f0f0f3;display:flex;align-items:center;justify-content:space-between;margin-top:8px;height:35px;font-size:9px;color:#92929a}
.collection-footer>span:first-child{display:flex;align-items:center;gap:6px}
.collection-footer b{font-weight:500;color:#73747c;margin-left:3px}
.collection-footer .live-dot{width:5px;height:5px}
.attention{padding:21px 20px 0;display:flex;flex-direction:column}
.attention h2{font-size:14px;display:flex;align-items:center;gap:8px}
.count-badge{width:18px;height:18px;text-align:center;line-height:18px;border-radius:5px;background:#f0f0f2;font-size:10px;color:#767780;font-weight:500}
.subtle{color:#85858d;font-size:12px}
.attention .panel-heading>.subtle svg{width:15px;height:15px}
.attention-row{display:flex;align-items:center;gap:11px;text-align:left;padding:18px 0 17px;width:100%;border-bottom:1px solid #eeeeF1;flex:1}
.attention-row:hover h3{color:var(--accent)}
.attention-row.last{border-bottom:0}
.attention-icon{width:32px;height:34px;background:#f4f4f6;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:#8d8d95;flex:none}
.attention-icon.urgent{background:#fff0e8;color:#e36735}
.attention-icon svg{width:16px;height:16px}
.attention-row>div{min-width:0}
.attention-meta{display:flex;align-items:center;gap:4px;color:#8a8a94;font-size:9px;margin-bottom:4px}
.attention-meta>span:not(.status-dot){color:#a0887d}
.attention-row h3{font-size:12px;font-weight:500;letter-spacing:-.1px;transition:color .16s;line-height:1.4}
.attention-row p{color:#909099;font-size:10px;margin-top:4px}
.attention-row p b{color:#6f6f78;font-weight:500}
.row-arrow{margin-left:auto;color:#b2b2ba}
.row-arrow svg{width:13px;height:13px}
.orange-text{color:#d56335!important}
.green-text{color:#4d8061!important}
.orange-bg{background:#ee8a60!important}
.status-dot{width:4px;height:4px;display:inline-block;border-radius:50%;margin-left:3px}
.attention-footer{margin:0 -20px;border-top:1px solid #eeeeF1;background:#fcfcfd;padding:11px 20px;border-radius:0 0 12px 12px;display:flex;gap:7px;align-items:center;font-size:10px;color:#9a9aa2}
.attention-footer svg{width:13px;height:13px;color:#94a297}
.active-projects{margin-top:26px}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;gap:15px}
.section-heading h2{font-size:17px;display:flex;gap:8px;align-items:center}
.heading-count{font-size:11px;font-weight:400;color:#898992;letter-spacing:0;background:#eaeaee;border-radius:4px;padding:0 5px}
.section-heading p{font-size:11px;color:#8b8c95;margin-top:3px}
.section-actions{display:flex;align-items:center;gap:20px}
.segmented{display:flex;position:relative;background:#ebebee;border-radius:7px;padding:3px;height:31px}
.segment-track{position:absolute;left:3px;top:3px;width:calc((100% - 6px)/2);height:25px;background:white;border-radius:5px;box-shadow:0 1px 3px #0000000a;transition:transform .22s var(--ease)}
.segmented button{z-index:1;min-width:78px;padding:0 9px;display:flex;gap:6px;align-items:center;justify-content:center;font-size:10px;color:#8b8b94}
.segmented button.selected{color:#3f4047}
.segmented button span{font-size:9px;opacity:.8}
.text-button{font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:#73737c;font-weight:500;padding:3px 0}
.text-button:hover{color:var(--accent)}
.text-button svg{width:13px;height:13px}
.table-wrap{overflow-x:auto}
.project-table,.invoice-table{border-collapse:collapse;width:100%;text-align:left;white-space:nowrap}
.project-table thead,.invoice-table thead{background:#fdfdfe;color:#93939b;font-weight:400;font-size:10px}
.project-table th,.invoice-table th{font-weight:400;padding:12px 12px;border-bottom:1px solid #ebebef}
.project-table td,.invoice-table td{padding:12px 12px;border-bottom:1px solid #f0f0f3;font-size:11px}
.project-table tr:last-child td,.invoice-table tr:last-child td{border-bottom:0}
.project-table tbody tr:hover,.invoice-table tbody tr:hover{background:#fdfdfE}
.project-table th:first-child,.project-table td:first-child{padding-left:20px}
.project-table th:last-child,.project-table td:last-child{padding-right:16px;width:36px}
.project-table th:first-child{width:31%}
.overview-table th:nth-child(2){width:16%}
.overview-table th:nth-child(3){width:22%}
.overview-table th:nth-child(4){width:17%}
.project-identity{display:flex;align-items:center;gap:11px;text-align:left;padding:0;max-width:100%}
.project-mark{width:33px;height:33px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex:none;background:#eff1ed;color:#86917c}
.project-mark svg{width:17px;height:17px;stroke-width:1.5}
.project-mark.rose{background:#f9eeed;color:#b08a85}
.project-mark.lilac{background:#f0edf7;color:#a092b6}
.project-mark.blue{background:#eaf1f4;color:#839ca8}
.project-mark.sand{background:#f4f0e8;color:#ad9b7b}
.project-mark.gray{background:#f0f0f2;color:#93939c}
.project-mark.mint{background:#eaf3f0;color:#83a095}
.project-identity b{display:block;font-weight:500;font-size:11px}
.project-identity small{display:block;font-size:10px;color:#95959e;margin-top:3px;max-width:230px;overflow:hidden;text-overflow:ellipsis}
.status{display:inline-flex;align-items:center;gap:5px;color:#74747b;font-size:9px;background:#f4f4f6;border-radius:4px;padding:3px 7px;line-height:1.3}
.status i{width:4px;height:4px;border-radius:50%;background:#8c8c93}
.status.risk{background:#fff2e9;color:#cb6b40}
.status.risk i{background:#ed8555}
.status.review{background:#f0eef8;color:#8a7da4}
.status.review i{background:#a394c2}
.status.completed,.status.paid{background:#edf4ee;color:#5e8c6e}
.status.completed i,.status.paid i{background:#6f9779}
.status.sent{background:#edf1f7;color:#7789a9}
.status.sent i{background:#869fc2}
.progress-cell{display:flex;align-items:center;gap:10px;font-size:10px;color:#8c8c95}
.progress-track{display:block;background:#ededf0;border-radius:2px;height:4px;width:92px;overflow:hidden}
.progress-track i{display:block;height:100%;background:#7b7c82;border-radius:2px}
.owner{display:flex;gap:7px;align-items:center;font-size:10px;color:#777780;white-space:nowrap}
.owner img{width:23px;height:23px}
.owner b{font-weight:500;color:#5b5b64}
.overview-bottom{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}
.team-preview,.activity{padding:20px}
.team-preview h2,.activity h2{font-size:14px}
.team-subhead{display:flex;justify-content:space-between;color:#9a9aa2;font-size:9px;margin-top:16px;padding-bottom:9px;border-bottom:1px solid #f1f1f4}
.workload-row{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid #f3f3f5;font-size:10px}
.workload-row .owner{width:139px;flex:none}
.workload-track{height:4px;background:#efeff2;border-radius:3px;width:100%;overflow:hidden}
.workload-track i{height:100%;display:block;background:#939b91;border-radius:3px}
.workload-row>span{white-space:nowrap;color:#8e8e96}
.workload-row>span:first-of-type{min-width:22px}
.load-label{font-size:9px;width:73px;flex:none}
.panel-footnote{display:flex;align-items:center;gap:6px;font-size:9px;color:#94949b;padding-top:13px}
.panel-footnote .live-dot{width:5px;height:5px}
.activity-row{display:flex;align-items:center;gap:10px;text-align:left;width:100%;padding:14px 0;border-bottom:1px solid #f2f2f5}
.activity-row:last-child{border-bottom:0;padding-bottom:0}
.activity-icon{width:29px;height:29px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#f4f4f6;color:#93939b;flex:none}
.activity-icon svg{width:14px;height:14px}
.activity-icon.received{background:#edf4ee;color:#739581}
.activity-desc b{display:block;font-size:10px;font-weight:500}
.activity-desc small{display:block;font-size:9px;color:#9999a1;margin-top:4px}
.activity-amount{margin-left:auto;text-align:right}
.activity-amount b{display:block;font-size:11px;font-weight:500}
.activity-amount small{display:block;font-size:9px;color:#8c8c94;margin-top:4px}
.page-footer{display:flex;justify-content:space-between;color:#aaaaB2;font-size:9px;padding:23px 0 20px}
.page-footer>span:first-child{font-weight:500;color:#8b8c94}
.project-tabs{display:flex;gap:26px;align-items:center;border-bottom:1px solid #e3e3e8;margin-bottom:22px}
.project-tabs button{padding:0 0 14px;display:flex;gap:7px;align-items:center;color:#8e8e98;font-size:12px;position:relative}
.project-tabs button.current{color:#36373d;font-weight:500}
.project-tabs button.current:after{content:'';position:absolute;left:0;right:0;height:2px;bottom:-1px;background:#e66936;border-radius:2px}
.tab-count{font-size:9px;background:#eaeaec;padding:1px 5px;border-radius:4px;color:#8a8b92;font-weight:400}
.current .tab-count{background:#e5e5e8;color:#5e5f66}
.list-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:17px}
.search-field{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e2e2e7;border-radius:7px;padding:0 11px;min-width:280px;height:37px;color:#9a9ba2;max-width:380px;flex:1}
.search-field svg{width:15px;height:15px}
.search-field input{border:0;outline:0;width:100%;height:100%;font-size:11px;background:none;box-shadow:none;color:#53545a}
.search-field input::placeholder{color:#9d9da5}
.search-field button{padding:0;display:flex}
.toolbar-right{display:flex;align-items:center;gap:9px}
.select-wrap{width:140px}
.outlined{border:1px solid #dfdfe4;background:white;width:37px;height:37px}
.full-projects .project-table th:first-child{width:26%}
.full-projects .project-table td{padding-top:17px;padding-bottom:17px}
.full-projects .project-identity small{max-width:208px}
.full-projects .project-identity b{font-size:11px}
.full-projects .progress-track{width:58px}
.full-projects .progress-cell{gap:7px}
.stage{font-size:10px;color:#777780}
.due-cell>span,.budget-cell>span{display:block;font-size:10px}
.due-cell small,.budget-cell small{display:block;font-size:9px;color:#9d9da5;margin-top:4px}
.right{text-align:right}
.table-footer{padding:14px 20px;border-top:1px solid #ededf0;display:flex;justify-content:space-between;color:#9696a0;font-size:10px}
.table-footer b{font-weight:400}
.empty-state{padding:65px 20px;text-align:center}
.empty-state>span{background:#f3f3f5;border-radius:50%;padding:13px;color:#a1a2aa}
.empty-state h3{font-size:14px;margin-top:14px;font-weight:500}
.empty-state p{color:#92929a;font-size:12px;margin:7px 0 18px}
.project-summary{display:flex;align-items:center;gap:8px;font-size:11px;color:#8f8f98;padding:19px 0}
.project-summary .live-dot{background:#eaa37b}
.project-summary b{font-weight:500;color:#6e6e76}
.invoice-summary{display:flex;gap:70px;padding:2px 0 29px}
.invoice-summary>div{display:flex;flex-direction:column;gap:6px}
.invoice-summary span{color:#898992;font-size:11px}
.invoice-summary strong{font-size:28px;font-weight:500;letter-spacing:-.8px}
.invoice-table th,.invoice-table td{padding:17px 20px}
.invoice-table td{font-size:12px}
.invoice-id{font-size:11px;color:#676771;font-weight:500;padding:0}
.invoice-id:hover{text-decoration:underline}
.invoice-client b{font-size:11px;font-weight:500;display:block}
.invoice-client small{display:block;font-size:10px;color:#95959d;margin-top:4px}
.amount{font-weight:500}
.team-overview{display:flex;gap:75px;padding:0 0 30px}
.team-overview>div{display:flex;flex-direction:column;gap:5px}
.team-overview b{font-size:30px;line-height:1.2;font-weight:500;letter-spacing:-.8px}
.team-overview span{color:#898992;font-size:11px}
.team-list{padding:22px}
.team-list .panel-heading{margin-bottom:15px}
.workload-row.full{padding:17px 0;gap:28px;font-size:12px}
.workload-row.full .owner{width:240px;font-size:12px;gap:12px}
.workload-row.full .owner img{width:32px;height:32px}
.workload-row.full .owner small{display:block;font-size:10px;color:#92929b;margin-top:3px}
.workload-row.full .project-total{width:170px}
.workload-row.full .workload-track{max-width:280px}
.workload-row.full .load-label{width:100px;font-size:11px}
.settings-view{max-width:820px}
.settings-tabs{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e4e9;padding-bottom:17px;margin-bottom:24px}
.settings-tabs>span{font-weight:500;color:#3c3d44;font-size:12px}
.settings-user{display:flex;gap:8px;align-items:center;font-size:10px;color:#95959e}
.settings-user img{width:22px;height:22px}
.preferences{padding:25px}
.settings-section-title{display:flex;gap:13px;align-items:center;margin-bottom:20px}
.settings-section-title>span{padding:10px;background:#f4f4f6;border-radius:9px;color:#86868f}
.settings-section-title h2{font-size:15px}
.settings-section-title p{font-size:11px;color:#94949d;margin-top:4px}
.preference-row{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #f0f0f3;padding:20px 0;cursor:pointer}
.preference-row b{display:block;font-size:12px;font-weight:500}
.preference-row small{display:block;font-size:11px;color:#8e8e98;margin-top:5px}
.switch{position:relative;width:33px;height:19px;display:block;flex:none}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.switch i{display:block;position:absolute;inset:0;pointer-events:none;background:#d7d7dc;border-radius:20px;transition:background .17s}
.switch i:after{content:'';height:15px;width:15px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0002;position:absolute;left:2px;top:2px;transition:transform .17s var(--ease)}
.switch input:checked+i{background:#333438}
.switch input:checked+i:after{transform:translateX(14px)}
.switch input:focus-visible+i{outline:2px solid var(--accent);outline-offset:3px}
.email-setting{margin-top:7px;border-top:1px solid #efeff3;padding-top:22px}
.email-setting label{display:block;font-size:12px;margin-bottom:9px;font-weight:500}
.email-setting input{width:100%;max-width:400px;height:38px;padding:0 11px;border:1px solid #dddde4;border-radius:6px;font-size:12px;color:#6b6b74;background:#fff}
.preferences-footer{display:flex;align-items:center;justify-content:flex-end;gap:20px;margin-top:24px}
.saved-note{font-size:11px;color:#678671;display:flex;gap:5px;align-items:center}
.saved-note svg{width:14px;height:14px}
.connection-panel{margin-top:18px;padding:20px 25px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.connection-panel h2{font-size:13px}
.connection-panel p{font-size:11px;color:#8f8f99;margin-top:5px}
.drawer{margin:0 0 0 auto;padding:0;border:0;width:665px;max-width:100%;height:100dvh;max-height:100dvh;background:white;color:var(--ink);box-shadow:-10px 0 60px #20212616;overflow:visible}
.drawer::backdrop{background:#26282f4d;backdrop-filter:blur(2px)}
.drawer[open]{animation:drawer-in .26s var(--ease)}
@keyframes drawer-in{from{transform:translateX(45px);opacity:.3}
to{transform:translateX(0);opacity:1}
}
.drawer-shell{display:flex;height:100%;flex-direction:column}
.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:25px 30px 22px;border-bottom:1px solid var(--line);flex:none}
.drawer-eyebrow{font-size:9px;color:#92929b;letter-spacing:1px;margin-bottom:6px}
.drawer-header h2{font-size:23px;letter-spacing:-.6px;font-weight:500}
.drawer-body{padding:28px 30px;overflow-y:auto;flex:1;overscroll-behavior:contain}
.drawer-footer{padding:18px 30px;border-top:1px solid #eaeaf0;background:#fdfdfe;flex:none}
.drawer-footer>div{display:flex;justify-content:space-between;gap:12px}
.drawer-footer .button{height:39px;padding:0 17px}
.detail-identity{display:flex;gap:13px;align-items:center}
.project-mark.large{width:45px;height:45px;border-radius:11px}
.project-mark.large svg{width:22px;height:22px}
.detail-identity h3{font-weight:500;font-size:16px;margin-bottom:6px}
.detail-description{font-size:13px;line-height:1.8;color:#7d7e87;margin-top:22px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px 20px;margin:28px 0;border-block:1px solid #ededf1;padding:25px 0}
.detail-grid label{display:block;font-size:10px;color:#92929c;margin-bottom:9px}
.detail-grid b{font-size:12px;font-weight:500}
.detail-grid small{display:block;font-size:10px;color:#92929c;margin-top:5px}
.detail-grid .owner{font-size:12px;gap:8px}
.detail-grid .owner img{width:25px;height:25px}
.detail-progress>div{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.detail-progress h3{font-size:12px;font-weight:500}
.detail-progress b{font-weight:500;font-size:12px}
.detail-progress .progress-track{width:100%;height:6px}
.detail-progress .progress-track i{background:var(--accent)}
.detail-alert{background:#fff6ef;border:1px solid #f5e1d4;border-radius:7px;padding:15px;display:flex;gap:10px;margin-top:25px;color:#be734b}
.detail-alert>span{align-self:flex-start}
.detail-alert svg{width:16px;height:16px}
.detail-alert b{font-size:12px;font-weight:500}
.detail-alert p{font-size:11px;line-height:1.7;margin-top:5px;color:#a28170}
.detail-section-title{font-size:13px;margin-top:30px;margin-bottom:17px;font-weight:500}
.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:flex;gap:13px;padding-bottom:23px;position:relative}
.timeline li:not(:last-child):after{content:'';position:absolute;height:100%;border-left:1px solid #e6e6eb;left:5px;top:8px;z-index:0}
.timeline li>span{width:11px;height:11px;border-radius:50%;border:2px solid #dddde4;background:white;margin-top:4px;z-index:1}
.timeline li.done>span{background:#899e8d;border-color:#899e8d}
.timeline li.current>span{background:#f2a07a;border-color:#f2a07a}
.timeline b{font-weight:500;font-size:12px;display:block}
.timeline small{display:block;font-size:10px;color:#9b9ba3;margin-top:5px}
.linked-invoice{display:flex;gap:12px;align-items:center;width:100%;border-top:1px solid #efeff3;padding:15px 0;text-align:left}
.linked-invoice>span:first-child{color:#a5a5ae}
.linked-invoice b{display:block;font-size:12px;font-weight:500}
.linked-invoice small{display:block;font-size:10px;margin-top:4px;color:#9696a0}
.linked-invoice>b{margin-left:auto}
.linked-invoice>span:last-child{color:#a5a5ae}
.form-section{padding-bottom:23px;margin-bottom:23px;border-bottom:1px solid #ececf1}
.form-section h3{font-size:13px;font-weight:600;margin-bottom:17px}
.field{margin-bottom:18px}
.field:last-child{margin-bottom:0}
.field label{font-size:11px;color:#70717a;display:block;margin-bottom:8px;font-weight:500}
.field label>span{color:#a4a4ac;font-weight:400;font-size:10px}
.field input,.field textarea{width:100%;height:39px;border:1px solid #dddde5;border-radius:6px;padding:0 10px;color:#55565e;background:#fff;font-size:12px}
.field input::placeholder,.field textarea::placeholder,.line-item input::placeholder{color:#a9a9b2}
.field textarea{height:auto;padding:10px;line-height:1.7;resize:vertical}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-two .field{margin:0}
.date-input{position:relative}
.date-input>span{position:absolute;right:12px;top:12px;color:#9797a1;pointer-events:none}
.date-input svg{width:14px;height:14px}
.static-field{height:39px;border:1px solid #dddde5;border-radius:6px;display:flex;align-items:center;justify-content:space-between;font-size:12px;padding:0 11px;color:#7e7e88;background:#fafafb}
.static-field>span{color:#a0a0aa}
.client-email{color:#9999a3;display:block;font-size:10px;margin-top:7px}
.items-heading{display:flex;justify-content:space-between;align-items:baseline}
.items-heading>span{color:#9c9ca5;font-size:10px}
.line-labels,.line-item{display:grid;grid-template-columns:minmax(110px,1fr) 48px 81px 85px 26px;gap:8px;align-items:center}
.line-labels{font-size:9px;color:#9999a3;margin-bottom:7px}
.line-labels>span:nth-child(3),.line-labels>span:nth-child(4){text-align:right}
.line-item{margin-bottom:9px}
.line-item input{width:100%;height:37px;border:1px solid #dddde5;border-radius:5px;padding:0 8px;font-size:11px;background:white;color:#666670}
.line-item input[type=number]{text-align:right;-moz-appearance:textfield}
.line-item input::-webkit-inner-spin-button{appearance:none}
.line-amount{font-size:11px;text-align:right;font-weight:500;white-space:nowrap}
.add-item{margin-top:5px;font-size:11px}
.invoice-totals{margin:25px 0 0 auto;width:240px}
.invoice-totals>div{display:flex;justify-content:space-between;font-size:11px;color:#8f8f98;margin-bottom:11px}
.invoice-totals .grand-total{font-size:15px;color:#34353b;border-top:1px solid #e8e8ee;padding-top:14px;margin-top:15px;margin-bottom:0}
.grand-total b{font-weight:500}
.invoice-delivery{display:flex;align-items:center;gap:9px;padding-top:5px;font-size:10px;color:#8f8f99;line-height:1.7}
.invoice-delivery svg{width:14px;height:14px;color:#a6a6af}
.invoice-delivery b{font-weight:500;color:#72727d}
.field-error{display:block;font-size:10px;color:#c45f42;margin-top:6px}
.form-error{padding:13px 14px;color:#b25c43;background:#fff1ed;border:1px solid #f0d8cf;border-radius:7px;font-size:11px;margin-top:20px;display:flex;gap:10px;line-height:1.7}
.form-error b{font-weight:500}
.form-error .text-button{color:#bd6040;font-size:10px;margin-top:6px}
.form-error p{font-size:11px;margin-top:4px}
.page-error{margin-bottom:20px;background:#fff1ed;border:1px solid #f0d8cf;padding:12px 15px;border-radius:7px;display:flex;align-items:center;gap:10px;font-size:12px;color:#ae624b}
.page-error button{margin-left:auto;font-size:11px}
.invoice-detail-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}
.invoice-detail-top .subtle{font-size:10px}
.invoice-paper{border:1px solid #e6e6ec;border-radius:7px;padding:30px;box-shadow:0 3px 5px #22222203}
.invoice-paper-brand{display:flex;align-items:baseline;font-size:25px;letter-spacing:-1px;font-weight:600}
.invoice-paper-brand>span{color:var(--accent)}
.invoice-paper-brand>small{font-size:8px;font-weight:400;letter-spacing:1.5px;color:#8f8f99;margin-left:8px}
.invoice-paper-heading{display:flex;flex-direction:column;gap:5px;margin-top:26px}
.invoice-paper-heading>span{font-size:9px;color:#a1a1aa;letter-spacing:1px}
.invoice-paper-heading>b{font-size:17px;font-weight:500}
.invoice-address{display:flex;justify-content:space-between;gap:20px;margin:25px 0 30px}
.invoice-address label{font-size:10px;color:#a0a0a8;display:block;margin-bottom:7px}
.invoice-address h3{font-size:12px;font-weight:500}
.invoice-address p{font-size:10px;color:#8f8f98;margin-top:5px}
.invoice-address b{font-size:11px;font-weight:500}
.invoice-preview-labels{display:flex;justify-content:space-between;border-bottom:1px solid #ededf0;font-size:9px;color:#9b9ba4;padding-bottom:9px}
.invoice-preview-item{display:flex;justify-content:space-between;gap:25px;padding:16px 0;border-bottom:1px solid #f1f1f4}
.invoice-preview-item b{font-size:11px;font-weight:500;display:block}
.invoice-preview-item small{font-size:9px;color:#9b9ba5;margin-top:6px;display:block}
.invoice-preview-total{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-top:22px}
.invoice-preview-total b{font-size:22px;font-weight:500;letter-spacing:-.5px}
.invoice-preview-total small{font-size:9px;color:#9999a3;margin-left:5px}
.invoice-note{font-size:10px;line-height:1.8;color:#a1a1a9;border-top:1px solid #eeeef2;padding-top:23px;margin-top:30px}
.invoice-sent-note{color:#6a8c75;font-size:11px;display:flex;align-items:center;gap:6px;margin-top:20px}
.invoice-sent-note svg{width:14px}
.toast{position:fixed;bottom:25px;left:calc(50% + 111px);transform:translateX(-50%);display:flex;gap:10px;align-items:center;padding:13px 15px;border:1px solid #dedee5;border-radius:9px;background:#fff;box-shadow:0 5px 25px #26262d15;z-index:50;font-size:12px;white-space:nowrap}
.toast-check{width:23px;height:23px;border-radius:50%;color:#698573;background:#eef5ef}
.toast svg{width:13px;height:13px}
.toast>button{padding:3px;margin-left:15px;color:#a2a2ab}
.spinning svg{animation:spin 1.1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}
}
.refreshing .plot{opacity:.35}
.loading-label{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);background:white;border:1px solid #e7e7ed;border-radius:5px;padding:7px 12px;color:#777781;font-size:10px;box-shadow:0 2px 8px #00000008}
.choices{margin-bottom:0;font-size:12px}
.choices__inner{min-height:37px;background:white;border:1px solid #dfdfe5;border-radius:6px;font-size:11px;padding:5px 10px!important;color:#63636e}
.choices__list--single{padding:3px 15px 3px 0}
.choices[data-type*=select-one] .choices__inner{padding-bottom:5px}
.choices[data-type*=select-one]:after{height:6px;width:6px;transform:rotate(45deg);border:0;border-right:1px solid #9a9aa3;border-bottom:1px solid #9a9aa3;right:13px;top:15px;margin:0}
.choices[data-type*=select-one].is-open:after{transform:rotate(225deg);top:18px;margin:0;border-color:#9a9aa3}
.choices__list--dropdown,.choices__list[aria-expanded]{border:1px solid #dddde5!important;border-radius:6px!important;box-shadow:0 6px 22px #22222212;margin-top:4px;z-index:30;word-break:normal}
.choices__list--dropdown .choices__item,.choices__list[aria-expanded] .choices__item{font-size:11px;padding:10px 12px;line-height:1.5}
.choices__list--dropdown .choices__item--selectable.is-highlighted{background:#f5f5f7}
.is-focused .choices__inner,.is-open .choices__inner{border-color:#b5b5bf}
.choices__placeholder{opacity:1;color:#9d9da7}
.choices__input{font-size:11px!important;background:white!important;box-shadow:none!important;height:35px!important;margin:0!important}
.choices__list--dropdown .choices__list{max-height:190px}
.composer-body .choices__inner{min-height:39px}
.composer-body .choices__list--single{padding-top:5px;padding-bottom:4px}
.composer-body .choices{font-size:12px}
.flatpickr-calendar{font-family:Inter;font-size:12px;border:1px solid #ececf0;border-radius:8px;box-shadow:0 5px 25px #22222220;z-index:999}
.flatpickr-day.selected,.flatpickr-day.selected:hover{background:#35363c;border-color:#35363c}
.flatpickr-day{font-size:11px}
.flatpickr-current-month{font-size:14px}
.flatpickr-weekday{font-weight:400}
.flatpickr-calendar.static{position:absolute}
.date-input .flatpickr-wrapper{width:100%}
.date-input .flatpickr-calendar{right:0;left:auto}
.is-offline .connection{color:#c37b55}