:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#172232;background:#f4f7fb;font-synthesis:none;text-rendering:optimizeLegibility;--ink:#172232;--muted:#718096;--line:#dce4ed;--panel:#fff;--blue:#111111;--blue-dark:#050505;--cyan:#A6A6A6;--green:#13865e;--amber:#a96812;--red:#bd343f;--shadow:0 8px 28px rgba(25,48,79,.065)}*{box-sizing:border-box}body{margin:0;min-width:320px;background:#f4f7fb}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.hidden{display:none!important}.login-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px 18px;background:radial-gradient(circle at 85% 10%,#e0edff 0,#f4f7fb 35%,#eef3f9 100%)}.login-brand,.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.login-brand{margin-bottom:28px}.brand-mark{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:13px;background:#050505;color:#fff;font-weight:900;font-size:24px;box-shadow:0 5px 14px rgba(32,87,166,.18)}.login-brand strong,.brand strong{display:block;letter-spacing:.1em;font-size:16px}.login-brand small,.brand small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.login-card{width:min(100%,430px);padding:34px;border:1px solid #e1e8f0;border-radius:22px;background:#fff;box-shadow:0 18px 60px rgba(31,57,88,.11)}h1,h2,h3,p{margin-top:0}.login-card h1{font-size:30px;letter-spacing:-.04em;margin:9px 0 10px}.login-card p{color:var(--muted);line-height:1.55;font-size:14px}.eyebrow{display:block;color:#5e7899;font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;margin-bottom:8px}.login-card label,.add-device-panel label,.inline-create-form label,.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700;color:#394b60;margin:17px 0 0}.login-card input,.form-grid input,.inline-create-form input,.form-grid select,.select-field select,.login-card select,.inline-create-form select,.company-filter select,.inline-actions input{min-height:42px;border:1px solid #d6e0eb;border-radius:9px;padding:9px 11px;background:#fff;color:var(--ink);outline:none}.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.inline-create-form input:focus,.select-field select:focus{border-color:#6d9ddd;box-shadow:0 0 0 3px #e8f1ff}.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:9px;min-height:39px;padding:9px 14px;font-weight:750;font-size:12px;transition:background .15s,border .15s;color:var(--ink);background:#edf2f8;text-decoration:none}.button.primary{color:#fff;background:var(--blue);border-color:var(--blue)}.button.primary:hover{background:var(--blue-dark)}.button.secondary{background:#fff;border-color:#d3deea;color:#304760}.button.secondary:hover,.button.ghost:hover{background:#edf3fa}.button.ghost{background:transparent;border-color:#d9e2eb;color:#5d6e82}.button.small{min-height:33px;padding:7px 11px}.button.full-width{width:100%;margin-top:22px}.inline-message{min-height:18px;margin:11px 0 0;color:var(--muted);font-size:12px;line-height:1.5}.inline-message.error{color:var(--red)}.inline-message.success{color:var(--green)}.security-note{display:block;margin-top:16px;color:#8795a6;line-height:1.4}.login-screen footer{margin-top:24px;color:#8a98a9;font-size:11px}.workspace{min-height:100vh}.topbar{height:82px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 3.2%;gap:34px;position:sticky;top:0;z-index:900}.brand{min-width:184px}.brand-mark{width:37px;height:37px;border-radius:11px;font-size:21px}.main-nav{display:flex;align-items:center;gap:6px;align-self:stretch}.nav-item{position:relative;border:0;background:transparent;color:#63748a;display:flex;align-items:center;gap:8px;padding:0 14px;font-size:12px;font-weight:750}.nav-item svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.nav-item.active{color:var(--blue)}.nav-item.active:after{content:"";position:absolute;bottom:0;left:13px;right:13px;height:3px;border-radius:3px 3px 0 0;background:var(--blue)}.nav-item:hover{color:var(--blue)}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:14px}.company-filter{display:flex;align-items:center;gap:9px;color:#718096;font-size:11px;font-weight:700}.company-filter select{max-width:245px;min-height:35px;font-size:12px}.user-chip{display:flex;align-items:center;gap:9px;min-width:135px}.avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 35px;width:35px;height:35px;border-radius:50%;background:#e6eefb;color:#2459a1;font-size:12px;font-weight:900}.user-chip strong{display:block;font-size:12px;max-width:145px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.user-chip small{display:block;margin-top:3px;color:var(--muted);font-size:10px}.main-content{max-width:1540px;margin:0 auto;padding:32px 3.2% 64px}.view{display:none}.view.active{display:block}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:25px}.page-heading h1{font-size:31px;line-height:1.1;letter-spacing:-.045em;margin:0 0 9px}.page-heading p{color:var(--muted);font-size:13px;line-height:1.5;margin:0;max-width:750px}.heading-tools{display:flex;align-items:center;gap:10px;color:#7b899b;font-size:11px;white-space:nowrap}.status-dot{width:8px;height:8px;border-radius:50%;background:#18a575;box-shadow:0 0 0 4px #e4f7ef}.account-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:14px;margin-bottom:32px}.account-card,.panel{border:1px solid var(--line);border-radius:15px;background:var(--panel);box-shadow:var(--shadow)}.account-card{padding:22px 24px;min-height:128px}.account-main{background:linear-gradient(135deg,#050505,#111111);color:white;border-color:#111111}.card-label{display:block;font-size:9px;letter-spacing:.14em;font-weight:850;color:#8293a7;margin-bottom:13px}.account-main .card-label{color:#b8d1f4}.account-card h2{font-size:22px;line-height:1.2;letter-spacing:-.025em;margin:0 0 7px}.account-main p{margin:0;color:#d1e1f6;font-size:11px}.account-card>strong{display:block;font-size:23px;letter-spacing:-.04em;margin-bottom:9px}.account-card>small{display:block;color:var(--muted);font-size:10px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:15px}.section-heading h2,.panel-heading h2{font-size:18px;letter-spacing:-.025em;margin:0 0 5px}.section-heading .eyebrow{margin-bottom:5px}.inline-actions{display:flex;gap:8px}.inline-actions input{min-width:240px;min-height:38px;font-size:12px}.device-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.device-card{border:1px solid var(--line);border-radius:14px;background:white;box-shadow:var(--shadow);overflow:hidden}.device-card-head{display:flex;align-items:flex-start;gap:12px;padding:18px 19px 15px;border-bottom:1px solid #edf1f6}.device-glyph{display:flex;align-items:center;justify-content:center;flex:0 0 42px;width:42px;height:42px;border-radius:12px;background:#eaf2ff;color:#111111;font-size:21px}.device-heading{flex:1;min-width:0}.device-heading h3{font-size:15px;margin:0 0 5px;overflow-wrap:anywhere}.device-heading p{margin:0;color:var(--muted);font-size:10px;overflow-wrap:anywhere}.state-pill,.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:800;white-space:nowrap}.state-pill.good{background:#e1f6ed;color:#18774f}.state-pill.warn{background:#fff2dc;color:#946018}.state-pill.neutral,.badge.neutral{background:#eef2f6;color:#607289}.device-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:5px 19px 12px}.device-fact{padding:10px 0 7px;min-width:0}.device-fact span{display:block;color:#7d8b9b;font-size:9px;margin-bottom:5px}.device-fact strong{display:block;font-size:11px;font-weight:750;color:#28384b;overflow-wrap:anywhere}.diagnostic-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 19px;background:#f8fafc;border-top:1px solid #edf1f6}.diagnostic-copy{display:flex;align-items:center;gap:8px;font-size:10px;color:#64758a}.diagnostic-copy .diag-dot{width:7px;height:7px;border-radius:50%;background:#1c9d6f}.diagnostic-copy.warn .diag-dot{background:#d99922}.diagnostic-copy.bad .diag-dot{background:#bd343f}.device-actions{display:flex;gap:6px;flex-wrap:wrap}.text-button{border:0;background:transparent;color:var(--blue);font-size:10px;font-weight:800;padding:5px}.text-button.danger{color:var(--red)}.empty-state{grid-column:1/-1;padding:38px 20px;border:1px dashed #cbd7e4;border-radius:13px;text-align:center;color:#7b899b;font-size:12px;background:rgba(255,255,255,.7)}.empty-state strong{display:block;color:#41546a;margin-bottom:6px}.empty-state p{margin:0}.add-device-panel{padding:21px;margin-top:20px}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}.panel-heading p{font-size:11px;line-height:1.5;color:var(--muted);margin:5px 0 0;max-width:700px}.icon-button{border:1px solid #dce4ed;border-radius:8px;background:#fff;color:#748399;font-size:23px;width:34px;height:34px}.form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.form-grid label{margin:0}.form-grid input,.form-grid select{width:100%}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:17px;flex-wrap:wrap}.sync-strip{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:24px;padding:18px 20px;background:#edf4fc;border:1px solid #d7e6f7;border-radius:13px}.sync-strip strong,.sync-strip small{display:block}.sync-strip strong{font-size:12px;margin-bottom:4px}.sync-strip small{font-size:10px;color:#6e8299}.map-layout{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(260px,.9fr);gap:16px;margin-bottom:18px}.map-panel{position:relative;min-height:475px;border:1px solid var(--line);border-radius:15px;background:#e6edf4;overflow:hidden;box-shadow:var(--shadow)}#real-device-map{height:475px;width:100%;z-index:1}.map-empty{position:absolute;z-index:500;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:8px;width:min(85%,360px);padding:22px;background:rgba(255,255,255,.96);border:1px solid #dce4ed;border-radius:12px;box-shadow:var(--shadow);text-align:center;color:var(--muted);font-size:11px}.map-empty strong{font-size:13px;color:#2b3f55}.map-side{padding:19px;border:1px solid var(--line);background:white;border-radius:15px;box-shadow:var(--shadow);min-height:475px}.map-side .panel-heading{margin-bottom:10px}.map-linked-list{display:flex;flex-direction:column;gap:9px}.map-linked-item{display:flex;gap:9px;align-items:flex-start;padding:11px 0;border-bottom:1px solid #edf1f6}.map-linked-item:last-child{border-bottom:0}.map-linked-item .pin{flex:0 0 32px;height:32px;border-radius:9px;background:#e4f6f4;color:#138b85;display:grid;place-items:center;font-size:17px}.map-linked-item strong{display:block;font-size:11px;margin-bottom:3px}.map-linked-item small{display:block;font-size:9px;color:var(--muted);line-height:1.4;overflow-wrap:anywhere}.link-manager{padding:20px;margin-top:18px}.link-form-grid{grid-template-columns:1.2fr 1.2fr 1fr auto;align-items:end}.link-form-grid label{min-width:0}.form-end{display:flex;align-items:flex-end;min-height:42px}.link-form-grid select{width:100%;min-width:0}.table-wrap{width:100%;overflow:auto;margin-top:14px}table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:11px}thead{background:#f7f9fc}th{text-align:left;padding:12px 11px;color:#75849a;font-size:9px;letter-spacing:.06em;text-transform:uppercase}td{padding:12px 11px;border-top:1px solid #edf1f6;color:#354960}td .empty-state{padding:24px;background:transparent;border:0;white-space:normal}.settings-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(310px,.8fr);gap:16px}.setting-card{padding:23px}.setting-card .panel-heading{margin-bottom:22px}.range-field{display:block;padding:17px 0;border-bottom:1px solid #edf1f6}.range-field>span{display:flex;justify-content:space-between;gap:15px;font-size:11px;font-weight:750;color:#33485f}.range-field strong{color:var(--blue);white-space:nowrap}.range-field input{width:100%;margin:17px 0 8px;accent-color:var(--blue)}.range-field small,.select-field small,.check-row small{display:block;color:var(--muted);font-size:10px;line-height:1.5;margin-top:6px}.select-field{display:flex;flex-direction:column;gap:8px;padding:18px 0;font-size:11px;font-weight:750}.select-field select{width:100%}.check-row{display:flex;align-items:flex-start;gap:10px;padding:15px 0;border-bottom:1px solid #edf1f6;cursor:pointer}.check-row input{margin-top:3px;accent-color:var(--blue)}.check-row strong{display:block;font-size:11px}.sync-status-box{padding:17px;border-radius:10px;background:#f5f8fc;border:1px solid #e4eaf2;min-height:68px;font-size:11px;color:#5c6f86;line-height:1.5}.sync-status-box.good{background:#eaf8f1;border-color:#ccefe0;color:#237450}.sync-status-box.bad{background:#fff1f1;border-color:#f3d5d7;color:#a5333d}.setting-card>p{font-size:11px;line-height:1.6;color:var(--muted);margin:15px 0}.setting-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#eaf2ff;color:var(--blue);font-size:20px}.integration-note{display:flex;flex-direction:column;gap:5px;padding-top:18px;border-top:1px solid #edf1f6;margin-top:18px}.integration-note strong{font-size:11px}.integration-note span{font-size:10px;color:var(--muted)}.role-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.role-card{padding:17px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow)}.role-card strong{font-size:12px}.role-card p{margin:8px 0 0;color:var(--muted);font-size:10px;line-height:1.55}.admin-users-panel{padding:22px}.inline-create-form{display:grid;grid-template-columns:1fr 1.2fr 1.2fr 1fr;gap:12px;padding:18px;margin:0 0 18px;background:#f8fafc;border:1px solid #e5ebf3;border-radius:12px}.inline-create-form label{margin:0}.inline-create-form .form-actions,.inline-create-form .inline-message{grid-column:1/-1}.inline-create-form .form-actions{margin-top:2px}.app-footer{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:22px 3.2%;color:#8794a4;font-size:10px}.app-footer strong{color:#506177;margin-right:10px;letter-spacing:.13em}.app-footer span{line-height:1.4}.global-alert{max-width:1540px;padding:12px 15px;margin-bottom:18px;background:#fff5df;border:1px solid #f1dcae;color:#835a12;border-radius:9px;font-size:11px}.toast{position:fixed;right:22px;bottom:22px;z-index:1500;max-width:min(430px,calc(100vw - 44px));padding:13px 17px;border-radius:11px;background:#183f72;color:#fff;box-shadow:0 12px 30px rgba(18,39,68,.18);font-size:12px;opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s}.toast.show{opacity:1;transform:translateY(0)}.toast.error{background:#a8313d}.token-dialog{width:min(92vw,520px);padding:25px;border:1px solid var(--line);border-radius:17px;box-shadow:0 24px 70px rgba(16,35,60,.25)}.token-dialog::backdrop{background:rgba(10,25,45,.45)}.token-dialog h2{font-size:23px;margin:0 0 9px}.token-dialog p{font-size:12px;line-height:1.6;color:var(--muted)}.token-dialog textarea{width:100%;resize:vertical;padding:11px;border:1px solid #d5dfea;border-radius:9px;background:#f7f9fc;color:#33485f;overflow-wrap:anywhere}.dialog-heading{margin-bottom:18px}.leaflet-popup-content{font-size:12px;line-height:1.5}.leaflet-popup-content strong{display:block;margin-bottom:5px}.leaflet-control-attribution{font-size:9px!important}@media(max-width:1180px){.topbar{gap:15px;padding:0 2%}.brand{min-width:auto}.brand small{display:none}.nav-item{padding:0 10px}.topbar-right{gap:8px}.company-filter select{max-width:175px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.link-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.role-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inline-create-form{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:820px){.topbar{height:auto;min-height:74px;flex-wrap:wrap;padding:12px 16px;gap:10px}.brand{margin-right:auto}.main-nav{order:3;width:100%;height:48px;justify-content:space-around}.nav-item{flex:1;justify-content:center;padding:0 7px}.nav-item.active:after{bottom:-12px;left:12px;right:12px}.topbar-right{margin-left:0}.user-chip{min-width:0}.user-chip>div{display:none}.company-filter{max-width:150px}.company-filter span{display:none}.company-filter select{max-width:145px}.main-content{padding:24px 16px 44px}.page-heading{align-items:flex-start;flex-direction:column}.heading-tools{flex-wrap:wrap;white-space:normal}.account-grid{grid-template-columns:1fr 1fr}.account-main{grid-column:1/-1}.device-grid{grid-template-columns:1fr}.map-layout,.settings-grid{grid-template-columns:1fr}.map-panel,#real-device-map{min-height:380px;height:380px}.map-side{min-height:0}.role-summary-grid{grid-template-columns:1fr 1fr}.section-heading{align-items:flex-start;flex-direction:column}.inline-actions{width:100%}.inline-actions input{flex:1;min-width:0}.sync-strip{align-items:flex-start;flex-direction:column}.app-footer{padding:18px 16px;flex-direction:column}.link-form-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.topbar-right{width:100%;justify-content:space-between}.company-filter{flex:1}.company-filter select{max-width:none;width:100%}.user-chip{display:none}.account-grid{grid-template-columns:1fr}.account-main{grid-column:auto}.account-card{min-height:108px}.form-grid,.link-form-grid,.inline-create-form,.role-summary-grid{grid-template-columns:1fr}.form-grid label{margin-top:3px}.login-card{padding:24px}.login-card h1{font-size:27px}.page-heading h1{font-size:27px}.device-facts{padding:5px 14px 10px}.device-card-head{padding:15px 14px 13px}.diagnostic-strip{padding:10px 14px;align-items:flex-start;flex-direction:column}.section-heading h2{font-size:17px}.button{font-size:11px}.nav-item{gap:5px;font-size:11px}.nav-item svg{width:17px;height:17px}}

