/* Kodgo splash / loading animation — 4.4s loop, no JS required.
   Usage: <div class="ks-splash">…</div> (see SplashScreen.razor).
   Modifiers: .ks-splash--dark  .ks-splash--no-loader  .ks-splash--hide (fade out when app is ready) */
.ks-splash{--ks-bg:#f5ead8;--ks-hex:#201e1d;--ks-g:#f5ead8;--ks-track:#ebdcc2;--ks-accent:#c67139;--ks-sage:#7a8a5e;--ks-dur:4.4s;
  position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(40px,8vh,96px);
  background:var(--ks-bg);transition:opacity .45s cubic-bezier(0.33,1,0.68,1),visibility .45s}
.ks-splash--dark{--ks-bg:#201e1d;--ks-hex:#f5ead8;--ks-g:#201e1d;--ks-track:#3a3633}
.ks-splash--hide{opacity:0;visibility:hidden;pointer-events:none}
.ks-splash *{animation-duration:var(--ks-dur);animation-iteration-count:infinite;animation-fill-mode:both}
.ks-mark{width:clamp(120px,19vw,372px);aspect-ratio:61.6/68.24;animation-name:ks-mark}
.ks-mark svg{width:100%;height:100%;overflow:visible;display:block}
.ks-mark svg *{transform-box:view-box;transform-origin:24.8px 28.1px}
.ks-mark svg g{transform-origin:0 0}
.ks-ping{fill:none;stroke:var(--ks-sage);stroke-width:.8;animation-name:ks-ping}
.ks-hex{fill:var(--ks-hex);animation-name:ks-hex}
.ks-route{fill:none;stroke:var(--ks-hex);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:1 1;animation-name:ks-route}
.ks-gs{fill:none;stroke:var(--ks-g);stroke-width:.5;stroke-linejoin:round;stroke-dasharray:1 1}
.ks-gs:nth-of-type(1){animation-name:ks-g0,ks-gout}.ks-gs:nth-of-type(2){animation-name:ks-g1,ks-gout}.ks-gs:nth-of-type(3){animation-name:ks-g2,ks-gout}
.ks-gf{fill:var(--ks-g);animation-name:ks-gin}
.ks-dot{fill:var(--ks-accent);offset-path:path("M23.11 55.78L1.69 43.41A3.39 3.39 0 0 1 0 40.48V15.75a3.39 3.39 0 0 1 1.69-2.94L23.11.45a3.39 3.39 0 0 1 3.39 0l21.41 12.37a3.39 3.39 0 0 1 1.69 2.94v24.72a3.39 3.39 0 0 1-1.69 2.94L26.5 55.78a3.39 3.39 0 0 1-3.39 0z");offset-rotate:0deg;transform-box:fill-box!important;transform-origin:center!important;animation-name:ks-dot,ks-dotscale}
.ks-loader{width:clamp(160px,16vw,300px);height:14px;border-radius:999px;background:var(--ks-track);overflow:hidden;animation-name:ks-loader}
.ks-loader>span{display:block;height:100%;border-radius:999px;background:var(--ks-accent);transform-origin:left;animation-name:ks-progress}
.ks-splash--no-loader .ks-loader{display:none}
@keyframes ks-mark{0%,31.82%{transform:scale(.9);opacity:1;animation-timing-function:cubic-bezier(0.34,1.56,0.64,1)}44.32%{transform:scale(1)}59.09%{transform:scale(1);animation-timing-function:ease-in-out}64.2%{transform:scale(1.05);animation-timing-function:ease-in-out}69.32%,81.82%{transform:scale(1);opacity:1;animation-timing-function:cubic-bezier(0.33,1,0.68,1)}97.73%,100%{transform:scale(.88);opacity:0}}
@keyframes ks-ping{0%,59.09%{transform:scale(1);opacity:0}59.32%{opacity:.9;animation-timing-function:cubic-bezier(0.33,1,0.68,1)}84.09%,100%{transform:scale(1.45);opacity:0}}
@keyframes ks-hex{0%,31.82%{transform:scale(0);animation-timing-function:cubic-bezier(0.33,1,0.68,1)}42.05%,100%{transform:scale(1)}}
@keyframes ks-route{0%,5.68%{stroke-dashoffset:1;opacity:1;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}32.95%{stroke-dashoffset:0}38.64%{opacity:1}42.05%,100%{stroke-dashoffset:0;opacity:0}}
@keyframes ks-g0{0%,36.36%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}48.86%,100%{stroke-dashoffset:0}}
@keyframes ks-g1{0%,39.55%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}52.05%,100%{stroke-dashoffset:0}}
@keyframes ks-g2{0%,42.73%{stroke-dashoffset:1;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}55.23%,100%{stroke-dashoffset:0}}
@keyframes ks-gout{0%,42.05%{opacity:1;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}59.09%,100%{opacity:0}}
@keyframes ks-gin{0%,42.05%{opacity:0;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}59.09%,100%{opacity:1}}
@keyframes ks-dot{0%,5.68%{offset-distance:0%;animation-timing-function:cubic-bezier(0.65,0,0.35,1)}32.95%,100%{offset-distance:100%}}
@keyframes ks-dotscale{0%{transform:scale(0);animation-timing-function:cubic-bezier(0.34,1.56,0.64,1)}7.95%,31.82%{transform:scale(1);animation-timing-function:cubic-bezier(0.33,1,0.68,1)}38.64%,100%{transform:scale(0)}}
@keyframes ks-loader{0%,6.82%{opacity:0;transform:translateY(12px);animation-timing-function:cubic-bezier(0.33,1,0.68,1)}18.18%,81.82%{opacity:1;transform:none;animation-timing-function:cubic-bezier(0.33,1,0.68,1)}93.18%,100%{opacity:0;transform:none}}
@keyframes ks-progress{0%,9.09%{transform:scaleX(0);animation-timing-function:cubic-bezier(0.65,0,0.35,1)}81.82%,100%{transform:scaleX(1)}}
/* Login-page additions: inline mark, frozen "settled" frame, overlay fade-in */
.ks-splash--inline{position:relative;inset:auto;z-index:auto;display:block;background:transparent;transition:none}
.ks-splash--inline .ks-mark{width:100%}
.ks-splash--still *{animation-delay:-3.6s!important;animation-play-state:paused!important}
.ks-splash--enter{animation:ks-enter .45s cubic-bezier(0.33,1,0.68,1) both}
.ks-splash--contained{position:absolute;z-index:5}
.ks-splash--contained .ks-mark{width:200px}
.ks-splash--kodgo{--ks-bg:#eeefec;--ks-hex:#14181b;--ks-g:#f9f9f7;--ks-track:#e3e5e1;--ks-accent:#e2622a;--ks-sage:#2f6b4f}
@keyframes ks-enter{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.ks-splash *{animation:none!important}.ks-route,.ks-gs,.ks-dot,.ks-ping{display:none}}
