:root{color-scheme:light;--bg: #0f2240;--bg-2: #162e4d;--surface: rgba(255, 255, 255, .92);--surface-strong: #ffffff;--border: rgba(225, 83, 46, .24);--text: #12233e;--muted: #5f6d82;--brand: #e1532e;--brand-strong: #c8421f;--shadow: 0 24px 60px rgba(5, 16, 32, .24);--shadow-soft: 0 10px 30px rgba(5, 16, 32, .14)}*{-webkit-box-sizing:border-box;box-sizing:border-box}html,body,#root{height:100%;min-height:100%}body{margin:0;font-family:Cairo,Inter,sans-serif;background:radial-gradient(circle at top right,rgba(225,83,46,.24),transparent 26%),-webkit-gradient(linear,left top,left bottom,from(#0d1c35),color-stop(45%,#112745),to(#163054));background:radial-gradient(circle at top right,rgba(225,83,46,.24),transparent 26%),linear-gradient(180deg,#0d1c35,#112745 45%,#163054);color:var(--text)}button,input{font:inherit}.portal-shell{min-height:100vh;background-color:#162e4deb;background-repeat:no-repeat;background-position:left bottom;background-size:min(110vh,100%);position:relative}.portal-shell.authenticated{height:100vh;background:var(--bg-2);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;overflow:hidden}.portal-shell:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#09122361,#09122314);pointer-events:none}.portal-shell.authenticated:before{display:none}.portal-topbar,.portal-main{position:relative;z-index:1}.portal-topbar{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0;height:52px;padding:0 .75rem;background:#081122f7;border-bottom:1px solid rgba(255,255,255,.07);color:#fff;-ms-flex-negative:0;flex-shrink:0;overflow:hidden}.topbar-brand{-ms-flex-negative:0;flex-shrink:0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-border-end:1px solid rgba(255,255,255,.1);border-inline-end:1px solid rgba(255,255,255,.1);-webkit-margin-end:.5rem;margin-inline-end:.5rem;line-height:1.2}.topbar-brand-button{border:0;background:transparent;text-align:start;cursor:pointer}.topbar-brand-button:hover .brand-title{color:#ffffffe6}.topbar-brand-button:focus-visible{outline:2px solid rgba(225,83,46,.7);outline-offset:2px;border-radius:8px}.brand-title{font-size:.78rem;font-weight:800;white-space:nowrap;color:#fff}.brand-sub{font-size:.7rem;color:#ffffff8c}.app-nav{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.15rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding:0 .25rem;height:100%}.app-nav::-webkit-scrollbar{display:none}.nav-pill{-ms-flex-negative:0;flex-shrink:0;border:0;background:transparent;color:#fff9;padding:.4rem .9rem;border-radius:8px;cursor:pointer;font-size:.85rem;font-weight:600;white-space:nowrap;height:34px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.35rem;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.nav-pill:hover{background:#ffffff17;color:#fff}.nav-pill--active{background:var(--brand);color:#fff;-webkit-box-shadow:0 2px 10px rgba(225,83,46,.4);box-shadow:0 2px 10px #e1532e66}.nav-pill--active:hover{background:var(--brand-strong)}.nav-pill--newtab{color:#ffffff80}.nav-pill--newtab:hover{color:#fff}.logout-pill{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:.5rem;margin-inline-start:.5rem;border:1px solid rgba(255,255,255,.14);background:transparent;color:#ffffffa6;padding:.32rem .75rem;border-radius:8px;cursor:pointer;font-size:.8rem;font-weight:700;white-space:nowrap;-webkit-transition:background .15s,border-color .15s,color .15s;transition:background .15s,border-color .15s,color .15s}.refresh-pill{color:#6abcefeb}.close-pill{color:#ffffffb8}.topbar-action-button{-ms-flex-negative:0;flex-shrink:0;-webkit-margin-start:.5rem;margin-inline-start:.5rem;border:1px solid rgba(255,255,255,.14);background:transparent;color:inherit;width:32px;height:32px;padding:0;border-radius:8px;cursor:pointer;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-transition:background .15s,border-color .15s,color .15s;transition:background .15s,border-color .15s,color .15s}.topbar-action-icon{width:16px;height:16px}.refresh-pill:hover:not(:disabled){border-color:#2e99e180;background:#2e99e11a;color:#fff}.refresh-pill:disabled{opacity:.45;cursor:default}.close-pill:hover:not(:disabled){border-color:#ffffff57;background:#ffffff1a;color:#fff}.close-pill:disabled{opacity:.45;cursor:default}.logout-pill:hover{border-color:#e1532e80;background:#e1532e1a;color:#fff}.portal-subnav{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.15rem;height:38px;padding:0 .75rem;background:#0e1a32fa;border-bottom:1px solid rgba(255,255,255,.05);overflow-x:auto;scrollbar-width:none;-ms-flex-negative:0;flex-shrink:0}.portal-subnav::-webkit-scrollbar{display:none}.subnav-pill{-ms-flex-negative:0;flex-shrink:0;border:0;background:transparent;color:#fff9;padding:.28rem .75rem;border-radius:6px;cursor:pointer;font-size:.82rem;font-weight:600;white-space:nowrap;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.3rem;-webkit-transition:background .15s,color .15s;transition:background .15s,color .15s}.subnav-pill:hover{background:#ffffff12;color:#fff}.subnav-pill--active{background:#e1532e38;color:#f96a3b;font-weight:700}.subnav-pill--newtab{color:#ffffff73}.subnav-pill--newtab:hover{color:#fff}.pill-newtab-icon{width:11px;height:11px;opacity:.75;-ms-flex-negative:0;flex-shrink:0}.portal-content{-webkit-box-flex:1;-ms-flex:1;flex:1;overflow:hidden;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.welcome-screen{-webkit-box-flex:1;-ms-flex:1;flex:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;overflow:hidden;padding:0;background:radial-gradient(circle at 78% 32%,rgba(225,83,46,.18),transparent 38%),radial-gradient(circle at 22% 76%,rgba(255,255,255,.06),transparent 34%),-webkit-gradient(linear,left top,left bottom,from(#122948),to(#102542));background:radial-gradient(circle at 78% 32%,rgba(225,83,46,.18),transparent 38%),radial-gradient(circle at 22% 76%,rgba(255,255,255,.06),transparent 34%),linear-gradient(180deg,#122948,#102542)}.welcome-screen__map{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;-webkit-transform:none;transform:none;background:url(/assets/saudi-map-DNvJpXsY.svg) center / contain no-repeat;opacity:.34;-webkit-filter:drop-shadow(0 20px 44px rgba(0,0,0,.32));filter:drop-shadow(0 20px 44px rgba(0,0,0,.32));pointer-events:none}.welcome-screen__map:before,.welcome-screen__map:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.welcome-screen__map:before{background:radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 18% 34% / 120px 120px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 30% 48% / 140px 140px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 44% 24% / 130px 130px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 55% 56% / 150px 150px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 66% 38% / 135px 135px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 76% 62% / 150px 150px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 62% 74% / 125px 125px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 40% 72% / 145px 145px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 24% 64% / 130px 130px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 14% 50% / 115px 115px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 27% 22% / 125px 125px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 36% 82% / 140px 140px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 48% 66% / 120px 120px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 57% 28% / 125px 125px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 71% 24% / 120px 120px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 82% 44% / 135px 135px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 74% 78% / 130px 130px no-repeat,radial-gradient(circle,rgba(255,255,255,.72) 0 2px,transparent 3px) 52% 86% / 128px 128px no-repeat;-webkit-animation:gpsSignalPulse 3.1s ease-in-out infinite;animation:gpsSignalPulse 3.1s ease-in-out infinite}.welcome-screen__map:after{background:radial-gradient(circle,rgba(225,83,46,.95) 0 2.6px,transparent 3.6px) 22% 40% / 170px 170px no-repeat,radial-gradient(circle,rgba(225,83,46,.9) 0 2.6px,transparent 3.6px) 36% 30% / 180px 180px no-repeat,radial-gradient(circle,rgba(225,83,46,.95) 0 2.6px,transparent 3.6px) 52% 44% / 175px 175px no-repeat,radial-gradient(circle,rgba(225,83,46,.92) 0 2.6px,transparent 3.6px) 68% 52% / 190px 190px no-repeat,radial-gradient(circle,rgba(225,83,46,.95) 0 2.6px,transparent 3.6px) 58% 66% / 185px 185px no-repeat,radial-gradient(circle,rgba(225,83,46,.9) 0 2.6px,transparent 3.6px) 32% 60% / 170px 170px no-repeat,radial-gradient(circle,rgba(225,83,46,.92) 0 2.6px,transparent 3.6px) 16% 36% / 165px 165px no-repeat,radial-gradient(circle,rgba(225,83,46,.95) 0 2.6px,transparent 3.6px) 28% 74% / 175px 175px no-repeat,radial-gradient(circle,rgba(225,83,46,.9) 0 2.6px,transparent 3.6px) 44% 18% / 168px 168px no-repeat,radial-gradient(circle,rgba(225,83,46,.94) 0 2.6px,transparent 3.6px) 64% 30% / 178px 178px no-repeat,radial-gradient(circle,rgba(225,83,46,.92) 0 2.6px,transparent 3.6px) 78% 40% / 174px 174px no-repeat,radial-gradient(circle,rgba(225,83,46,.95) 0 2.6px,transparent 3.6px) 70% 70% / 182px 182px no-repeat,radial-gradient(circle,rgba(225,83,46,.9) 0 2.6px,transparent 3.6px) 48% 78% / 176px 176px no-repeat;animation:gpsSignalPulse 2.35s ease-in-out infinite reverse}@-webkit-keyframes gpsSignalPulse{0%{opacity:.22;-webkit-transform:scale(.985);transform:scale(.985)}50%{opacity:.62;-webkit-transform:scale(1.02);transform:scale(1.02)}to{opacity:.22;-webkit-transform:scale(.985);transform:scale(.985)}}@keyframes gpsSignalPulse{0%{opacity:.22;-webkit-transform:scale(.985);transform:scale(.985)}50%{opacity:.62;-webkit-transform:scale(1.02);transform:scale(1.02)}to{opacity:.22;-webkit-transform:scale(.985);transform:scale(.985)}}.welcome-screen__card{position:relative;z-index:1;max-width:680px;width:min(90vw,680px);-webkit-margin-end:auto;margin-inline-end:auto;padding:1.65rem 1.8rem;border-radius:20px;border:1px solid rgba(255,255,255,.12);background:#0813269e;-webkit-box-shadow:0 12px 32px rgba(3,10,22,.28);box-shadow:0 12px 32px #030a1647;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.welcome-screen__card h2{margin:0;color:#fffffff2;font-size:clamp(1.35rem,1.95vw,1.85rem);font-weight:800}.welcome-screen__card p{margin:.7rem 0 0;color:#ffffffb8;font-size:1.04rem;line-height:1.7}.portal-main{min-height:100vh;display:grid;place-items:center;padding:2rem 1rem 3rem;position:relative;z-index:1}.login-section{width:min(1100px,100%);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,.9fr);-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:2rem}.login-heading{color:#fff;-webkit-padding-start:.5rem;padding-inline-start:.5rem}.login-heading h1,.apps-title{margin:0;font-size:clamp(2rem,3vw,3.2rem);line-height:1.1;font-weight:800}.login-heading p{margin:1rem 0 0;max-width:42rem;color:#ffffffc7;font-size:1.05rem;line-height:1.8}.login-card-shell{min-height:450px;background-repeat:no-repeat;background-position:center;background-size:contain;display:grid;place-items:center}.login-card{width:min(100%,340px);-webkit-margin-start:11rem;margin-inline-start:11rem;border-radius:28px;background:#ffffffe6;-webkit-box-shadow:var(--shadow);box-shadow:var(--shadow);padding:1.2rem;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.45)}.login-card__header{font-size:1.2rem;font-weight:800;color:var(--text);margin-bottom:1.1rem}.field{display:grid;gap:.45rem;margin-bottom:1rem}.field span{font-weight:700;color:var(--text)}.field input{width:100%;border:1px solid rgba(18,35,62,.14);border-radius:16px;background:#fffffff2;padding:.9rem 1rem;outline:none;-webkit-transition:border-color .2s ease,-webkit-box-shadow .2s ease,-webkit-transform .2s ease;transition:border-color .2s ease,-webkit-box-shadow .2s ease,-webkit-transform .2s ease;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease,-webkit-box-shadow .2s ease,-webkit-transform .2s ease}.field input:focus{border-color:#e1532eb3;-webkit-box-shadow:0 0 0 4px rgba(225,83,46,.12);box-shadow:0 0 0 4px #e1532e1f}.primary-button,.ghost-button,.app-card{-webkit-transition:border-color .2s ease,opacity .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease;transition:border-color .2s ease,opacity .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,opacity .2s ease;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,opacity .2s ease,-webkit-transform .2s ease,-webkit-box-shadow .2s ease}.primary-button{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:.5rem;border:0;border-radius:16px;background:linear-gradient(135deg,var(--brand) 0%,var(--brand-strong) 100%);color:#fff;font-weight:800;padding:.95rem 1.2rem;-webkit-box-shadow:0 16px 26px rgba(225,83,46,.28);box-shadow:0 16px 26px #e1532e47;cursor:pointer}.primary-button:hover,.ghost-button:hover,.app-card:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px)}.primary-button:disabled{opacity:.65;cursor:progress}.full-width{width:100%}.ghost-button{border:1px solid rgba(255,255,255,.22);background:#ffffff14;color:#fff;border-radius:999px;padding:.8rem 1.15rem;cursor:pointer}.ghost-button.danger{border-color:#e1532e6b;background:#e1532e1f}.error-banner{margin-top:1rem;padding:.85rem 1rem;border-radius:14px;background:#b71c1c1a;color:#8d1f1f;font-weight:700}.apps-screen{width:min(1280px,100%);padding:.5rem 1rem 2rem}.apps-title{color:#fff;text-align:center;margin:0 0 2rem;font-size:clamp(1.4rem,2.5vw,2rem)}.apps-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}.app-card{min-height:120px;width:100%;border:1px solid var(--border);border-radius:18px;padding:1.1rem 1.2rem;background:linear-gradient(160deg,#fffffffa,#fff8f4f5);color:var(--text);-webkit-box-shadow:0 6px 20px rgba(5,16,32,.12);box-shadow:0 6px 20px #0510201f;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;text-align:start;-webkit-transition:-webkit-transform .18s ease,-webkit-box-shadow .18s ease;transition:-webkit-transform .18s ease,-webkit-box-shadow .18s ease;transition:transform .18s ease,box-shadow .18s ease;transition:transform .18s ease,box-shadow .18s ease,-webkit-transform .18s ease,-webkit-box-shadow .18s ease}.app-card:hover{-webkit-transform:translateY(-3px);transform:translateY(-3px);-webkit-box-shadow:0 14px 32px rgba(5,16,32,.18);box-shadow:0 14px 32px #0510202e}.app-card__title{font-size:1rem;font-weight:800;line-height:1.4}.app-card__description{display:none}.back-card{border-style:dashed;border-color:#ffffff4d;background:#ffffff14;color:#fff;min-height:60px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:.9rem;font-weight:700}.back-card:hover{background:#ffffff24}.app-frame{-webkit-box-flex:1;-ms-flex:1;flex:1;width:100%;height:100%;border:0;background:#fff}.idle-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#070e1c94;display:grid;place-items:center;padding:1rem;z-index:20}.idle-card{width:min(560px,100%);border-radius:28px;background:#fffffffa;-webkit-box-shadow:var(--shadow);box-shadow:var(--shadow);padding:1.5rem;text-align:center}.idle-card h2{margin:0;color:var(--text);font-size:1.35rem}.idle-card p{color:var(--muted);line-height:1.8;margin:.9rem 0 1.4rem}@media(max-width:960px){.portal-topbar{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.login-section{grid-template-columns:1fr}.login-card-shell{min-height:auto;background-position:center top}.login-card{-webkit-margin-start:0;margin-inline-start:0;margin-top:10rem}.welcome-screen{padding:0}.welcome-screen__card{width:min(94vw,620px);margin-inline:auto}}@media(max-width:640px){.portal-shell{background-size:cover}.portal-topbar,.portal-main{padding-inline:1rem}.login-card,.app-frame,.idle-card{border-radius:22px}.portal-content{overflow:hidden}.welcome-screen__map{top:0;right:0;bottom:0;left:0;width:100%;height:100%;background-size:contain;opacity:.28}.welcome-screen__card{margin-inline:auto;text-align:center;padding:1.15rem 1.1rem}}