/* ============================================================
   inv 子域名深空科技主题（仅 html.inv-host 生效）
   与 inv.html 首页风格完全统一（模仿 sr-inv.messesum.com）
   ============================================================ */

/* --- 特效元素默认隐藏，inv 域名时显示（加载屏仅首页显示，此处始终隐藏） --- */
#invStarfield,#invBg,#invLoading{display:none}
html.inv-host #invStarfield{display:block}
html.inv-host #invBg{display:block}
#invLoading{display:none!important}

/* --- body 深空背景 + 星云漂移 --- */
html.inv-host body{
  min-height:100vh;
  background:radial-gradient(circle at 50% 12%,rgba(91,193,254,.12) 0%,transparent 28%),
    radial-gradient(circle at 82% 16%,rgba(141,103,255,.12) 0%,transparent 20%),
    linear-gradient(180deg,#060811 0%,#0b0e14 42%,#040608 100%);
  background-color:#0b0e14;
  color:#f0f4f8;
}
html.inv-host body::before,html.inv-host body::after{
  content:"";position:fixed;top:-50%;left:-50%;width:200vw;height:200vh;z-index:1;
  pointer-events:none;opacity:.6;background-repeat:no-repeat;background-blend-mode:screen;
}
html.inv-host body::before{
  background-image:radial-gradient(circle at 30% 70%,rgba(91,193,254,.15) 0%,transparent 40%),
    radial-gradient(circle at 70% 30%,rgba(138,43,226,.1) 0%,transparent 50%);
  animation:invNebula1 40s linear infinite alternate;
}
html.inv-host body::after{
  background-image:radial-gradient(ellipse at 50% 50%,rgba(226,201,138,.08) 0%,transparent 60%),
    radial-gradient(circle at 80% 80%,rgba(91,193,254,.1) 0%,transparent 40%);
  animation:invNebula2 50s linear infinite alternate-reverse;
}
@keyframes invNebula1{0%{transform:translate(0,0) scale(1) rotate(0deg)}100%{transform:translate(-5%,-5%) scale(1.2) rotate(5deg)}}
@keyframes invNebula2{0%{transform:translate(0,0) scale(1.1) rotate(0deg)}100%{transform:translate(5%,5%) scale(1) rotate(-5deg)}}

/* --- 星空 canvas --- */
#invStarfield{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2;pointer-events:none;opacity:.9}

/* --- 背景特效层 --- */
#invBg{position:fixed;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.inv-scene-cover,.inv-scene-aurora,.inv-cloud,.inv-particles,.inv-vignette{position:absolute;inset:0}
.inv-scene-cover{
  inset:-8%;
  background:linear-gradient(180deg,rgba(12,18,30,.12) 0%,rgba(8,12,20,.6) 36%,rgba(5,8,13,.95) 100%),
    radial-gradient(68% 40% at 50% 8%,rgba(91,193,254,.2) 0%,transparent 65%),
    radial-gradient(42% 28% at 14% 28%,rgba(91,193,254,.12) 0%,transparent 70%),
    radial-gradient(38% 24% at 86% 18%,rgba(226,201,138,.08) 0%,transparent 70%);
  transform:scale(1.08);animation:invCoverBreath 12s ease-in-out infinite alternate;
}
.inv-scene-aurora{
  inset:-16%;
  background:radial-gradient(circle at 30% 42%,rgba(91,193,254,.22) 0%,transparent 22%),
    radial-gradient(circle at 68% 18%,rgba(141,103,255,.22) 0%,transparent 20%),
    radial-gradient(circle at 52% 28%,rgba(226,201,138,.16) 0%,transparent 18%);
  filter:blur(72px);mix-blend-mode:screen;opacity:.72;
  animation:invAuroraDrift 14s ease-in-out infinite alternate;
}
.inv-cloud{filter:blur(52px);opacity:.55}
.inv-cloud--far{
  inset:-18%;
  background:radial-gradient(44% 16% at 48% 20%,rgba(91,193,254,.24) 0%,transparent 78%),
    radial-gradient(36% 14% at 55% 26%,rgba(255,255,255,.1) 0%,transparent 74%),
    radial-gradient(30% 12% at 40% 34%,rgba(226,201,138,.12) 0%,transparent 76%);
  animation:invCloudFar 16s ease-in-out infinite alternate;
}
.inv-cloud--near{
  inset:-24%;
  background:radial-gradient(26% 12% at 44% 32%,rgba(91,193,254,.16) 0%,transparent 80%),
    radial-gradient(22% 10% at 58% 30%,rgba(255,255,255,.08) 0%,transparent 78%),
    radial-gradient(18% 10% at 54% 38%,rgba(226,201,138,.1) 0%,transparent 76%);
  animation:invCloudNear 10s ease-in-out infinite alternate;
}
.inv-orbital{position:absolute;top:clamp(40px,6vw,72px);left:50%;width:min(1080px,100vw);height:min(360px,36vw);transform:translateX(-50%);opacity:.7}
.inv-orbital::before{content:"";position:absolute;top:6%;left:50%;transform:translateX(-50%);width:min(420px,56vw);height:1px;background:linear-gradient(90deg,transparent,rgba(91,193,254,.3),transparent);box-shadow:0 0 18px rgba(91,193,254,.2);border-radius:999px}
.inv-orbital::after{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(200px,30vw);height:min(200px,30vw);background:radial-gradient(circle,rgba(91,193,254,.12) 0%,transparent 68%);filter:blur(20px);border-radius:50%}
.inv-ring{position:absolute;left:50%;border-radius:50%;border:1px solid rgba(91,193,254,.12);box-shadow:0 0 20px rgba(91,193,254,.06)}
.inv-ring--outer{top:0;width:min(520px,74vw);height:min(200px,28vw);transform:translateX(-50%);animation:invRingOuter 18s linear infinite}
.inv-ring--inner{top:12%;width:min(320px,48vw);height:min(130px,20vw);border-color:rgba(226,201,138,.14);box-shadow:0 0 16px rgba(226,201,138,.06);transform:translateX(-50%);animation:invRingInner 12s linear infinite reverse}
@keyframes invRingOuter{from{transform:translateX(-50%) rotate(0deg)}to{transform:translateX(-50%) rotate(360deg)}}
@keyframes invRingInner{from{transform:translateX(-50%) rotate(0deg)}to{transform:translateX(-50%) rotate(360deg)}}
.inv-scene-star,.inv-scene-particle{position:absolute;border-radius:50%;pointer-events:none}
.inv-scene-star{width:var(--star-size,4px);height:var(--star-size,4px);background:radial-gradient(circle,rgba(255,255,255,.98) 0%,rgba(91,193,254,.72) 46%,transparent 74%);box-shadow:0 0 16px rgba(91,193,254,.4);animation:invStarBlink var(--star-duration,4.8s) ease-in-out infinite;animation-delay:var(--star-delay,0s)}
.inv-scene-particle{width:var(--particle-size,2px);height:var(--particle-size,2px);background:radial-gradient(circle,rgba(255,255,255,.85) 0%,rgba(91,193,254,.4) 58%,transparent 78%);box-shadow:0 0 10px rgba(91,193,254,.22);animation:invParticleFloat var(--particle-duration,11s) ease-in-out infinite;animation-delay:var(--particle-delay,0s)}
.inv-vignette{background:radial-gradient(circle at 50% 36%,transparent 10%,rgba(4,6,10,.14) 52%,rgba(2,3,5,.86) 100%),linear-gradient(180deg,transparent 0%,rgba(4,6,10,.1) 42%,rgba(2,3,5,.48) 100%)}
@keyframes invCoverBreath{0%{transform:scale(1.04)}100%{transform:scale(1.12)}}
@keyframes invAuroraDrift{0%{transform:translate3d(-3%,-2%,0) rotate(-4deg)}100%{transform:translate3d(4%,3%,0) rotate(4deg)}}
@keyframes invCloudFar{0%{transform:translate3d(-3%,-1%,0) scale(1)}100%{transform:translate3d(3%,2%,0) scale(1.06)}}
@keyframes invCloudNear{0%{transform:translate3d(2%,0,0) scale(1)}100%{transform:translate3d(-2%,2%,0) scale(1.08)}}
@keyframes invStarBlink{0%,100%{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1.4)}}
@keyframes invParticleFloat{0%{opacity:0;transform:translate3d(0,20px,0) scale(.8)}20%,80%{opacity:.9}100%{opacity:0;transform:translate3d(0,-30px,0) scale(1.2)}}

