/* VoidVision first run — psychedelic motion around calm, readable glass cards. */
.vvfr{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#060812;color:#eef6fb;overflow:hidden;font:15px/1.5 "Segoe UI",system-ui,sans-serif;--c1:var(--vvt-s1,#ff3cd7);--c2:var(--vvt-s2,#8a5cff);--c3:var(--vvt-s3,#2ec5ff)}
.vvfr::backdrop{background:#03040a}
.vvfr[open]{display:grid;grid-template-rows:auto 1fr}
.vvfr.handoff{animation:vvfr-handoff .38s ease-in forwards}
@keyframes vvfr-handoff{to{opacity:0;filter:blur(14px) hue-rotate(90deg);transform:scale(1.04)}}
/* drifting colour fields */
.vvfr-aura{position:absolute;inset:-20%;z-index:0;opacity:.5;pointer-events:none;contain:strict}
.vvfr-aura i{position:absolute;width:55vmax;height:55vmax;border-radius:50%;mix-blend-mode:screen;will-change:transform;animation:vvfr-drift 26s ease-in-out infinite alternate}
.vvfr-aura i:nth-child(1){left:-5%;top:-10%;background:radial-gradient(circle,var(--c1),transparent 62%)}
.vvfr-aura i:nth-child(2){right:-10%;top:5%;background:radial-gradient(circle,var(--c3),transparent 62%);animation-duration:31s;animation-delay:-8s}
.vvfr-aura i:nth-child(3){left:20%;bottom:-25%;background:radial-gradient(circle,var(--c2),transparent 62%);animation-duration:37s;animation-delay:-14s}
.vvfr-aura i:nth-child(4){right:15%;bottom:-15%;width:35vmax;height:35vmax;background:radial-gradient(circle,transparent 30%,#0000 31%),conic-gradient(from 0deg,var(--c1),var(--c3),var(--c2),var(--c1));-webkit-mask:radial-gradient(circle,#000 0,transparent 68%);mask:radial-gradient(circle,#000 0,transparent 68%);animation:vvfr-spin 40s linear infinite;opacity:.45}
@keyframes vvfr-drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6vmax,-4vmax) scale(1.15)}100%{transform:translate(-5vmax,5vmax) scale(.92)}}
@keyframes vvfr-spin{to{transform:rotate(360deg)}}
.vvfr::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 55%,transparent 0,#060812cc 75%)}
/* colour-ring bloom between steps */
.vvfr-ripple{position:absolute;left:50%;top:55%;width:10px;height:10px;margin:-5px;border-radius:50%;z-index:1;pointer-events:none;opacity:0}
.vvfr-ripple.go{animation:vvfr-bloom .9s cubic-bezier(.2,.7,.2,1)}
@keyframes vvfr-bloom{0%{opacity:.95;box-shadow:0 0 0 0 var(--c1),0 0 0 0 var(--c2),0 0 0 0 var(--c3);filter:hue-rotate(0)}60%{opacity:.6}100%{opacity:0;box-shadow:0 0 0 60vmax transparent,0 0 0 40vmax transparent,0 0 0 22vmax transparent;filter:hue-rotate(160deg)}}
.vvfr-ripple.go{background:radial-gradient(circle,#fff,transparent 70%)}
.vvfr-ripple.go::before,.vvfr-ripple.go::after{content:'';position:absolute;inset:-2px;border-radius:50%;border:3px solid var(--c1);animation:vvfr-ring .9s cubic-bezier(.2,.7,.2,1) forwards}
.vvfr-ripple.go::after{border-color:var(--c3);animation-delay:.12s}
@keyframes vvfr-ring{from{transform:scale(1);opacity:1}to{transform:scale(160);opacity:0;border-width:.2px}}
/* top bar */
.vvfr-top{position:relative;z-index:2;display:flex;align-items:center;gap:22px;padding:18px clamp(16px,4vw,44px)}
.vvfr-brand{font:900 15px/1 Anton,Impact,sans-serif;letter-spacing:5px;background:linear-gradient(90deg,var(--c1),var(--c3),var(--c2),var(--c1));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:vvfr-flow 8s linear infinite}
@keyframes vvfr-flow{to{background-position:300% 0}}
.vvfr-rail{display:flex;gap:6px;list-style:none;margin:0 auto;padding:0;counter-reset:s}
.vvfr-rail li{display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:999px;color:#9fb3c4;font-size:13px;background:#ffffff08;border:1px solid #ffffff12;transition:all .35s}
.vvfr-rail b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#ffffff14;font:700 12px "Segoe UI",sans-serif;color:#cfe3f0}
.vvfr-rail li.on{color:#fff;background:linear-gradient(90deg,color-mix(in srgb,var(--c1) 35%,transparent),color-mix(in srgb,var(--c3) 30%,transparent));border-color:color-mix(in srgb,var(--c3) 60%,transparent)}
.vvfr-rail li.on b{background:#fff;color:#0a0d16}
.vvfr-rail li.done b{background:var(--c3);color:#061018}.vvfr-rail li.done b{font-size:0}.vvfr-rail li.done b::after{content:'✓';font-size:12px}
.vvfr-later{background:none;border:0;color:#9fb3c4;font:inherit;font-size:13px;cursor:pointer;padding:8px 4px;text-decoration:underline;text-underline-offset:3px}.vvfr-later:hover{color:#fff}
/* stage + cards */
.vvfr-stage{position:relative;z-index:2;display:grid;place-items:center;padding:8px clamp(14px,4vw,44px) 28px;overflow:auto}
.vvfr-card{width:min(980px,100%);background:linear-gradient(180deg,#0c111dee,#090d17f2);border:1px solid #ffffff1c;border-radius:22px;padding:clamp(20px,3.4vw,40px);box-shadow:0 30px 90px #000b,inset 0 1px 0 #ffffff12;transition:opacity .42s cubic-bezier(.16,1,.3,1),transform .42s cubic-bezier(.16,1,.3,1),filter .42s}
.vvfr-card.in{opacity:0;transform:translateY(18px) scale(.985);filter:blur(10px) hue-rotate(-60deg)}
.vvfr-card.out{opacity:0;transform:scale(.97);filter:blur(10px) hue-rotate(80deg);transition-duration:.24s}
.vvfr-head{margin-bottom:22px}.vvfr-kicker{display:inline-block;font:700 11px/1 "Segoe UI",sans-serif;letter-spacing:3px;color:color-mix(in srgb,var(--c3) 80%,#fff)}
.vvfr-head h1{font:400 clamp(30px,4.6vw,48px)/1.05 Anton,Impact,sans-serif;letter-spacing:.5px;margin:10px 0 8px;color:#fff}
.vvfr-head p{margin:0;color:#b9c9d6;max-width:62ch}
.vvfr-actions{display:flex;justify-content:space-between;align-items:center;margin-top:26px;gap:12px}
.vvfr button.primary,.vvfr button.ghost{font:600 15px "Segoe UI",sans-serif;border-radius:12px;padding:12px 22px;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s}
.vvfr button.primary{border:0;color:#08101a;background:linear-gradient(100deg,var(--c3),color-mix(in srgb,var(--c1) 80%,#fff));box-shadow:0 8px 30px color-mix(in srgb,var(--c1) 35%,transparent)}
.vvfr button.primary:hover{transform:translateY(-1px);box-shadow:0 12px 40px color-mix(in srgb,var(--c1) 50%,transparent)}
.vvfr button.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}
.vvfr button.ghost{background:#ffffff0a;border:1px solid #ffffff26;color:#e7f1f8}.vvfr button.ghost:hover{background:#ffffff14}
.vvfr button.small{padding:7px 12px;font-size:13px;border-radius:9px}
.vvfr :focus-visible{outline:2px solid #fff;outline-offset:3px}
/* theme grid */
.vvfr-themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.vvfr-theme{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:10px;border-radius:16px;background:#ffffff08;border:1px solid #ffffff18;color:#eef6fb;font:inherit;text-align:left;cursor:pointer;transition:transform .2s,border-color .2s,background .2s}
.vvfr-theme:hover{transform:translateY(-2px);background:#ffffff10}
.vvfr-theme[aria-checked=true]{border-color:#fff;box-shadow:0 0 0 2px var(--c3),0 10px 30px #0008}
.vvfr-sw{width:100%;aspect-ratio:16/10;border-radius:11px;margin-bottom:6px;box-shadow:inset 0 0 0 1px #ffffff20}
.vvfr-theme b{font-size:14px}.vvfr-theme small{color:#9fb3c4;font-size:12px;line-height:1.3}
/* profile */
.vvfr-cols{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(240px,.75fr);gap:28px;align-items:start}
.vvfr-form{display:flex;flex-direction:column;gap:14px}
.vvfr-field{display:flex;flex-direction:column;gap:6px}.vvfr-field>span{font-weight:600;font-size:14px;color:#e6f0f7}.vvfr-field small{color:#93a7b8;font-size:12.5px}
.vvfr input:not([type=color]),.vvfr textarea{font:15px "Segoe UI",sans-serif;color:#fff;background:#0a0f19;border:1px solid #ffffff26;border-radius:11px;padding:11px 13px;outline:none;transition:border-color .2s,box-shadow .2s;width:100%;box-sizing:border-box}
.vvfr input:focus,.vvfr textarea:focus{border-color:var(--c3);box-shadow:0 0 0 3px color-mix(in srgb,var(--c3) 25%,transparent)}
.vvfr textarea{resize:vertical;min-height:76px}
.vvfr-at{display:flex;align-items:center;background:#0a0f19;border:1px solid #ffffff26;border-radius:11px;padding-left:13px}.vvfr-at span{color:var(--c3);font-weight:700}.vvfr-at input{border:0!important;box-shadow:none!important;background:transparent;padding-left:4px}
.vvfr-at:focus-within{border-color:var(--c3);box-shadow:0 0 0 3px color-mix(in srgb,var(--c3) 25%,transparent)}
.vvfr-at.bad,.vvfr input.bad{border-color:#ff6b8b!important}
.vvfr-links{display:flex;flex-direction:column;gap:8px}.vvfr-link{display:flex;gap:8px}.vvfr-link .ghost{flex:none}
.vvfr-error{min-height:1.4em;margin:0;color:#ff9db3;font-weight:600}
.vvfr-preview{position:sticky;top:0}
.vvfr-pcard{margin-top:10px;border-radius:18px;overflow:hidden;background:#0a0f19;border:1px solid #ffffff1c;padding-bottom:16px;text-align:left}
.vvfr-pbanner{height:84px;background:linear-gradient(110deg,var(--c1),var(--c2),var(--c3));background-size:200% 100%;animation:vvfr-flow 10s linear infinite}
.vvfr-ppic{width:64px;height:64px;border-radius:50%;margin:-32px 0 8px 16px;border:3px solid #0a0f19;background:linear-gradient(135deg,var(--c2),var(--c3)) center/cover;display:grid;place-items:center;font:400 28px Anton,Impact,sans-serif;color:#fff}
.vvfr-ppic.big{width:96px;height:96px;margin:0;font-size:40px;border-color:#ffffff40}
.vvfr-pcard b,.vvfr-pcard>span,.vvfr-pcard p,.vvfr-plinks{display:block;margin:0 16px}.vvfr-pcard b{font-size:18px}.vvfr-pcard>span{color:var(--c3);font-size:13.5px}.vvfr-pcard p{color:#c4d3df;font-size:13.5px;margin-top:8px;word-break:break-word}
.vvfr-plinks{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.vvfr-plinks span{font-size:12px;padding:3px 9px;border-radius:999px;background:#ffffff12;color:#dfeaf2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* banner */
.vvfr-bwrap{position:relative;border-radius:18px;overflow:hidden;border:1px solid #ffffff24;box-shadow:0 18px 50px #000a}
.vvfr-bcanvas{display:block;width:100%;aspect-ratio:3.2/1;background:#0a0f19}
.vvfr-bid{position:absolute;left:18px;bottom:14px;display:flex;align-items:center;gap:12px;padding:8px 14px 8px 8px;border-radius:999px;background:#060912c4;backdrop-filter:blur(8px)}
.vvfr-bid .vvfr-ppic{width:46px;height:46px;margin:0;font-size:20px}.vvfr-bid b{display:block}.vvfr-bid span{color:var(--c3);font-size:13px}
.vvfr-banners{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:8px;margin-top:16px;max-height:230px;overflow:auto;padding:2px}
.vvfr-bthumb{display:flex;flex-direction:column;gap:4px;padding:5px;border-radius:12px;background:#ffffff08;border:1px solid #ffffff18;color:#dfeaf2;cursor:pointer;font:inherit}
.vvfr-bthumb canvas{width:100%;aspect-ratio:3.2/1;border-radius:8px;background:#0a0f19}.vvfr-bthumb small{font-size:12px;text-align:left;padding-left:2px}
.vvfr-bthumb[aria-pressed=true]{border-color:#fff;box-shadow:0 0 0 2px var(--c3)}
.vvfr-tune{display:flex;align-items:center;gap:10px;margin-top:14px}.vvfr-tune input{width:44px;height:32px;border:1px solid #ffffff30;border-radius:8px;background:none;padding:2px;cursor:pointer}
/* welcome */
.vvfr-done{text-align:center;display:flex;flex-direction:column;align-items:center;max-width:620px}
.vvfr-done .vvfr-ppic.big{box-shadow:0 0 0 4px #ffffff22,0 0 60px color-mix(in srgb,var(--c3) 60%,transparent);animation:vvfr-glowpulse 3s ease-in-out infinite;margin-bottom:12px}
.vvfr-done .vvfr-head{margin:0}.vvfr-done .vvfr-head p{margin:auto}.vvfr-handle{color:var(--c3);margin:6px 0 0}.vvfr-done .vvfr-actions{justify-content:center;width:100%}.vvfr-done .vvfr-actions>span{display:none}
@keyframes vvfr-glowpulse{50%{box-shadow:0 0 0 4px #ffffff33,0 0 90px color-mix(in srgb,var(--c1) 70%,transparent)}}
/* launcher: Studio Desktop button glow after setup */
.library-app.vvfr-glow{position:relative;border-color:#fff!important;box-shadow:0 0 0 2px var(--teal,#67efda),0 0 28px var(--pink,#fb86d2);animation:vvfr-btnglow 1.6s ease-in-out infinite}
@keyframes vvfr-btnglow{50%{box-shadow:0 0 0 2px var(--pink,#fb86d2),0 0 44px var(--teal,#67efda)}}
/* profile links (profile page) */
a.profile-link{display:block;color:var(--teal,#67efda);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}a.profile-link:hover{text-decoration:underline}
@media(max-width:760px){.vvfr-rail span{display:none}.vvfr-rail li{padding:6px}.vvfr-cols{grid-template-columns:1fr}.vvfr-preview{position:static}.vvfr-top{gap:12px}}
@media(prefers-reduced-motion:reduce){.vvfr-aura i,.vvfr-brand,.vvfr-pbanner,.vvfr-done .vvfr-ppic.big,.library-app.vvfr-glow{animation:none!important}.vvfr-card{transition:none}.vvfr-ripple{display:none}}
