/*
 * Intra Solution welcome intro + page loader, and the sign-in scene.
 * Same model as the GPSmap brand system, recoloured to the intrasolution navy/green and with a
 * network scene instead of a map. Everything is scoped to .is-intro / .is-scene / .fi-simple-*
 * so it cannot affect Filament's or the website's own styles.
 */
.is-intro{--is-navy:#0a2a4a;--is-green:#4fae4a;--is-signal:#8ee86f;--is-font:'Avenir Next','Segoe UI',Arial,sans-serif;
  position:fixed;inset:0;z-index:2147483000;background:#061a30;color:#fff;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:center;
  opacity:1;visibility:visible;transition:opacity .5s ease,visibility .5s;font-family:var(--is-font)}
.is-intro *{box-sizing:border-box}
.is-intro[hidden]{display:none!important}
.is-intro.is-exit{opacity:0;visibility:hidden;pointer-events:none}
.is-intro:before{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 42%,#123c66a6,transparent 68%),linear-gradient(120deg,#04142a,#0a2744)}
.is-intro button{font:inherit;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.is-intro button:focus-visible,.is-intro a:focus-visible{outline:3px solid var(--is-signal);outline-offset:5px}
html.is-locked,html.is-locked body{overflow:hidden}
.is-intro .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.is-grain{position:absolute;inset:0;opacity:.1;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23ffffff' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.is-top,.is-bottom{position:absolute;left:5vw;right:5vw;display:flex;align-items:center;justify-content:space-between;z-index:5}
.is-top{top:35px}
.is-brand-label{font-size:11px;letter-spacing:.22em;font-weight:650}
.is-brand-label span{font-weight:400;color:#7f9cb8;display:block;font-size:9px;margin-top:8px;letter-spacing:.25em}
.is-skip{color:#c4d6e6;background:transparent;font-size:12px;padding:12px 0 12px 18px;display:flex;gap:18px;align-items:center}
.is-skip span{border:1px solid #33557a;border-radius:3px;padding:3px 7px;font-size:11px}
.is-bottom{bottom:30px;gap:25px;color:#7393b3;font-size:9px;letter-spacing:.17em}
.is-progress{height:1px;background:#ffffff25;flex:1;position:relative;overflow:hidden}
.is-progress:after{content:'';position:absolute;inset:0;background:var(--is-signal);transform:scaleX(0);transform-origin:left}
.is-running .is-progress:after{animation:is-progress 4.7s linear forwards}
.is-coordinate{position:absolute;left:5vw;top:49%;writing-mode:vertical-rl;font-size:9px;letter-spacing:.18em;color:#5b7fa3}

/* Background map with animated route */
.is-route{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:-1;opacity:.38}
.is-route-glow{fill:none;stroke:var(--is-signal);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;filter:drop-shadow(0 0 6px #8ee86f)}
.is-running .is-route-glow{animation:is-route 2.8s cubic-bezier(.25,.05,.25,1) .2s forwards}
.is-packet{opacity:0;filter:drop-shadow(0 0 8px #8ee86f)}
.is-running .is-packet{animation:is-light 3.2s .2s both}
.is-nodes{opacity:0}
.is-running .is-nodes{animation:is-rise .7s 2.7s forwards}

/* Radar */
.is-radar{position:absolute;width:620px;height:620px;left:50%;top:46%;transform:translate(-50%,-50%);z-index:0;pointer-events:none;border:1px solid #8ee86f14;border-radius:50%;background:radial-gradient(circle,#061a30ea 30%,#061a3088 57%,transparent 70%)}
.is-radar:before,.is-radar:after{content:'';position:absolute;border:1px solid #8ee86f15;border-radius:50%;inset:55px}
.is-radar:after{inset:120px}
.is-radar i{position:absolute;inset:0;border:1px solid #8ee86f;border-radius:50%;opacity:0}
.is-running .is-radar i{animation:is-pulse 3s .1s ease-out infinite}
.is-running .is-radar i:nth-child(2){animation-delay:1.1s}
.is-running .is-radar i:nth-child(3){animation-delay:2.1s}
.is-radar div{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 72%,#8ee86f09 88%,#8ee86f30 99%,transparent);-webkit-mask-image:radial-gradient(circle,transparent 35%,black 60%);mask-image:radial-gradient(circle,transparent 35%,black 60%);animation:is-sweep 6s linear infinite}

/* Centre stage */
.is-center{width:min(85vw,660px);text-align:center;position:relative;z-index:2;margin-top:-20px}
.is-logo-shell{position:relative;width:min(100%,520px);margin:0 auto 32px;display:flex;align-items:center;justify-content:center;min-height:150px}
.is-logo-panel{position:relative;width:100%;opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(12px)}
.is-logo-panel img{width:100%;height:auto;display:block}
.is-running .is-logo-panel{animation:is-logo 1.1s cubic-bezier(.16,1,.3,1) 1s forwards}
.is-pieces{position:absolute;inset:0;display:flex;gap:14px;align-items:center;justify-content:center}
.is-pieces i{width:46px;height:46px;border:7px solid #fff;border-radius:50%;opacity:0;box-shadow:0 0 45px #75a5e514}
.is-pieces i:nth-child(2){margin-top:-60px;border-color:#a8ec8a;width:64px;height:64px}
.is-pieces i:nth-child(3){margin-top:30px;border-color:var(--is-green);width:56px;height:56px}
.is-running .is-pieces i{animation:is-piece 1.9s cubic-bezier(.2,.7,.2,1) .15s both}
.is-running .is-pieces i:nth-child(2){animation-delay:.3s}
.is-running .is-pieces i:nth-child(3){animation-delay:.45s}
.is-tagline{font-size:clamp(32px,3.9vw,54px);font-weight:500;line-height:1.12;letter-spacing:-.045em;margin:0;color:#fff}
.is-tagline span{display:block;opacity:0;transform:translateY(20px)}
.is-tagline span:last-child{color:var(--is-signal)}
.is-running .is-tagline span{animation:is-rise .85s cubic-bezier(.16,1,.3,1) 2s forwards}
.is-running .is-tagline span:last-child{animation-delay:2.25s}
.is-subtitle{font-size:9px;letter-spacing:.22em;color:#8fb0cf;margin:24px 0 0;opacity:0}
.is-running .is-subtitle{animation:is-rise .7s 2.85s forwards}
.is-enter{margin-top:30px;background:transparent;color:#fff;border:1px solid #33557a!important;border-radius:30px;padding:12px 22px;font-size:11px;letter-spacing:.03em;opacity:0;transform:translateY(10px)}
.is-enter b{margin-left:22px;color:var(--is-signal);font-size:15px;font-weight:400}
.is-running .is-enter{animation:is-rise .65s 3s forwards}
.is-enter:hover{background:#ffffff10;border-color:var(--is-signal)!important}
.is-run-label{display:none}
.is-powered{position:absolute;bottom:58px;left:0;right:0;text-align:center;z-index:5;margin:0;font-size:10px;letter-spacing:.06em;color:#7a9cbc}
.is-powered a{color:#e6edf7;text-decoration:none;font-weight:600}
.is-powered a:hover{color:var(--is-signal)}

/* Terminal readouts */
.is-terminal{position:absolute;left:3vw;bottom:100px;width:264px;z-index:3;border:1px solid #3f6a9455;border-radius:7px;background:#04142ac9;box-shadow:0 12px 35px #0002;overflow:hidden;pointer-events:none;font-family:'SFMono-Regular',Consolas,'Liberation Mono',monospace;font-size:10px;color:#a3bdd6;text-align:left}
.is-terminal-bar{display:flex;justify-content:space-between;padding:10px 13px;border-bottom:1px solid #3f6a9433;font-size:9px;color:#6a8fb0;letter-spacing:.03em}
.is-terminal-bar i{display:inline-block;width:5px;height:5px;background:#8ee86f;border-radius:50%;margin-right:7px}
.is-terminal-bar>span:last-child{font-size:6px;letter-spacing:3px;color:#44688f}
.is-terminal-body{padding:12px 13px 14px}
.is-terminal-line{height:20px;line-height:20px}
.is-terminal-line>span{display:block;white-space:nowrap;overflow:hidden;width:0}
.is-terminal-line b{color:#8ee86f;font-weight:400}
.is-terminal-line em{font-style:normal;color:#8ee86f}
.is-running .is-terminal-line>span{animation:is-type .65s steps(28,end) .25s forwards}
.is-running .is-terminal-line:nth-child(2)>span{animation-delay:1.05s}
.is-running .is-terminal-line:nth-child(3)>span{animation-delay:1.8s}
.is-running .is-terminal-line:nth-child(4)>span{animation-delay:2.55s}
.is-running .is-terminal-line:nth-child(5)>span{animation-delay:3.3s}
.is-running .is-terminal-line em{animation:is-cursor .8s steps(1,end) infinite}
.is-terminal-signals{left:auto;right:3vw}
.is-terminal-routes{left:auto;right:3vw;top:110px;bottom:auto}
.is-running .is-terminal-signals .is-terminal-line>span{animation-delay:.55s}
.is-running .is-terminal-signals .is-terminal-line:nth-child(2)>span{animation-delay:1.25s}
.is-running .is-terminal-signals .is-terminal-line:nth-child(3)>span{animation-delay:1.95s}
.is-running .is-terminal-signals .is-terminal-line:nth-child(4)>span{animation-delay:2.65s}
.is-running .is-terminal-signals .is-terminal-line:nth-child(5)>span{animation-delay:3.35s}
.is-running .is-terminal-routes .is-terminal-line>span{animation-delay:.85s}
.is-running .is-terminal-routes .is-terminal-line:nth-child(2)>span{animation-delay:1.55s}
.is-running .is-terminal-routes .is-terminal-line:nth-child(3)>span{animation-delay:2.25s}
.is-running .is-terminal-routes .is-terminal-line:nth-child(4)>span{animation-delay:2.95s}
.is-running .is-terminal-routes .is-terminal-line:nth-child(5)>span{animation-delay:3.65s}

/* Loader mode (inner pages) */
.is-loader{transition-duration:.25s}
.is-loader .is-center{width:min(82vw,340px);margin:0}
.is-loader .is-logo-shell{width:320px;max-width:100%;min-height:0;margin:0 auto 23px}
.is-loader .is-logo-panel{opacity:1;clip-path:none;transform:none;animation:none!important}
.is-loader .is-pieces,.is-loader .is-tagline,.is-loader .is-subtitle,.is-loader .is-enter,.is-loader .is-coordinate,
.is-loader .is-brand-label,.is-loader .is-bottom,.is-loader .is-powered,.is-loader .is-terminal,.is-loader .is-nodes{display:none}
.is-loader .is-top{justify-content:flex-end;top:22px}
.is-loader .is-skip{font-size:10px;color:#a1b1cb}
.is-loader .is-route{opacity:.14}
.is-loader .is-route-glow,.is-loader .is-packet{animation-duration:1.05s!important;animation-delay:0s!important;animation-iteration-count:infinite!important}
.is-loader .is-radar{width:300px;height:300px;top:50%}
.is-loader .is-radar div{animation-duration:1.3s}
.is-loader .is-radar i{animation-duration:1.25s}
.is-loader .is-radar i:nth-child(2),.is-loader .is-radar i:nth-child(3){display:none}
.is-loader .is-run-label{display:flex;align-items:center;justify-content:center;gap:13px;margin-top:4px}
.is-lane{width:92px;height:2px;background:#ffffff1c;position:relative;overflow:hidden}
.is-lane:after{content:'';position:absolute;width:32px;height:2px;background:var(--is-signal);animation:is-lane .85s ease-in-out infinite}
.is-run-label small{color:#aabbd1;letter-spacing:.17em;font-size:8px}

@keyframes is-progress{to{transform:scaleX(1)}}
@keyframes is-route{to{stroke-dashoffset:0}}
@keyframes is-light{0%,100%{opacity:0}10%,80%{opacity:1}}
@keyframes is-piece{0%{opacity:0;transform:translate(-100px,50px)}35%,60%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(50px,-25px)}}
@keyframes is-logo{to{clip-path:inset(0);opacity:1;transform:translateY(0)}}
@keyframes is-rise{to{opacity:1;transform:translateY(0)}}
@keyframes is-lane{from{transform:translateX(-35px)}to{transform:translateX(100px)}}
@keyframes is-pulse{0%{transform:scale(.35);opacity:0}20%{opacity:.2}100%{transform:scale(1.3);opacity:0}}
@keyframes is-sweep{to{transform:rotate(360deg)}}
@keyframes is-type{to{width:100%}}
@keyframes is-cursor{50%{opacity:0}}

@media(min-width:1600px){.is-center{transform:scale(1.1)}}
@media(max-width:1100px){
  .is-terminal{width:222px;font-size:9px;bottom:88px;left:22px}
  .is-terminal-signals{left:auto;right:22px}
  .is-terminal-routes{left:auto;right:22px;top:100px;bottom:auto}
}
@media(max-width:760px){
  .is-top{top:22px;left:24px;right:24px}
  .is-brand-label{font-size:9px}.is-brand-label span{font-size:8px}
  .is-intro .is-center{width:88vw;margin-top:-12px}
  .is-intro:not(.is-loader) .is-center{transform:translateY(-55px)}
  .is-logo-shell{width:100%;min-height:90px;margin-bottom:35px}
  .is-tagline{font-size:clamp(27px,7.3vw,43px)}
  .is-subtitle{font-size:7px;letter-spacing:.13em;margin-top:23px}
  .is-bottom{left:24px;right:24px;bottom:25px;gap:14px;font-size:7px}
  .is-bottom .is-end,.is-coordinate{display:none}
  .is-route{width:180%;left:-40%}
  .is-radar{width:460px;height:460px}
  .is-powered{bottom:51px;font-size:9px}
  .is-terminal{left:16px;bottom:88px;width:calc(50% - 22px);font-size:6.5px}
  .is-terminal-signals{left:auto;right:16px}
  .is-terminal-routes{left:auto;right:16px;top:85px;bottom:auto}
  .is-terminal-bar{font-size:6.5px;padding:6px 7px}
  .is-terminal-bar>span:last-child{display:none}
  .is-terminal-body{padding:7px}.is-terminal-line{height:13px;line-height:13px}
  .is-terminal-routes .is-terminal-line:nth-child(n+4){display:none}
  .is-loader .is-center{width:82vw}
  .is-loader .is-radar{width:280px;height:280px}
}
@media(max-width:760px) and (max-height:740px){
  .is-intro:not(.is-loader) .is-center{transform:translateY(-45px)}
  .is-terminal-bar{display:none}
  .is-terminal-routes{top:78px}.is-terminal-routes .is-terminal-line:nth-child(n+3){display:none}
}
@media(max-height:620px){
  .is-logo-shell{width:330px;min-height:0;margin-bottom:18px}
  .is-tagline{font-size:30px}.is-intro .is-center{margin-top:0}
  .is-radar{width:420px;height:420px}
  .is-subtitle{margin-top:13px}.is-enter{margin-top:17px;padding:8px 20px}
  .is-top{top:14px}.is-bottom{bottom:17px}.is-powered{bottom:39px}
  .is-loader .is-logo-shell{width:270px}
}
@media(max-height:520px){
  .is-terminal{width:190px;bottom:70px;font-size:8px}.is-terminal-bar{display:none}
  .is-terminal-line{height:14px;line-height:14px}
  .is-terminal-routes{top:78px}.is-terminal-routes .is-terminal-line:nth-child(n+3){display:none}
}
@media(prefers-reduced-motion:reduce){
  .is-running *,.is-running *:after{animation:none!important}
  .is-pieces,.is-packet,.is-radar i,.is-radar div,.is-terminal-line em{display:none!important}
  .is-logo-panel{opacity:1!important;clip-path:none!important;transform:none!important}
  .is-tagline span,.is-subtitle,.is-enter,.is-nodes{opacity:1!important;transform:none!important}
  .is-terminal-line>span{width:100%}
  .is-route-glow{stroke-dashoffset:0}
  .is-intro{transition:opacity .15s ease,visibility .15s}
  .is-progress:after{transform:scaleX(1)}
}

/* ======================================================================
   Sign-in pages (login, password reset, 2FA): welcome scene + terminal form
   ====================================================================== */
.is-scene{--is-signal:#8ee86f;position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;color:#fff;font-family:'Avenir Next','Segoe UI',Arial,sans-serif}
.is-scene .is-route{opacity:.42}
.is-scene .is-radar{top:50%}
.is-scene .is-bottom{display:none}
.is-scene .is-nodes{opacity:1;animation:none}
.is-packet-loop{filter:drop-shadow(0 0 8px #8ee86f)}
.is-scene .is-route-glow{animation:is-route 2.8s cubic-bezier(.25,.05,.25,1) .2s forwards}
.is-progress-loop:after{animation:is-progress-loop 3.5s ease-in-out infinite!important;transform:scaleX(.25)}
@keyframes is-progress-loop{0%{transform:translateX(-100%) scaleX(.25)}100%{transform:translateX(400%) scaleX(.25)}}

.fi-simple-layout{background:#061a30!important;position:relative}
.fi-simple-layout:before{content:'';position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse at 50% 42%,#123c66a6,transparent 68%),linear-gradient(120deg,#04142a,#0a2744)}
.fi-simple-main-ctn,.fi-simple-layout .is-footer{position:relative;z-index:2}
.fi-simple-layout .is-footer{color:#7393b3;justify-content:center;gap:1.25rem}
.fi-simple-layout .is-footer a{color:#a8ec8a}

/* The form as a terminal window */
.fi-simple-main{--is-mono:'SFMono-Regular','JetBrains Mono',Consolas,'Liberation Mono',monospace;
  position:relative;background:#04142ae8!important;border:1px solid #3f6a9466!important;border-radius:10px!important;
  box-shadow:0 30px 80px #000a,0 0 0 1px #4fae4a14,0 0 60px #8ee86f12!important;backdrop-filter:blur(6px);
  padding-top:3.4rem!important;overflow:hidden;color:#d3e2f0}
.fi-simple-main:before{content:'intrasolution — secure login';position:absolute;top:0;left:0;right:0;height:2.35rem;display:flex;align-items:center;justify-content:center;
  font:500 .72rem/1 var(--is-mono);letter-spacing:.04em;color:#7393b3;border-bottom:1px solid #3f6a9440;background:#03101fcc}
.fi-simple-main:after{content:'';position:absolute;top:.85rem;left:1rem;width:52px;height:.65rem;
  background:radial-gradient(circle at 5px 50%,#ff6b6b 4.5px,transparent 5px),radial-gradient(circle at 23px 50%,#ffc24b 4.5px,transparent 5px),radial-gradient(circle at 41px 50%,#8ee86f 4.5px,transparent 5px)}
.fi-simple-main .fi-logo-light{display:none!important}
.fi-simple-main .fi-logo-dark{display:block!important}
.fi-simple-header-heading{font-family:var(--is-mono)!important;font-size:1.05rem!important;font-weight:600!important;color:#eef4fa!important;letter-spacing:.02em}
.fi-simple-header-heading:before{content:'> ';color:#8ee86f}
.fi-simple-header-subheading{font-family:var(--is-mono);color:#85a3bf!important}

.is-login-prompt{font:.78rem/1.7 var(--is-mono);color:#b3c9dd;margin:-.25rem 0 .5rem;padding:.6rem .75rem;border:1px dashed #3f6a9455;border-radius:6px;background:#031226}
.is-login-user{color:#8ee86f}.is-login-path{color:#6fb3ff}.is-login-dim{color:#6b88a5}

.fi-simple-main .fi-fo-field-label-content,.fi-simple-main label{font-family:var(--is-mono);color:#9dbcd8!important;font-size:.78rem!important;letter-spacing:.03em}
.fi-simple-main .fi-fo-field-label-content:before{content:'› ';color:#8ee86f}
.fi-simple-main .fi-input-wrp{background:#03101f!important;border-color:#1f4268!important;box-shadow:none!important;border-radius:6px!important}
.fi-simple-main .fi-input-wrp:focus-within{border-color:#8ee86f!important;box-shadow:0 0 0 3px #8ee86f22!important}
.fi-simple-main .fi-input{font-family:var(--is-mono)!important;color:#eef6ff!important;caret-color:#8ee86f;background:transparent!important}
.fi-simple-main .fi-input::placeholder{color:#44668a!important}
.fi-simple-main .fi-input-wrp .fi-icon-btn,.fi-simple-main .fi-input-wrp .fi-input-wrp-actions{color:#7393b3!important;border-color:#1f4268!important}
.fi-simple-main .fi-checkbox-input{background:#03101f!important;border-color:#2f5378!important}
.fi-simple-main .fi-checkbox-input:checked{background-color:#4fae4a!important;border-color:#4fae4a!important}
.fi-simple-main .fi-link{color:#8ee86f!important;font-family:var(--is-mono);font-size:.78rem}
.fi-simple-main .fi-btn{font-family:var(--is-mono)!important;letter-spacing:.08em;text-transform:uppercase;font-size:.8rem!important;
  background:linear-gradient(90deg,#4fae4a,#8ee86f)!important;color:#082a14!important;border-radius:6px!important;box-shadow:0 8px 24px #8ee86f2e!important}
.fi-simple-main .fi-btn:hover{filter:brightness(1.08)}
.fi-simple-main .fi-btn.fi-color-gray,.fi-simple-main .fi-btn.fi-outlined{background:transparent!important;color:#b3c9dd!important;border:1px solid #2f5378!important;box-shadow:none!important}
.fi-simple-main .fi-fo-field-wrp-error-message,.fi-simple-main .fi-fo-field-wrp-hint{font-family:var(--is-mono);font-size:.75rem}
.fi-simple-main,.fi-simple-main p,.fi-simple-main span{--tw-prose-body:#d3e2f0}
.fi-simple-main .fi-sc-text,.fi-simple-main .fi-in-text{color:#b3c9dd}

@media(max-width:760px){
  .is-scene .is-terminal,.is-scene .is-bottom,.is-scene .is-coordinate{display:none}
  .fi-simple-main{margin:0 .75rem}
}
@media(prefers-reduced-motion:reduce){.is-packet-loop{display:none}.is-scene *,.is-scene *:after{animation:none!important}.is-scene .is-terminal-line>span{width:100%}}
/* 2FA code boxes in the terminal form */
.fi-simple-main .fi-one-time-code-input-digit{background:#03101f!important;border:1px solid #1f4268!important;color:#eef6ff!important;font-family:var(--is-mono)!important;caret-color:#8ee86f;box-shadow:none!important}
.fi-simple-main .fi-one-time-code-input-digit:focus{border-color:#8ee86f!important;box-shadow:0 0 0 3px #8ee86f22!important;outline:none}
/* Language switch on the sign-in pages */
.is-lang{position:fixed;top:30px;right:5vw;z-index:10;display:flex;gap:2px;padding:3px;border:1px solid #33557a;border-radius:8px;background:#04142acc;font:600 11px/1 'SFMono-Regular',Consolas,monospace;letter-spacing:.08em}
.is-lang a{color:#97b3cf;text-decoration:none;padding:6px 10px;border-radius:5px}
.is-lang a:hover{color:#fff}
.is-lang a.is-active{background:#4fae4a;color:#082a14}
@media(max-width:760px){.is-lang{top:18px;right:16px}}
