:root{--bg:#080a0b;--panel:#101315;--panel2:#15191c;--line:#2b3033;--gold:#f4b62d;--gold2:#d99a12;--text:#f4f5f5;--muted:#a5aaad;--green:#49b963;--red:#ef5454;--blue:#4aa3ff;--orange:#f28b2d}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif;min-height:100%}body{overflow-x:hidden}.hidden{display:none!important}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:100vh;background:linear-gradient(#090b0d,#0d0f10)}
.sidebar{position:sticky;top:0;height:100vh;border-right:1px solid #2a2d2f;background:linear-gradient(180deg,#111416 0%,#0a0c0e 70%);display:flex;flex-direction:column}.brand{height:118px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #292d2f;padding:18px}.brand img{max-width:165px;max-height:86px;object-fit:contain}.sidebar nav{padding:12px 0}.sidebar nav a{display:flex;align-items:center;gap:16px;padding:14px 24px;color:#e8e8e8;text-decoration:none;border-left:4px solid transparent;font-size:15px}.sidebar nav a.active{background:linear-gradient(90deg,rgba(244,182,45,.28),rgba(244,182,45,.05));border-left-color:var(--gold);color:#fff}.sidebar nav a:hover{background:#171b1d}.sidebar-copy{margin-top:auto;padding:24px 28px 30px;color:#d7d8d9;line-height:1.45;font-size:12px;letter-spacing:.08em;background:linear-gradient(180deg,transparent,rgba(255,255,255,.02))}.sidebar-copy i{display:block;width:40px;border-top:3px solid var(--gold);margin-top:15px}
.main-shell{min-width:0}.topbar{height:62px;display:flex;align-items:center;gap:20px;padding:0 26px;border-bottom:1px solid #282c2e;background:#0d0f11;position:sticky;top:0;z-index:20}.search-wrap{flex:1;max-width:460px;background:#171a1d;border:1px solid #2f3437;border-radius:6px;padding:10px 13px;color:#a9adb0}.search-wrap input{width:calc(100% - 24px);margin-left:8px;background:transparent;border:0;outline:0;color:#fff}.top-actions{margin-left:auto;display:flex;align-items:center;gap:28px;color:var(--gold);font-weight:700}.top-actions .reliable{margin-left:auto}.top-actions button{border:1px solid #41474a;background:#171a1c;color:#ddd;padding:8px 12px;border-radius:6px;font-size:12px}
#view{padding-bottom:36px}.hero{min-height:220px;padding:26px 42px;display:flex;align-items:center;position:relative;overflow:hidden;border-bottom:1px solid #31363a;background:linear-gradient(90deg,rgba(5,7,8,.98) 0%,rgba(5,7,8,.86) 38%,rgba(5,7,8,.35) 73%,rgba(5,7,8,.65) 100%),url('../assets/hero-truck.jpg') center/cover no-repeat}.hero.small{min-height:180px}.hero h1{font-size:42px;line-height:.98;margin:4px 0 12px;max-width:760px;text-transform:uppercase;letter-spacing:-.035em;font-weight:900}.hero h1 span{color:var(--gold)}.hero .eyebrow{color:var(--gold);font-weight:800;margin:0 0 6px}.hero p{font-size:18px;max-width:700px;margin:0;color:#f4f4f4}.hero-note{position:absolute;right:42px;top:32px;text-align:right;font-weight:800;font-size:14px;line-height:1.4;color:#fff}.hero-note b{color:var(--gold);display:block;font-size:18px}
.content{padding:22px 24px}.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.kpi{background:linear-gradient(180deg,#171b1e,#111416);border:1px solid #2c3235;border-radius:7px;padding:16px 18px;display:flex;gap:14px;align-items:center}.kpi .icon{width:42px;height:42px;border:1px solid #51431a;color:var(--gold);background:#1a1710;border-radius:6px;display:grid;place-items:center;font-size:23px}.kpi small{display:block;color:#c0c4c6;margin-bottom:4px}.kpi strong{font-size:28px}.kpi em{font-size:12px;color:var(--green);font-style:normal;margin-left:8px}.toolbar{display:flex;gap:10px;align-items:center;margin:14px 0 18px;flex-wrap:wrap}.toolbar input,.toolbar select{background:#15191b;border:1px solid #33383c;color:#eee;border-radius:5px;padding:10px 12px;min-width:150px}.btn{border:1px solid #494f52;background:#171a1c;color:#fff;padding:10px 14px;border-radius:5px;font-weight:700}.btn.gold{background:linear-gradient(#ffc84f,#edae22);color:#111;border-color:#f6c44f}.btn.green{background:#1c7e3d;border-color:#279b4d}.btn.danger{background:#5e2525;border-color:#8e3535}.panel{background:linear-gradient(180deg,#131719,#0f1214);border:1px solid #2b3033;border-radius:7px;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid #2c3134}.panel-head h2{font-size:16px;margin:0}.panel-head a,.panel-head button{color:var(--gold);text-decoration:none;background:none;border:0}.dashboard-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:14px}.dashboard-grid .wide{grid-column:1/-1}.activity-list,.simple-list{list-style:none;margin:0;padding:0}.activity-list li,.simple-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 15px;border-bottom:1px solid #252a2d}.activity-list li:last-child,.simple-list li:last-child{border-bottom:0}.activity-list small,.simple-list small{color:var(--muted)}.activity-list b{color:#fff}.charts{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px}.donut-wrap{display:flex;align-items:center;gap:24px}.donut{width:130px;height:130px;border-radius:50%;background:conic-gradient(var(--gold) 0 42%,var(--green) 42% 67%,#8a8e91 67% 84%,#9b6d31 84% 94%,#ececec 94%);display:grid;place-items:center}.donut:after{content:attr(data-label);white-space:pre;width:76px;height:76px;border-radius:50%;background:#111416;display:grid;place-items:center;text-align:center;font-weight:800;font-size:18px}.legend{display:grid;gap:8px;color:#ddd;font-size:13px}.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;background:var(--gold)}
.kanban{display:grid;grid-template-columns:repeat(6,minmax(220px,1fr));gap:8px;overflow-x:auto;padding-bottom:10px}.lane{background:#101315;border:1px solid #2c3134;border-radius:6px;min-height:460px}.lane-head{padding:11px 12px;border-bottom:3px solid var(--gold);display:flex;justify-content:space-between;font-weight:800}.lane.won .lane-head{border-color:var(--green)}.lane.lost .lane-head{border-color:var(--red)}.lead-card{margin:8px;background:#181c1e;border:1px solid #343a3e;border-radius:6px;overflow:hidden}.lead-img{height:58px;background:linear-gradient(0deg,rgba(0,0,0,.28),rgba(0,0,0,.05)),url('../assets/service-tree.webp') center/cover}.lead-card[data-service*="Land"] .lead-img{background-image:url('../assets/service-landscaping.webp')}.lead-card[data-service*="Construct"] .lead-img{background-image:url('../assets/service-construction.webp')}.lead-card[data-service*="Stump"] .lead-img{background-image:url('../assets/service-stump.webp')}.lead-body{padding:9px 10px}.lead-body strong{display:block}.lead-body small{display:block;color:#c0c3c5;margin:4px 0}.lead-meta{display:flex;justify-content:space-between;color:#aeb3b6;font-size:11px;margin-top:9px}.pill{display:inline-flex;align-items:center;border-radius:999px;padding:3px 8px;font-size:10px;font-weight:800;text-transform:uppercase;background:#393e42}.pill.hot{background:#c83b3b}.pill.low,.pill.won{background:#278e48}.pill.medium{background:#c38b21;color:#111}.pill.lost{background:#5a5f63}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:920px}.data-table th,.data-table td{padding:11px 12px;border-bottom:1px solid #262b2e;text-align:left;font-size:13px}.data-table th{color:#b7bdc0;background:#121517;font-size:11px;text-transform:uppercase;letter-spacing:.04em}.data-table tr:hover td{background:#151a1c}.progress{height:8px;border-radius:8px;background:#454a4d;overflow:hidden;min-width:110px}.progress i{display:block;height:100%;background:var(--gold)}.status{font-size:10px;font-weight:800;padding:5px 9px;border-radius:999px;background:#34393c}.status.in-progress,.status.completed{background:#278e48}.status.scheduled{background:#d5d7d8;color:#111}.status.quoted{background:#306da0}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.customer-card,.quote-card{padding:16px;background:#131719;border:1px solid #2c3134;border-radius:7px}.customer-card h3,.quote-card h3{margin:0 0 8px}.customer-card p,.quote-card p{color:#bfc4c6;margin:5px 0;font-size:13px}.customer-card .tags{margin-top:12px;display:flex;gap:6px;flex-wrap:wrap}.tag{border:1px solid #67551f;color:#f3bf48;border-radius:999px;padding:4px 8px;font-size:10px}.calendar{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid #2d3235;border-left:1px solid #2d3235}.day{min-height:120px;border-right:1px solid #2d3235;border-bottom:1px solid #2d3235;padding:8px;background:#101315}.day .num{color:#bbb;font-size:12px}.event{margin-top:7px;padding:6px 8px;border-left:3px solid var(--gold);background:#342a12;font-size:11px;border-radius:3px}.event.tree{border-color:var(--green);background:#173820}.event.construct{border-color:var(--blue);background:#15334b}.event.stump{border-color:var(--orange);background:#4b2814}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(90deg,rgba(5,7,8,.94),rgba(5,7,8,.78)),url('../assets/hero-truck.jpg') center/cover}.login-card{width:min(480px,100%);background:rgba(12,14,15,.96);border:1px solid #363b3e;border-top:4px solid var(--gold);border-radius:10px;padding:32px;box-shadow:0 28px 80px rgba(0,0,0,.5)}.login-card img{width:180px;height:90px;object-fit:contain;display:block;margin:0 0 16px}.login-card h1{font-size:34px;line-height:1.05;margin:0 0 12px;text-transform:uppercase}.login-card h1 span{color:var(--gold)}.login-card .eyebrow{color:var(--gold);font-weight:800;letter-spacing:.08em}.login-copy{color:#c4c8ca;line-height:1.45}.login-card label{display:grid;gap:6px;margin:13px 0;font-size:12px;color:#d8d8d8}.login-card input{background:#171a1c;border:1px solid #373c3f;color:#fff;padding:12px;border-radius:5px}.login-card button{width:100%;margin-top:8px;background:var(--gold);color:#111;border:0;border-radius:5px;padding:12px;font-weight:900}.login-card small{display:block;margin-top:18px;color:#aaa;text-align:center}.form-error{min-height:18px;color:#ff7878;font-size:12px}.modal{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.74);display:grid;place-items:center;padding:20px}.modal-card{width:min(620px,96vw);max-height:90vh;overflow:auto;background:#111517;border:1px solid #3a4043;border-radius:8px;padding:22px;position:relative}.modal-x{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#fff;font-size:26px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{display:grid;gap:5px;color:#cfd3d5;font-size:12px}.form-grid input,.form-grid select,.form-grid textarea{background:#0c0f10;color:#fff;border:1px solid #343a3d;border-radius:5px;padding:10px}.form-grid .full{grid-column:1/-1}.empty{padding:28px;text-align:center;color:#9ca2a5}.section-title{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px}.section-title h2{margin:0}.section-title p{margin:4px 0 0;color:#aeb4b7}.quote-preview{background:#f6f5f1;color:#171717;padding:20px;border-radius:4px}.quote-preview h2{font-size:28px;text-transform:uppercase}.quote-preview h2 span{color:#d59515}.quote-preview table{width:100%;border-collapse:collapse}.quote-preview th,.quote-preview td{border-bottom:1px solid #ccc;padding:7px;text-align:left}.quote-layout{display:grid;grid-template-columns:1.3fr .8fr;gap:14px}.report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.report-card{padding:18px;background:#121618;border:1px solid #2c3134;border-radius:7px}.report-card strong{font-size:30px;display:block}.report-card small{color:#aaa}.bar{height:12px;background:#292f32;border-radius:8px;overflow:hidden;margin:8px 0}.bar i{display:block;height:100%;background:var(--gold)}
@media(max-width:1050px){.app-shell{grid-template-columns:78px minmax(0,1fr)}.brand{height:86px;padding:8px}.brand img{width:64px}.sidebar nav a{padding:14px 20px;justify-content:center}.sidebar nav span,.sidebar-copy{display:none}.top-actions span{display:none}.kpis{grid-template-columns:1fr 1fr}.dashboard-grid,.quote-layout{grid-template-columns:1fr}.cards{grid-template-columns:1fr 1fr}.hero{padding:24px}.hero h1{font-size:34px}.hero-note{display:none}}
@media(max-width:680px){.app-shell{display:block}.sidebar{position:fixed;z-index:50;bottom:0;top:auto;width:100%;height:66px;border:0;border-top:1px solid #34393c}.brand,.sidebar-copy{display:none}.sidebar nav{display:grid;grid-template-columns:repeat(5,1fr);padding:0;height:100%}.sidebar nav a{font-size:18px;padding:8px 2px;border-left:0;border-top:3px solid transparent}.sidebar nav a:nth-child(n+6){display:none}.sidebar nav a.active{border-top-color:var(--gold)}.topbar{height:58px;padding:0 12px}.top-actions{gap:8px}.search-wrap{max-width:none}.content{padding:14px 12px 90px}.hero{min-height:190px;padding:22px 16px}.hero h1{font-size:30px}.hero p{font-size:14px}.kpis{grid-template-columns:1fr 1fr;gap:8px}.kpi{padding:12px}.kpi .icon{display:none}.kpi strong{font-size:23px}.cards{grid-template-columns:1fr}.kanban{grid-template-columns:repeat(6,260px)}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.report-grid{grid-template-columns:1fr}.calendar{min-width:760px}.calendar-wrap{overflow:auto}.top-actions button{padding:7px}.modal{align-items:end;padding:0}.modal-card{width:100%;border-radius:12px 12px 0 0;max-height:86vh}}

/* Visual QA polish */
.ui-icon{width:20px;height:20px;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.search-icon{width:18px;height:18px;vertical-align:middle;fill:none;stroke:#a9adb0;stroke-width:2;stroke-linecap:round}.search-wrap{display:flex;align-items:center}.search-wrap input{width:100%;margin-left:9px}.brand img{max-width:none;width:185px;transform:scale(1.14)}
.hero h1,.section-title h2,.panel-head h2,.kpi strong,.customer-card h3,.quote-card h3,.report-card h3,.lane-head{font-family:"DejaVu Sans Condensed","Arial Narrow",Arial,sans-serif}.hero h1{letter-spacing:-.025em}.sidebar nav a{font-weight:600}.sidebar nav a .ui-icon{width:19px;height:19px;color:#cdd1d3;flex:0 0 19px}.sidebar nav a.active .ui-icon{color:var(--gold)}
.kpi .icon{color:var(--gold)}.kpi .icon .ui-icon{width:23px;height:23px}.activity-list li>span,.simple-list li>span{min-width:0}.activity-list li>span>b,.activity-list li>span>small,.simple-list li>span>b,.simple-list li>span>small{display:block}.activity-list li>span>small,.simple-list li>span>small{margin-top:3px}.activity-list li>small,.simple-list li>span:last-child{text-align:right}.data-table td b,.data-table td small{display:block}.data-table td small{margin-top:3px;color:var(--muted);font-size:11px}.star-rating{display:flex;gap:3px;color:var(--gold);margin-bottom:7px}.star-rating .ui-icon{width:18px;height:18px;fill:rgba(244,182,45,.18);stroke-width:2.2}
.btn,.top-actions button,.login-card button{transition:transform .15s ease,filter .15s ease,border-color .15s ease}.btn:hover,.top-actions button:hover,.login-card button:hover{filter:brightness(1.08);border-color:#697176}.btn:active,.login-card button:active{transform:translateY(1px)}.customer-card,.quote-card,.panel,.kpi{box-shadow:0 1px 0 rgba(255,255,255,.015) inset}.customer-card:hover,.quote-card:hover{border-color:#4a5054;background:#151a1c}

@media(max-width:680px){
 .sidebar{height:72px}.sidebar nav{display:flex;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none}.sidebar nav::-webkit-scrollbar{display:none}.sidebar nav a,.sidebar nav a:nth-child(n+6){display:flex;flex:0 0 76px;min-width:76px;height:72px;flex-direction:column;justify-content:center;gap:3px;padding:6px 4px;font-size:10px;border-top:3px solid transparent}.sidebar nav a span{display:block;white-space:nowrap}.sidebar nav a .ui-icon{width:20px;height:20px}.sidebar nav a.active{background:linear-gradient(180deg,rgba(244,182,45,.22),rgba(244,182,45,.05));border-top-color:var(--gold)}
 .hero{min-height:188px;padding:20px 16px;background:linear-gradient(90deg,rgba(5,7,8,.96),rgba(5,7,8,.7)),url('../assets/hero-truck.jpg') center/cover no-repeat}.hero h1{font-size:28px;line-height:1.02}.hero p{font-size:13px;line-height:1.3}.content{padding-bottom:104px}.section-title{align-items:flex-start;gap:12px}.section-title .btn{flex:0 0 auto}.kpi{min-height:72px}.kpi small{font-size:12px}.topbar{gap:8px}.top-actions button{white-space:nowrap}
 .jobs-table,.invoice-table{min-width:0;display:block}.jobs-table thead,.invoice-table thead{display:none}.jobs-table tbody,.invoice-table tbody{display:block}.jobs-table tr,.invoice-table tr{display:block;margin:0 0 12px;border:1px solid #2c3134;border-radius:7px;background:#111517;overflow:hidden}.jobs-table td,.invoice-table td{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;border-bottom:1px solid #252a2d;padding:8px 12px;text-align:right}.jobs-table td:last-child,.invoice-table td:last-child{border-bottom:0}.jobs-table td:first-child,.invoice-table td:first-child{display:block;text-align:left;padding:12px;font-size:15px;background:#151a1c}.jobs-table td:not(:first-child)::before,.invoice-table td:not(:first-child)::before{color:#92999d;font-size:10px;font-weight:800;letter-spacing:.05em;text-align:left}.jobs-table td:nth-child(2)::before{content:'SERVICE'}.jobs-table td:nth-child(3)::before{content:'LOCATION'}.jobs-table td:nth-child(4)::before{content:'CREW'}.jobs-table td:nth-child(5)::before{content:'EQUIPMENT'}.jobs-table td:nth-child(6)::before{content:'PROGRESS'}.jobs-table td:nth-child(7)::before{content:'DATE'}.jobs-table td:nth-child(8)::before{content:'STATUS'}.jobs-table td:nth-child(9)::before{content:'ACTION'}.invoice-table td:nth-child(2)::before{content:'DESCRIPTION'}.invoice-table td:nth-child(3)::before{content:'AMOUNT'}.invoice-table td:nth-child(4)::before{content:'STATUS'}.invoice-table td:nth-child(5)::before{content:'DUE'}.jobs-table .progress{width:130px;max-width:45vw}.table-wrap{overflow:visible}
}