:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#111827;background:radial-gradient(circle at 8% 0%,rgba(34,197,94,.16),transparent 30rem),radial-gradient(circle at 82% 10%,rgba(37,99,235,.15),transparent 32rem),linear-gradient(135deg,#f7fbff,#eef8f3 48%,#eef5ff);--blue: #2563eb;--blue-dark: #1d4ed8;--green: #16a34a;--green-dark: #15803d;--ink: #0f172a;--muted: #64748b;--line: rgba(148, 163, 184, .28);--glass: rgba(255, 255, 255, .74);--shadow: 0 18px 45px rgba(15, 23, 42, .09)}html{width:100%;overflow-x:clip;-webkit-text-size-adjust:100%;text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;min-height:100vh;width:100%;overflow-x:clip;touch-action:manipulation;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;font-size:16px}button{cursor:pointer;touch-action:manipulation;transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease,color .16s ease,filter .16s ease}button:active{transform:translateY(1px) scale(.99)}.app-shell{min-height:100vh;width:100%;display:grid;grid-template-columns:280px 1fr}.sidebar{position:sticky;top:0;height:100vh;padding:24px;background:linear-gradient(160deg,#0f172af5,#0d3a43f0),radial-gradient(circle at 20% 0%,rgba(34,197,94,.24),transparent 18rem);color:#fff;display:flex;flex-direction:column;gap:24px;box-shadow:12px 0 32px #0f172a24}.brand,.user-chip,.panel-title,.button-row,.badge-row{display:flex;align-items:center;gap:12px}.brand>div:last-child,.user-chip>div{min-width:0;display:grid;gap:2px}.brand-mark,.user-chip span,.terminal-grid span{width:44px;height:44px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--green));color:#fff;font-weight:800;box-shadow:0 10px 28px #2563eb42}.brand span,.user-chip small,.ops-person small,.quick-card small,.vehicle-card span,.panel p,.terminal-header span{color:#64748b}.sidebar .brand span,.sidebar label span{color:#cbd5e1}.role-switch,.filters label,.modal label{display:grid;gap:8px}select,input,textarea{min-width:0;width:100%;border:1px solid #d7dde8;border-radius:8px;padding:11px 12px;background:#fff;color:#111827}.sidebar select{background:#1e293b;color:#fff;border-color:#334155}nav{display:grid;gap:8px}nav button{width:100%;border:0;border-radius:8px;padding:12px;background:transparent;color:#cbd5e1;display:flex;align-items:center;gap:10px;text-align:left;min-width:0}nav button.active,nav button:hover{background:#ffffff1f;color:#fff;box-shadow:inset 0 0 0 1px #ffffff14}main{padding:28px;min-width:0;max-width:100%}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px;min-width:0}.eyebrow{margin:0 0 6px;color:#2563eb;font-weight:750;text-transform:uppercase;letter-spacing:0;font-size:12px}h1,h2,h3,h4,p{margin-top:0}h1{margin-bottom:0;font-size:38px;line-height:1.08}.user-chip{background:var(--glass);border:1px solid rgba(255,255,255,.76);border-radius:8px;padding:10px 14px;min-width:260px;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 14px 36px #0f172a14}.view-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.hero-panel,.panel,.terminal-view{background:var(--glass);border:1px solid rgba(255,255,255,.76);border-radius:8px;padding:22px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:panelIn .28s ease both;min-width:0}.hero-panel{grid-column:1 / -1;display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;background:linear-gradient(135deg,#ffffffe6,#e7f7efe6 45%,#e2eeffeb),radial-gradient(circle at 88% 18%,rgba(34,197,94,.18),transparent 18rem);position:relative;overflow:hidden}.hero-panel:after{content:"";position:absolute;right:-8%;bottom:-42%;width:310px;height:310px;border-radius:999px;background:radial-gradient(circle,rgba(37,99,235,.14),transparent 66%);pointer-events:none}.hero-panel h2{font-size:52px;line-height:1.02;margin-bottom:8px}.punch-button{width:min(42vw,240px);aspect-ratio:1;border:0;border-radius:999px;color:#fff;background:linear-gradient(135deg,var(--green),#22c55e);font-weight:850;font-size:24px;box-shadow:0 20px 40px #16a34a47;position:relative;z-index:1;animation:pulseReady 3.4s ease-in-out infinite}.punch-button.out{background:linear-gradient(135deg,#dc2626,#f97316);box-shadow:0 20px 40px #dc26263d;animation:pulseStop 3.4s ease-in-out infinite}.punch-button:hover{transform:translateY(-2px) scale(1.015);filter:saturate(1.08)}.panel-title{justify-content:space-between;margin-bottom:16px}.panel-title h3,.panel-title h4{margin-bottom:0}.panel-title.wrap{flex-wrap:wrap}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:750;background:#e2e8f0;color:#334155;white-space:nowrap;border:1px solid rgba(148,163,184,.22);transition:transform .16s ease,background-color .16s ease}.badge.success,.alert.success{background:linear-gradient(135deg,#dcfce7,#ecfdf5);color:#166534}.badge.warning,.alert.warning{background:#fef3c7;color:#92400e}.badge.info,.alert.info{background:linear-gradient(135deg,#dbeafe,#eef6ff);color:#1d4ed8}.alert.danger,.badge.danger{background:#fee2e2;color:#b91c1c}.quick-grid,.cards-grid,.vehicle-grid,.vehicle-form,.report-grid,.filters,.terminal-grid,.nfc-actions{display:grid;gap:14px}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-card,.vehicle-card,.config-card,.ops-card,.report-grid article,.terminal-grid button{border:1px solid rgba(226,232,240,.88);border-radius:8px;background:#ffffffd1;padding:16px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .18s ease;min-width:0}.quick-card{min-height:132px;text-align:left;display:grid;align-content:start;gap:8px}.quick-card svg{font-size:26px;color:var(--blue);transition:transform .18s ease,color .18s ease}.quick-card:hover,.vehicle-card:hover,.config-card:hover,.ops-card:hover,.report-grid article:hover{transform:translateY(-3px);border-color:#2563eb47;box-shadow:0 16px 34px #0f172a1a;background:#fffffff0}.quick-card:hover svg{color:var(--green);transform:translateY(-1px) scale(1.08)}.balance-list{display:grid;gap:10px}.balance-list div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #edf0f5;padding-bottom:10px}.alert{border-radius:8px;padding:12px;margin-top:10px;border:1px solid rgba(255,255,255,.68)}.full{width:100%}.full-span{grid-column:1 / -1}.ops-panel{grid-column:1 / -1;background:linear-gradient(135deg,#f0fdf4db,#eff6ffe6),radial-gradient(circle at 94% 10%,rgba(34,197,94,.16),transparent 20rem)}.dashboard-admin{align-items:start}.admin-dashboard{display:grid;gap:12px}.admin-validation-panel{grid-column:1 / -1}.ops-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}.ops-metrics div{border:1px solid rgba(226,232,240,.88);border-radius:8px;background:#ffffffb8;padding:14px;display:grid;gap:6px;min-height:104px}.ops-metrics svg{color:var(--blue)}.ops-metrics span{color:var(--muted);font-size:13px}.ops-metrics strong{font-size:28px}.ops-board{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.ops-card{display:grid;gap:12px}.ops-person{display:flex;gap:10px;align-items:center}.ops-person>span{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--blue),var(--green));color:#fff;font-weight:800;flex:0 0 auto}.ops-person small,.ops-detail span{color:var(--muted)}.ops-person small,.ops-detail span,.timeline p,.nfc-status small,.alert,td,dd{overflow-wrap:anywhere}.ops-detail{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(226,232,240,.86);padding-top:10px}.ops-detail strong{text-align:right}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;border-bottom:1px solid #edf0f5;padding:14px 12px}tbody tr{transition:background-color .14s ease}tbody tr:hover{background:#dbeafe57}th{color:#64748b;font-size:12px;text-transform:uppercase;letter-spacing:.06em}.segmented{display:inline-flex;padding:4px;border-radius:8px;background:#e2e8f0b8;box-shadow:inset 0 1px #fff9}.segmented button{border:0;background:transparent;border-radius:7px;padding:8px 14px}.segmented button.active{background:linear-gradient(135deg,#fff,#f6fbff);color:var(--blue);box-shadow:0 4px 12px #0f172a1a}.cards-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.config-card dl{display:grid;gap:10px;margin:0}.config-card div:has(dt){display:grid;grid-template-columns:100px 1fr;gap:12px}dt{color:#64748b}dd{margin:0;font-weight:700}.primary,.button-row button,td button,.panel-title button,.vehicle-card button,.nfc-actions button{border:0;border-radius:8px;padding:10px 14px;background:linear-gradient(135deg,var(--blue),var(--blue-dark));color:#fff;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:8px}.panel-title button,.vehicle-card button,td button,.button-row button,.nfc-actions button:not(.primary){background:#e2e8f0d1;color:#0f172a}.primary:hover,.button-row button:hover,td button:hover,.panel-title button:hover,.vehicle-card button:hover,.nfc-actions button:hover{transform:translateY(-1px);box-shadow:0 10px 24px #2563eb29}.wide{width:100%;margin-top:14px}.vehicle-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.vehicle-form{grid-template-columns:1.4fr 1fr .8fr auto auto;align-items:end;margin-bottom:14px;padding:14px;border:1px solid rgba(226,232,240,.9);border-radius:8px;background:#f8fafcc2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.checkbox-label{display:flex;align-items:center;gap:8px;min-height:42px}.checkbox-label input{width:auto}.vehicle-card{display:grid;gap:12px}.nfc-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.nfc-status{margin-top:14px;border:1px solid #dbeafe;border-radius:8px;padding:14px;display:grid;gap:4px;background:linear-gradient(135deg,#f8fbfff5,#f0fdf4cc)}.nfc-status small{color:#64748b;line-height:1.45}.terminal-view{background:linear-gradient(150deg,#0f172afa,#0e5348eb),radial-gradient(circle at 100% 0%,rgba(37,99,235,.24),transparent 22rem);color:#fff}.terminal-header{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:18px}.terminal-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.terminal-grid button{min-height:180px;display:grid;place-items:center;gap:8px;color:#111827}.terminal-grid button:hover{transform:translateY(-3px) scale(1.01);box-shadow:0 18px 34px #0f172a33}.timeline{display:grid;gap:14px}.timeline.compact{gap:8px;margin-top:14px}.timeline.compact p{margin-bottom:0;font-size:14px}.timeline div{display:grid;grid-template-columns:16px 1fr;gap:10px}.timeline span{width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--green));margin-top:5px;box-shadow:0 0 0 4px #2563eb1f}.filters{grid-template-columns:repeat(5,minmax(0,1fr));margin-bottom:18px}.report-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.report-grid article{display:grid;gap:10px}.report-grid strong{font-size:24px}.modal{width:min(560px,calc(100vw - 32px));border:0;border-radius:8px;padding:0;box-shadow:0 24px 80px #0f172a52}.modal::backdrop{background:#0f172a8c}.modal form{padding:22px;display:grid;gap:14px}textarea{min-height:96px;resize:vertical}.toast{position:fixed;right:24px;bottom:24px;max-width:min(420px,calc(100vw - 48px));background:linear-gradient(135deg,var(--ink),#0f3f45);color:#fff;border-radius:8px;padding:14px 16px;box-shadow:0 18px 45px #0f172a47;animation:toastIn .22s ease both}@keyframes panelIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseReady{0%,to{box-shadow:0 20px 40px #16a34a47}50%{box-shadow:0 22px 48px #16a34a61}}@keyframes pulseStop{0%,to{box-shadow:0 20px 40px #dc26263d}50%{box-shadow:0 22px 48px #f9731657}}@keyframes toastIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:1ms!important}}@media (max-width: 1100px){.ops-board,.cards-grid,.vehicle-grid,.vehicle-form,.report-grid,.filters,.terminal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 820px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;padding:10px 12px;gap:12px;box-shadow:none}main{padding:12px}nav{grid-auto-flow:column;grid-auto-columns:minmax(104px,32vw);overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;scroll-snap-type:x proximity}nav button{min-height:50px;justify-content:center;white-space:normal;text-align:center;flex-direction:column;gap:6px;padding:9px 8px;font-size:12px;line-height:1.15;scroll-snap-align:start}.role-admin .sidebar{padding:8px 10px;gap:8px}.role-admin .brand-mark{width:32px;height:32px;font-size:13px}.role-admin .brand strong{font-size:16px}.role-admin .brand span{display:none}.role-admin .role-switch{gap:5px}.role-admin .role-switch span{font-size:11px}.role-admin .role-switch select{min-height:40px;padding:7px 10px;font-size:16px;border-radius:8px}.role-admin nav{grid-auto-columns:minmax(76px,24vw);gap:6px}.role-admin nav button{min-height:42px;padding:6px;font-size:11px;line-height:1.1}.role-admin nav button svg{width:15px;height:15px}.role-admin main{padding:10px}.role-admin .topbar{margin-bottom:8px}.role-admin .topbar .user-chip,.role-admin .topbar{display:none}.role-admin h1{font-size:22px}.role-admin .eyebrow{font-size:11px;margin-bottom:2px}.dashboard-admin .hero-panel,.dashboard-admin>.panel:not(.admin-validation-panel),.dashboard-admin .quick-grid{display:none!important}.topbar,.hero-panel{grid-template-columns:1fr;display:grid}.topbar{gap:10px;margin-bottom:12px}.user-chip{min-width:0;width:100%}.view-grid,.ops-board,.quick-grid,.cards-grid,.vehicle-grid,.vehicle-form,.report-grid,.filters,.terminal-grid,.nfc-actions{grid-template-columns:1fr}.punch-button{width:min(58vw,188px);justify-self:center}table{min-width:620px}}@media (max-width: 640px){:root{--shadow: 0 8px 22px rgba(15, 23, 42, .07)}.app-shell{min-height:100svh}.sidebar{border-bottom:1px solid rgba(255,255,255,.08)}.brand{gap:10px;align-items:center}.brand>div:last-child span{display:none}.brand-mark,.user-chip span,.terminal-grid span{width:34px;height:34px;font-size:13px}.role-switch span{font-size:12px}.role-switch{gap:6px}.topbar{gap:12px}.user-chip{padding:8px 10px;box-shadow:none}.user-chip small{font-size:12px}.hero-panel{gap:14px;align-items:start}.hero-panel:after{width:220px;height:220px;right:-24%;bottom:-32%}.dashboard-admin{gap:10px}.ops-panel{padding:10px}.role-admin .panel,.role-admin .terminal-view,.role-admin .ops-panel{padding:10px;box-shadow:0 6px 18px #0f172a0f}.role-admin .view-grid,.role-admin .admin-dashboard,.role-admin .cards-grid,.role-admin .vehicle-grid,.role-admin .vehicle-form,.role-admin .report-grid,.role-admin .filters,.role-admin .terminal-grid,.role-admin .nfc-actions{gap:9px}.ops-panel .panel-title{display:grid;gap:8px;margin-bottom:10px}.ops-panel .panel-title p{display:none}.ops-panel .panel-title .badge{justify-self:start;font-size:10px;padding:5px 7px}.ops-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}.ops-metrics div{min-height:0;padding:9px 10px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}.ops-metrics span{font-size:12px;line-height:1.15}.ops-metrics strong{font-size:21px;line-height:1}.ops-metrics svg{width:17px;height:17px}.ops-board{gap:8px}.ops-card{grid-template-columns:1fr;align-items:stretch;gap:7px;padding:9px 10px}.ops-person{min-width:0}.ops-person>span{width:32px;height:32px;font-size:12px}.ops-person strong,.ops-person small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ops-card>.badge{justify-self:start;max-width:100%;text-align:left;font-size:11px;padding:5px 7px}.ops-detail,.balance-list div{display:grid;gap:4px}.ops-detail{grid-column:1 / -1;grid-template-columns:1fr auto;align-items:center;border-top:0;padding-top:0;font-size:12px}.panel-title{gap:10px}.badge{max-width:100%;white-space:normal;line-height:1.2}.button-row{display:grid;grid-template-columns:1fr;width:100%}.button-row button,.panel-title button,.vehicle-card button,td button{width:100%;min-height:44px}.segmented{width:100%}.segmented button{flex:1;min-height:40px}.table-wrap{overflow:visible}table,thead,tbody,tr,th,td{display:block;width:100%;min-width:0}thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}tbody{display:grid;gap:10px}tbody tr{border:1px solid rgba(226,232,240,.88);border-radius:8px;background:#ffffffc7;padding:10px}td{border-bottom:0;padding:8px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}td:before{content:attr(data-label);color:var(--muted);font-size:12px;font-weight:750;flex:0 0 38%}.report-grid strong{font-size:21px}.modal form{padding:16px}}@media (max-width: 560px){body{font-size:14px}.brand{align-items:flex-start}.brand strong{font-size:15px}.topbar{margin-bottom:12px}h1{font-size:22px}.hero-panel,.panel,.terminal-view{padding:12px}.panel-title{margin-bottom:10px}.panel-title h3,.terminal-header h2{font-size:17px;line-height:1.2}.panel-title h4{font-size:15px}.hero-panel h2{font-size:25px}.hero-panel p{margin-bottom:8px;font-size:14px}.punch-button{width:min(52vw,166px);font-size:19px;box-shadow:0 12px 26px #16a34a38}.badge-row,.button-row,.panel-title{align-items:flex-start;flex-wrap:wrap}.quick-card,.terminal-grid button{min-height:86px}.quick-card,.vehicle-card,.config-card,.ops-card,.report-grid article,.terminal-grid button{padding:12px}.quick-card{gap:6px}.quick-card svg{width:20px;height:20px}.quick-card small,.vehicle-card span,.panel p,.terminal-header span{font-size:13px}.terminal-header{display:grid}.role-switch select,.primary,input,select,textarea,.nfc-actions button,.wide{min-height:48px}.toast{right:12px;bottom:12px;max-width:calc(100vw - 24px)}}@media (max-width: 430px){.sidebar{padding:8px 10px;gap:9px}nav{grid-auto-columns:minmax(82px,27vw);gap:6px}nav button{min-height:46px;padding:7px 6px;font-size:11px}nav button svg{width:16px;height:16px}main{padding:10px}.view-grid,.quick-grid,.cards-grid,.vehicle-grid,.vehicle-form,.report-grid,.filters,.terminal-grid,.nfc-actions,.ops-board{gap:10px}.ops-metrics{grid-template-columns:1fr;gap:6px}.role-admin .sidebar{padding:7px 8px}.role-admin nav{grid-auto-columns:52px}.role-admin nav button{font-size:10px;min-height:42px;overflow:hidden;color:transparent;position:relative}.role-admin h1{font-size:20px}.role-admin nav button svg{color:#cbd5e1;position:absolute}.role-admin nav button.active svg,.role-admin nav button:hover svg{color:#fff}.ops-metrics div{padding:8px 9px}.ops-metrics span{font-size:12px}.ops-metrics strong{font-size:20px}.ops-card{padding:8px 9px}.hero-panel h2{font-size:25px}.punch-button{width:min(48vw,150px)}}