@import url('https://fonts.googleapis.com/css2?family=Google+Sans+Flex:opsz,wght@6..144,400..800&display=swap');
:root{--ink:#28242e;--muted:#746d7a;--purple:#7658e9;--purple2:#a476e9;--peach:#ff9977;--bg:#f7f6fb;--card:rgba(255,255,255,.88);--line:#e8e3ed;--green:#1a9a61;--red:#cf5361;--shadow:0 18px 60px rgba(56,43,84,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:radial-gradient(circle at 75% 0,rgba(162,126,235,.09),transparent 27%),var(--bg);font-family:"Google Sans Flex","Segoe UI",sans-serif}button,input,select,textarea{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}.sidebar{position:fixed;inset:0 auto 0 0;width:265px;padding:24px 18px;display:flex;flex-direction:column;background:linear-gradient(175deg,#2d2834,#242129);color:#fff;z-index:50}.logo{display:flex;align-items:center;gap:12px;padding:2px 8px 25px;border-bottom:1px solid rgba(255,255,255,.1)}.logo>span,.auth-brand>span{width:45px;height:45px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,var(--purple),var(--purple2) 52%,var(--peach));font-weight:800}.logo div,.auth-brand div{display:grid}.logo small,.auth-brand small{color:#bdb5c3}.sidebar nav{display:grid;gap:5px;margin:27px 0}.sidebar nav a{padding:13px 14px;border-radius:11px;color:#d9d3de;transition:.2s}.sidebar nav a:hover{color:#fff;background:rgba(255,255,255,.08);transform:translateX(3px)}.sidebar-user{margin-top:auto;padding:14px 8px 0;border-top:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px}.sidebar-user>span{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#494150}.sidebar-user div{min-width:0;display:grid}.sidebar-user b,.sidebar-user small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-user small{color:#a9a1af;font-size:.68rem}.app{margin-left:265px;min-height:100vh;padding:32px clamp(22px,4vw,58px) 60px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.topbar small{color:var(--muted)}.topbar h1{margin:5px 0 0;font-size:clamp(1.8rem,3vw,2.5rem);letter-spacing:-.045em}.menu{display:none}.quick-add,.primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 19px;border:0;border-radius:13px;background:linear-gradient(115deg,var(--purple),var(--purple2) 55%,var(--peach));color:#fff;font-weight:750;box-shadow:0 13px 30px rgba(118,88,233,.22)}.primary.small{min-height:42px}.alert{padding:14px 18px;margin:15px 0;border-radius:12px}.alert.success{background:#e9f8f0;color:#166f48}.alert.error{background:#fff0f2;color:#9d3140}.eyebrow{color:var(--purple);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.16em}.filterbar{min-height:64px;padding:10px 14px;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.7)}.filterbar form{display:flex;align-items:end;gap:10px}.filterbar label{display:grid;gap:4px;color:var(--muted);font-size:.72rem}.filterbar input,.filterbar select{height:38px;border:1px solid var(--line);border-radius:9px;padding:0 11px;background:#fff}.filterbar button{height:38px;border:0;border-radius:9px;padding:0 15px;background:var(--ink);color:#fff}.filterbar>span{color:var(--muted);font-size:.78rem}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px;margin-bottom:22px}.metric-grid article{padding:25px;border:1px solid rgba(255,255,255,.8);border-radius:22px;background:var(--card);box-shadow:var(--shadow)}.metric-grid span{display:block;color:var(--muted);font-size:.78rem}.metric-grid strong{display:block;margin:14px 0 18px;font-size:clamp(1.7rem,2.5vw,2.4rem);letter-spacing:-.045em}.metric-grid i{width:fit-content;padding:6px 9px;border-radius:999px;font-size:.68rem;font-style:normal}.metric-grid i.purple{color:#6746d2;background:#eee9ff}.metric-grid i.peach{color:#b45d43;background:#fff0e9}.metric-grid i.green{color:#19744d;background:#eaf8f1}.metric-grid i.red{color:#a13b48;background:#fff0f2}.panel{padding:26px;margin:20px 0;border:1px solid var(--line);border-radius:22px;background:var(--card);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.panel-head h2{margin:6px 0 0;font-size:1.35rem;letter-spacing:-.035em}.panel-head>a{color:var(--purple);font-weight:700}.analytics-table{overflow-x:auto}.table-head,.table-row{min-width:820px;display:grid;grid-template-columns:1.5fr .55fr .85fr .85fr .85fr .8fr;align-items:center;gap:16px;padding:14px 10px}.table-head{color:var(--muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.09em}.table-row{border-top:1px solid var(--line);font-size:.84rem}.table-row:hover{background:#faf8ff}.table-row>span{min-width:0;display:grid;gap:3px}.table-row small{color:var(--muted);overflow:hidden;text-overflow:ellipsis}.money-good{color:var(--green)}.money-due{color:var(--red)}.progress{display:block;width:100%;height:6px;border-radius:999px;background:#ece8ef;overflow:hidden}.progress>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--purple),var(--peach))}.order-list{display:grid}.order-list>a{display:grid;grid-template-columns:42px 1fr auto auto;align-items:center;gap:14px;padding:15px 4px;border-top:1px solid var(--line)}.order-mark,.avatar{display:grid;place-items:center;border-radius:13px;background:#eee9ff;color:var(--purple);font-weight:800}.order-mark{width:42px;height:42px}.order-list div{min-width:0;display:grid;gap:4px}.order-list small{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.order-money{text-align:right}.status{display:inline-flex;width:fit-content;padding:6px 9px;border-radius:999px;background:#f0edf2;color:#68616d;font-size:.7rem}.status.active,.status.completed{background:#e9f8f1;color:#197149}.status.disabled,.status.cancelled{background:#fff0f2;color:#a03745}.status.new{background:#eee9ff;color:#6648c8}.status.in_progress{background:#fff3df;color:#9b6415}.status.submitted{background:#e7f5ff;color:#2872a1}.split-layout{display:grid;grid-template-columns:360px minmax(0,1fr);gap:20px;align-items:start}.grow{min-width:0}.form-panel{position:sticky;top:20px}.form-panel label,.order-form>label,.order-form .form-grid label,.install-card label,.auth-card label{display:grid;gap:8px;margin:15px 0;color:#4b4550;font-size:.8rem;font-weight:700}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:11px;padding:0 13px;background:#fff;color:var(--ink);outline:none}input,select{height:47px}textarea{padding:13px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--purple);box-shadow:0 0 0 3px rgba(118,88,233,.1)}label small{color:var(--muted);font-weight:400}.phone-grid,.form-grid{display:grid;grid-template-columns:1fr 2fr;gap:13px}.form-grid.three{grid-template-columns:repeat(3,1fr)}.cancel{display:block;margin-top:13px;text-align:center;color:var(--muted)}.search{display:flex}.search input{border-radius:10px 0 0 10px}.search button{border:0;border-radius:0 10px 10px 0;background:var(--ink);color:#fff}.client-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.client-grid article{padding:18px;display:grid;grid-template-columns:46px 1fr auto;gap:12px;border:1px solid var(--line);border-radius:17px;background:#fff}.avatar{width:46px;height:46px}.client-grid h3{margin:1px 0;font-size:1rem}.client-grid p,.client-grid small{margin:4px 0;color:var(--muted);font-size:.76rem}.client-stats{text-align:right}.client-stats span{display:block;color:var(--green);font-size:.76rem}.client-grid footer{grid-column:1/-1;padding-top:12px;display:flex;gap:12px;border-top:1px solid var(--line);color:var(--muted);font-size:.74rem}.client-grid footer span{margin-right:auto}.client-grid footer a{color:var(--purple);font-weight:700}.team-list{display:grid}.team-list article{display:grid;grid-template-columns:44px 1fr auto .7fr auto auto;align-items:center;gap:13px;padding:14px 0;border-top:1px solid var(--line)}.team-list article>div{display:grid}.team-list small{color:var(--muted);font-size:.74rem}.team-list a,.team-list button{border:0;background:transparent;color:var(--purple);font-weight:700}.team-list button.danger{color:var(--red)}.order-form{max-width:1200px}.payment-box{padding:23px;margin:25px 0;border:1px solid #ddd4fa;border-radius:18px;background:linear-gradient(135deg,#f3efff,#fff8f5)}.payment-box h3{margin:7px 0}.live-balance{padding-top:12px;text-align:right;color:var(--muted)}.live-balance strong{color:var(--red);font-size:1.2rem}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:20px}.form-actions>a{color:var(--muted)}.orders-table .table-row,.orders-table .table-head{grid-template-columns:1.6fr 1.1fr .7fr .8fr .8fr .8fr}.order-hero{padding:28px;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;gap:25px;border-radius:24px;background:radial-gradient(circle at 82% 20%,rgba(255,153,119,.32),transparent 27%),linear-gradient(135deg,#ece6ff,#fff);box-shadow:var(--shadow)}.order-hero h2{margin:7px 0;font-size:clamp(1.25rem,2.5vw,2rem);overflow-wrap:anywhere}.order-hero p{color:var(--muted)}.order-hero form label{display:grid;gap:6px;font-size:.72rem}.copy-line{display:flex;align-items:center;gap:12px}.copy-line button{white-space:nowrap;border:1px solid #d8cef7;border-radius:9px;padding:8px 11px;background:#fff;color:var(--purple);font-weight:700}.detail-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:20px;align-items:start}.detail-grid aside .panel{margin-top:0}.info-card{margin-top:0}.info-card dl{display:grid;grid-template-columns:repeat(2,1fr);gap:0 25px}.info-card dl>div{padding:14px 0;border-top:1px solid var(--line)}.info-card dt{color:var(--muted);font-size:.7rem}.info-card dd{margin:5px 0 0;font-weight:650}.note{padding:15px;border-radius:12px;background:#f7f4ff;color:#5f566c;line-height:1.6}.payment-summary>span{color:var(--muted)}.payment-summary>strong{display:block;margin:10px 0 20px;font-size:2.3rem}.payment-summary>div{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px}.payment-summary>div span{padding:12px;border-radius:11px;background:#f8f6fa;color:var(--muted);font-size:.72rem}.payment-summary>div b{display:block;color:var(--ink);font-size:.95rem}.payment-summary>small{display:block;margin-top:12px;color:var(--muted)}.payment-ledger article{display:grid;grid-template-columns:42px 1fr auto auto auto;align-items:center;gap:13px;padding:15px 0;border-top:1px solid var(--line)}.payment-ledger article>span{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:#e9f8f1;color:var(--green)}.payment-ledger article.reversal>span{background:#fff0f2;color:var(--red)}.payment-ledger article div{display:grid}.payment-ledger small{color:var(--muted)}.payment-ledger article>a,.payment-ledger button{border:0;background:transparent;color:var(--purple);font-weight:700}.payment-ledger button{color:var(--red)}.empty{padding:35px;text-align:center;color:var(--muted)}.auth-page{min-height:100vh;display:grid;place-items:center;padding:25px;background:radial-gradient(circle at 12% 15%,#e3d9ff,transparent 28%),radial-gradient(circle at 88% 80%,#ffe0d4,transparent 27%),#faf9fd}.auth-card,.install-card{width:min(470px,100%);padding:42px;border:1px solid rgba(255,255,255,.9);border-radius:28px;background:rgba(255,255,255,.88);box-shadow:0 35px 90px rgba(50,38,80,.16);backdrop-filter:blur(20px)}.install-card{width:min(760px,100%)}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:40px}.auth-brand>span{color:#fff}.auth-card h1,.install-card h1{margin:15px 0 8px;font-size:clamp(2.5rem,6vw,4rem);line-height:1;letter-spacing:-.06em}.auth-card>p,.install-card>p{color:var(--muted);line-height:1.6}.auth-card form{display:grid;gap:7px;margin-top:28px}.install-card h2{margin:30px 0 8px;font-size:1rem}.install-card .primary,.auth-card .primary{width:100%;margin-top:14px}
@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.split-layout{grid-template-columns:1fr}.form-panel{position:static}.client-grid{grid-template-columns:1fr}.form-grid.three{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.sidebar{transform:translateX(-100%);transition:.25s}.nav-open .sidebar{transform:none;box-shadow:30px 0 70px rgba(0,0,0,.2)}.app{margin-left:0;padding:22px 16px 50px}.menu{display:block;border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff}.detail-grid{grid-template-columns:1fr}.info-card dl{grid-template-columns:1fr}.payment-ledger article{grid-template-columns:38px 1fr auto}.payment-ledger article>a,.payment-ledger article>form{grid-column:2}.team-list article{grid-template-columns:44px 1fr auto}.team-list article>div:nth-of-type(2),.team-list article>a,.team-list article>form{grid-column:2}}
@media(max-width:560px){.topbar{align-items:flex-start}.quick-add{font-size:0;width:44px;min-height:44px;padding:0}.quick-add:after{content:"+";font-size:1.3rem}.metric-grid{grid-template-columns:1fr 1fr;gap:10px}.metric-grid article{padding:18px 15px}.metric-grid strong{font-size:1.35rem}.filterbar{align-items:stretch;flex-direction:column}.filterbar form{align-items:stretch;display:grid;grid-template-columns:1fr 1fr}.filterbar form button{grid-column:1/-1}.order-list>a{grid-template-columns:38px 1fr auto}.order-list .status{display:none}.order-money{grid-column:2;text-align:left}.phone-grid,.form-grid,.form-grid.three{grid-template-columns:1fr}.client-grid article{grid-template-columns:42px 1fr}.client-stats{grid-column:2;text-align:left}.order-hero{align-items:stretch;flex-direction:column}.copy-line{align-items:flex-start;flex-direction:column}.payment-summary>div{grid-template-columns:1fr}.auth-card,.install-card{padding:30px 20px}.panel{padding:20px}.metric-grid i{display:none}}