:root{
  --bg:#05070d;
  --text:#f4f5f8;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#05070d}
body{font-family:Inter,system-ui,sans-serif;color:var(--text)}
.scene{
  position:relative;width:100vw;height:100vh;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(circle at 50% 115%, rgba(255,126,52,.10), transparent 22%),
    linear-gradient(180deg, #03050b 0%, #050814 48%, #04060b 100%);
}
.noise,.vignette,.orb,.vertical-glow,.arc,.spine,.horizon,.hero{position:absolute}
.noise{
  inset:0;opacity:.028;pointer-events:none;mix-blend-mode:soft-light;
  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='.72' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}
.vignette{
  inset:-10%;pointer-events:none;
  background:radial-gradient(circle, transparent 46%, rgba(0,0,0,.20) 74%, rgba(0,0,0,.54) 100%);
}
.vertical-glow{width:15vw;height:100vh;top:-5vh;filter:blur(50px);opacity:.24;mix-blend-mode:screen}
.vertical-glow-a{left:17vw;background:linear-gradient(180deg, transparent 0%, rgba(85,97,255,.28) 36%, rgba(78,89,255,.05) 100%)}
.vertical-glow-b{right:20vw;background:linear-gradient(180deg, transparent 0%, rgba(83,193,255,.16) 30%, rgba(83,193,255,.04) 100%)}
.orb{border-radius:50%;filter:blur(34px);mix-blend-mode:screen;animation:drift 20s ease-in-out infinite}
.orb-left{width:30vw;height:30vw;left:-3vw;top:22vh;background:radial-gradient(circle, rgba(97,90,255,.30), rgba(97,90,255,.06) 54%, transparent 72%)}
.orb-center{width:22vw;height:28vw;left:39vw;top:43vh;background:radial-gradient(circle, rgba(151,199,255,.12), rgba(151,199,255,.04) 50%, transparent 76%);animation-duration:24s}
.orb-right{width:34vw;height:34vw;right:-5vw;top:32vh;background:radial-gradient(circle, rgba(255,150,87,.22), rgba(255,150,87,.06) 52%, transparent 74%);animation-duration:22s}
.arc{border-radius:50%;border:1px solid rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.012) inset;opacity:.14}
.arc-a{width:46vw;height:46vw;right:-6vw;bottom:-20vw}
.arc-b{width:70vw;height:70vw;right:-13vw;bottom:-36vw;opacity:.08}
.spine{
  top:0;bottom:0;left:50%;width:1px;opacity:.26;
  background:linear-gradient(180deg, transparent, rgba(255,255,255,.07) 18%, rgba(255,255,255,.07) 82%, transparent);
}
.horizon{
  left:0;right:0;bottom:9.2vh;height:1px;opacity:.40;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.08) 30%, rgba(255,255,255,.08) 70%, transparent 100%);
  box-shadow:0 0 18px rgba(255,142,79,.08);
}
.hero{
  inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:6vh 5vw 9vh;
}
.eyebrow{
  position:relative;font-size:11px;letter-spacing:.34em;color:rgba(255,214,191,.56);
  margin-bottom:28px;text-transform:uppercase;text-align:center;
}
.wordmark{
  position:relative;display:flex;align-items:flex-end;justify-content:center;
  width:min(1160px,80vw);margin:0 auto;
}
.word{
  margin:0;line-height:.86;font-family:Manrope,Inter,sans-serif;text-transform:uppercase;
  font-size:clamp(96px, 15.4vw, 248px);letter-spacing:-.088em;white-space:nowrap;
}
.word-dawn{
  font-weight:300;
  background:linear-gradient(180deg, rgba(245,248,253,.98) 0%, rgba(245,248,253,.98) 42%, rgba(255,233,205,.98) 58%, rgba(255,199,137,.98) 72%, rgba(255,146,88,.96) 86%, rgba(255,92,58,.92) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 8px rgba(255,255,255,.02),0 0 18px rgba(255,160,98,.05),0 0 28px rgba(255,114,72,.03);
}
.word-trek{font-weight:800;margin-left:-.05em;position:relative;display:flex;align-items:flex-end;gap:0}
.word-trek .solid,
.word-trek .outline{display:inline-block}
.word-trek .solid{
  background:linear-gradient(180deg, rgba(255,255,255,.97), rgba(255,255,255,.16));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.word-trek .outline{color:transparent;-webkit-text-stroke:1.35px rgba(255,255,255,.24);margin-left:-.018em;letter-spacing:-.01em}

.icon-stage{
  position:relative;
  margin-top:30px;
  width:min(980px, 84vw);
  height:210px;
  display:block;
  pointer-events:none;
  z-index:34;
}
.app-icon{
  position:absolute;
  left:var(--icon-left);
  top:var(--icon-top);
  width:104px;
  height:104px;
  margin-left:-52px;
  margin-top:-52px;
  border-radius:26px;
  overflow:hidden;
  z-index:12;
}
a.app-icon{
  pointer-events:auto;
  cursor:pointer;
  text-decoration:none;
}
a.app-icon:focus-visible{
  outline:2px solid rgba(255,255,255,.55);
  outline-offset:3px;
}
.app-icon-inner{
  position:absolute;
  inset:8px;
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.012)),
    linear-gradient(135deg, rgba(255,255,255,.025), rgba(120,90,190,.018));
  box-shadow:
    inset 0 0 0 0.35px rgba(255,255,255,.04),
    0 10px 20px rgba(0,0,0,.14),
    0 0 8px rgba(255,255,255,.015);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.icon-stack{background-image:url('assets/stack.webp')}
.icon-ulya{background-image:url('assets/ulya.webp')}
.icon-stack::after,
.icon-ulya::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 24% 20%, rgba(255,255,255,.12), transparent 24%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 34%, rgba(0,0,0,.04));
}
.app-icon-c .app-icon-inner,
.app-icon-d .app-icon-inner{
  background:
    radial-gradient(circle at 32% 30%, rgba(255,255,255,.36), transparent 24%),
    linear-gradient(135deg, rgba(255,208,164,.32), rgba(107,128,255,.16));
}
.icon-float{animation:sideIconFloat var(--float-duration) ease-in-out infinite;animation-delay:var(--float-delay)}
@keyframes sideIconFloat{
  0%{transform:translate3d(var(--tx), var(--ty), 0) rotate(-7deg) scale(1)}
  25%{transform:translate3d(calc(var(--tx) + 2px), calc(var(--ty) - 6px), 0) rotate(5deg) scale(1.08)}
  50%{transform:translate3d(calc(var(--tx) - 2px), calc(var(--ty) + 3px), 0) rotate(-4deg) scale(.97)}
  75%{transform:translate3d(calc(var(--tx) + 2px), calc(var(--ty) - 3px), 0) rotate(6deg) scale(1.05)}
  100%{transform:translate3d(var(--tx), var(--ty), 0) rotate(-7deg) scale(1)}
}
.copyright{
  position:fixed;
  left:50%;
  right:auto;
  bottom:12px;
  transform:translateX(-50%);
  width:100vw;
  max-width:100vw;
  margin:0;
  padding:0 12px;
  text-align:center;
  display:block;
  color:rgba(255,255,255,.90);
  z-index:999;
  font-size:9px;
  letter-spacing:.10em;
  line-height:1.4;
  text-transform:uppercase;
}
.layer{--tx:0px;--ty:0px;transform:translate3d(var(--tx), var(--ty), 0);will-change:transform}
.reveal{opacity:0;animation:fadeUp 1.1s cubic-bezier(.2,.95,.24,1) forwards}
.eyebrow.reveal{animation-delay:.08s}
.word-dawn.reveal{animation-delay:.12s}
.word-trek.reveal{animation-delay:.18s}
.app-icon-ulya.reveal{animation-delay:.24s}
.app-icon-stack.reveal{animation-delay:.28s}
.app-icon-c.reveal{animation-delay:.32s}
.app-icon-d.reveal{animation-delay:.36s}
@keyframes fadeUp{
  0%{opacity:0;transform:translate3d(var(--tx), calc(var(--ty) + 14px), 0) scale(.99);filter:blur(10px)}
  100%{opacity:1;transform:translate3d(var(--tx), var(--ty), 0) scale(1);filter:blur(0)}
}
@keyframes drift{
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-10px) scale(1.02)}
}

