:root{color-scheme:dark;--bg: #050714;--text: #f3f6ff;--muted: rgba(227, 233, 255, .68);--line: rgba(151, 168, 255, .16);--shadow: 0 32px 80px rgba(0, 0, 0, .45);--accent: #6ef0ff;--accent-soft: rgba(110, 240, 255, .1);--accent-glow: rgba(110, 240, 255, .2);--surface-tint: rgba(110, 240, 255, .08);--orb-one-x: 18%;--orb-one-y: 18%;--orb-two-x: 78%;--orb-two-y: 72%;--scene-tilt: 1deg;--scene-scale: 1;--scene-speed: .9s;font-family:Manrope,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,var(--accent-soft),transparent 34%),radial-gradient(circle at top right,var(--accent-glow),transparent 30%),linear-gradient(180deg,#04050c,#070b16 54%,#03040a);color:var(--text);transition:background .48s ease,color .48s ease}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 95%);mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 95%);opacity:.35}h1,h2,h3,h4,p{margin:0}button,input,textarea,select{font:inherit}.app-shell{position:relative;min-height:100vh;display:grid;place-items:center;padding:32px;background:radial-gradient(circle at var(--orb-one-x) var(--orb-one-y),color-mix(in srgb,var(--accent) 20%,transparent),transparent 34%),radial-gradient(circle at var(--orb-two-x) var(--orb-two-y),var(--surface-tint),transparent 38%),linear-gradient(180deg,#03040a8c,#03040ab3);transition:background .52s ease,filter .52s ease,transform .52s ease}.app-shell--offline{background:radial-gradient(circle at 50% 42%,var(--accent-soft),transparent 42%),#000}.app-shell--loading{background:radial-gradient(circle at 50% 42%,var(--accent-soft),transparent 42%),linear-gradient(180deg,#050714,#02030a)}.app-shell--panel{background:radial-gradient(circle at top,var(--accent-soft),transparent 36%),linear-gradient(180deg,#04050c,#070b16 54%,#03040a)}.app-shell[data-scene=echo]{filter:saturate(1.15)}.app-shell[data-scene=orbit]{filter:saturate(1.3) contrast(1.05)}.app-shell[data-scene=blade]{filter:saturate(.95) contrast(1.12)}.app-shell[data-scene=void]{filter:saturate(1.2) brightness(1.02)}.app-shell[data-scene=halo]{filter:saturate(1.35) brightness(1.04)}.app-shell[data-scene=ice]{filter:saturate(1.05) contrast(1.08) brightness(1.02)}.app-shell[data-scene=signal]{filter:saturate(1.22) contrast(1.08)}.ambient{position:fixed;inset:auto;width:520px;height:520px;filter:blur(24px);opacity:.34;pointer-events:none;z-index:0;animation:drift 16s ease-in-out infinite alternate}.ambient-one{top:-120px;left:-120px;background:radial-gradient(circle,var(--accent-glow),transparent 66%)}.ambient-two{right:-180px;bottom:-200px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 58%,white),transparent 66%);animation-delay:-8s}.scene-ribbon{position:fixed;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 0 44%,color-mix(in srgb,var(--accent) 12%,transparent) 49%,transparent 54%),linear-gradient(180deg,transparent 0 48%,rgba(255,255,255,.04) 50%,transparent 52%);mix-blend-mode:screen;opacity:.3;animation:ribbonSweep 12s linear infinite}.scene-artifact{position:fixed;inset:auto;pointer-events:none;z-index:0;opacity:.55}.scene-artifact--orbit{top:12%;right:9%;width:180px;height:180px}.scene-artifact--orbit span{position:absolute;inset:0;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 70%,white);animation:orbitSpin 18s linear infinite}.scene-artifact--orbit span:nth-child(2){inset:18px;animation-direction:reverse}.scene-artifact--orbit span:nth-child(3){inset:42px;border-style:dashed;opacity:.6}.scene-artifact--blade{top:13%;left:7%;width:250px;height:116px;border-radius:999px 28px/72px 28px;background:radial-gradient(circle at 24% 50%,color-mix(in srgb,var(--accent) 76%,white),transparent 56%),linear-gradient(145deg,color-mix(in srgb,var(--accent) 58%,white),color-mix(in srgb,var(--accent) 22%,transparent));transform:rotate(-24deg) skew(-10deg);box-shadow:0 0 34px color-mix(in srgb,var(--accent) 28%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--accent) 68%,white);overflow:hidden}.scene-artifact--blade:before{content:"";position:absolute;inset:18px 64px 18px 18px;border-radius:inherit;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.28) 46%,transparent 52%),linear-gradient(180deg,transparent 0%,rgba(0,0,0,.12) 100%);opacity:.7}.scene-artifact--blade:after{content:"";position:absolute;inset:10px;border-radius:inherit;border:1px solid color-mix(in srgb,var(--accent) 42%,transparent);opacity:.75}.scene-artifact--void{bottom:12%;left:8%;width:170px;height:170px}.scene-artifact--void span{position:absolute;inset:0;border-radius:18px;background:radial-gradient(circle,rgba(0,0,0,.8),transparent 65%);box-shadow:inset 0 0 0 1px #ffffff14;transform:rotate(45deg)}.scene-artifact--void span:nth-child(2){inset:34px;opacity:.65}.scene-artifact--halo{top:10%;right:8%;width:200px;height:200px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 62%,white);box-shadow:0 0 60px color-mix(in srgb,var(--accent) 22%,transparent)}.scene-artifact--halo:before,.scene-artifact--halo:after{content:"";position:absolute;inset:28px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 40%,white);animation:orbitSpin 24s linear infinite reverse}.scene-artifact--halo:after{inset:58px;opacity:.7}.scene-artifact--ice{top:14%;left:10%;width:210px;height:210px}.scene-artifact--ice span{position:absolute;inset:0;clip-path:polygon(50% 0%,64% 26%,100% 38%,70% 58%,78% 100%,50% 76%,22% 100%,30% 58%,0% 38%,36% 26%);background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 80%,white),transparent);filter:drop-shadow(0 0 18px color-mix(in srgb,var(--accent) 35%,transparent));animation:shardDrift 10s ease-in-out infinite alternate}.scene-artifact--ice span:nth-child(2){inset:36px;opacity:.8;animation-delay:-2s}.scene-artifact--ice span:nth-child(3){inset:72px;opacity:.7;animation-delay:-4s}.scene-artifact--ice span:nth-child(4){inset:108px;opacity:.55;animation-delay:-6s}.scene-artifact--signal{top:16%;right:8%;width:180px;height:120px;display:grid;gap:10px;align-content:center}.scene-artifact--signal span{display:block;height:4px;border-radius:999px;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 90%,white),transparent);animation:signalPulse 2.8s ease-in-out infinite}.scene-artifact--signal span:nth-child(2){width:78%;animation-delay:-.8s}.scene-artifact--signal span:nth-child(3){width:56%;animation-delay:-1.6s}.scene-artifact--echo{bottom:14%;right:10%;width:160px;height:160px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 58%,white);opacity:.45;animation:orbitSpin 20s linear infinite}.scene-artifact--echo span{position:absolute;inset:22px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 42%,white)}.eyebrow,.section-label{font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.24em;font-size:.72rem;color:var(--muted)}.eyebrow{margin-bottom:14px}.spotlight-card{position:relative;border-radius:18px;background:linear-gradient(180deg,#090c1ceb,#060812e0),radial-gradient(circle at top right,var(--accent-soft),transparent 38%);border:1px solid color-mix(in srgb,var(--accent) 56%,rgba(255,255,255,.08));box-shadow:var(--shadow);overflow:hidden;animation:cardFloat 8s ease-in-out infinite;transition:border-color .42s ease,box-shadow .42s ease,background .42s ease,border-radius .42s ease}.app-shell[data-scene=orbit] .spotlight-card,.app-shell[data-scene=blade] .spotlight-card,.app-shell[data-scene=void] .spotlight-card,.app-shell[data-scene=halo] .spotlight-card,.app-shell[data-scene=ice] .spotlight-card,.app-shell[data-scene=signal] .spotlight-card{border-radius:18px}.spotlight-card__frame{position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff0a,inset 0 0 24px color-mix(in srgb,var(--accent) 22%,transparent);pointer-events:none;animation:frameGlow 7s ease-in-out infinite alternate}.loading-card{position:relative;z-index:1;width:min(520px,100%);padding:42px 30px 34px;border-radius:30px;background:linear-gradient(180deg,#090c1cf0,#060812eb),radial-gradient(circle at top,var(--accent-soft),transparent 44%);border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);text-align:center;animation:shellRise var(--scene-speed) cubic-bezier(.2,.8,.2,1) both}.loading-card h1{margin-top:14px;font-size:clamp(2rem,6vw,4rem);letter-spacing:-.08em;font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif}.loading-card p:last-child{margin-top:10px;color:var(--muted)}.loading-spinner{width:54px;height:54px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:var(--accent);border-right-color:color-mix(in srgb,var(--accent) 60%,white);margin:0 auto 8px;animation:spin .9s linear infinite;box-shadow:0 0 24px color-mix(in srgb,var(--accent) 22%,transparent)}.offline-card{position:relative;z-index:1;width:min(580px,100%);padding:42px 30px;border-radius:30px;background:linear-gradient(180deg,#000000eb,#050812eb),radial-gradient(circle at top,var(--accent-soft),transparent 44%);border:1px solid rgba(255,255,255,.14);box-shadow:var(--shadow);text-align:center;animation:cardFloat 8s ease-in-out infinite;transition:border-color .42s ease,box-shadow .42s ease,background .42s ease,border-radius .42s ease}.app-shell[data-scene=orbit] .offline-card,.app-shell[data-scene=void] .offline-card{border-radius:42px 18px}.app-shell[data-scene=halo] .offline-card,.app-shell[data-scene=ice] .offline-card,.app-shell[data-scene=signal] .offline-card{border-radius:28px 28px 18px 18px}.offline-card h1{margin-top:16px;font-size:clamp(2rem,6vw,4rem);letter-spacing:-.08em;font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif}.offline-card p:last-child{margin-top:12px;color:var(--muted)}.panel-card{position:relative;z-index:1;width:min(980px,100%);padding:28px;border-radius:30px;background:linear-gradient(180deg,#080a16eb,#04060eeb),radial-gradient(circle at top right,var(--surface-tint),transparent 44%);border:1px solid color-mix(in srgb,var(--accent) 24%,rgba(255,255,255,.1));box-shadow:var(--shadow);animation:shellRise .7s cubic-bezier(.2,.8,.2,1) both;transition:border-color .42s ease,box-shadow .42s ease,background .42s ease,border-radius .42s ease}.app-shell[data-scene=orbit] .panel-card{border-radius:42px 18px}.app-shell[data-scene=blade] .panel-card{border-radius:18px}.app-shell[data-scene=void] .panel-card{border-radius:28px 48px}.app-shell[data-scene=halo] .panel-card{border-radius:999px 24px}.app-shell[data-scene=ice] .panel-card{border-radius:24px 42px}.app-shell[data-scene=signal] .panel-card{border-radius:14px}.panel-card--login{width:min(560px,100%);text-align:center}.panel-card__header{display:flex;justify-content:space-between;gap:18px;align-items:start}.panel-card h1{margin-top:10px;font-size:clamp(2rem,6vw,4rem);letter-spacing:-.08em;font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif}.panel-login{margin-top:24px;display:grid;gap:16px}.panel-login label{display:grid;gap:10px;text-align:left}.panel-login span,.panel-current span,.front-chip__pronouns,.panel-status{color:var(--muted)}.panel-login input{width:100%;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:var(--text)}.panel-login button,.panel-link{border:0;border-radius:999px;padding:12px 16px;background:color-mix(in srgb,var(--accent) 14%,rgba(255,255,255,.08));color:var(--text);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.panel-login button:hover,.panel-link:hover,.front-chip:hover,.front-chip:focus-visible{transform:translateY(-1px);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 36%,white),0 10px 30px color-mix(in srgb,var(--accent) 18%,transparent)}.panel-current{margin-top:18px;display:grid;gap:6px}.panel-current strong{font-size:1.2rem}.panel-status{margin-top:16px}.panel-grid{margin-top:20px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.panel-current--offline{margin-top:18px;padding:16px;border-radius:18px;background:#ffffff08;border:1px solid rgba(255,255,255,.06)}.app-shell[data-scene=orbit] .panel-current--offline,.app-shell[data-scene=void] .panel-current--offline{border-radius:22px 10px}.app-shell[data-scene=halo] .panel-current--offline,.app-shell[data-scene=ice] .panel-current--offline,.app-shell[data-scene=signal] .panel-current--offline{border-radius:18px}.front-chip{display:grid;gap:6px;text-align:left;padding:14px 16px;border-radius:18px;border:1px solid color-mix(in srgb,var(--accent) 45%,rgba(255,255,255,.12));background:color-mix(in srgb,var(--accent) 12%,rgba(255,255,255,.03));color:var(--text);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}.app-shell[data-scene=orbit] .front-chip{border-radius:10px 22px}.app-shell[data-scene=blade] .front-chip{border-radius:28px}.app-shell[data-scene=void] .front-chip{border-radius:22px 10px}.app-shell[data-scene=halo] .front-chip{border-radius:999px}.app-shell[data-scene=ice] .front-chip{border-radius:16px 28px}.app-shell[data-scene=signal] .front-chip{border-radius:10px}.front-chip--active{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 60%,white),0 0 30px color-mix(in srgb,var(--accent) 26%,transparent);transform:translateY(-1px)}.front-chip__name{font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif;font-size:1rem}.front-chip__pronouns{font-style:italic;font-size:.9rem}.spotlight-shell{position:relative;z-index:1;width:min(920px,100%);transform:perspective(1400px) rotateX(var(--scene-tilt)) scale(var(--scene-scale));animation:shellRise var(--scene-speed) cubic-bezier(.2,.8,.2,1) both}.spotlight-card__inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:stretch;padding:34px}.spotlight-card__copy h1{margin-top:10px;font-family:Space Grotesk,Manrope,ui-sans-serif,system-ui,sans-serif;font-size:clamp(2.1rem,5.6vw,4.5rem);line-height:.9;letter-spacing:-.06em;text-shadow:0 0 28px color-mix(in srgb,var(--accent) 28%,transparent);text-wrap:balance}.app-shell[data-scene=orbit] .spotlight-card__copy h1{text-transform:uppercase;letter-spacing:.08em}.app-shell[data-scene=blade] .spotlight-card__copy h1{font-variation-settings:"wght" 760}.app-shell[data-scene=void] .spotlight-card__copy h1{font-style:italic}.app-shell[data-scene=halo] .spotlight-card__copy h1{text-shadow:0 0 34px color-mix(in srgb,var(--accent) 34%,transparent)}.app-shell[data-scene=ice] .spotlight-card__copy h1{letter-spacing:-.02em}.app-shell[data-scene=signal] .spotlight-card__copy h1{text-transform:uppercase;letter-spacing:.2em}.spotlight-note{margin-top:16px;max-width:34ch;color:var(--muted);font-size:.98rem;line-height:1.45}.app-shell[data-scene=orbit] .spotlight-note{max-width:28ch}.app-shell[data-scene=blade] .spotlight-note{max-width:40ch}.app-shell[data-scene=void] .spotlight-note{letter-spacing:.03em}.app-shell[data-scene=halo] .spotlight-note,.app-shell[data-scene=ice] .spotlight-note,.app-shell[data-scene=signal] .spotlight-note{max-width:32ch}.status-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid color-mix(in srgb,var(--accent) 54%,rgba(255,255,255,.1));background:color-mix(in srgb,var(--accent) 12%,rgba(255,255,255,.03));color:#f5fbff;padding:10px 14px;font-size:.84rem;white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease}.spotlight-card__meta{display:flex;flex-direction:column;justify-content:space-between;align-items:end;min-width:170px;gap:16px;padding-left:22px;border-left:1px solid color-mix(in srgb,var(--accent) 20%,rgba(255,255,255,.08))}.app-shell[data-scene=orbit] .spotlight-card__meta,.app-shell[data-scene=void] .spotlight-card__meta{text-align:right}.app-shell[data-scene=blade] .spotlight-card__meta{border-left-style:dashed}.app-shell[data-scene=void] .spotlight-card__meta{border-left-width:2px}.app-shell[data-scene=halo] .spotlight-card__meta,.app-shell[data-scene=ice] .spotlight-card__meta,.app-shell[data-scene=signal] .spotlight-card__meta{min-width:0}.spotlight-pronouns{color:var(--muted);font-style:italic;font-size:1rem;letter-spacing:.04em;line-height:1.1}.app-shell[data-scene=blade] .spotlight-pronouns{text-transform:uppercase;letter-spacing:.12em}.app-shell[data-scene=void] .spotlight-pronouns{text-decoration:overline}@keyframes shellRise{0%{opacity:0;transform:perspective(1400px) rotateX(calc(var(--scene-tilt) * .8)) scale(calc(var(--scene-scale) * .98)) translateY(18px);filter:blur(8px)}to{opacity:1;transform:perspective(1400px) rotateX(var(--scene-tilt)) scale(var(--scene-scale)) translateY(0);filter:blur(0)}}@keyframes cardFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes drift{0%{transform:translate3d(-8px,-6px,0) scale(1)}to{transform:translate3d(12px,10px,0) scale(1.08)}}@keyframes ribbonSweep{0%{transform:translate(-4%)}to{transform:translate(4%)}}@keyframes frameGlow{0%{box-shadow:inset 0 0 0 1px #ffffff0a,inset 0 0 18px color-mix(in srgb,var(--accent) 18%,transparent)}to{box-shadow:inset 0 0 0 1px #ffffff14,inset 0 0 30px color-mix(in srgb,var(--accent) 30%,transparent)}}@keyframes orbitSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shardDrift{0%{transform:translateY(-4px) rotate(45deg)}to{transform:translateY(8px) rotate(45deg)}}@keyframes signalPulse{0%,to{opacity:.45;transform:scaleX(.9)}50%{opacity:1;transform:scaleX(1.03)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:720px){.panel-card,.panel-card--login{padding:20px;border-radius:24px}.panel-card__header{flex-direction:column}.spotlight-shell{transform:none;animation:shellRise var(--scene-speed) cubic-bezier(.2,.8,.2,1) both}.spotlight-card__inner{grid-template-columns:1fr;gap:18px;padding:24px}.spotlight-card__meta{align-items:start;min-width:0;padding-left:0;padding-top:18px;border-left:0;border-top:1px solid color-mix(in srgb,var(--accent) 20%,rgba(255,255,255,.08))}.ambient,.scene-ribbon,.spotlight-card,.offline-card,.panel-card,.spotlight-card__frame,.scene-artifact{animation-duration:0s}}
