.visual-dashboard{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:14px;margin-top:14px}.visual-panel{position:relative;min-height:330px;overflow:hidden}.visual-panel h2{font-size:.94rem;margin:0}.visual-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.live-dot{display:inline-flex;align-items:center;gap:6px;font-size:.68rem;color:var(--muted)}.live-dot:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--good);box-shadow:0 0 0 5px color-mix(in srgb,var(--good) 12%,transparent)}.security-wall{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;height:258px}.camera-tile{position:relative;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:radial-gradient(circle at 68% 40%,#273154 0 2%,transparent 3%),linear-gradient(155deg,#17172f,#0a0919 60%,#16132d)}.camera-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.035) 50%,transparent 51%),linear-gradient(0deg,transparent 49%,rgba(255,255,255,.03) 50%,transparent 51%);background-size:42px 42px}.camera-tile:after{content:"";position:absolute;width:72px;height:42px;border:2px solid color-mix(in srgb,var(--accent) 65%,white);border-radius:7px;left:50%;top:52%;transform:translate(-50%,-50%);box-shadow:0 0 28px color-mix(in srgb,var(--accent) 18%,transparent)}.camera-label{position:absolute;left:9px;bottom:8px;font-size:.65rem;color:#dcd7ff;z-index:2}.camera-label b{display:block;color:#fff;font-size:.72rem}.system-stack{display:grid;gap:9px}.system-widget{padding:13px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel2) 75%,#050714)}.system-widget .icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 18%,transparent);color:#fff;margin-bottom:9px}.system-widget strong{font-size:.82rem;display:block}.system-widget small{color:var(--muted);font-size:.68rem}.system-meter{height:5px;border-radius:9px;background:#070b14;margin-top:9px;overflow:hidden}.system-meter i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--accent),var(--accent2))}.fleet-map{position:relative;height:285px;border-radius:11px;overflow:hidden;border:1px solid var(--line);background:#101923}.fleet-map:before{content:"";position:absolute;inset:-30px;background:linear-gradient(28deg,transparent 0 18%,#23313e 18.5% 20%,transparent 20.5% 39%,#23313e 39.5% 41%,transparent 41.5% 62%,#23313e 62.5% 64%,transparent 64.5%),linear-gradient(102deg,transparent 0 28%,#1e2c38 28.5% 30%,transparent 30.5% 57%,#1e2c38 57.5% 59%,transparent 59.5%),repeating-linear-gradient(0deg,transparent 0 44px,rgba(255,255,255,.025) 45px),repeating-linear-gradient(90deg,transparent 0 55px,rgba(255,255,255,.02) 56px);transform:rotate(-3deg)}.route{position:absolute;left:15%;top:62%;width:68%;height:2px;background:var(--accent);transform:rotate(-17deg);box-shadow:0 0 12px color-mix(in srgb,var(--accent) 55%,transparent)}.route:after{content:"";position:absolute;right:0;top:-3px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 30%,transparent)}.vehicle-pin{position:absolute;width:27px;height:27px;border-radius:50% 50% 50% 0;background:var(--accent);transform:rotate(-45deg);display:grid;place-items:center;box-shadow:0 7px 18px rgba(0,0,0,.38)}.vehicle-pin span{transform:rotate(45deg);font-size:.7rem;font-weight:900}.p1{left:26%;top:61%}.p2{left:53%;top:42%}.p3{left:75%;top:30%}.map-label{position:absolute;left:12px;bottom:11px;padding:6px 9px;border-radius:7px;background:rgba(5,11,18,.82);font-size:.66rem;color:var(--muted)}.fleet-status{display:grid;gap:9px}.vehicle-card{display:grid;grid-template-columns:36px 1fr auto;gap:9px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:10px;background:color-mix(in srgb,var(--panel2) 76%,#060b12)}.vehicle-icon{width:36px;height:30px;border-radius:8px;background:color-mix(in srgb,var(--accent) 16%,transparent);display:grid;place-items:center;color:#fff}.vehicle-card strong{font-size:.78rem}.vehicle-card small{display:block;color:var(--muted);font-size:.65rem;margin-top:2px}.speed{font-size:.68rem;color:#fff;text-align:right}.speed b{display:block;font-size:.92rem;color:var(--accent2)}@media(max-width:1050px){.visual-dashboard{grid-template-columns:1fr}.system-stack,.fleet-status{grid-template-columns:repeat(3,1fr)}}@media(max-width:800px){.visual-panel{min-height:auto}.security-wall{height:220px}.system-stack,.fleet-status{grid-template-columns:1fr}.fleet-map{height:250px}}

/* 2026-09-09 landing-page fit and approved product graphics */
@media (min-width:801px){
  .login{min-height:100dvh;height:auto;grid-template-columns:minmax(330px,520px) minmax(0,1fr);gap:clamp(18px,2vw,34px);padding:clamp(16px,2.2vh,26px) clamp(18px,2.2vw,34px);align-items:start;overflow:auto;position:relative}
  .login-card{align-self:start;justify-self:stretch;margin:0;width:100%;max-width:520px;padding:clamp(20px,2.5vh,30px);border-radius:18px}
  .login:after{min-height:0;height:min(760px,calc(100dvh - 32px));align-self:start;border:1px solid var(--line);border-radius:22px;box-shadow:0 28px 70px rgba(0,0,0,.32);overflow:hidden;background-color:#08111f;background-position:right center;background-repeat:no-repeat}
  body[data-product="phaztrack"] .login:after{background:linear-gradient(90deg,rgba(5,13,23,.96) 0%,rgba(5,13,23,.62) 30%,rgba(5,13,23,.05) 64%),radial-gradient(circle at 74% 65%,rgba(255,67,80,.20),transparent 34%),url('/phaztrack-landing-hero.webp') right center/auto 92% no-repeat,#08111f}
  body[data-product="timalink"] .login:after{background:linear-gradient(90deg,rgba(9,8,21,.96) 0%,rgba(9,8,21,.62) 30%,rgba(9,8,21,.04) 64%),radial-gradient(circle at 78% 52%,rgba(124,58,237,.22),transparent 35%),url('/timalink-landing-hero.webp') right center/auto 94% no-repeat,#0a0918}
  .login-brand{margin-bottom:4px}.login-card p{margin:8px 0 12px}.login-card .field{margin:11px 0}.login-card .field input{padding:10px 12px}.login-card .product-install{margin-top:8px;gap:6px}.login-card .install-button{padding:9px 12px}
}
@media (min-width:801px) and (max-height:760px){
  .login{padding-top:12px;padding-bottom:12px}.login-card{padding:16px 20px}.login-brand img{max-height:40px}.login-brand h1{font-size:1.42rem}.login-card p{font-size:.8rem;margin:4px 0 8px}.login-card .field{margin:7px 0}.login-card .field input{padding:9px 11px}.login-card .primary{padding:10px 14px}.login-card .demo{margin-top:8px}.login:after{height:calc(100dvh - 24px)}
}
@media (max-width:800px){
  body[data-product="phaztrack"] .login,body[data-product="timalink"] .login{min-height:100dvh;padding:16px;align-items:start}.login-card{margin:0 auto;align-self:start}
}