@media (max-width: 980px){
  .hero{padding:7vh 5vw 11vh}
  .word{font-size:clamp(84px, 17vw, 176px)}
  .icon-stage{width:min(92vw, 760px);height:190px;margin-top:24px}
}
@media (max-width: 640px){
  .eyebrow{font-size:10px;letter-spacing:.22em;margin-bottom:18px}
  .wordmark{flex-direction:column;align-items:center;width:100%}
  .word{font-size:clamp(70px, 23vw, 128px);line-height:.9}
  .word-trek{margin-left:0;margin-top:-.08em}
  .icon-stage{width:min(94vw, 360px);height:240px;margin-top:18px}
  .app-icon{width:56px;height:56px;margin-left:-28px;margin-top:-28px;border-radius:16px}
  .app-icon-inner{inset:5px;border-radius:11px}
  .app-icon-ulya{left:16% !important;top:74% !important}
  .app-icon-stack{left:39% !important;top:57% !important}
  .app-icon-c{left:67% !important;top:76% !important}
  .app-icon-d{left:84% !important;top:39% !important}
  .copyright{bottom:10px;font-size:9px;letter-spacing:.10em;line-height:1.4}
}


/* ADMIN SELECT / OPTION FIX */
.admin-select{
  background-color: rgba(255,255,255,.06) !important;
  color: #f4f5f8 !important;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.admin-select option{
  background: #0b1220 !important;
  color: #f4f5f8 !important;
}

.admin-select optgroup{
  background: #0b1220 !important;
  color: #f4f5f8 !important;
}

.admin-input,
.admin-textarea,
.admin-select{
  color-scheme: dark;
}