:root{
  --bg:#050b12;--panel:#071522;--panel2:#091b2a;--line:#1c3446;--line2:#27485f;
  --text:#f4f7fb;--muted:#92a8ba;--blue:#1687ff;--cyan:#21b5ff;--orange:#ff9700;
  --red:#ff3b3b;--green:#20c866;--purple:#8d4dff;--yellow:#ffcc22;
  --sidebar:#03101a;--shadow:0 12px 34px rgba(0,0,0,.38)
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}
body{background:
 radial-gradient(circle at 85% 0,#0c2c4728,transparent 28%),
 linear-gradient(180deg,#050b12,#07111b)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}
.app{display:grid;grid-template-columns:258px minmax(0,1fr);min-height:100vh}
.login-view{min-height:100vh;display:grid;place-items:center;padding:22px;background:
 radial-gradient(circle at 50% 15%,#12395b,transparent 36%),#03080d}
.login-card{width:min(430px,100%);padding:30px;background:linear-gradient(145deg,#071522,#04101a);
 border:1px solid #1c3c54;border-radius:22px;box-shadow:0 30px 100px #000a}
.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.brand-mark{width:62px;height:62px;border-radius:16px;display:grid;place-items:center;
 background:linear-gradient(145deg,#0a5de9,#06285c);border:1px solid #2e8fff;
 box-shadow:0 0 24px #167fff55;color:white;font:900 24px/1 "Arial Narrow",sans-serif;letter-spacing:.04em}
.brand-mark.small{width:48px;height:48px;border-radius:12px;font-size:19px}
.login-card h1{margin:0;font:800 30px/1 "Arial Narrow",sans-serif;letter-spacing:.03em}
.login-card p{color:var(--muted)}
.login-card label{display:grid;gap:7px;margin:14px 0;font-weight:800;font-size:.86rem}
input,select,textarea{width:100%;background:#06121d;color:var(--text);border:1px solid #264257;border-radius:10px;padding:11px}
textarea{min-height:96px;resize:vertical}
.demo-warning{padding:11px;border:1px solid #6d4b12;background:#271b08;color:#ffd37d;border-radius:10px;font-size:.83rem}
.primary,.action-blue{border:1px solid #2f91ff;background:linear-gradient(180deg,#167fff,#0759c7);color:#fff;border-radius:10px;padding:11px 14px;font-weight:800}
.secondary{border:1px solid var(--line2);background:#0a1b29;color:#dce8f2;border-radius:10px;padding:10px 13px}
.danger{border:1px solid #9f3030;background:#341313;color:#ffaaaa;border-radius:10px;padding:10px 13px}
aside{height:100vh;position:sticky;top:0;display:flex;flex-direction:column;overflow:auto;padding:12px;
 background:linear-gradient(180deg,#020d16,#03121e);border-right:1px solid #153146;z-index:30}
.brand{display:flex;align-items:center;gap:11px;padding:4px 2px 13px;border-bottom:1px solid #173145}
.brand strong{display:block;font:900 19px/1 "Arial Narrow",sans-serif;letter-spacing:.04em}
.brand small{display:block;color:#ff3d3d;font-size:.73rem;font-weight:900;margin-top:4px}
.brand em{display:block;color:#9fb2c1;font-size:.58rem;font-style:normal;letter-spacing:.12em;margin-top:3px}
.global-search{margin:12px 0;padding:10px 11px;background:#061722;border-color:#23445b}
.nav-label{font-size:.65rem;color:#6f8a9f;font-weight:900;letter-spacing:.12em;margin:12px 8px 5px}
.nav-button,.workflow-button,.logout{width:100%;border:0;background:transparent;color:#c9d6e1;border-radius:8px;padding:10px 11px;text-align:left;margin:2px 0}
.nav-button,.workflow-button{display:flex;align-items:center;justify-content:space-between;gap:8px}
.nav-button:hover,.nav-button.active,.workflow-button:hover,.workflow-button.active{background:linear-gradient(90deg,#0a4dbf,#0a3a88);color:#fff;box-shadow:0 0 18px #167fff22}
.nav-left{display:flex;align-items:center;gap:10px}.nav-icon{width:18px;text-align:center}
.workflow-count,.nav-count{min-width:25px;text-align:center;border-radius:999px;padding:2px 7px;font-size:.72rem;font-weight:900;background:#15314a}
.count-red{background:#cf2424}.count-orange{background:#c66c00}.count-purple{background:#6423b9}.count-green{background:#138c3e}
.shop-status{margin-top:12px;padding:14px;border-radius:10px;background:linear-gradient(145deg,#072b19,#06190f);border:1px solid #17743d}
.shop-status span{display:block;color:#a8cbb5;font-size:.68rem;font-weight:900;letter-spacing:.08em}
.shop-status strong{display:flex;align-items:center;gap:8px;font-size:1.55rem;color:#7ee69e;margin:6px 0}
.status-dot{width:10px;height:10px;background:#35d86f;border-radius:50%;box-shadow:0 0 12px #35d86f}
.shop-status small{color:#9bb4a3}
.logout{margin-top:auto;border:1px solid #1b3d53}
main{min-width:0}
header{height:72px;position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:14px;padding:0 18px;
 background:#04101aee;backdrop-filter:blur(14px);border-bottom:1px solid #173245}
.menu-button{display:none;border:1px solid #24465e;background:#071725;color:#fff;border-radius:9px;padding:9px 11px}
.title-block h2{margin:0;font:900 25px/1 "Arial Narrow",sans-serif;letter-spacing:.04em}
.title-block p{margin:4px 0 0;color:var(--cyan);font-size:.79rem}
.header-tools{margin-left:auto;display:flex;align-items:center;gap:10px}
.clock-box,.user-box,.notification-box{border-left:1px solid #173245;padding-left:14px}
.clock-box{font-size:.72rem;color:#b9c8d5}.clock-box strong{display:block;color:white;font-size:.84rem}
.user-box{display:flex;align-items:center;gap:9px}.avatar{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:#143047;border:1px solid #3b7194;font-weight:900}
.user-box strong{display:block;font-size:.82rem}.user-box small{color:#99adbd}
.notification-box{position:relative;font-size:1.15rem}.notification-badge{position:absolute;right:-8px;top:-9px;background:var(--red);font-size:.6rem;font-weight:900;border-radius:999px;padding:2px 5px}
#content,.ro-workspace{padding:14px 16px 60px}
.kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.kpi{position:relative;min-height:135px;padding:16px;border-radius:11px;border:1px solid;overflow:hidden;box-shadow:var(--shadow)}
.kpi:after{content:"";position:absolute;width:95px;height:95px;border:18px solid currentColor;border-radius:50%;right:-42px;bottom:-48px;opacity:.08}
.kpi-blue{color:#66a9ff;border-color:#1266c4;background:linear-gradient(145deg,#0b3977,#071b32)}
.kpi-orange{color:#ffb02f;border-color:#c66c00;background:linear-gradient(145deg,#5b2c00,#261500)}
.kpi-red{color:#ff6969;border-color:#c72525;background:linear-gradient(145deg,#5b1010,#240909)}
.kpi-green{color:#55dd84;border-color:#139343;background:linear-gradient(145deg,#063f21,#051d11)}
.kpi-purple{color:#ab75ff;border-color:#6f32c6;background:linear-gradient(145deg,#281052,#120926)}
.kpi .label{color:#e6edf4;font-size:.73rem;font-weight:900;letter-spacing:.04em}.kpi strong{display:block;color:white;font-size:2.2rem;margin:8px 0 1px}.kpi small{color:#d1dbe4}.kpi .trend{position:absolute;bottom:13px;left:16px;color:#60da81;font-size:.72rem}.kpi .symbol{position:absolute;right:16px;top:28px;font-size:2.1rem}
.dashboard-grid{display:grid;grid-template-columns:1fr 1.2fr 1.15fr;gap:12px;margin-top:12px}
.panel{background:linear-gradient(145deg,#081a29,#06131f);border:1px solid #244257;border-radius:10px;box-shadow:0 8px 24px #0003;overflow:hidden}
.panel-head{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-bottom:1px solid #1c394d}
.panel-head h3{margin:0;font:900 15px/1 "Arial Narrow",sans-serif;letter-spacing:.04em}
.panel-body{padding:10px 14px}.panel-link{padding:9px;text-align:center;border-top:1px solid #1c394d;color:#45b7ff;font-size:.75rem}
.badge{display:inline-block;border-radius:999px;padding:3px 7px;font-size:.66rem;font-weight:900}
.badge.red{background:#cf2727;color:white}.badge.orange{background:#c06a00;color:white}.badge.green{background:#138a3b;color:white}.badge.purple{background:#6622ba;color:white}.badge.blue{background:#0e5db9;color:white}
.list-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:9px 0;border-bottom:1px solid #193247;align-items:center}
.list-row:last-child{border-bottom:0}.list-row b{font-size:.78rem}.list-row p{margin:2px 0 0;color:#a6b8c7;font-size:.71rem}.right{text-align:right}.blue-text{color:#39aaff}.red-text{color:#ff4e4e}.orange-text{color:#ffad20}.green-text{color:#43d875}.purple-text{color:#ac67ff}
.donut-wrap{display:flex;align-items:center;gap:16px;padding:8px 0}
.donut{width:138px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#ef2b2b 0 9%,#ff8d00 9% 28%,#ffca16 28% 40%,#147cff 40% 72%,#6b28be 72% 89%,#21a74f 89%);display:grid;place-items:center;box-shadow:0 0 25px #0008}
.donut:after{content:"";width:76px;aspect-ratio:1;background:#071522;border-radius:50%;border:1px solid #29485d}
.donut-label{position:absolute;text-align:center;z-index:2}.donut-shell{position:relative;display:grid;place-items:center}.donut-label strong{font-size:1.6rem}.donut-label small{display:block;color:#bdd0df}
.legend{display:grid;gap:7px;font-size:.71rem}.legend div{display:flex;gap:7px;align-items:center}.dot{width:8px;height:8px;border-radius:2px}
.tech-row{display:grid;grid-template-columns:100px 1fr 70px;gap:8px;align-items:center;padding:8px 0}.progress{height:5px;background:#173044;border-radius:999px;overflow:hidden}.progress i{display:block;height:100%;border-radius:999px}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.quick{padding:10px 8px;border-radius:8px;border:1px solid;font-weight:800;color:white}.quick.blue{background:#074fa8;border-color:#1687ff}.quick.orange{background:#713900;border-color:#ff9700}.quick.green{background:#075928;border-color:#20c866}.quick.purple{background:#32166a;border-color:#8d4dff}
.bottom-action{position:fixed;left:258px;right:0;bottom:0;z-index:12;height:38px;background:#07121d;border-top:1px solid #1a3649;display:flex;align-items:center;justify-content:center;gap:16px;font-size:.72rem}.bottom-action b{color:#ffc62b}
.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:980px}.data-table th,.data-table td{padding:10px;border-bottom:1px solid #193246;text-align:left;font-size:.76rem;vertical-align:top}.data-table th{color:#88a1b4;font-size:.65rem;text-transform:uppercase;letter-spacing:.06em}.ro-link{border:0;background:transparent;color:#3eb2ff;font-weight:900;padding:0}.row-actions{display:flex;gap:5px;flex-wrap:wrap}.small-button{border:1px solid #2c4b61;background:#0a1d2b;color:#dce7ef;border-radius:7px;padding:6px 8px}
.search-panel{position:fixed;left:258px;right:0;top:72px;z-index:25;background:#071725;border-bottom:1px solid #26475e;box-shadow:0 18px 45px #0009;max-height:55vh;overflow:auto;padding:10px 18px}.search-result{padding:11px;border-bottom:1px solid #1e3b50}.search-result:last-child{border-bottom:0}
.ro-topbar{display:flex;align-items:center;gap:12px;margin-bottom:12px}.ro-back{border:1px solid #28475d;background:#0a1b29;color:white;border-radius:8px;padding:9px 11px}.ro-heading{flex:1}.ro-heading h2{margin:0;font:900 24px/1 "Arial Narrow",sans-serif}.ro-heading p{margin:4px 0 0;color:#8fa7b8}
.ro-hero{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:10px;margin-bottom:10px}.ro-fact{padding:12px;background:#081925;border:1px solid #244459;border-radius:9px}.ro-fact span{display:block;color:#7f9aac;font-size:.62rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.ro-fact b{display:block;margin-top:5px;font-size:.78rem}
.ro-tabs{display:flex;gap:5px;overflow:auto;border-bottom:1px solid #244156;margin-bottom:10px}.ro-tab{border:1px solid transparent;background:transparent;color:#8fa6b7;padding:9px 12px;border-radius:8px 8px 0 0;font-weight:800;white-space:nowrap}.ro-tab.active{color:#48b7ff;background:#081925;border-color:#28485e;border-bottom-color:#081925}
.ro-layout{display:grid;grid-template-columns:1.4fr .6fr;gap:12px}.ro-section{padding:14px;background:#081925;border:1px solid #244459;border-radius:10px;margin-bottom:10px}.ro-section h3{margin:0 0 10px;font:900 15px "Arial Narrow",sans-serif}.ro-note{padding:10px;background:#071522;border-left:3px solid #1687ff;margin-bottom:8px}.ro-line-item{display:grid;grid-template-columns:1fr 100px 110px 50px;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid #1c394c;font-size:.76rem}.ro-total{text-align:right;font-weight:900;font-size:1.1rem;margin-top:10px}.ro-actions{display:flex;gap:7px;flex-wrap:wrap}
.job-card{border:1px solid #28516b;border-radius:10px;margin-bottom:10px;overflow:hidden;background:#061521}.job-header{display:flex;justify-content:space-between;gap:10px;padding:11px;background:#0a2132}.job-body{padding:12px}.job-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.job-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.mini-stat{padding:8px;background:#07111b;border:1px solid #1f3b50;border-radius:7px}.mini-stat span{display:block;font-size:.59rem;color:#8299aa;text-transform:uppercase}.mini-stat b{font-size:.76rem}
dialog{width:min(920px,95vw);border:1px solid #2c5067;border-radius:14px;padding:0;background:#071522;color:white;box-shadow:0 30px 100px #000c}dialog::backdrop{background:#02070bcc}
#roForm,#jobForm,#lineForm{padding:18px}.dialog-header{display:flex;align-items:center;justify-content:space-between}.dialog-header h3{margin:0}.icon-button{border:0;background:transparent;color:white;font-size:1.4rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-grid label{display:grid;gap:5px;font-size:.73rem;font-weight:800}.full{grid-column:1/-1}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.mobile-bottom{display:none}
@media(max-width:1250px){.kpi-grid{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr 1fr}.panel.quick-panel{grid-column:span 2}}
@media(max-width:900px){
 .app{grid-template-columns:1fr}.app aside{position:fixed;left:-280px;width:258px;transition:.2s}.app.open aside{left:0;box-shadow:20px 0 50px #000a}
 .menu-button{display:block}.clock-box{display:none}.search-panel{left:0}.bottom-action{left:0;bottom:56px}
 .dashboard-grid{grid-template-columns:1fr}.panel.quick-panel{grid-column:auto}.ro-layout{grid-template-columns:1fr}
 .header-tools .user-box{display:none}
}
@media(max-width:650px){
 header{height:64px;padding:0 10px}.title-block h2{font-size:19px}.title-block p{font-size:.68rem}.notification-box{padding-left:7px;border-left:0}
 #content,.ro-workspace{padding:10px 10px 112px}
 .kpi-grid{grid-template-columns:1fr}.kpi{min-height:105px}.kpi strong{font-size:1.8rem}.kpi .symbol{top:22px}
 .donut-wrap{flex-direction:column}.ro-hero{grid-template-columns:1fr 1fr}.ro-heading h2{font-size:20px}.ro-topbar{align-items:flex-start;flex-wrap:wrap}
 .job-grid,.form-grid{grid-template-columns:1fr}.full{grid-column:auto}.job-summary{grid-template-columns:1fr 1fr}.ro-line-item{grid-template-columns:1fr 70px}
 .quick-grid{grid-template-columns:1fr 1fr}
 .mobile-bottom{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;height:58px;background:#03101a;border-top:1px solid #1d3d52;z-index:40}
 .mobile-bottom button{border:0;background:transparent;color:#9bb0bf;font-size:.62rem}.mobile-bottom button b{display:block;color:white;font-size:1rem;margin-bottom:2px}
}

.input-action{display:grid;grid-template-columns:1fr auto;gap:6px}.field-status{min-height:15px;color:#48b7ff;font-weight:700}.invoice-sheet{background:white;color:#17212b;border-radius:8px;padding:32px;max-width:900px;margin:auto}.invoice-head{display:flex;justify-content:space-between;gap:24px;border-bottom:3px solid #123d65;padding-bottom:18px}.invoice-brand h1{margin:0;color:#123d65}.invoice-brand p,.invoice-meta p{margin:3px 0}.invoice-addresses{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:22px 0}.invoice-table{width:100%;border-collapse:collapse}.invoice-table th{background:#123d65;color:#fff}.invoice-table th,.invoice-table td{padding:9px;border-bottom:1px solid #c8d1d9;text-align:left}.invoice-table .money{text-align:right}.invoice-totals{width:min(390px,100%);margin:20px 0 0 auto}.invoice-total-row{display:flex;justify-content:space-between;padding:7px;border-bottom:1px solid #c8d1d9}.invoice-total-row.grand{font-size:1.25rem;font-weight:900;background:#e8f0f6}.catalog-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 180px auto;gap:8px;margin-bottom:12px}.stock-low{color:#ff5757;font-weight:900}.stock-good{color:#4bdd7d;font-weight:900}.report-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.report-card{padding:16px;border:1px solid #294b62;background:#081925;border-radius:10px}.report-card span{display:block;color:#8da6b8;font-size:.7rem;text-transform:uppercase;font-weight:900}.report-card b{display:block;font-size:1.7rem;margin:7px 0}.report-card button{border:0;background:transparent;color:#46b5ff;padding:0}.report-section{margin-top:12px}.report-bar{display:grid;grid-template-columns:140px 1fr 70px;gap:10px;align-items:center;margin:10px 0}.invoice-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-bottom:10px}@media(max-width:800px){.report-grid{grid-template-columns:1fr 1fr}.catalog-toolbar{grid-template-columns:1fr}.invoice-sheet{padding:16px}.invoice-head,.invoice-addresses{grid-template-columns:1fr;display:grid}}@media print{body *{visibility:hidden}.invoice-sheet,.invoice-sheet *{visibility:visible}.invoice-sheet{position:absolute;left:0;top:0;width:100%;max-width:none}.invoice-actions,aside,header,.bottom-action,.mobile-bottom{display:none!important}}

.job-status-select{width:auto;min-width:145px;padding:6px 8px;border-radius:7px;font-size:.72rem;font-weight:800}
.invoice-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.invoice-toolbar label{display:flex;align-items:center;gap:7px;font-size:.72rem;font-weight:800}
.invoice-toolbar input,.invoice-toolbar select{width:auto;min-width:120px;padding:8px}
.payment-history{margin-top:16px;border-top:1px solid #cad3da;padding-top:10px;color:#152330}
.payment-history table{width:100%;border-collapse:collapse}
.payment-history th,.payment-history td{padding:7px;border-bottom:1px solid #d9e0e5;text-align:left;font-size:.75rem}
.payment-status{font-weight:900;padding:4px 9px;border-radius:999px;display:inline-block}
.payment-status.paid{background:#c7f3d5;color:#075b25}
.payment-status.partial{background:#ffe7b7;color:#754300}
.payment-status.unpaid{background:#ffd0d0;color:#7a1111}
@media print{.invoice-toolbar,.invoice-actions,.ro-topbar,.ro-tabs,header,aside,.bottom-action,.mobile-bottom{display:none!important}.app{display:block}.ro-workspace{padding:0}.invoice-sheet{box-shadow:none;border:0;margin:0;max-width:none}}

.kpi.clickable{cursor:pointer;transition:transform .16s,border-color .16s}.kpi.clickable:hover{transform:translateY(-2px);filter:brightness(1.08)}
.report-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.report-toolbar select,.report-toolbar input{width:auto}
.report-library{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.report-group{background:#081925;border:1px solid #294b62;border-radius:10px;overflow:hidden}.report-group h3{margin:0;padding:12px 14px;background:#0b2233;border-bottom:1px solid #294b62}.report-link{display:flex;width:100%;justify-content:space-between;gap:10px;padding:10px 14px;border:0;border-bottom:1px solid #173449;background:transparent;color:#dce8f1;text-align:left}.report-link:hover{background:#0c2c42;color:#51bbff}.report-link:last-child{border-bottom:0}
.statement{background:#fff;color:#17212b;border-radius:10px;padding:24px;max-width:980px;margin:auto}.statement-head{display:flex;justify-content:space-between;border-bottom:3px solid #173f60;padding-bottom:14px}.statement h1,.statement h2{margin:0}.statement-section{margin-top:18px}.statement-row{display:grid;grid-template-columns:1fr 130px;padding:7px 10px;border-bottom:1px solid #d8dfe4}.statement-row.indent span:first-child{padding-left:22px}.statement-row.total{font-weight:900;border-top:2px solid #526675}.statement-row.grand{font-size:1.15rem;font-weight:900;background:#e6eef4;border-top:3px double #263c4e}.negative{color:#a51616}.positive{color:#08772e}
.drill-table{width:100%;border-collapse:collapse}.drill-table th,.drill-table td{padding:9px;border-bottom:1px solid #1d3a4f;text-align:left;font-size:.76rem}.report-back{margin-bottom:10px}.expense-actions{display:flex;justify-content:flex-end;margin-bottom:10px}
@media(max-width:800px){.report-library{grid-template-columns:1fr}.kpi{min-height:150px;padding:18px 16px 42px}.kpi strong{margin-top:12px}.kpi small{display:block;margin-top:8px;line-height:1.3}.kpi .trend{bottom:15px;left:16px}.statement{padding:14px}.statement-head{display:block}.statement-row{grid-template-columns:1fr 105px}.report-toolbar{align-items:stretch}.report-toolbar>*{width:100%!important}}