/* v29 semantic aliases used by the real API-rendered device cards and maps. */
.device-icon{display:flex;align-items:center;justify-content:center;flex:0 0 42px;width:42px;height:42px;border-radius:12px;background:#eaf2ff;color:#111111;font-size:21px}
.device-title{flex:1;min-width:0}
.device-title h3{font-size:15px;margin:0 0 5px;overflow-wrap:anywhere}
.device-title p{margin:0;color:var(--muted);font-size:10px;overflow-wrap:anywhere}
.device-badges{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.fact{padding:10px 0 7px;min-width:0}
.fact span{display:block;color:#7d8b9b;font-size:9px;margin-bottom:5px}
.fact strong{display:block;font-size:11px;font-weight:750;color:#28384b;overflow-wrap:anywhere}
.fact small{display:block;margin-top:4px;color:var(--muted);font-size:9px;line-height:1.4;overflow-wrap:anywhere}
.badge.success{background:#e1f6ed;color:#18774f}
.badge.warning{background:#fff2dc;color:#946018}
.badge.danger{background:#fde9eb;color:#a82c39}
.diagnostic-strip p{margin:5px 0 0;color:#64758a;font-size:10px;line-height:1.45}
.diagnostic-meta{display:flex;flex-direction:column;gap:4px;font-size:10px;line-height:1.45;color:var(--muted)}
.map-list-item{display:flex;gap:9px;align-items:flex-start;padding:11px 0;border-bottom:1px solid #edf1f6}
.map-list-item:last-child{border-bottom:0}
.map-list-item .pin{flex:0 0 32px;height:32px;border-radius:9px;background:#e4f6f4;color:#138b85;display:grid;place-items:center;font-size:17px}
.map-list-item strong{display:block;font-size:11px;margin-bottom:3px}
.map-list-item small{display:block;font-size:9px;color:var(--muted);line-height:1.4;overflow-wrap:anywhere}
.table-actions{display:flex;align-items:center;gap:5px}
.table-assignee{max-width:170px;min-height:31px;padding:5px 8px;border:1px solid #d6e0eb;border-radius:7px;background:#fff;color:var(--ink);font-size:10px}
.button.danger{background:#fff0f1;color:#a82c39;border-color:#f1cbd0}
.button.danger:hover{background:#fde1e4}
.sync-action{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.sync-action .inline-message{margin:0;text-align:right}
.admin-user-status{font-weight:750}
@media(max-width:520px){.device-badges{align-items:flex-end;flex-direction:column}.sync-action{align-items:flex-start}.sync-action .inline-message{text-align:left}}


/* YAYO GPS v30 — visual system: mascot yellow + electric blue, iOS-style glass surfaces. */
:root {
  color-scheme: light;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  color: #111111;
  background: #f5f7fc;
  --ink: #111111;
  --muted: #66758d;
  --line: rgba(33, 61, 103, .105);
  --panel: rgba(255,255,255,.9);
  --blue: #111111;
  --blue-dark: #0c43b7;
  --cyan: #229ed0;
  --green: #11845b;
  --amber: #9c6900;
  --red: #c42e45;
  --yayo-yellow: #A6A6A6;
  --yayo-yellow-deep: #A6A6A6;
  --yayo-blue: #111111;
  --shadow: 0 18px 55px rgba(21, 39, 76, .075);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: #f5f7fc; }
body::before { content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; background:radial-gradient(ellipse at 86% 5%,rgba(21,91,232,.075),transparent 30%),radial-gradient(ellipse at 7% 80%,rgba(255,217,46,.11),transparent 30%),linear-gradient(160deg,#f8faff 0%,#f3f6fc 55%,#f8f9fd 100%); }
button,input,select,textarea { font: inherit; }
button { cursor:pointer; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid rgba(21,91,232,.3); outline-offset:3px; }
.hidden { display:none!important; }
.sr-only { position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
/* Login — YAYO is the hero, not a tiny wordmark. */
.login-screen { position:relative; min-height:100vh; overflow:hidden; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; padding:clamp(22px,4vh,54px) 26px 18px; background:transparent; isolation:isolate; }
.login-ambient { position:absolute; z-index:-1; border-radius:50%; filter:blur(2px); pointer-events:none; }
.login-ambient-one { width:min(52vw,700px);aspect-ratio:1;top:-24%;left:-16%;background:radial-gradient(circle,rgba(255,217,46,.25),rgba(255,217,46,0) 67%); }
.login-ambient-two { width:min(55vw,760px);aspect-ratio:1;right:-22%;bottom:-39%;background:radial-gradient(circle,rgba(21,91,232,.13),rgba(21,91,232,0) 68%); }
.login-shell { width:min(1140px,100%); display:grid; grid-template-columns:minmax(0,1fr) minmax(380px,440px); align-items:center; gap:clamp(36px,7vw,100px); }
.login-hero { position:relative; display:flex; flex-direction:column; align-items:flex-start; padding:10px 0 10px clamp(0px,2vw,22px); }
.login-mascot-stage { position:relative; width:clamp(230px,25vw,340px); height:clamp(245px,31vw,380px); display:grid; place-items:center; margin-bottom:10px; align-self:center; }
.mascot-aura { position:absolute; width:78%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 48%,rgba(255,217,46,.36),rgba(255,217,46,.16) 46%,rgba(21,91,232,.035) 68%,transparent 72%);box-shadow:inset 0 0 55px rgba(255,217,46,.08);animation:yayo-breathe 5s ease-in-out infinite; }
.login-mascot { position:relative; z-index:2; width:auto; height:100%; max-width:100%; max-height:100%; min-height:0; object-fit:contain; filter:drop-shadow(0 24px 18px rgba(22,44,87,.12)); animation:yayo-float 5.5s ease-in-out infinite; }
.mascot-orbit { position:absolute;z-index:1;width:90%;height:34%;border:1px solid rgba(21,91,232,.17);border-radius:50%;transform:rotate(-20deg); }
.orbit-two { width:102%;height:41%;border-color:rgba(240,189,0,.22);transform:rotate(24deg); }
.login-wordmark { max-width:510px; }
.wordmark-kicker { display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:850;letter-spacing:.19em;color:#111111; }
.wordmark-kicker::before { content:"";width:23px;height:3px;border-radius:3px;background:var(--yayo-yellow-deep); }
.login-wordmark h2 { margin:13px 0 9px;font-size:clamp(40px,5vw,64px);line-height:.98;letter-spacing:-.07em;font-weight:900;color:#111111; }
.login-wordmark h2 em { color:#111111;font-style:normal;position:relative; }
.login-wordmark p { max-width:420px;margin:0;color:#65748b;font-size:clamp(14px,1.4vw,18px);line-height:1.65; }
.login-trust { display:flex;align-items:center;gap:9px;margin-top:27px;color:#65748b;font-size:12px;font-weight:650; }
.trust-check { display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e5f7ee;color:#11845b;font-size:12px;font-weight:900; }
.login-card { width:100%;padding:clamp(27px,3vw,39px);border:1px solid rgba(255,255,255,.98);border-radius:30px;background:rgba(255,255,255,.83);backdrop-filter:blur(30px) saturate(140%);-webkit-backdrop-filter:blur(30px) saturate(140%);box-shadow:0 30px 90px rgba(20,43,83,.11),inset 0 1px 0 #fff; }
.login-card .eyebrow { color:#111111;font-size:10px;letter-spacing:.17em;margin-bottom:10px; }
.login-card h1 { font-size:clamp(28px,2.8vw,35px);letter-spacing:-.055em;font-weight:850;margin:0 0 9px; }
.login-card > p:not(.inline-message) { color:#6a7890;line-height:1.65;font-size:13px;margin-bottom:27px; }
.login-card label,.add-device-panel label,.inline-create-form label,.form-grid label { color:#263a58;font-size:12px;font-weight:700; }
.login-card input,.login-card select,.form-grid input,.inline-create-form input,.form-grid select,.select-field select,.inline-create-form select,.company-filter select,.inline-actions input { min-height:46px;border:1px solid rgba(27,59,105,.14);border-radius:13px;padding:11px 13px;background:rgba(255,255,255,.92);color:#111111;transition:border-color .2s,box-shadow .2s,background .2s; }
.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.inline-create-form input:focus,.select-field select:focus,.login-card select:focus,.inline-actions input:focus { border-color:#76a4ff;box-shadow:0 0 0 4px rgba(21,91,232,.10);outline:none;background:#fff; }
.login-card input::placeholder,.inline-actions input::placeholder { color:#9aa6b8; }
.login-card .button.full-width { margin-top:25px;min-height:50px; }
.login-card .button.primary { justify-content:space-between;padding:12px 17px 12px 20px;background:linear-gradient(110deg,#111111,#0c49c8);border:0;border-radius:15px;color:#fff;box-shadow:0 10px 25px rgba(21,91,232,.22); }
.login-card .button.primary::before { content:"";width:7px;height:7px;border-radius:50%;background:var(--yayo-yellow);box-shadow:0 0 0 4px rgba(255,217,46,.16); }
.login-card .button.primary svg { width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s; }
.login-card .button.primary:hover svg { transform:translateX(3px); }
.login-security { display:flex;align-items:flex-start;gap:10px;margin-top:24px;padding-top:18px;border-top:1px solid rgba(33,61,103,.09); }
.login-security svg { flex:0 0 19px;width:19px;height:19px;fill:none;stroke:#1a73d9;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.login-security small { color:#7a879b;font-size:10px;line-height:1.55; }
.login-screen footer { display:flex;align-items:center;gap:10px;margin:10px 0 0;color:#8b97a9;font-size:11px; }
.login-screen footer strong { color:#344967;letter-spacing:.1em; }
/* Floating icon rail — no horizontal navigation bar. */
.workspace { position:relative;min-height:100vh;animation:workspace-enter .45s ease both; }
.app-rail { position:fixed;z-index:900;left:15px;top:15px;bottom:15px;width:76px;display:flex;flex-direction:column;align-items:center;gap:20px;padding:14px 10px 16px;border:1px solid rgba(255,255,255,.12);border-radius:27px;background:linear-gradient(160deg,#101f3a 0%,#142c50 55%,#0b1a32 100%);box-shadow:0 18px 50px rgba(9,25,54,.2),inset 0 1px 0 rgba(255,255,255,.08); }
.rail-brand { position:relative;display:grid;place-items:center;width:49px;height:55px;border-radius:17px;text-decoration:none;overflow:hidden;background:linear-gradient(145deg,rgba(255,217,46,.20),rgba(255,217,46,.06));border:1px solid rgba(255,217,46,.25);box-shadow:0 6px 20px rgba(0,0,0,.14); }
.rail-brand img { width:41px;height:49px;object-fit:contain;filter:drop-shadow(0 3px 3px rgba(0,0,0,.16));transition:transform .25s; }
.rail-brand:hover img { transform:translateY(-2px) rotate(-3deg); }
.rail-nav { display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;height:auto; }
.nav-item { position:relative;display:grid;place-items:center;flex:0 0 49px;width:49px;height:49px;padding:0;border:1px solid transparent;border-radius:17px;background:transparent;color:#bac9e1;transition:color .2s,background .2s,border-color .2s,transform .2s,box-shadow .2s; }
.nav-item svg { width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.nav-item span.nav-tooltip { position:absolute;left:61px;top:50%;z-index:20;transform:translate(-5px,-50%);padding:8px 11px;border-radius:10px;background:#10223f;color:#fff;font-size:11px;font-weight:750;white-space:nowrap;box-shadow:0 7px 20px rgba(6,20,42,.2);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .17s,transform .17s,visibility .17s; }
.nav-item span.nav-tooltip::before { content:"";position:absolute;left:-4px;top:50%;width:8px;height:8px;background:#10223f;transform:translateY(-50%) rotate(45deg); }
.nav-item:hover { color:#fff;background:rgba(255,255,255,.09);transform:translateY(-1px); }
.nav-item:hover .nav-tooltip,.nav-item:focus-visible .nav-tooltip { opacity:1;visibility:visible;transform:translate(0,-50%); }
.nav-item.active { color:#0d2242;background:linear-gradient(145deg,#ffe870,#ffd52b);border-color:rgba(255,245,183,.9);box-shadow:0 8px 19px rgba(255,209,30,.18),inset 0 1px 0 rgba(255,255,255,.65); }
.nav-item.active::after { content:"";position:absolute;left:-11px;top:14px;bottom:14px;width:3px;border-radius:0 5px 5px 0;background:#A6A6A6;box-shadow:0 0 12px rgba(255,217,46,.45); }
.rail-bottom { margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:11px; }
.rail-status { display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.06); }
.rail-status i { display:block;width:7px;height:7px;border-radius:50%;background:#57dc9b;box-shadow:0 0 0 5px rgba(87,220,155,.11); }
.rail-version { color:#6f85a8;font-size:9px;font-weight:800;letter-spacing:.08em; }
.floating-toolbar { position:fixed;z-index:850;top:18px;right:24px;display:flex;align-items:center;gap:8px;padding:7px;border:1px solid rgba(255,255,255,.93);border-radius:22px;background:rgba(255,255,255,.73);backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);box-shadow:0 8px 30px rgba(19,43,84,.075),inset 0 1px 0 #fff; }
.company-filter { display:flex;align-items:center;gap:9px;min-height:38px;margin:0;padding:0 8px 0 11px;border:1px solid rgba(22,66,135,.09);border-radius:14px;background:rgba(246,249,255,.72); }
.company-filter svg { width:17px;height:17px;flex:0 0 17px;fill:none;stroke:#111111;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.company-filter select { width:auto;max-width:230px;min-height:30px;padding:4px 23px 4px 2px;border:0;background:transparent;color:#223958;font-size:11px;font-weight:750; }
.company-filter select:focus { box-shadow:none;outline:none; }
.user-chip { display:flex;align-items:center;gap:9px;min-width:0;padding:2px 10px 2px 2px; }
.user-chip .avatar { display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:13px;border:1px solid rgba(255,255,255,.9);background:linear-gradient(145deg,#e8f0ff,#dbe8ff);color:#111111;font-size:13px;font-weight:900;box-shadow:0 2px 7px rgba(21,91,232,.08); }
.user-chip strong { display:block;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800;color:#1b2e49; }
.user-chip small { display:block;margin-top:2px;font-size:10px;color:#78879d; }
.logout-button { display:grid;place-items:center;width:39px;height:39px;border:1px solid rgba(33,61,103,.08);border-radius:14px;background:rgba(255,255,255,.66);color:#65748c;transition:background .2s,color .2s,transform .2s; }
.logout-button svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.logout-button:hover { background:#fff0f0;border-color:#f4d3d8;color:#be3146;transform:translateY(-1px); }
.main-content { width:auto;max-width:1840px;margin:0 24px 0 110px;padding:100px 0 44px; }
.page-heading { display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 29px;padding:0 0 22px;border-bottom:1px solid rgba(36,63,102,.085); }
.page-heading h1 { margin:0 0 9px;font-size:clamp(30px,3vw,41px);font-weight:850;letter-spacing:-.06em;line-height:1.08;color:#0d1d35; }
.page-heading p { max-width:760px;margin:0;color:#74829a;font-size:13px;line-height:1.65; }
.eyebrow { color:#111111;font-size:9px;font-weight:850;letter-spacing:.18em;margin-bottom:10px; }
.heading-tools { display:flex;align-items:center;gap:12px;color:#73829b;font-size:11px; }
.status-dot { width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#ffcc24;box-shadow:0 0 0 5px rgba(255,217,46,.18); }
.status-dot.online { background:#23bd81;box-shadow:0 0 0 5px rgba(35,189,129,.1); }
.button { min-height:41px;padding:10px 15px;gap:8px;border-radius:13px;font-size:11px;font-weight:800;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s; }
.button:hover:not(:disabled) { transform:translateY(-1px); }
.button.primary { background:linear-gradient(115deg,#111111,#104dcc);border-color:transparent;color:#fff;box-shadow:0 6px 17px rgba(21,91,232,.16); }
.button.primary:hover:not(:disabled) { background:linear-gradient(115deg,#0d4bd0,#0a3eaf);box-shadow:0 9px 22px rgba(21,91,232,.21); }
.button.secondary { background:rgba(255,255,255,.84);border-color:rgba(35,65,110,.12);color:#264266;box-shadow:0 2px 7px rgba(25,47,82,.025); }
.button.secondary:hover:not(:disabled),.button.ghost:hover:not(:disabled) { background:#fff;border-color:rgba(21,91,232,.24);box-shadow:0 5px 15px rgba(17,49,100,.07); }
.button.ghost { background:rgba(247,249,254,.75);border-color:rgba(35,65,110,.1);color:#335173; }
.button.small { min-height:33px;padding:7px 10px;border-radius:10px;font-size:10px; }
.button.danger { color:#b82e45;background:#fff2f4;border-color:#f4d9df; }
.button:disabled { opacity:.48;transform:none;box-shadow:none; }
.account-grid { display:grid;grid-template-columns:minmax(1.35fr,1.6fr) repeat(2,minmax(170px,.8fr));gap:15px;margin-bottom:39px; }
.account-card { position:relative;min-height:142px;padding:23px 24px;border:1px solid rgba(255,255,255,.95);border-radius:22px;background:rgba(255,255,255,.76);backdrop-filter:blur(16px);box-shadow:0 10px 28px rgba(27,50,90,.035),inset 0 1px 0 #fff;overflow:hidden; }
.account-card::after { content:"";position:absolute;right:-26px;bottom:-38px;width:105px;height:105px;border-radius:50%;background:rgba(21,91,232,.035);pointer-events:none; }
.account-main { border-color:rgba(21,91,232,.13);background:linear-gradient(125deg,rgba(255,255,255,.96),rgba(239,245,255,.83)); }
.account-main::before { content:"";position:absolute;top:0;left:24px;right:45%;height:3px;border-radius:0 0 5px 5px;background:linear-gradient(90deg,#A6A6A6,#111111); }
.card-label { display:block;color:#74829a;font-size:9px;letter-spacing:.14em;font-weight:850;margin-bottom:14px; }
.account-card h2 { margin:0 0 6px;font-size:clamp(18px,2vw,24px);font-weight:850;letter-spacing:-.04em;color:#10213a;overflow-wrap:anywhere; }
.account-card p { margin:0;color:#78869c;font-size:11px;line-height:1.5; }
.account-card>strong { display:block;margin-top:5px;color:#142744;font-size:30px;line-height:1;font-weight:850;letter-spacing:-.05em; }
.account-card small { display:block;margin-top:11px;color:#8794a7;font-size:10px;line-height:1.45; }
.section-heading { display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:0 0 18px; }
.section-heading h2 { margin:0;font-size:21px;font-weight:850;letter-spacing:-.04em;color:#11233d; }
.inline-actions { display:flex;align-items:center;gap:9px; }
.inline-actions input { width:min(320px,34vw);min-width:200px;min-height:40px;border-radius:13px;background:rgba(255,255,255,.8); }
.device-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:17px;margin-bottom:23px; }
.device-card { overflow:hidden;border:1px solid rgba(255,255,255,.96);border-radius:22px;background:rgba(255,255,255,.85);box-shadow:0 12px 32px rgba(20,45,86,.045),inset 0 1px 0 #fff;transition:transform .22s,box-shadow .22s,border-color .22s;animation:card-rise .35s ease both; }
.device-card:hover { transform:translateY(-2px);box-shadow:0 17px 38px rgba(20,45,86,.075);border-color:rgba(21,91,232,.16); }
.device-card-head { display:flex;align-items:flex-start;gap:14px;padding:21px 22px 17px;border-bottom:1px solid rgba(36,63,102,.07); }
.device-icon { display:grid;place-items:center;flex:0 0 47px;width:47px;height:47px;border-radius:16px;background:linear-gradient(145deg,#fff2ae,#ffe56a);color:#183c7c;font-size:23px;box-shadow:inset 0 1px 0 rgba(255,255,255,.8); }
.device-title h3 { margin:0 0 5px;font-size:15px;font-weight:850;letter-spacing:-.02em;color:#152743;overflow-wrap:anywhere; }
.device-title p { margin:0;color:#8290a4;font-size:10px;line-height:1.45; }
.device-title .eyebrow { margin-bottom:7px;font-size:8px; }
.device-badges { display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap; }
.badge { display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;font-size:9px;font-weight:850;letter-spacing:.01em;white-space:nowrap; }
.badge.success { background:#e4f8ef;color:#147a55; }
.badge.warning { background:#fff3cf;color:#8c6400; }
.badge.neutral { background:#edf2f9;color:#5f7088; }
.device-facts { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px;padding:9px 22px 15px; }
.fact { min-width:0;padding:12px 0 8px;border-bottom:1px solid rgba(33,61,103,.065); }
.fact span { margin-bottom:6px;color:#8794a8;font-size:9px;letter-spacing:.02em; }
.fact strong { color:#263956;font-size:11px;font-weight:800;line-height:1.4; }
.fact small { color:#95a0b1;font-size:9px; }
.diagnostic-strip { display:flex;align-items:center;gap:13px;flex-wrap:wrap;padding:15px 22px 18px;background:linear-gradient(115deg,rgba(247,249,255,.96),rgba(250,251,255,.82));border-top:1px solid rgba(33,61,103,.06); }
.diagnostic-strip>div:first-child { min-width:180px;flex:1; }
.diagnostic-strip p { color:#78869b;font-size:10px; }
.diagnostic-meta { gap:4px;color:#8b97a9;font-size:9px; }
.sync-strip { display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:22px;padding:22px 25px;border:1px solid rgba(255,255,255,.95);border-radius:22px;background:linear-gradient(120deg,rgba(255,255,255,.9),rgba(246,249,255,.83));box-shadow:0 8px 25px rgba(20,44,83,.035); }
.sync-strip>div:first-child strong { display:block;font-size:15px;font-weight:850;letter-spacing:-.02em;color:#172c4a; }
.sync-strip>div:first-child small { display:block;margin-top:7px;color:#8290a4;font-size:10px;line-height:1.55; }
.sync-action { max-width:470px; }
.sync-action .inline-message { max-width:450px;font-size:10px;line-height:1.5; }
.panel { border:1px solid rgba(255,255,255,.95);border-radius:23px;background:rgba(255,255,255,.86);box-shadow:0 12px 36px rgba(20,44,83,.045),inset 0 1px 0 #fff; }
.panel-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:19px; }
.panel-heading h2 { margin:0 0 7px;font-size:19px;font-weight:850;letter-spacing:-.04em;color:#132742; }
.panel-heading p { margin:0;max-width:800px;color:#7b899e;font-size:11px;line-height:1.6; }
.add-device-panel { padding:25px; }
.icon-button { display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--line);border-radius:13px;background:#fff;color:#526783;font-size:22px; }
.form-grid { gap:14px; }
.form-grid label,.inline-create-form label,.add-device-panel label { gap:8px;margin:0;color:#304461;font-size:11px; }
.form-grid input,.form-grid select,.inline-create-form input,.inline-create-form select,.select-field select { width:100%;min-width:0;min-height:43px;border-radius:12px;font-size:11px; }
.form-actions { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px; }
.inline-message { color:#73829a;font-size:10px;line-height:1.55; }
.inline-message.error { color:#bc3046; }
.inline-message.success { color:#14805a; }
/* Maps: soft glass, visible real linked devices even while waiting for GPS. */
.map-layout { grid-template-columns:minmax(0,1fr) minmax(300px,350px);gap:17px;align-items:stretch; }
.map-panel { position:relative;min-height:500px;border:1px solid rgba(255,255,255,.94);border-radius:24px;background:#e7edf6;box-shadow:0 17px 45px rgba(21,45,84,.1);overflow:hidden;isolation:isolate; }
#real-device-map { min-height:500px;height:500px;background:linear-gradient(135deg,#eaf1fb,#dfe8f5); }
.leaflet-container { font-family:inherit;background:#e5edf8; }
.leaflet-control-zoom { border:1px solid rgba(255,255,255,.9)!important;border-radius:14px!important;overflow:hidden;box-shadow:0 7px 25px rgba(16,39,79,.18)!important; }
.leaflet-control-zoom a { width:34px!important;height:34px!important;line-height:34px!important;background:rgba(255,255,255,.94)!important;color:#153864!important;border:0!important; }
.leaflet-control-zoom a:hover { background:#fff9d9!important;color:#0d47b5!important; }
.leaflet-control-attribution { padding:3px 7px!important;border-radius:8px 0 0 0;background:rgba(255,255,255,.8)!important;color:#61718a!important; }
.map-empty { position:absolute;z-index:500;left:50%;top:50%;transform:translate(-50%,-50%);width:min(400px,calc(100% - 46px));padding:22px 24px;border:1px solid rgba(255,255,255,.98);border-radius:22px;background:rgba(255,255,255,.91);backdrop-filter:blur(20px);box-shadow:0 15px 40px rgba(21,43,78,.13);text-align:center;pointer-events:none; }
.map-empty strong { display:block;margin-bottom:8px;color:#183154;font-size:13px;font-weight:850; }
.map-empty span { display:block;color:#7988a0;font-size:10px;line-height:1.6; }
.map-tile-warning { position:absolute;z-index:650;left:14px;right:14px;bottom:34px;padding:10px 14px;border:1px solid #f2d88a;border-radius:13px;background:rgba(255,248,220,.96);color:#805c07;font-size:10px;line-height:1.5;box-shadow:0 8px 18px rgba(38,35,13,.07); }
.map-side { min-width:0;min-height:500px;padding:22px 21px;border:1px solid rgba(255,255,255,.95);border-radius:24px;background:rgba(255,255,255,.83);box-shadow:0 10px 30px rgba(19,42,80,.045); }
.map-side .panel-heading { margin-bottom:12px; }
.map-side h2 { font-size:17px; }
.map-linked-list { display:flex;flex-direction:column;gap:7px; }
.map-list-item { display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid rgba(33,61,103,.07); }
.map-list-item:last-child { border-bottom:0; }
.map-list-marker { display:grid;place-items:center;flex:0 0 37px;width:37px;height:37px;border:1px solid #e3eaff;border-radius:13px;background:linear-gradient(145deg,#edf3ff,#e1ebff);color:#111111; }
.map-list-item.no-location .map-list-marker { border-color:#fff0ad;background:#fff8d9;color:#927000; }
.map-list-marker svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round; }
.map-list-copy { min-width:0;flex:1; }
.map-list-copy strong { display:block;margin-bottom:4px;color:#203653;font-size:10px;font-weight:850;overflow-wrap:anywhere; }
.map-list-copy small { display:block;margin-top:3px;color:#8491a5;font-size:9px;line-height:1.4;overflow-wrap:anywhere; }
.location-waiting { padding:5px 7px;border-radius:8px;background:#fff6d5;color:#876600;font-size:8px;font-weight:850;white-space:nowrap; }
.yayo-map-marker-wrap { background:transparent;border:0; }
.yayo-map-marker { position:relative;display:grid;place-items:center;width:34px;height:34px;border:2px solid #fff;border-radius:50% 50% 50% 8px;transform:rotate(-45deg);background:linear-gradient(145deg,#ffe971,#ffc915);box-shadow:0 7px 16px rgba(20,48,96,.26); }
.yayo-map-marker::before { content:"";position:absolute;inset:4px;border:1px solid rgba(18,58,127,.18);border-radius:50%; }
.yayo-map-marker span { width:9px;height:9px;border-radius:50%;background:#111111;box-shadow:0 0 0 3px rgba(21,91,232,.12); }
.map-popup { min-width:145px;display:flex;flex-direction:column;gap:5px; }
.map-popup strong { color:#152744;font-size:12px; }
.map-popup span,.map-popup small { color:#6d7d93;font-size:10px;line-height:1.4; }
.link-manager { margin-top:19px;padding:24px; }
.link-form-grid { grid-template-columns:minmax(200px,1.2fr) minmax(200px,1.2fr) minmax(170px,1fr) auto;gap:12px; }
.link-form-grid select { width:100%;min-width:0;min-height:44px;border-radius:12px; }
.table-wrap { border:1px solid rgba(33,61,103,.075);border-radius:15px;overflow:auto; }
table { width:100%;border-collapse:separate;border-spacing:0;white-space:nowrap;font-size:11px; }
thead { background:#f5f8ff; }
th { padding:13px 13px;color:#71819a;font-size:9px;letter-spacing:.08em;border-bottom:1px solid rgba(33,61,103,.08); }
td { padding:13px;border-top:1px solid rgba(33,61,103,.055);color:#304461;font-size:10px; }
tbody tr:hover { background:#fafcff; }
.table-assignee { min-height:32px;border:1px solid rgba(33,61,103,.13);border-radius:9px;background:#fff;color:#233a5b;font-size:10px; }
.settings-grid { grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:17px; }
.setting-card { padding:25px; }
.setting-card .panel-heading { margin-bottom:20px; }
.range-field { padding:18px 0;border-bottom:1px solid rgba(33,61,103,.075); }
.range-field>span { color:#2a405f;font-size:11px; }
.range-field strong { color:#111111;font-size:12px; }
.range-field input { accent-color:#111111; }
.range-field small,.select-field small,.check-row small { color:#8794a8;font-size:10px;line-height:1.6; }
.check-row { gap:12px;padding:17px 0;border-bottom:1px solid rgba(33,61,103,.075); }
.check-row input { accent-color:#111111; }
.check-row strong { color:#2b405d;font-size:11px; }
.sync-status-box { padding:17px;border:1px solid rgba(33,61,103,.08);border-radius:16px;background:#f4f7fd;color:#677993;font-size:11px;line-height:1.6; }
.sync-status-box.good { background:#e8f9f1;border-color:#cdeedd;color:#167a53; }
.sync-status-box.bad { background:#fff0f2;border-color:#f1d1d8;color:#a92e43; }
.setting-card>p { color:#78879d;font-size:10px;line-height:1.65; }
.setting-icon { width:40px;height:40px;border-radius:14px;background:#fff5c5;color:#725700; }
.integration-note { padding-top:17px;border-top:1px solid rgba(33,61,103,.08); }
.integration-note strong { color:#304461;font-size:11px; }
.integration-note span { color:#8794a8;font-size:10px;line-height:1.5; }
.role-summary-grid { gap:13px; }
.role-card { position:relative;min-height:130px;padding:20px;border:1px solid rgba(255,255,255,.96);border-radius:21px;background:rgba(255,255,255,.82);box-shadow:0 9px 26px rgba(20,44,83,.04); }
.role-card::before { content:"";position:absolute;top:0;left:20px;width:34px;height:3px;border-radius:0 0 5px 5px;background:linear-gradient(90deg,#A6A6A6,#111111); }
.role-card strong { display:block;margin-top:4px;color:#213754;font-size:12px; }
.role-card p { margin-top:10px;color:#7b899f;font-size:10px;line-height:1.6; }
.admin-users-panel { padding:24px; }
.inline-create-form { gap:13px;padding:19px;border:1px solid rgba(33,61,103,.075);border-radius:17px;background:#f7f9fe; }
.inline-create-form label { font-size:10px; }
.app-footer { display:flex;justify-content:space-between;gap:18px;margin:14px 24px 22px 110px;padding:18px 0;border-top:1px solid rgba(36,63,102,.075);color:#91a0b3;font-size:10px; }
.app-footer strong { margin-right:10px;color:#3b506e;letter-spacing:.12em; }
.app-footer span { line-height:1.5; }
.global-alert { max-width:100%;margin-bottom:18px;padding:13px 16px;border:1px solid #f1dfad;border-radius:15px;background:rgba(255,249,224,.86);color:#835c04;font-size:11px;line-height:1.5; }
.global-alert.error { border-color:#f2d0d8;background:rgba(255,240,243,.94);color:#9e2840; }
.empty-state { padding:22px 15px;border:1px dashed rgba(42,75,125,.17);border-radius:15px;background:rgba(250,252,255,.78);color:#8694a8;font-size:10px;line-height:1.6;text-align:center; }
.empty-state strong { display:block;color:#2f4667;margin-bottom:5px; }
.empty-state span { display:block; }
.toast { right:24px;bottom:24px;z-index:1500;max-width:min(440px,calc(100vw - 34px));padding:14px 18px;border:1px solid rgba(255,255,255,.16);border-radius:16px;background:rgba(16,37,70,.96);backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(12,29,58,.21);font-size:11px;line-height:1.55; }
.toast.error { background:rgba(157,39,59,.97); }
.token-dialog { width:min(92vw,520px);padding:27px;border:1px solid rgba(255,255,255,.95);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:0 25px 80px rgba(12,30,62,.22); }
.token-dialog::backdrop { background:rgba(9,23,47,.46);backdrop-filter:blur(5px); }
.token-dialog h2 { font-size:25px;letter-spacing:-.04em; }
.token-dialog p { color:#6f7f97;font-size:11px;line-height:1.65; }
.token-dialog textarea { border:1px solid rgba(33,61,103,.12);border-radius:13px;background:#f5f8fd; }
/* Entrance and micro-motion stay subtle and honor reduced-motion preferences. */
@keyframes yayo-float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes yayo-breathe { 0%,100%{transform:scale(1);opacity:.82} 50%{transform:scale(1.045);opacity:1} }
@keyframes card-rise { from{opacity:0;transform:translateY(7px)} to{opacity:1;transform:translateY(0)} }
@keyframes workspace-enter { from{opacity:.7} to{opacity:1} }
@media(max-width:1100px) {
  .login-shell { gap:34px;grid-template-columns:minmax(0,1fr) minmax(350px,420px); }
  .login-mascot-stage { width:250px;height:310px; }
  .map-layout { grid-template-columns:minmax(0,1fr) minmax(260px,310px); }
  .link-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .account-grid { grid-template-columns:minmax(0,1.3fr) repeat(2,minmax(150px,.8fr)); }
}
@media(max-width:850px) {
  .login-shell { width:min(540px,100%);grid-template-columns:1fr;gap:19px; }
  .login-hero { align-items:center;text-align:center;padding:0; }
  .login-mascot-stage { width:185px;height:220px;margin-bottom:0; }
  .login-wordmark h2 { font-size:39px;margin-top:8px; }
  .login-wordmark p { font-size:12px; }
  .login-trust { margin-top:13px; }
  .login-card { padding:27px; }
  .login-screen { justify-content:flex-start;padding-top:22px; }
  .app-rail { left:10px;top:10px;bottom:10px;width:64px;padding:12px 7px;border-radius:23px; }
  .rail-brand { width:45px;height:50px; }
  .rail-brand img { width:37px;height:44px; }
  .nav-item { width:45px;height:45px;flex-basis:45px;border-radius:15px; }
  .floating-toolbar { top:12px;right:12px;gap:5px;padding:5px;border-radius:18px; }
  .company-filter { min-height:34px;gap:5px;padding:0 6px 0 8px; }
  .company-filter select { max-width:155px;font-size:10px; }
  .user-chip { gap:6px;padding-right:6px; }
  .user-chip .avatar { width:32px;height:32px;flex-basis:32px;border-radius:11px; }
  .user-chip strong { max-width:118px;font-size:10px; }
  .user-chip small { font-size:9px; }
  .logout-button { width:34px;height:34px;border-radius:11px; }
  .main-content { margin:0 14px 0 88px;padding:83px 0 38px; }
  .page-heading { flex-direction:column;align-items:flex-start;gap:14px;padding-bottom:18px;margin-bottom:22px; }
  .heading-tools { flex-wrap:wrap; }
  .account-grid { grid-template-columns:1fr 1fr;gap:11px;margin-bottom:30px; }
  .account-main { grid-column:1/-1; }
  .account-card { min-height:120px;padding:18px; }
  .map-layout,.settings-grid { grid-template-columns:1fr; }
  .map-panel,#real-device-map { min-height:390px;height:390px; }
  .map-side { min-height:auto;padding:20px; }
  .map-linked-list { display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 16px; }
  .role-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .section-heading { align-items:flex-start;flex-direction:column; }
  .inline-actions { width:100%; }
  .inline-actions input { width:auto;min-width:0;flex:1; }
  .sync-strip { align-items:flex-start;flex-direction:column; }
  .sync-action { max-width:100%;align-items:flex-start; }
  .sync-action .inline-message { text-align:left; }
  .app-footer { margin:10px 14px 18px 88px; }
}
@media(max-width:560px) {
  .login-screen { padding:16px 14px;gap:15px; }
  .login-mascot-stage { width:133px;height:152px; }
  .login-wordmark h2 { font-size:32px; }
  .login-wordmark p { max-width:310px;font-size:11px; }
  .login-trust { font-size:10px; }
  .login-card { padding:23px 20px;border-radius:23px; }
  .login-card h1 { font-size:28px; }
  .app-rail { left:8px;right:8px;top:auto;bottom:8px;width:auto;height:65px;flex-direction:row;justify-content:center;gap:12px;padding:7px 11px;border-radius:22px; }
  .rail-brand { display:none; }
  .rail-nav { flex-direction:row;justify-content:center;gap:10px;width:auto; }
  .nav-item { width:46px;height:46px;flex-basis:46px; }
  .nav-item.active::after { left:10px;right:10px;top:auto;bottom:-7px;width:auto;height:3px;border-radius:5px;background:#A6A6A6; }
  .nav-item span.nav-tooltip { display:none; }
  .rail-bottom { display:none; }
  .floating-toolbar { top:9px;left:82px;right:9px;justify-content:flex-end;max-width:calc(100vw - 91px); }
  .company-filter { flex:1;min-width:0; }
  .company-filter select { max-width:none;min-width:0;flex:1;width:100%; }
  .user-chip { min-width:0; }
  .user-chip>div { display:none; }
  .main-content { margin:0 8px;padding:83px 12px 96px; }
  .page-heading h1 { font-size:30px; }
  .page-heading p { font-size:11px; }
  .heading-tools { gap:8px;font-size:10px; }
  .account-grid { grid-template-columns:1fr; }
  .account-main { grid-column:auto; }
  .account-card { min-height:100px; }
  .account-card>strong { font-size:26px; }
  .device-grid { grid-template-columns:1fr; }
  .device-card-head { padding:16px;gap:10px; }
  .device-facts { padding:6px 16px 12px;column-gap:14px; }
  .fact strong { font-size:10px; }
  .diagnostic-strip { align-items:flex-start;flex-direction:column;padding:13px 16px; }
  .map-panel,#real-device-map { min-height:340px;height:340px; }
  .map-side,.link-manager,.setting-card,.admin-users-panel { padding:17px; }
  .map-linked-list { display:flex; }
  .link-form-grid,.form-grid,.inline-create-form,.role-summary-grid { grid-template-columns:1fr; }
  .form-grid label { margin-top:2px; }
  .table-wrap { max-width:100%; }
  .section-heading h2 { font-size:18px; }
  .button { font-size:10px; }
  .app-footer { margin:0 12px 82px;flex-direction:column;gap:5px;padding:13px 0; }
  .global-alert { font-size:10px; }
  .toast { left:12px;right:12px;bottom:85px;max-width:none; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important; }
}


/* YAYO GPS v30.3 — compact navigation, ambient colour, motion and responsive refinements */
:root {
  --yayo-yellow: #A6A6A6;
  --yayo-yellow-soft: #F0F0F0;
  --yayo-blue: #111111;
  --yayo-blue-deep: #111111;
  --yayo-cyan: #A6A6A6;
  --yayo-lilac: #A6A6A6;
  --motion-smooth: cubic-bezier(.2,.75,.25,1);
}
html { scroll-behavior:smooth; }
body {
  background:
    radial-gradient(ellipse at 88% 9%, rgba(255,217,46,.19) 0, rgba(255,217,46,0) 27%),
    radial-gradient(ellipse at 9% 74%, rgba(73,133,245,.14) 0, rgba(73,133,245,0) 30%),
    radial-gradient(ellipse at 78% 86%, rgba(98,214,232,.11) 0, rgba(98,214,232,0) 28%),
    linear-gradient(135deg,#f7f9ff 0%,#f1f5fc 54%,#f8faff 100%);
}
.workspace { position:relative; isolation:isolate; }
.workspace::before {
  content:""; position:fixed; z-index:-1; pointer-events:none; inset:0;
  background:
    radial-gradient(circle at 20% 18%,rgba(255,255,255,.65),transparent 25%),
    radial-gradient(circle at 94% 58%,rgba(255,217,46,.10),transparent 19%);
  animation:yayo-ambient-drift 18s ease-in-out infinite alternate;
}
.app-rail {
  top:50%; bottom:auto; transform:translateY(-50%);
  width:66px; height:auto; max-height:calc(100dvh - 28px);
  gap:13px; padding:10px 8px 12px; border-radius:23px;
  background:linear-gradient(155deg,#0c1b35 0%,#173763 56%,#0b1b34 100%);
  box-shadow:0 18px 45px rgba(9,25,54,.22),0 0 0 1px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.12);
  overflow:visible;
}
.app-rail::after {
  content:""; position:absolute; inset:1px; border-radius:22px; pointer-events:none;
  background:linear-gradient(125deg,rgba(255,255,255,.065),transparent 45%,rgba(255,217,46,.04));
}
.rail-brand { width:43px;height:45px;border-radius:14px;flex:0 0 auto; }
.rail-brand img { width:36px;height:42px; }
.rail-nav { gap:9px; flex:0 0 auto; }
.nav-item { width:45px;height:45px;flex-basis:45px;border-radius:15px; }
.rail-bottom { display:none!important; }
.nav-item.active { box-shadow:0 9px 19px rgba(255,209,30,.22),0 0 0 4px rgba(255,217,46,.08),inset 0 1px 0 rgba(255,255,255,.72); }
.nav-item.active svg { animation:yayo-icon-pop .32s var(--motion-smooth) both; }
.nav-item:focus-visible,.button:focus-visible,.logout-button:focus-visible,.company-filter select:focus-visible {
  outline:3px solid rgba(21,91,232,.28);outline-offset:3px;
}
.main-content { transition:padding .28s var(--motion-smooth); }
.view.active { animation:yayo-section-enter .42s var(--motion-smooth) both; }
.page-heading { animation:yayo-header-enter .48s var(--motion-smooth) both; }
.page-heading h1 {
  background:linear-gradient(105deg,#0d1d35 0%,#173c73 64%,#111111 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.eyebrow { color:#111111; }
.account-card,.panel,.map-panel,.map-side,.link-manager,.setting-card,.admin-users-panel {
  transition:transform .24s var(--motion-smooth),box-shadow .24s var(--motion-smooth),border-color .24s var(--motion-smooth);
}
.account-card:hover,.panel:hover,.map-side:hover,.setting-card:hover,.admin-users-panel:hover {
  border-color:rgba(21,91,232,.18);box-shadow:0 15px 36px rgba(16,43,88,.075),inset 0 1px 0 rgba(255,255,255,.95);
}
.button {
  min-height:42px; padding:10px 16px; border-radius:13px; font-size:12px; font-weight:800;
  letter-spacing:-.01em; transition:transform .22s var(--motion-smooth),box-shadow .22s var(--motion-smooth),background .22s,border-color .22s,color .22s;
}
.button:active:not(:disabled) { transform:translateY(1px) scale(.985); }
.button.primary { background:linear-gradient(115deg,#1765f4 0%,#154fc9 68%,#0c43b0 100%);box-shadow:0 8px 19px rgba(21,91,232,.19),inset 0 1px 0 rgba(255,255,255,.2); }
.button.primary:hover:not(:disabled) { box-shadow:0 11px 25px rgba(21,91,232,.27),0 0 0 4px rgba(21,91,232,.07); }
.button.secondary { background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(245,248,255,.9)); }
.button.ghost { backdrop-filter:blur(8px); }
input,select,textarea { transition:border-color .2s,box-shadow .2s,background .2s; }
input:focus-visible,select:focus-visible,textarea:focus-visible {
  outline:none;border-color:#6ea1ff!important;box-shadow:0 0 0 4px rgba(21,91,232,.10)!important;background:#fff;
}
.account-card:nth-child(1) { animation:card-rise .52s .04s var(--motion-smooth) both; }
.account-card:nth-child(2) { animation:card-rise .52s .10s var(--motion-smooth) both; }
.account-card:nth-child(3) { animation:card-rise .52s .16s var(--motion-smooth) both; }
.device-card:nth-child(1) { animation-delay:.03s; }
.device-card:nth-child(2) { animation-delay:.08s; }
.device-card:nth-child(3) { animation-delay:.13s; }
.device-card:nth-child(4) { animation-delay:.18s; }
.sync-strip { background:linear-gradient(118deg,rgba(255,255,255,.94),rgba(237,244,255,.92) 70%,rgba(255,247,204,.54)); }
.map-panel { border-color:rgba(255,255,255,.98);box-shadow:0 16px 40px rgba(20,45,86,.08),inset 0 1px 0 #fff; }
.legacy-badge { margin:2px 0 4px;align-self:flex-start;white-space:normal; }
.legacy-note { display:block;color:#95661a;line-height:1.45;margin-top:4px;max-width:390px; }
.map-list-item { transition:background .2s,transform .2s,border-color .2s; }
.map-list-item:hover { background:linear-gradient(100deg,#f1f6ff,#fffdf2);transform:translateX(2px); }
.login-ambient-one { animation:yayo-ambient-drift 16s ease-in-out infinite alternate; }
.login-ambient-two { animation:yayo-ambient-drift 21s ease-in-out infinite alternate-reverse; }
.login-mascot { animation:yayo-float 5.5s ease-in-out infinite; }
.login-card { animation:yayo-section-enter .55s var(--motion-smooth) both; }
.login-wordmark { animation:yayo-header-enter .5s var(--motion-smooth) both; }
@keyframes yayo-section-enter {
  from { opacity:0;transform:translate3d(0,12px,0) scale(.994);filter:blur(2px); }
  to { opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0); }
}
@keyframes yayo-header-enter {
  from { opacity:0;transform:translate3d(0,8px,0); }
  to { opacity:1;transform:translate3d(0,0,0); }
}
@keyframes yayo-icon-pop {
  0% { transform:scale(.85) rotate(-7deg); }
  68% { transform:scale(1.10) rotate(2deg); }
  100% { transform:scale(1) rotate(0); }
}
@keyframes yayo-ambient-drift {
  from { transform:translate3d(-.5%,0,0) scale(1); }
  to { transform:translate3d(.8%,1%,0) scale(1.025); }
}
@media (min-width:851px) {
  .app-rail { left:16px; }
  .main-content { margin-left:104px; }
}
@media (min-width:561px) and (max-width:1100px) {
  .app-rail { left:10px;width:62px;padding:9px 7px 11px; }
  .rail-brand { width:40px;height:42px; }
  .rail-brand img { width:34px;height:39px; }
  .nav-item { width:43px;height:43px;flex-basis:43px;border-radius:14px; }
  .main-content { margin-left:86px;margin-right:16px;padding-top:92px; }
  .floating-toolbar { max-width:calc(100vw - 105px); }
  .map-layout { grid-template-columns:minmax(0,1.6fr) minmax(245px,.8fr); }
}
@media (max-width:850px) {
  .app-rail { transform:translateY(-50%); }
  .page-heading h1 { font-size:clamp(27px,4.3vw,36px); }
  .account-grid { gap:12px; }
  .map-panel,#real-device-map { height:clamp(300px,48vh,430px);min-height:300px; }
}
@media (max-width:560px) {
  .app-rail { left:8px;right:8px;top:auto;bottom:8px;transform:none;width:auto;height:65px;max-height:none;flex-direction:row;justify-content:center;gap:12px;padding:7px 11px;border-radius:22px; }
  .rail-brand { display:none; }
  .rail-nav { flex-direction:row;justify-content:center;gap:10px;width:auto; }
  .nav-item { width:46px;height:46px;flex-basis:46px; }
  .nav-item.active::after { left:10px;right:10px;top:auto;bottom:-7px;width:auto;height:3px;border-radius:5px;background:#A6A6A6; }
  .nav-item span.nav-tooltip { display:none; }
  .workspace::before { animation-duration:28s; }
  .main-content { margin:0 7px;padding:80px 10px 102px; }
  .page-heading { margin-bottom:20px;padding-bottom:17px; }
  .page-heading h1 { font-size:clamp(25px,7vw,31px); }
  .page-heading p { max-width:100%;font-size:12px; }
  .account-card { border-radius:18px; }
  .section-heading { gap:12px; }
  .inline-actions { flex-wrap:wrap; }
  .inline-actions input { flex:1 1 100%;width:100%; }
  .inline-actions .button { flex:1 1 auto; }
  .map-layout { gap:12px; }
  .map-panel,#real-device-map { height:min(62vh,390px);min-height:275px; }
  .map-side { border-radius:19px; }
  .map-list-item { gap:9px;padding:11px 0; }
  .map-list-copy { min-width:0;overflow-wrap:anywhere; }
  .floating-toolbar { backdrop-filter:blur(18px) saturate(145%); }
  .button { min-height:40px;padding:9px 12px;font-size:11px; }
  .login-screen { min-height:100svh; }
  .login-shell { gap:10px; }
}
@media (prefers-reduced-motion:reduce) {
  .workspace::before,.login-ambient-one,.login-ambient-two,.login-mascot,.login-card,.login-wordmark,.view.active,.page-heading,.account-card,.device-card,.nav-item.active svg {
    animation:none!important;filter:none!important;
  }
}


/* YAYO GPS v30.4 — focused login and dynamic device inventory */
.login-screen { min-height:100svh; padding:clamp(18px,4vh,48px) 18px 16px; }
.login-shell { width:min(470px,100%); display:block; }
.login-hero { display:none!important; }
.login-card { text-align:center; padding:clamp(26px,4vw,42px); border-radius:30px; box-shadow:0 32px 100px rgba(16,46,102,.14), inset 0 1px 0 rgba(255,255,255,.98); }
.login-card-brand { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; margin:0 auto 15px; }
.login-card-brand img { width:78px; height:88px; object-fit:contain; filter:drop-shadow(0 12px 12px rgba(20,42,80,.13)); animation:yayo-float 5.5s ease-in-out infinite; }
.login-card-brand span { color:#152743; font-size:14px; font-weight:950; letter-spacing:.08em; }
.login-card-brand em { color:var(--yayo-blue); font-style:normal; }
.login-welcome { display:inline-flex; align-items:center; justify-content:center; padding:8px 15px; margin:0 auto 10px; border:1px solid rgba(21,91,232,.13); border-radius:999px; color:#111111; background:linear-gradient(110deg,rgba(255,217,46,.25),rgba(21,91,232,.07)); font-size:clamp(18px,2.3vw,24px); font-weight:950; letter-spacing:.16em; text-align:center; }
.login-card h1 { margin:0 0 10px; text-align:center; font-size:clamp(29px,3.1vw,36px); letter-spacing:-.06em; }
.login-card > p:not(.inline-message) { max-width:340px; margin:0 auto 23px; text-align:center; }
.login-card label { display:block; width:100%; margin:12px auto 7px; text-align:center; }
.login-card input,.login-card select { width:100%; text-align:center; min-height:49px; border-radius:15px; background:rgba(246,249,255,.92); }
.login-card input:focus,.login-card select:focus { background:#fff; transform:translateY(-1px); }
.login-card .button.full-width { width:100%; margin-top:21px; min-height:54px; justify-content:center; position:relative; }
.login-card .button.primary::before { position:absolute; left:21px; }
.login-card .button.primary svg { position:absolute; right:18px; }
.login-card .login-security { text-align:left; }
.login-screen footer { justify-content:center; flex-wrap:wrap; text-align:center; }
.global-admin-field { display:grid; grid-template-columns:minmax(0,1fr); gap:6px; padding:15px 16px; margin:0 0 18px; border:1px solid rgba(21,91,232,.13); border-radius:16px; background:linear-gradient(110deg,rgba(237,244,255,.9),rgba(255,249,211,.62)); }
.global-admin-field label { display:grid; gap:7px; color:#243b5d; font-size:12px; font-weight:800; }
.global-admin-field select { width:100%; min-height:43px; border:1px solid rgba(31,63,110,.15); border-radius:12px; padding:10px 12px; background:#fff; color:#182b47; }
.global-admin-field small { color:#71819a; font-size:10px; line-height:1.5; }
.device-create-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.device-card-v304 { display:flex; flex-direction:column; min-width:0; border-radius:25px; background:rgba(255,255,255,.9); }
.device-card-media { position:relative; height:164px; min-height:164px; overflow:hidden; isolation:isolate; background:linear-gradient(130deg,#edf5ff,#fff8ce); }
.device-reference-photo { display:block; width:100%; height:100%; object-fit:cover; object-position:center 57%; transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s; }
.device-card-v304:hover .device-reference-photo { transform:scale(1.045); filter:saturate(1.04); }
.device-card-media::after { content:""; position:absolute; inset:35% 0 0; z-index:1; pointer-events:none; background:linear-gradient(180deg,transparent,rgba(9,28,56,.43)); }
.device-media-top { position:absolute; z-index:2; left:13px; right:13px; top:13px; display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.device-type-pill { display:inline-flex; align-items:center; padding:8px 11px; border:1px solid rgba(255,255,255,.76); border-radius:999px; background:rgba(255,255,255,.83); color:#18365f; font-size:10px; font-weight:900; letter-spacing:.04em; box-shadow:0 5px 16px rgba(12,30,62,.08); backdrop-filter:blur(12px); }
.device-media-badges { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; }
.device-media-badges .badge { border:1px solid rgba(255,255,255,.6); box-shadow:0 5px 15px rgba(8,27,56,.08); backdrop-filter:blur(12px); }
.device-card-v304 .device-card-head { padding:18px 20px 12px; border-bottom:0; }
.device-card-v304 .device-title { min-width:0; flex:1; }
.device-card-v304 .device-title h3 { font-size:18px; line-height:1.2; }
.device-card-v304 .device-title p { font-size:11px; }
.device-facts-v304 { padding-top:0; padding-bottom:16px; column-gap:24px; }
.device-facts-v304 .fact { padding:10px 0 8px; }
.device-facts-v304 .fact span { display:block; }
.device-facts-v304 .fact strong { display:block; overflow-wrap:anywhere; font-size:11px; }
.device-facts-v304 .fact small { display:block; margin-top:4px; font-size:9px; line-height:1.45; }
.device-card-footer { display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:15px 18px 17px; border-top:1px solid rgba(25,55,100,.07); background:linear-gradient(115deg,rgba(245,248,255,.96),rgba(255,250,221,.49)); margin-top:auto; }
.device-card-footer-meta { display:flex; flex-direction:column; align-items:flex-start; gap:6px; min-width:0; flex:1; color:#73839b; font-size:9px; }
.device-card-footer-meta small { color:#8693a7; font-size:9px; }
.device-legacy-note { color:#896400; font-size:9px; line-height:1.4; }
.device-card-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.device-card-actions .button { min-height:36px; padding:8px 12px; }
.device-card-actions .button:disabled { cursor:not-allowed; }
.device-empty { padding:27px; border:1px dashed rgba(40,80,146,.18); border-radius:20px; background:rgba(255,255,255,.68); }
.device-empty strong { font-size:14px; }
.device-empty span { color:#7a8aa2; font-size:11px; line-height:1.6; }
@media(min-width:851px) {
  .login-screen { justify-content:center; }
  .login-card { width:100%; }
  .device-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,390px),1fr)); }
}
@media(min-width:1200px) {
  .device-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); }
}
@media(max-width:850px) {
  .login-screen { justify-content:center; padding:18px 16px 22px; }
  .login-shell { width:min(470px,100%); }
  .login-card { padding:28px 26px; }
  .login-card-brand img { width:66px;height:74px; }
  .device-card-media { height:150px; min-height:150px; }
  .device-create-grid { grid-template-columns:1fr 1fr; }
}
@media(max-width:560px) {
  .login-screen { gap:14px; padding:12px 12px 16px; }
  .login-shell { width:min(430px,100%); }
  .login-card { padding:23px 19px; border-radius:25px; }
  .login-card-brand { margin-bottom:10px; }
  .login-card-brand img { width:58px;height:64px; }
  .login-welcome { font-size:19px; letter-spacing:.13em; }
  .login-card h1 { font-size:28px; }
  .login-card > p:not(.inline-message) { font-size:12px; margin-bottom:18px; }
  .device-create-grid { grid-template-columns:1fr; }
  .device-card-media { height:139px; min-height:139px; }
  .device-card-v304 .device-card-head { padding:15px 16px 10px; }
  .device-facts-v304 { padding:0 16px 13px; column-gap:14px; }
  .device-card-footer { padding:13px 14px; flex-direction:column; align-items:stretch; }
  .device-card-actions { display:grid; grid-template-columns:1fr 1fr; }
  .device-card-actions .button { width:100%; white-space:nowrap; }
  .global-admin-field { padding:13px; }
}
@media(prefers-reduced-motion:reduce) {
  .login-card-brand img,.device-reference-photo { animation:none!important; transition:none!important; }
}


/* YAYO GPS v30.5 — compact fleet cards, cloud battery telemetry and BLE onboarding */
.page-device-actions{display:flex;justify-content:flex-end;margin:-6px 0 14px;}
.page-device-actions .button{min-height:39px;box-shadow:0 7px 18px rgba(21,91,232,.14)}
#inventory-section-heading{margin-top:10px}
.device-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,292px),328px));justify-content:start;align-items:start;gap:14px;margin:0 0 22px;}
.device-card-v305{width:100%;min-width:0;max-width:328px;border-radius:20px;overflow:hidden;background:rgba(255,255,255,.94);box-shadow:0 12px 34px rgba(22,52,94,.08);transition:transform .24s cubic-bezier(.2,.75,.25,1),box-shadow .24s,border-color .24s;}
.device-card-v305:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(22,52,94,.14);border-color:rgba(21,91,232,.25)}
.device-card-media-v305{height:95px;min-height:95px;border-radius:0;background:linear-gradient(120deg,#e9f1ff,#fff6be)}
.device-card-media-v305 .device-reference-photo{height:100%;width:100%;object-fit:cover;object-position:center 56%;filter:saturate(.95)}
.device-card-media-v305::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,31,59,.08),rgba(13,31,59,.02) 42%,rgba(13,31,59,.13));pointer-events:none}
.device-card-media-v305 .device-media-top{z-index:2;padding:9px;align-items:flex-start}
.device-card-media-v305 .device-type-pill{font-size:9px;padding:5px 8px;border:1px solid rgba(255,255,255,.7);box-shadow:0 2px 8px rgba(20,40,70,.08)}
.device-card-media-v305 .device-media-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
.device-card-media-v305 .badge{font-size:8px;padding:4px 6px}
.device-card-head-v305{padding:11px 13px 8px;border:0;min-height:auto}
.device-card-head-v305 .eyebrow{font-size:7px;letter-spacing:.14em;margin-bottom:4px}
.device-card-head-v305 .device-title h3{font-size:14px;line-height:1.25;margin:0 0 3px;overflow-wrap:anywhere}
.device-card-head-v305 .device-title p{font-size:9px;line-height:1.35;margin:0;color:#7788a2}
.device-facts-v305{padding:0 13px 10px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.device-facts-v305 .fact{padding:7px 0 6px;border-bottom:1px solid #edf1f8;min-width:0}
.device-facts-v305 .fact span{font-size:8px;color:#8292aa;line-height:1.25;margin-bottom:3px}
.device-facts-v305 .fact strong{font-size:9px;line-height:1.3;overflow-wrap:anywhere;white-space:normal}
.device-facts-v305 .fact small{font-size:8px;line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.device-facts-v305 .fact .badge{font-size:8px;padding:4px 6px}
.device-card-footer-v305{padding:9px 12px 11px;gap:8px;align-items:flex-end;background:linear-gradient(120deg,rgba(236,244,255,.72),rgba(255,251,225,.7));border-top:1px solid rgba(222,231,246,.7)}
.device-card-footer-v305 .device-card-footer-meta{min-width:0;gap:4px}
.device-card-footer-v305 .device-card-footer-meta small{font-size:8px;line-height:1.25}
.device-card-footer-v305 .device-card-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;max-width:65%}
.device-card-footer-v305 .button{font-size:9px;min-height:29px;padding:6px 8px;border-radius:9px;white-space:nowrap}
.device-provider-only{border-style:dashed;border-color:#d3b34b}
.battery-widget{display:inline-flex;align-items:center;gap:6px;min-height:18px;color:#20324d;white-space:nowrap}
.battery-widget strong{font-size:10px!important;font-weight:850;letter-spacing:-.02em}
.battery-outline{position:relative;display:inline-flex;align-items:center;width:31px;height:14px;padding:2px;border:1.6px solid #7f8b9e;border-radius:4px;background:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);overflow:visible}
.battery-outline:after{content:"";position:absolute;right:-4px;top:3px;width:2px;height:5px;border-radius:0 2px 2px 0;background:#7f8b9e}
.battery-fill{display:block;height:100%;border-radius:1.5px;transition:width .4s ease;background:#25b56a}
.battery-medium .battery-fill{background:#edb72b}
.battery-low .battery-fill{background:#ec4b55}
.battery-unreported{font-size:8px;color:#91a0b5;display:inline-flex;align-items:center;min-height:18px}
.battery-low strong{color:#d23b47}.battery-medium strong{color:#9b7200}.battery-high strong{color:#15864e}
.add-device-methods{padding:18px;margin:0 0 18px;border:1px solid rgba(206,220,244,.9);background:linear-gradient(120deg,rgba(255,255,255,.96),rgba(239,246,255,.9),rgba(255,250,218,.7));}
.add-method-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:8px 0 4px}
.add-method-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:7px;padding:17px;border:1px solid #dbe5f6;border-radius:16px;background:rgba(255,255,255,.85);color:#111111;cursor:pointer;transition:transform .2s ease,border-color .2s,box-shadow .2s}
.add-method-card:hover{transform:translateY(-3px);border-color:#8eaffb;box-shadow:0 12px 26px rgba(21,91,232,.11)}
.add-method-icon{display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:linear-gradient(135deg,#ffed76,#ffd72f);color:#111111;font-size:23px;font-weight:900}
.add-method-card strong{font-size:13px}.add-method-card small{font-size:10px;line-height:1.55;color:#7889a3}
.add-method-cta{display:flex;justify-content:space-between;gap:15px;align-items:center;width:100%;margin-top:5px;color:#111111;font-size:10px;font-weight:800}
.ble-device-panel{margin-top:16px;padding:16px;border:1px solid #dfe8f7;border-radius:16px;background:rgba(255,255,255,.9)}
.ble-device-panel .panel-heading{margin-bottom:10px}.ble-device-panel .panel-heading h3{font-size:16px;margin:5px 0}.ble-device-panel .panel-heading p{font-size:10px;line-height:1.5;color:#7a8ca4;max-width:660px}
.ble-scan-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0 17px}
.ble-scan-status{font-size:10px;color:#6f8098;line-height:1.5;min-width:220px}
.ble-device-form{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}
.ble-device-form .ble-battery-preview{padding:10px 12px;border-radius:12px;border:1px solid #dbe6f6;background:#f7faff;display:flex;align-items:center;min-height:42px;gap:8px;flex-wrap:wrap}
.ble-battery-preview small{font-size:9px;color:#7586a0}
.ble-device-form .form-actions,.ble-device-form .inline-message{grid-column:1/-1}
@media(max-width:980px){.device-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,278px),1fr))}.device-card-v305{max-width:none}.ble-device-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.page-device-actions{justify-content:stretch}.page-device-actions .button{width:100%}.device-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.device-card-media-v305{height:82px;min-height:82px}.device-card-head-v305{padding:10px 10px 6px}.device-card-head-v305 .device-title h3{font-size:12px}.device-card-head-v305 .device-title p{font-size:8px}.device-facts-v305{padding:0 10px 8px;grid-template-columns:1fr;column-gap:0}.device-facts-v305 .fact{padding:6px 0 5px}.device-card-footer-v305{padding:8px;align-items:stretch;flex-direction:column}.device-card-footer-v305 .device-card-actions{max-width:none;justify-content:flex-start}.device-card-footer-v305 .button{flex:1}.add-method-grid{grid-template-columns:1fr}}
@media(max-width:430px){.device-grid{grid-template-columns:minmax(0,1fr)}.device-card-v305{max-width:100%}.device-card-media-v305{height:110px;min-height:110px}.device-facts-v305{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}.ble-device-form{grid-template-columns:1fr}.add-device-methods{padding:13px}.add-method-card{padding:14px}}
@media(prefers-reduced-motion:reduce){.device-card-v305,.add-method-card,.battery-fill{transition:none!important}}

/* v30.6 — distinguish real cloud inventory points that are not linked yet. */
.yayo-map-marker-cloud-wrap .yayo-map-marker{background:linear-gradient(145deg,#60d8ff,#1477f8);box-shadow:0 7px 18px rgba(20,119,248,.38)}
.yayo-map-marker-cloud-wrap .yayo-map-marker span{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.26)}
.map-cloud-item{background:linear-gradient(90deg,rgba(230,244,255,.48),transparent);border-radius:10px;padding-left:8px;padding-right:8px}
.map-list-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.map-popup-status{display:block;margin:5px 0;color:#986200;font-weight:700}
@media(max-width:520px){.map-list-actions{width:100%;justify-content:flex-start;padding-left:42px}.map-list-item{flex-wrap:wrap}.map-list-copy{min-width:0;flex:1}}


/* v30.7 — sync summary, 15-day trajectory, QR/NFC, and dashboard empty-state refinement */
#device-grid.hidden,#inventory-section-heading.hidden{display:none!important}
.add-method-grid-v307{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.add-method-grid-v307 .add-method-card{min-height:178px;display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:9px;border-radius:18px;position:relative;overflow:hidden}
.add-method-grid-v307 .add-method-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,#ffd92f,#145be8);opacity:.75}
.add-method-grid-v307 .add-method-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,#fff2a4,#e5efff);color:#164bba;font-size:22px;font-weight:900}
.add-method-grid-v307 .add-method-card strong{font-size:14px;color:#10233f;line-height:1.3}
.add-method-grid-v307 .add-method-card small{font-size:11px;line-height:1.55;color:#72819a}
.add-method-grid-v307 .add-method-cta{margin-top:auto;font-size:11px;color:#111111;font-weight:800}
.scan-device-panel{margin-top:14px;padding:16px;border:1px solid rgba(210,224,248,.95);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.97),rgba(236,244,255,.88),rgba(255,250,219,.65));box-shadow:0 10px 30px rgba(20,52,100,.06);animation:card-rise .24s ease both}
.qr-camera-video{display:block;width:min(100%,640px);max-height:360px;min-height:120px;margin:12px auto;border-radius:18px;object-fit:cover;background:#0b1d36}
.scan-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}
.scan-manual-fallback{display:grid;gap:7px;margin:12px 0;color:#354c6e;font-size:12px;font-weight:700}
.scan-manual-fallback input{padding:12px 14px;border:1px solid #d7e2f3;border-radius:12px;background:#fff;color:#152945;font:inherit;font-weight:500}
.nfc-reading-orb{margin:14px auto;width:100px;height:100px;display:grid;place-items:center;border-radius:50%;font-size:28px;font-weight:900;color:#145be8;background:radial-gradient(circle at 35% 30%,#fff,#e7efff 50%,#fff2a5);box-shadow:0 0 0 12px rgba(20,91,232,.045),0 14px 38px rgba(20,91,232,.12);animation:nfc-pulse 1.8s ease-in-out infinite}
@keyframes nfc-pulse{0%,100%{transform:scale(1);box-shadow:0 0 0 8px rgba(20,91,232,.04),0 14px 38px rgba(20,91,232,.1)}50%{transform:scale(1.045);box-shadow:0 0 0 17px rgba(20,91,232,.02),0 14px 42px rgba(20,91,232,.15)}}
.workspace-dialog{width:min(900px,calc(100vw - 28px));max-width:900px;max-height:min(88vh,920px);overflow:auto;padding:0;border:1px solid rgba(255,255,255,.9);border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f3f7ff 64%,#fffbe3 100%);color:#142944;box-shadow:0 28px 100px rgba(8,29,62,.28)}
.workspace-dialog::backdrop{background:rgba(9,26,52,.44);backdrop-filter:blur(8px)}
.workspace-dialog-heading{padding:24px 26px 18px;border-bottom:1px solid #e3eaf5}
.workspace-dialog-heading h2{margin:7px 0 8px;color:#10233f;font-size:clamp(22px,3vw,30px);font-weight:900;letter-spacing:-.04em}
.workspace-dialog-heading p{margin:0;color:#6d7f99;font-size:12px;line-height:1.6}
.sync-modal-status{display:flex;align-items:center;gap:11px;margin:18px 24px 0;padding:13px 15px;border:1px solid #bee9d6;border-radius:15px;background:#effbf5}
.sync-success-dot{width:12px;height:12px;flex:none;border-radius:50%;background:#13a66a;box-shadow:0 0 0 5px rgba(19,166,106,.13)}
.sync-modal-status strong,.sync-modal-status small{display:block}.sync-modal-status strong{font-size:13px;color:#137a51}.sync-modal-status small{margin-top:3px;font-size:11px;color:#54826f;line-height:1.45}
.sync-modal-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:18px 24px}
.sync-metric{min-width:0;padding:14px 12px;border:1px solid rgba(214,226,245,.94);border-radius:15px;background:rgba(255,255,255,.78);box-shadow:0 5px 15px rgba(24,56,105,.035)}
.sync-metric strong{display:block;color:#111111;font-size:25px;line-height:1.1;font-weight:900;letter-spacing:-.04em}.sync-metric span{display:block;margin-top:7px;color:#657894;font-size:10px;line-height:1.45}
.sync-modal-details{margin:0 24px 20px;padding:16px 18px;border-radius:16px;background:rgba(255,255,255,.72);border:1px solid #e0e8f5}.sync-modal-details h3{margin:0 0 9px;font-size:13px;color:#1a3254}.sync-modal-details ul{padding-left:18px;margin:0;color:#6b7c95;font-size:11px;line-height:1.7}.sync-modal-details li+li{margin-top:4px}
.workspace-dialog-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 24px 20px;border-top:1px solid #e3eaf5;color:#71819a;font-size:10px;line-height:1.4}
.trajectory-map{height:300px;margin:18px 24px 12px;border-radius:18px;overflow:hidden;border:1px solid #d7e4f5;background:#e6f0ff}
.trajectory-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:0 24px 14px}.trajectory-summary span{display:block;min-width:0;padding:12px;border-radius:13px;background:rgba(255,255,255,.82);border:1px solid #e1e9f6;color:#71819a;font-size:10px}.trajectory-summary strong{display:block;color:#173253;font-size:11px;margin-bottom:5px;overflow-wrap:anywhere}
.trajectory-table-wrap{max-height:240px;overflow:auto;margin:0 24px 18px;border:1px solid #e1e9f6;border-radius:13px;background:#fff}.trajectory-table{width:100%;border-collapse:collapse;font-size:11px}.trajectory-table th,.trajectory-table td{padding:10px 12px;border-bottom:1px solid #edf1f7;text-align:left;white-space:nowrap}.trajectory-table th{position:sticky;top:0;background:#f6f9ff;color:#4f6380;font-size:9px;text-transform:uppercase;letter-spacing:.06em}.trajectory-table td{color:#28405f}.trajectory-table tbody tr:last-child td{border-bottom:0}
@media(max-width:1000px){.add-method-grid-v307{grid-template-columns:repeat(2,minmax(0,1fr))}.sync-modal-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.workspace-dialog{width:calc(100vw - 16px);border-radius:18px;max-height:92vh}.workspace-dialog-heading{padding:19px 17px 15px}.sync-modal-status{margin:14px 14px 0}.sync-modal-metrics{padding:14px;gap:8px}.sync-metric{padding:11px 10px}.sync-metric strong{font-size:22px}.sync-modal-details{margin:0 14px 15px;padding:13px}.workspace-dialog-footer{align-items:flex-start;flex-direction:column;padding:13px 16px 16px}.workspace-dialog-footer .button{width:100%}.trajectory-map{height:250px;margin:14px 14px 10px}.trajectory-summary{grid-template-columns:1fr;margin:0 14px 12px}.trajectory-table-wrap{margin:0 14px 14px}.trajectory-table th,.trajectory-table td{padding:9px 8px}.add-method-grid-v307{grid-template-columns:1fr}.add-method-grid-v307 .add-method-card{min-height:145px}.qr-camera-video{max-height:250px}}
@media(prefers-reduced-motion:reduce){.nfc-reading-orb,.scan-device-panel{animation:none!important}}

.sync-modal-status.sync-failed{border-color:#f3c5be;background:#fff4f2}.sync-modal-status.sync-failed strong{color:#ae3126}.sync-modal-status.sync-failed small{color:#8d625d}.sync-modal-status.sync-failed .sync-success-dot{background:#dc4939;box-shadow:0 0 0 5px rgba(220,73,57,.13)}.sync-metric strong.sync-metric-text{font-size:14px;line-height:1.25;letter-spacing:-.02em;overflow-wrap:anywhere}


/* YAYO GPS v31.1 — explicit per-company settings scope */
.settings-org-picker{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:16px;margin:0 0 8px;border:1px solid #d8e5fa;border-radius:14px;background:linear-gradient(120deg,rgba(235,243,255,.88),rgba(255,250,220,.52));}
.settings-org-picker label{display:block;margin:0;color:#29405f;font-size:11px;font-weight:850;}
.settings-org-picker select{width:100%;min-height:43px;border:1px solid #cddcf0;border-radius:11px;padding:10px 12px;background:#fff;color:#162945;font:inherit;font-size:12px;font-weight:700;outline:none;transition:border-color .18s,box-shadow .18s;}
.settings-org-picker select:focus-visible{border-color:#111111;box-shadow:0 0 0 4px rgba(21,91,232,.10);}
.settings-org-picker small{display:block;color:#6e819a;font-size:10px;line-height:1.55;}
#settings-result.success{padding:10px 12px;border-radius:10px;background:#eaf8f1;color:#16734f;}
#settings-result.error{padding:10px 12px;border-radius:10px;background:#fff1f1;color:#a5333d;}
#settings-form input:disabled{cursor:not-allowed;opacity:.62;}
@media(max-width:560px){.settings-org-picker{padding:13px;}}


/* TRIOTAG BRAND OVERRIDE v1 */
:root {
  color-scheme: light;
  --ink: #111111;
  --muted: #737373;
  --line: #D5D5D5;
  --panel: #FFFFFF;
  --blue: #111111;
  --blue-dark: #050505;
  --cyan: #A6A6A6;
  --yayo-yellow: #FFFFFF;
  --yayo-yellow-deep: #A6A6A6;
  --yayo-blue: #111111;
  --yayo-yellow-soft: #F0F0F0;
  --yayo-blue-deep: #111111;
  --yayo-cyan: #A6A6A6;
  --yayo-lilac: #A6A6A6;
  --shadow: 0 8px 28px rgba(0,0,0,.08);
}

/* Login: dark background so the supplied white TRIOTAG wordmark remains legible. */
.login-screen {
  background: radial-gradient(circle at 18% 16%, #1C1C1C 0, #111111 43%, #050505 100%) !important;
  color: #FFFFFF !important;
}
.login-screen .login-brand,
.login-screen .login-hero,
.login-screen .login-hero h1,
.login-screen .login-hero h2,
.login-screen .login-wordmark,
.login-screen .login-wordmark h2,
.login-screen .login-wordmark h2 em,
.login-screen .wordmark-kicker { color: #FFFFFF !important; }
.login-screen .login-wordmark p,
.login-screen .login-trust,
.login-screen .login-hero p { color: #A6A6A6 !important; }
.login-screen .login-mascot-stage {
  width: clamp(250px, 29vw, 410px) !important;
  height: clamp(95px, 13vw, 155px) !important;
  margin-bottom: 24px !important;
}
.login-screen .mascot-aura { display: none !important; }
.login-screen .login-mascot {
  display: block !important;
  width: min(100%, 390px) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  filter: none !important;
}
.login-screen .panel,
.login-screen form,
.login-screen #login-form,
.login-screen .login-card,
.login-screen .login-panel,
.login-screen .login-form {
  background: #111111 !important;
  color: #FFFFFF !important;
  border-color: #383838 !important;
  box-shadow: 0 18px 55px rgba(0,0,0,.32) !important;
}
.login-screen label,
.login-screen .field-label,
.login-screen .form-label { color: #E6E6E6 !important; }
.login-screen input,
.login-screen select,
.login-screen textarea {
  background: #050505 !important;
  color: #FFFFFF !important;
  border-color: #454545 !important;
}
.login-screen input:focus,
.login-screen select:focus,
.login-screen textarea:focus {
  border-color: #A6A6A6 !important;
  box-shadow: 0 0 0 3px rgba(166,166,166,.18) !important;
}
.login-screen #login-submit,
.login-screen .btn-primary,
.login-screen button[type="submit"] {
  background: #FFFFFF !important;
  color: #050505 !important;
  border-color: #FFFFFF !important;
  box-shadow: none !important;
}
.login-screen #login-submit:hover,
.login-screen .btn-primary:hover,
.login-screen button[type="submit"]:hover { background: #DADADA !important; }
.login-screen a { color: #D0D0D0; }

/* Monochrome brand accents in the active dashboard; keep semantic status colors intact. */
.brand-mark { background: #111111 !important; color: #FFFFFF !important; }
.nav-item.active { color: #111111 !important; }
.nav-item.active:after { background: #111111 !important; }
.nav-item:hover { color: #111111 !important; }
.account-main {
  background: linear-gradient(135deg, #050505, #1C1C1C) !important;
  color: #FFFFFF !important;
  border-color: #383838 !important;
}
.account-main .card-label { color: #D0D0D0 !important; }


/* TRIOTAG VISIBLE BRAND FIX v2 */
.login-card-brand {
  width: min(100%, 280px);
  margin: 0 auto 15px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.login-card-brand img {
  display: block;
  width: min(235px, 100%);
  height: auto;
  max-height: 58px;
  object-fit: contain;
  filter: none;
}
.rail-brand img {
  display: block;
  width: 34px;
  height: 34px;
  object-fit: contain;
  border-radius: 8px;
  filter: none;
}