:root{--sidebar:250px;--red:#ff4f59;--red-dark:#d93445;--ink:#172036;--bg:#f7f8fb}
body{background:#f7f8fb}
.app-shell{display:none}body.signed-in .app-shell{display:block}
.login-screen{min-height:100vh;display:grid;grid-template-columns:minmax(430px,42%) 1fr;background:#f4f7fb}.login-screen.hidden{display:none}.login-card{width:min(460px,calc(100% - 48px));margin:auto;padding:42px 44px;background:#fff;border:1px solid #e2e8f1;border-radius:22px;box-shadow:0 25px 65px rgba(24,51,86,.13)}.login-brand{padding-bottom:25px;border-bottom:1px solid #e9edf3}.login-brand img{width:190px}.login-copy{padding:26px 0 7px}.login-copy h1{margin:0;font-size:27px;color:#16233a}.login-card form>label{display:block;color:#29364c;font-size:11px;font-weight:800;margin-top:15px}.login-card input[type="email"],.login-card input[type="text"],.password-wrap{width:100%;height:46px;border:1px solid #d7dfeb;border-radius:10px;background:#f8faff;margin-top:7px}.login-card input[type="email"],.login-card input[type="text"],.password-wrap input{padding:0 13px;color:#24324a;outline:0;font-size:13px}.login-card input:focus,.password-wrap:focus-within{border-color:#4c82c6;box-shadow:0 0 0 3px rgba(76,130,198,.1)}.password-wrap{display:flex}.password-wrap input{flex:1;border:0;background:transparent}.password-wrap button{width:45px;border:0;background:transparent;color:#738096}.login-options{display:flex;justify-content:space-between;align-items:center;margin:15px 0;font-size:10px;color:#6f798b}.login-options label{display:flex;gap:5px;align-items:center}.login-options button{border:0;background:transparent;color:#2868b2;font-size:10px;font-weight:800}.login-error{height:16px;color:#cf3445;font-size:10px;margin:0}.login-submit{width:100%;height:47px;border:0;border-radius:10px;background:linear-gradient(135deg,#397fc9,#235a9d);color:#fff;font-weight:850;display:flex;justify-content:center;align-items:center;gap:10px;box-shadow:0 10px 22px rgba(37,96,161,.25)}.login-slogan{text-align:center;margin:23px 0 0;padding-top:19px;border-top:1px solid #e8edf4;color:#728096;font-size:11px}.login-visual{background:radial-gradient(circle at 78% 18%,rgba(104,190,255,.33),transparent 30%),linear-gradient(145deg,#17416f 0%,#1e609c 46%,#318bcb 100%);display:grid;place-items:center;padding:55px;overflow:hidden;position:relative}.login-visual:before{content:"";position:absolute;width:720px;height:720px;border-radius:50%;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 0 90px rgba(255,255,255,.025),0 0 0 180px rgba(255,255,255,.018)}.finance-scene{width:min(690px,92%);height:530px;position:relative;z-index:1}.finance-window{position:absolute;inset:65px 30px 58px 18px;background:rgba(247,251,255,.97);border:1px solid rgba(255,255,255,.5);border-radius:19px;box-shadow:0 35px 75px rgba(2,25,54,.35);overflow:hidden;transform:perspective(1100px) rotateY(-4deg) rotateX(1deg)}.window-top{height:39px;background:#fff;display:flex;align-items:center;gap:6px;padding:0 15px;border-bottom:1px solid #e7edf4}.window-top span{width:7px;height:7px;border-radius:50%;background:#d8e2ed}.window-top span:first-child{background:#f07b7b}.window-top span:nth-child(2){background:#f1bf59}.window-top span:nth-child(3){background:#64c68b}.window-top i{width:120px;height:8px;border-radius:10px;background:#edf2f7;margin-left:auto}.window-body{height:calc(100% - 39px);display:grid;grid-template-columns:58px 1fr}.window-body aside{background:#173d68;display:flex;flex-direction:column;align-items:center;gap:20px;padding:17px 0}.window-body aside b{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:#3f91d1;color:#fff}.window-body aside i{width:20px;height:5px;border-radius:5px;background:rgba(255,255,255,.27)}.window-body section{padding:22px}.mini-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mini-cards>div{height:68px;border:1px solid #e2eaf3;background:#fff;border-radius:9px;padding:12px}.mini-cards small,.mini-cards strong,.mini-cards em{display:block;border-radius:4px}.mini-cards small{width:38%;height:5px;background:#a7bed6}.mini-cards strong{width:62%;height:12px;background:#2f74b5;margin:9px 0 7px}.mini-cards em{width:44%;height:4px;background:#d8e4ef}.mini-cards>div:nth-child(2) strong{background:#28a37a}.mini-cards>div:nth-child(3) strong{background:#e2a23c}.finance-chart{height:145px;margin-top:14px;background:#f8fbfe;border:1px solid #e2eaf3;border-radius:10px;position:relative;overflow:hidden}.chart-grid{position:absolute;inset:0;background:linear-gradient(#e8eef5 1px,transparent 1px),linear-gradient(90deg,#e8eef5 1px,transparent 1px);background-size:100% 36px,52px 100%;opacity:.7}.finance-chart svg{position:absolute;inset:0;width:100%;height:100%}.finance-chart .area{fill:url(#areaBlue)}.finance-chart .line{fill:none;stroke:#2c83ce;stroke-width:3}.finance-table{margin-top:14px}.finance-table>div{height:25px;display:grid;grid-template-columns:32px 1fr 50px;gap:10px;align-items:center;border-bottom:1px solid #edf1f5}.finance-table b{width:22px;height:14px;border-radius:4px;background:#d9e9f8}.finance-table span{height:5px;width:58%;background:#dbe3eb;border-radius:4px}.finance-table em{height:6px;background:#65a1d2;border-radius:4px}.floating-invoice{position:absolute;right:-10px;top:21px;width:180px;height:113px;background:#fff;border-radius:13px;padding:17px;display:flex;gap:12px;box-shadow:0 20px 45px rgba(2,29,58,.3);transform:rotate(4deg)}.floating-invoice>span{width:34px;height:34px;border-radius:50%;background:#dbf4e9;color:#1f9a6c;display:grid;place-items:center;font-weight:900}.floating-invoice div{flex:1}.floating-invoice b,.floating-invoice i,.floating-invoice strong{display:block;border-radius:5px}.floating-invoice b{width:60%;height:7px;background:#306ea9}.floating-invoice i{height:5px;background:#e4e9ef;margin-top:9px}.floating-invoice i:nth-child(3){width:70%}.floating-invoice strong{width:46%;height:9px;background:#31a77c;margin-top:11px}.floating-calculator{position:absolute;left:-20px;bottom:0;width:145px;height:184px;border-radius:16px;background:#f8fbff;padding:14px;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;box-shadow:0 22px 50px rgba(2,29,58,.36);transform:rotate(-5deg)}.floating-calculator div{grid-column:1/-1;height:36px;border-radius:7px;background:#dceaf6}.floating-calculator span{display:grid;place-items:center;background:#fff;border:1px solid #e3eaf1;color:#37648e;border-radius:6px;font-size:10px}.floating-calculator span:nth-child(5),.floating-calculator span:nth-child(9),.floating-calculator span:nth-child(13){background:#307ebc;color:#fff}.floating-donut{position:absolute;right:25px;bottom:6px;width:138px;height:115px;background:#fff;border-radius:14px;box-shadow:0 19px 42px rgba(2,29,58,.31);display:flex;align-items:center;gap:8px;padding:16px}.floating-donut i{width:67px;height:67px;border-radius:50%;background:conic-gradient(#2f83c7 0 45%,#35b18b 45% 70%,#f0b24f 70%);position:relative}.floating-donut i:after{content:"";position:absolute;inset:16px;border-radius:50%;background:#fff}.floating-donut span{width:22px;height:5px;background:#dbe4ed;border-radius:4px}.coin{position:absolute;width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffd97a,#e7a72e);border:3px solid rgba(255,255,255,.5);color:#765116;font-weight:900;box-shadow:0 10px 22px rgba(11,38,67,.25)}.coin-a{left:8px;top:38px}.coin-b{right:3px;top:188px;transform:scale(.75)}.coin-c{left:140px;bottom:15px;transform:scale(.65)}.visual-glow{position:absolute;border-radius:50%;filter:blur(4px);background:rgba(104,190,255,.24)}.glow-one{width:170px;height:170px;right:-30px;top:-20px}.glow-two{width:110px;height:110px;left:0;bottom:10px}
.sidebar{background:linear-gradient(180deg,#fbfaf9 0%,#f3f1ef 100%);color:var(--ink);box-shadow:6px 0 22px rgba(41,45,65,.06);border-right:1px solid #e7e3e1}
.sidebar:after{display:none}.brand{background:transparent;border-bottom:1px solid #e7e3e1;height:94px;padding:20px 25px}.brand img{filter:none;width:183px}
.nav-item{color:#5b6172;font-weight:620}.nav-item:hover{background:#fff;color:#da3948}.nav-item.active{background:#fff;color:#ef3e4c;box-shadow:0 7px 22px rgba(62,44,50,.09);position:relative}.nav-item.active:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;background:#ff5360;border-radius:0 5px 5px 0}
.sidebar-footer{border-top:1px solid #e4e0de}.sidebar-footer small{color:#9296a2}
.topbar{min-height:94px;padding:10px 30px;background:linear-gradient(100deg,#d8ebff 0%,#cfe4fa 48%,#e5f2ff 100%);border-bottom:0;box-shadow:0 5px 18px rgba(36,85,132,.1)}
.welcome-icon{font-size:34px;color:#2571b9;width:48px;text-align:center;line-height:1}.welcome-copy{margin-right:auto}.welcome-copy h1{font-size:21px;color:#15243a}.welcome-note{color:#52708f;margin-top:3px}.top-actions{gap:14px}
.global-search{width:290px;height:42px;background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.8);border-radius:12px;display:flex;align-items:center;gap:8px;padding:0 13px;color:#536d87;box-shadow:0 4px 12px rgba(36,85,132,.06)}.global-search input{border:0;outline:0;background:transparent;width:100%;font-size:12px;color:#24384f}.global-search input::placeholder{color:#8498ac}
.icon-button{border:0;background:transparent;color:#355d84;font-size:19px}.notification-dot{display:none}.notification-count{position:absolute;right:1px;top:0;background:#2b77bd;color:white;width:18px;height:18px;border:2px solid #d6e9fc;border-radius:50%;display:grid;place-items:center;font-size:9px;font-weight:900}
.profile-button{background:transparent;border:0;padding:3px 4px}.profile-button b{color:#294967;margin-left:7px}.profile-button small{color:#58748f}.avatar{background:linear-gradient(140deg,#3d88c8,#2863a1);box-shadow:none;border-radius:50%}
.profile-wrap{position:relative}.profile-button i{font-style:normal;color:#496c8e;margin-left:7px}.profile-menu{display:none;position:absolute;right:0;top:52px;width:165px;background:#fff;border:1px solid #dfe7ef;border-radius:10px;padding:7px;box-shadow:0 14px 30px rgba(25,58,91,.14)}.profile-menu.open{display:block}.profile-menu button{width:100%;border:0;background:#edf6ff;color:#245f9b;padding:10px;border-radius:7px;text-align:left;font-size:11px;font-weight:800}
.content{padding:26px 28px 48px;max-width:1600px}.status-row{margin-bottom:14px}.status-row h2{font-size:18px}.status-row p{font-size:12px}.cards{gap:14px;margin:15px 0 18px}
.metric-card{min-height:150px;border-radius:14px;padding:22px 18px;align-items:flex-start;box-shadow:0 5px 16px rgba(35,42,61,.045)}.metric-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(35,42,61,.08)}.metric-card.turnover{background:linear-gradient(135deg,#eaf4ff,#f6faff);border:1px solid #e0edfa}.metric-card.expense{background:linear-gradient(135deg,#fff0f1,#fff8f8);border:1px solid #f8e2e4}.metric-card.payable{background:linear-gradient(135deg,#fff4df,#fffaf1);border:1px solid #f4e7ce}.metric-card.collection{background:linear-gradient(135deg,#e9f9ef,#f6fff9);border:1px solid #dfeee4}
.metric-icon{width:48px;height:48px;border-radius:50%;font-size:20px}.metric-card p{font-size:12px;color:#2f3545;margin-top:4px}.metric-card strong{font-size:24px;margin-top:13px}.metric-card small{display:flex;align-items:center;gap:8px;margin-top:12px;color:#8b909d}.metric-card small b{font-size:11px}.up{color:#18a160}.down{color:#e04b54}.card-menu{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#6c707c;letter-spacing:1px;font-weight:900}.card-arrow,.card-glow{display:none}
.panel{border:1px solid #e9eaf0;border-radius:13px;box-shadow:0 4px 14px rgba(35,42,61,.035)}.panel-heading{padding:16px 18px}.panel-heading h3{font-size:15px}.panel-heading p{font-size:10px}.invoice-heading-actions{display:flex;align-items:center;gap:14px}.daily-sales-inline{border-right:1px solid #e6e7eb;padding-right:14px;text-align:right}.daily-sales-inline span{display:block;color:#8a8f9d;font-size:9px}.daily-sales-inline strong{display:block;color:#1c2538;font-size:15px}.daily-sales-inline small{display:block;color:#28a16d;font-size:9px}.text-button{color:#3478da}
th{background:#fafbfc;color:#8c92a0;padding:10px 16px}td{padding:12px 16px}.status{display:inline-block;padding:5px 9px;border-radius:7px;font-size:9px;font-weight:800}.status.paid{background:#e1f7e9;color:#1b8755}.status.partial{background:#fff1d9;color:#a66a06}.status.pending{background:#e7f1ff;color:#3375c7}.status.overdue{background:#ffe1e3;color:#c33c4c}
.alerts-panel .panel-heading h3:before{content:"♧";color:#f04d59;margin-right:8px}.alert-item{padding:12px 17px}.alert-item b{font-size:11px}.alert-item p{font-size:9px}.primary-button{display:none}
.lower-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(330px,.8fr);gap:16px;margin-top:16px}.calendar-panel,.sales-score-panel{margin-top:0}.week-calendar{grid-template-columns:repeat(7,minmax(100px,1fr));padding:13px;gap:5px}.day{min-width:0;min-height:135px;border-radius:8px;padding:9px}.day>strong{font-size:18px}.event{font-size:8px;padding:5px}.calendar-actions .secondary-button{display:none}
.sales-score-panel .panel-heading{padding:15px 17px}.score-list{grid-template-columns:1fr;padding:10px 14px;gap:8px}.score-item{min-height:68px;grid-template-columns:25px 34px 1fr;border:0;background:#fafbfc;padding:10px}.score-item.winner{background:#fff9ec}.score-item>strong{grid-column:3;font-size:11px}.score-avatar{width:32px;height:32px;border-radius:50%}.score-bar{height:3px}
.module-page{max-width:1600px}.module-title{display:flex;justify-content:space-between;align-items:center;margin:5px 0 22px}.module-title h2{margin:5px 0 4px;font-size:24px}.module-title p{margin:0;color:#7e8390;font-size:12px}.module-kicker{font-size:9px;letter-spacing:1.4px;color:#dd4552;font-weight:900}.add-user-button,.save-button{border:0;background:linear-gradient(135deg,#e44a57,#c93446);color:#fff;border-radius:9px;padding:11px 15px;font-size:11px;font-weight:850}.settings-grid{display:grid;grid-template-columns:minmax(430px,.9fr) minmax(440px,1.1fr);gap:17px}.user-list-panel .panel-heading{padding:17px}.user-search{display:flex;align-items:center;border:1px solid #e3e4e8;border-radius:8px;padding:0 9px;color:#8c909c}.user-search input{width:130px;height:34px;border:0;outline:0;font-size:10px}.user-list{padding:8px}.user-row{width:100%;display:grid;grid-template-columns:40px 1fr auto 12px;gap:10px;align-items:center;text-align:left;border:0;background:#fff;padding:11px;border-radius:10px;color:#2d3140}.user-row:hover,.user-row.selected{background:#fff3f4}.user-avatar,.permission-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#f7dadd;color:#be3948;font-size:10px;font-weight:900}.user-row b{display:block;font-size:11px}.user-row small{display:block;color:#969aa4;font-size:9px;margin-top:3px}.user-row em{font-style:normal;color:#6d7280;background:#f4f4f6;padding:5px 7px;border-radius:6px;font-size:8px}.user-row i{font-style:normal;color:#b0b2ba}.permission-head{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid #ececf0}.permission-head div{flex:1}.permission-head h3{margin:0;font-size:14px}.permission-head p{margin:4px 0 0;color:#868b98;font-size:10px}.active-chip{background:#e4f6eb;color:#238258;border-radius:99px;padding:5px 9px;font-size:8px;font-weight:900}.permission-info{margin:14px 17px;padding:10px;background:#f2f6ff;color:#58709d;border-radius:8px;font-size:9px}.permission-list{padding:0 17px}.permission-row{display:flex;align-items:center;padding:11px 2px;border-bottom:1px solid #f0f0f2}.permission-row>span{flex:1}.permission-row b{display:block;font-size:10px}.permission-row small{display:block;color:#9a9da7;font-size:8px;margin-top:3px}.permission-row input{display:none}.permission-row i{width:34px;height:19px;background:#d7d9df;border-radius:99px;position:relative;transition:.2s}.permission-row i:after{content:"";position:absolute;width:15px;height:15px;border-radius:50%;background:#fff;left:2px;top:2px;box-shadow:0 1px 3px #0002;transition:.2s}.permission-row input:checked+i{background:#e34c59}.permission-row input:checked+i:after{transform:translateX(15px)}.permission-actions{display:flex;justify-content:flex-end;gap:8px;padding:16px 17px}.cancel-button{border:1px solid #dddfe3;background:#fff;color:#626774;border-radius:9px;padding:10px 13px;font-size:10px}.toast{position:fixed;right:25px;bottom:25px;background:#263044;color:#fff;padding:12px 17px;border-radius:10px;font-size:11px;box-shadow:0 14px 28px #0003;opacity:0;transform:translateY(15px);pointer-events:none;transition:.25s;z-index:100}.toast.show{opacity:1;transform:none}
.modal-backdrop{position:fixed;inset:0;background:rgba(19,35,56,.48);display:grid;place-items:center;padding:18px;z-index:90}.modal-backdrop[hidden]{display:none}.user-modal{width:min(570px,100%);background:#fff;border-radius:17px;box-shadow:0 30px 80px rgba(14,34,57,.3);overflow:hidden}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;padding:20px 23px;background:#eef6ff;border-bottom:1px solid #dce9f5}.modal-head span{font-size:8px;letter-spacing:1.3px;color:#3878b3;font-weight:900}.modal-head h2{margin:5px 0 0;font-size:18px}.modal-head button{border:0;background:transparent;color:#63758a;font-size:24px}.user-modal form{padding:21px 23px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.user-modal label{font-size:10px;font-weight:800;color:#344559}.user-modal input,.user-modal select{display:block;width:100%;height:42px;margin-top:6px;border:1px solid #d7e0ea;border-radius:8px;background:#fafcff;padding:0 11px;outline:0}.user-modal label small{display:block;color:#9099a5;font-size:8px;margin-top:5px}.modal-full,.modal-error,.modal-actions{grid-column:1/-1}.modal-error{min-height:14px;color:#c53849;font-size:9px;margin:0}.modal-actions{display:flex;justify-content:flex-end;gap:8px}
@media(max-width:1220px){.global-search{width:220px}.lower-grid{grid-template-columns:1fr}.score-list{grid-template-columns:repeat(3,1fr)}.score-item{grid-template-columns:25px 34px 1fr}.score-item>strong{grid-column:3}}
@media(max-width:900px){.login-screen{grid-template-columns:1fr}.login-visual{display:none}.settings-grid{grid-template-columns:1fr}}
@media(max-width:760px){.topbar{min-height:84px}.welcome-icon{display:none}.global-search{display:none}.content{padding:18px 12px}.score-list{grid-template-columns:1fr}.invoice-heading{align-items:flex-start}.invoice-heading-actions{align-items:flex-end;flex-direction:column}.daily-sales-inline{border-right:0;padding-right:0}.login-card{width:calc(100% - 28px);padding:30px 24px}.module-title{align-items:flex-start;gap:12px}.settings-grid{grid-template-columns:1fr}.user-row{grid-template-columns:38px 1fr 12px}.user-row em{display:none}}