/* --- 加载屏 --- */
#invLoading{
  position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;
  background:radial-gradient(circle at 50% 40%,rgba(18,30,48,.18) 0%,rgba(6,10,18,.8) 56%,rgba(4,6,10,.96) 100%);
  background-color:#0b0e14;
  flex-direction:column;justify-content:center;align-items:center;
  transition:opacity .8s ease-out,visibility .8s;
}
#invLoading::before,#invLoading::after{content:"";position:absolute;inset:-12%;pointer-events:none}
#invLoading::before{
  background:radial-gradient(40% 20% at 50% 34%,rgba(91,193,254,.22) 0%,transparent 78%),
    radial-gradient(28% 14% at 52% 38%,rgba(226,201,138,.14) 0%,transparent 76%),
    radial-gradient(22% 12% at 44% 28%,rgba(141,103,255,.12) 0%,transparent 82%);
  filter:blur(40px);opacity:.92;animation:invLoadCloud 10s ease-in-out infinite alternate;
}
#invLoading::after{
  background:radial-gradient(circle at 50% 50%,rgba(91,193,254,.08) 0%,transparent 18%),
    conic-gradient(from 0deg at 50% 50%,transparent 0deg,rgba(91,193,254,.16) 40deg,transparent 80deg,rgba(226,201,138,.14) 180deg,transparent 240deg,rgba(91,193,254,.16) 320deg,transparent 360deg);
  opacity:.4;animation:invWarp 9s linear infinite;
}
.inv-warp{position:absolute;inset:0;overflow:hidden;perspective:1000px;opacity:.8;mix-blend-mode:screen}
.inv-warp-lines{position:absolute;top:50%;left:50%;width:200vw;height:200vh;transform:translate(-50%,-50%);background:radial-gradient(circle,transparent 20%,#0b0e14 70%),conic-gradient(from 0deg at 50% 50%,transparent 10%,rgba(91,193,254,.1) 20%,transparent 30%,rgba(226,201,138,.1) 40%,transparent 50%,rgba(91,193,254,.2) 60%,transparent 70%,rgba(226,201,138,.2) 80%,transparent 90%);animation:invWarp 3s linear infinite}
.inv-warp-light{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:15vw;height:15vw;border-radius:50%;background:radial-gradient(circle,#5bc1fe 0%,transparent 70%);filter:blur(30px);animation:invPulseLight 2s ease-in-out infinite alternate}
@keyframes invWarp{from{transform:translate(-50%,-50%) rotate(0deg) scale(1)}to{transform:translate(-50%,-50%) rotate(360deg) scale(2)}}
@keyframes invPulseLight{0%{transform:translate(-50%,-50%) scale(.8);opacity:.5}100%{transform:translate(-50%,-50%) scale(1.2);opacity:1}}
@keyframes invLoadCloud{0%{transform:translate3d(-2%,-1%,0) scale(.98)}100%{transform:translate3d(2%,2%,0) scale(1.04)}}
.inv-loading-content{position:relative;z-index:2;text-align:center;min-width:min(360px,calc(100vw - 40px));padding:28px 34px;border:1px solid rgba(91,193,254,.14);border-radius:24px;background:linear-gradient(180deg,rgba(10,18,30,.4) 0%,rgba(7,11,18,.7) 100%);box-shadow:0 20px 80px rgba(0,0,0,.38),inset 0 0 32px rgba(91,193,254,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:invLoadHover 3.2s ease-in-out infinite}
@keyframes invLoadHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.inv-loading-icon{position:relative;width:74px;height:74px;margin:0 auto 20px}
.inv-loading-icon::after{content:"";position:absolute;inset:8px;border-radius:50%;border:1px solid rgba(226,201,138,.22);box-shadow:0 0 18px rgba(226,201,138,.14)}
.inv-icon-ring{position:absolute;inset:0;border:2px solid rgba(91,193,254,.2);border-top-color:#5bc1fe;border-radius:50%;animation:invSpin 1s linear infinite;box-shadow:0 0 24px rgba(91,193,254,.12)}
.inv-icon-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#e2c98a;font-size:24px;animation:invCorePulse 1.5s ease-in-out infinite}
@keyframes invSpin{100%{transform:rotate(360deg)}}
@keyframes invCorePulse{0%,100%{opacity:.5;transform:translate(-50%,-50%) scale(.8)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}
.inv-loading-text{font-family:"Orbitron",sans-serif;letter-spacing:2px;color:#5bc1fe;text-transform:uppercase;font-size:13px;margin-bottom:15px;text-shadow:0 0 10px rgba(91,193,254,.5)}
.inv-dots{animation:invBlink 1.5s infinite steps(4,end)}
@keyframes invBlink{0%,100%{opacity:0}50%{opacity:1}}
.inv-progress-track{width:min(260px,62vw);height:3px;background:rgba(255,255,255,.08);margin:0 auto;overflow:hidden;position:relative;border-radius:999px}
.inv-progress-bar{width:0%;height:100%;background:linear-gradient(90deg,rgba(91,193,254,.8),#e2c98a,rgba(255,255,255,.95));box-shadow:0 0 14px rgba(91,193,254,.35);animation:invProgress 2.5s cubic-bezier(.4,0,.2,1) forwards}
@keyframes invProgress{0%{width:0%}40%{width:40%}70%{width:60%}100%{width:100%}}

/* --- 导航 --- */
html.inv-host .navbar{background:rgba(6,10,18,.5)!important;border-bottom-color:rgba(91,193,254,.08)!important;backdrop-filter:blur(14px)!important;-webkit-backdrop-filter:blur(14px)!important}
html.inv-host .nav-logo,html.inv-host .nav-logo-text{color:#8b9bb4!important}
html.inv-host .nav-logo:hover,html.inv-host .nav-logo-text:hover{color:#5bc1fe!important}
html.inv-host .nav-link{color:#8b9bb4!important}
html.inv-host .nav-link:hover{color:#5bc1fe!important}
html.inv-host .nav-btn-ghost{background:rgba(255,255,255,.05)!important;border-color:rgba(91,193,254,.25)!important;color:#cbd5e1!important}
html.inv-host .nav-btn-ghost:hover{border-color:#5bc1fe!important;color:#fff!important}
html.inv-host .nav-btn-primary{background:linear-gradient(135deg,rgba(91,193,254,.35),rgba(91,193,254,.15))!important;border:1px solid rgba(91,193,254,.5)!important;color:#fff!important}

/* --- 标题 --- */
html.inv-host .activate-header h1,html.inv-host .query-header h1{
  color:#e2c98a!important;font-size:clamp(30px,6vw,42px)!important;font-weight:600!important;
  text-shadow:0 0 16px rgba(226,201,138,.24),0 0 30px rgba(91,193,254,.1);
}
html.inv-host .activate-header p,html.inv-host .query-header p{color:#8b9bb4!important;font-size:14px!important}

/* --- 步骤指示器 --- */
html.inv-host .step{background:rgba(255,255,255,.06)!important;border-color:rgba(91,193,254,.22)!important;color:#8b9bb4!important}
html.inv-host .step-wrap.active .step{background:linear-gradient(135deg,#5bc1fe,#7c6cff)!important;border-color:transparent!important;color:#fff!important;box-shadow:0 0 20px rgba(91,193,254,.5)!important}
html.inv-host .step-wrap.done .step{background:rgba(91,193,254,.15)!important;border-color:rgba(91,193,254,.4)!important;color:#5bc1fe!important}
html.inv-host .step-label{color:#8b9bb4!important}
html.inv-host .step-wrap.active .step-label{color:#5bc1fe!important;font-weight:600}
html.inv-host .step-wrap.done .step-label{color:#e2c98a!important}
html.inv-host .step-line{background:rgba(255,255,255,.1)!important}
html.inv-host .step-line.done{background:linear-gradient(90deg,#5bc1fe,#e2c98a)!important}

/* --- 卡片 --- */
html.inv-host .activate-card,html.inv-host .security-card{
  background:linear-gradient(180deg,rgba(20,27,42,.52) 0%,rgba(10,14,24,.82) 100%),
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.06) 0%,transparent 58%)!important;
  backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;
  border:1px solid rgba(91,193,254,.3)!important;border-radius:16px!important;
  box-shadow:0 30px 90px rgba(0,0,0,.56),0 0 0 1px rgba(255,255,255,.03),inset 0 0 28px rgba(91,193,254,.08)!important;
}
html.inv-host .step-content h3,html.inv-host .ticket-select-header h3{color:#f0f4f8!important}
html.inv-host .step-content p,html.inv-host .ticket-select-header p{color:#8b9bb4!important}

/* --- 表单 --- */
html.inv-host .form-input,html.inv-host .form-select,html.inv-host textarea{
  background:rgba(255,255,255,.05)!important;border:1.5px solid rgba(91,193,254,.18)!important;
  color:#f0f4f8!important;border-radius:10px!important;
  transition:all .25s ease-out!important;
}
html.inv-host .form-input::placeholder,html.inv-host textarea::placeholder{color:#475569!important}
html.inv-host .form-input:focus,html.inv-host textarea:focus{
  border-color:#5bc1fe!important;background:rgba(91,193,254,.08)!important;
  box-shadow:0 0 0 3px rgba(91,193,254,.15)!important;outline:none!important;
}
html.inv-host .form-label{color:#8b9bb4!important;font-weight:500!important}

/* --- 按钮 --- */
html.inv-host .btn-primary,html.inv-host .form-btn{
  background:linear-gradient(135deg,rgba(91,193,254,.28),rgba(91,193,254,.1))!important;
  border:1px solid rgba(91,193,254,.5)!important;color:#dff2ff!important;border-radius:26px!important;
  font-weight:600!important;letter-spacing:.5px!important;
  box-shadow:0 8px 28px rgba(91,193,254,.18),inset 0 0 18px rgba(91,193,254,.08)!important;
  transition:all .3s ease-out!important;padding:14px 32px!important;font-size:15px!important;
}
html.inv-host .btn-primary:hover,html.inv-host .form-btn:hover{
  transform:translateY(-2px)!important;box-shadow:0 14px 40px rgba(91,193,254,.32)!important;color:#fff!important;
}
html.inv-host .btn-secondary,html.inv-host .btn-outline-primary{
  background:rgba(255,255,255,.04)!important;color:rgba(240,244,248,.85)!important;
  border:1px solid rgba(255,255,255,.12)!important;border-radius:26px!important;
  transition:all .3s ease-out!important;
}
html.inv-host .btn-secondary:hover{border-color:rgba(91,193,254,.4)!important;transform:translateY(-2px)}

/* --- 查询 Tab --- */
html.inv-host .query-tabs{background:rgba(255,255,255,.05)!important;border:1px solid rgba(91,193,254,.15)!important;border-radius:12px!important;padding:4px!important}
html.inv-host .query-tab{color:#8b9bb4!important;transition:all .3s ease-out!important}
html.inv-host .query-tab.active{background:linear-gradient(135deg,rgba(91,193,254,.3),rgba(91,193,254,.12))!important;color:#dff2ff!important;box-shadow:0 4px 16px rgba(91,193,254,.25)!important}

/* --- 激活信息 / 通知 --- */
html.inv-host #actInfo{background:rgba(91,193,254,.08)!important;border:1px solid rgba(91,193,254,.25)!important;color:#c7d2fe!important}
html.inv-host #actInfo div:first-child{color:#f0f4f8!important}
html.inv-host .notice-box{background:rgba(255,255,255,.03)!important;border:1px solid rgba(255,255,255,.08)!important;color:#8b9bb4!important;border-radius:10px!important}
html.inv-host .step-content .success-icon{background:rgba(108,224,184,.15)!important;color:#6ce0b8!important}

/* --- 链接 --- */
html.inv-host a{color:#5bc1fe!important}
html.inv-host a:hover{color:#fff!important}

/* --- Toast --- */
html.inv-host .toast{background:rgba(10,14,24,.95)!important;color:#f0f4f8!important;border:1px solid rgba(91,193,254,.2)!important;backdrop-filter:blur(12px)!important;box-shadow:0 12px 40px rgba(0,0,0,.4)!important}

/* --- 滑动验证弹窗 --- */
html.inv-host .modal-overlay{background:rgba(0,0,0,.75)!important;backdrop-filter:blur(4px)!important}
html.inv-host .modal-overlay .modal-box,html.inv-host .modal{
  background:linear-gradient(180deg,rgba(20,27,42,.92) 0%,rgba(10,14,24,.96) 100%)!important;
  border:1px solid rgba(91,193,254,.25)!important;color:#f0f4f8!important;
  backdrop-filter:blur(20px)!important;box-shadow:0 24px 64px rgba(0,0,0,.5)!important;
}
html.inv-host .modal-overlay .modal-box h3,html.inv-host .modal h3{color:#f0f4f8!important}
html.inv-host .modal-overlay .modal-body,html.inv-host .modal-overlay .modal-box{color:#8b9bb4!important}

/* --- 票证结果卡片 --- */
html.inv-host .ticket-card{background:rgba(255,255,255,.05)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:12px!important}
html.inv-host .ticket-card:hover{border-color:rgba(91,193,254,.35)!important;box-shadow:0 12px 32px rgba(0,0,0,.35)!important}
html.inv-host .ticket-card-event{color:#f0f4f8!important}
html.inv-host .ticket-card-date{color:#8b9bb4!important}
html.inv-host .ticket-card-status.st-normal{background:rgba(16,185,129,.15)!important;color:#34d399!important}
html.inv-host .ticket-card-status.st-used,html.inv-host .ticket-card-status.st-disabled{background:rgba(100,116,139,.2)!important;color:#94a3b8!important}
html.inv-host .ticket-card-status.st-blacklist{background:rgba(124,58,237,.2)!important;color:#a78bfa!important}
html.inv-host .ticket-card-status.st-expired{background:rgba(217,119,6,.2)!important;color:#fbbf24!important}
html.inv-host .ticket-card-arrow{color:#475569!important}
html.inv-host .ticket-card:hover .ticket-card-arrow{color:#5bc1fe!important}
html.inv-host .ticket-back-btn{background:rgba(255,255,255,.06)!important;color:#cbd5e1!important;border:1px solid rgba(255,255,255,.15)!important;border-radius:20px!important}
html.inv-host .ticket-back-btn:hover{border-color:rgba(91,193,254,.4)!important;color:#fff!important}
html.inv-host .sc-name{color:#f0f4f8!important}
html.inv-host .sc-phone{color:#8b9bb4!important}
html.inv-host .sc-code{color:#64748b!important}
html.inv-host .security-footer{color:#64748b!important;border-top:1px solid rgba(255,255,255,.08)!important}

@media(max-width:640px){
  html.inv-host .btn-primary,html.inv-host .form-btn{padding:12px 26px!important;font-size:14px!important}
}
@media(prefers-reduced-motion:reduce){
  .inv-warp-lines,.inv-ring,.inv-scene-aurora,.inv-cloud,.inv-scene-cover{animation:none!important}
}