/* ViceCityAI — Dark Neon v2, shared across the entire product */
:root{
  color-scheme:dark;
  --vc2-black:#020205;
  --vc2-bg:#05050a;
  --vc2-panel:#0a0b12;
  --vc2-panel-hi:#11131d;
  --vc2-pink:#ff3ed1;
  --vc2-pink-hi:#ff86e5;
  --vc2-violet:#8c5cff;
  --vc2-cyan:#2de7ff;
  --vc2-blue:#4b7dff;
  --vc2-green:#54f0ac;
  --vc2-text:#f7f7ff;
  --vc2-soft:#c7c9d6;
  --vc2-muted:#8d91a4;
  --vc2-line:rgba(255,255,255,.09);
  --vc2-line-pink:rgba(255,62,209,.24);
  --vc2-radius:22px;
  --vc2-shadow:0 24px 80px rgba(0,0,0,.46);
  --darker-warm:#020205;--dark-warm:#090a10;--cream:#f7f7ff;
  --card-bg:rgba(10,11,18,.82);--card-border:rgba(255,62,209,.18);
  --text-soft:#c7c9d6;--text-muted:#8d91a4;
  --peach:#ff86e5;--soft-pink:#ff3ed1;--rose:#ff3ed1;
  --lavender:#8c5cff;--deep-lavender:#6e43d9;--warm-orange:#ff587f;--golden:#2de7ff;
  --bg:#020205;--panel:#0a0b12;--panel2:#11131d;--line:rgba(255,255,255,.09);
  --text:#f7f7ff;--muted:#8d91a4;--pink:#ff3ed1;--orange:#ff587f;--blue:#2de7ff;
}
*{box-sizing:border-box}
html{background:var(--vc2-black)!important;color-scheme:dark;scroll-behavior:smooth}
body{
  background:
    radial-gradient(900px 500px at 86% -10%,rgba(140,92,255,.14),transparent 68%),
    radial-gradient(800px 500px at -12% 34%,rgba(45,231,255,.07),transparent 66%),
    var(--vc2-black)!important;
  color:var(--vc2-text)!important;
  min-height:100vh;
}
body::before{
  content:""!important;position:fixed!important;inset:0!important;z-index:0!important;pointer-events:none!important;
  background-image:linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px)!important;
  background-size:56px 56px!important;
  -webkit-mask-image:linear-gradient(to bottom,black,transparent 78%);mask-image:linear-gradient(to bottom,black,transparent 78%);
}
main,footer,header{position:relative}
main{z-index:1}
::selection{background:rgba(255,62,209,.4);color:#fff}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#020205}::-webkit-scrollbar-thumb{background:linear-gradient(var(--vc2-pink),var(--vc2-violet));border:3px solid #020205;border-radius:20px}

/* Navigation */
header{
  background:rgba(3,3,8,.78)!important;border-bottom:1px solid rgba(255,62,209,.14)!important;
  box-shadow:0 16px 60px rgba(0,0,0,.42)!important;backdrop-filter:blur(22px) saturate(135%)!important;
  -webkit-backdrop-filter:blur(22px) saturate(135%)!important;
}
header::after{content:"";position:absolute;left:7%;right:7%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--vc2-pink),rgba(45,231,255,.55),transparent);opacity:.65;pointer-events:none}
.logo{background:linear-gradient(100deg,#fff 0%,var(--vc2-pink-hi) 42%,var(--vc2-cyan) 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;filter:drop-shadow(0 0 12px rgba(255,62,209,.25))}
.palm-logo img{filter:drop-shadow(0 0 9px rgba(255,62,209,.32)) saturate(1.15)}
.nav-links a,.auth-links a,.nav a{color:var(--vc2-soft)!important}
.nav-links a:hover,.auth-links a:hover,.nav a:hover{color:#fff!important;text-shadow:0 0 13px rgba(255,62,209,.75)}
.nav-links a.active{color:#fff!important}.nav-links a.active::after{background:linear-gradient(90deg,var(--vc2-pink),var(--vc2-cyan))!important;box-shadow:0 0 14px var(--vc2-pink)}
.theme-toggle{display:none!important}
.lang-toggle{border:1px solid rgba(255,255,255,.08)!important;border-radius:10px!important;padding:2px!important;background:#080910!important}
.lang-toggle button{border:0!important;border-radius:7px!important;color:var(--vc2-muted)!important}
.lang-toggle button.active{background:rgba(255,62,209,.13)!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,62,209,.26),0 0 14px rgba(255,62,209,.1)!important}

/* Type */
h1,h2,h3,h4,strong{color:var(--vc2-text)}
.hero-title,.page-title,.grad,.gradient,.stat-value{
  background:linear-gradient(102deg,#fff 2%,var(--vc2-pink-hi) 42%,var(--vc2-violet) 68%,var(--vc2-cyan))!important;
  -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 0 18px rgba(255,62,209,.15));
}
p,.page-subtitle,.hero-desc,.micro,small,.tool-desc,.endpoint-desc{color:#aeb1c2!important}
.hero-desc strong,p strong{color:#fff!important;-webkit-text-fill-color:initial!important;text-shadow:0 0 12px rgba(255,62,209,.28)}
a{transition:color .22s ease,text-shadow .22s ease,filter .22s ease}

/* Buttons */
.signup-btn,.btn-primary,.btn:not(.ghost):not(.secondary),.button:not(.secondary),.btn-full,.topup-btn,.payment-submit,.create-key-btn,.copy-btn,.send-btn,.doctor-launch>a{
  color:#fff!important;background:linear-gradient(115deg,var(--vc2-pink),var(--vc2-violet))!important;
  border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 8px 30px rgba(255,62,209,.18),inset 0 1px 0 rgba(255,255,255,.2)!important;
  transition:transform .22s ease,filter .22s ease,box-shadow .22s ease!important;
}
.signup-btn:hover,.btn-primary:hover,.btn:not(.ghost):not(.secondary):hover,.button:not(.secondary):hover,.btn-full:hover,.topup-btn:hover,.payment-submit:hover,.create-key-btn:hover,.copy-btn:hover,.send-btn:hover,.doctor-launch>a:hover{
  transform:translateY(-2px)!important;filter:brightness(1.2) saturate(1.12)!important;
  box-shadow:0 0 16px rgba(255,62,209,.62),0 0 46px rgba(140,92,255,.3),0 12px 34px rgba(0,0,0,.42)!important;
}
.btn-secondary,.ghost,.button.secondary,.logout-btn,.modal-close,.input-btn,.new-chat-btn{
  background:rgba(7,8,13,.9)!important;color:var(--vc2-text)!important;border:1px solid rgba(45,231,255,.25)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.btn-secondary:hover,.ghost:hover,.button.secondary:hover,.logout-btn:hover,.modal-close:hover,.input-btn:hover,.new-chat-btn:hover{
  border-color:var(--vc2-cyan)!important;color:#fff!important;filter:brightness(1.18)!important;box-shadow:0 0 18px rgba(45,231,255,.27)!important;
}

/* Surfaces — quiet at rest, luminous on hover */
.card,.feature,.feature-card,.wide-card,.section-card,.stat-card,.form-container,.model-pricing-table,.docs-content,.code,.code-block,.box,.plan,.deep,.repair,.drop,.modal-box,.payment-method,.endpoint,.tool-item,.base-url-box,.doctor-launch,.promo,.faq details,.notice,.cta,.status-item,.account,.issue,.metric,.token-row,.repair-option{
  position:relative;background:linear-gradient(145deg,rgba(15,16,25,.9),rgba(7,8,13,.94))!important;
  border-color:var(--vc2-line)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),var(--vc2-shadow)!important;
  backdrop-filter:blur(14px) saturate(115%);-webkit-backdrop-filter:blur(14px) saturate(115%);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),border-color .28s ease,box-shadow .28s ease,filter .28s ease,background .28s ease!important;
}
.card::before,.feature::before,.feature-card::before,.wide-card::before,.section-card::before,.stat-card::before,.plan::before,.tool-item::before,.doctor-launch::before,.form-container::before{
  content:"";position:absolute;left:12%;right:12%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,62,209,.48),rgba(45,231,255,.22),transparent);opacity:.65;pointer-events:none
}
.card:hover,.feature:hover,.feature-card:hover,.wide-card:hover,.section-card:hover,.stat-card:hover,.plan:hover,.payment-method:hover,.endpoint:hover,.tool-item:hover,.doctor-launch:hover,.promo:hover,.faq details:hover,.status-item:hover,.issue:hover,.repair-option:hover{
  transform:translateY(-4px)!important;border-color:rgba(255,62,209,.5)!important;
  background:linear-gradient(145deg,rgba(27,18,36,.96),rgba(8,10,18,.96))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 0 1px rgba(255,62,209,.08),0 0 28px rgba(255,62,209,.16),0 26px 80px rgba(0,0,0,.54)!important;
  filter:brightness(1.14) saturate(1.08);
}
.model-item,.model-chip,.provider-badge,.plan-badge,.price,.user-badge,.prism-pill,.uptime-badge{
  background:rgba(255,255,255,.025)!important;border-color:rgba(255,255,255,.1)!important;transition:all .24s ease!important
}
.model-item:hover,.model-chip:hover,.provider-badge:hover,.plan-badge:hover{
  color:#fff!important;background:rgba(255,62,209,.09)!important;border-color:rgba(255,62,209,.48)!important;
  box-shadow:0 0 20px rgba(255,62,209,.17)!important;filter:brightness(1.2);transform:translateY(-2px)
}

/* Forms, code and data */
input,textarea,select,.topup-input,.input-wrapper,.key-display,.model-display,.model-dropdown{
  background:#07080e!important;color:var(--vc2-text)!important;border-color:rgba(255,255,255,.11)!important
}
input:focus,textarea:focus,select:focus,.topup-input:focus,.input-wrapper:focus-within,.model-display:hover{
  outline:none!important;border-color:var(--vc2-pink)!important;box-shadow:0 0 0 3px rgba(255,62,209,.1),0 0 22px rgba(255,62,209,.1)!important
}
code,pre,.code,.code-block,.key-text,.base-url-value,.endpoint-path{color:#bff8ff!important;text-shadow:0 0 10px rgba(45,231,255,.1)}
table th,.data-table th{color:#ff9be7!important;border-color:rgba(255,62,209,.17)!important;background:rgba(255,62,209,.035)!important}
table td,.data-table td{border-color:rgba(255,255,255,.055)!important;color:#d8dae5!important}
tbody tr{transition:filter .2s ease}tbody tr:hover{filter:brightness(1.14)}tbody tr:hover td{background:rgba(255,62,209,.045)!important}

/* Product-specific surfaces */
.chat-sidebar{background:rgba(4,5,9,.96)!important;border-color:rgba(255,62,209,.14)!important}
.chat-bar{background:rgba(7,8,14,.9)!important;border-color:rgba(255,62,209,.13)!important}
.input-area{background:linear-gradient(180deg,transparent,rgba(2,2,5,.98) 30%)!important}
.input-wrapper{box-shadow:0 18px 50px rgba(0,0,0,.5),0 0 0 1px rgba(255,62,209,.05)!important}
.user-avatar{background:linear-gradient(135deg,var(--vc2-pink),var(--vc2-violet))!important;box-shadow:0 0 20px rgba(255,62,209,.3)}
.footer-social a,.method-icon,.drop-icon,.input-btn{background:#080910!important;border:1px solid rgba(255,62,209,.25)!important;color:var(--vc2-pink)!important;transition:all .22s ease!important}
.footer-social a:hover,.method-icon:hover,.drop:hover .drop-icon,.input-btn:hover{color:#fff!important;border-color:var(--vc2-pink)!important;filter:brightness(1.45) drop-shadow(0 0 9px var(--vc2-pink));box-shadow:0 0 22px rgba(255,62,209,.25);transform:translateY(-2px)}
.footer-social svg{fill:currentColor!important}
footer{background:linear-gradient(180deg,transparent,#020205 28%)!important;border-color:rgba(255,62,209,.12)!important}
footer a:hover{color:#fff!important;text-shadow:0 0 12px rgba(255,62,209,.6)}

/* Home portal — monumental recessed arch inspired by the supplied reference */
.hero.portal-hero{display:grid!important;grid-template-columns:minmax(350px,.8fr) minmax(600px,1.2fr)!important;align-items:center!important;gap:clamp(18px,2.5vw,48px)!important;min-height:820px!important;padding:112px 48px 58px!important;overflow:hidden}
.portal-hero .hero-left{order:1!important;width:100%!important;max-width:600px!important;justify-self:end;text-align:left!important;flex:none!important;position:relative;z-index:6;margin:0!important}
.portal-hero .hero-right{order:2!important;width:100%!important;min-height:680px!important;display:flex!important;align-items:center!important;justify-content:center!important}
.portal-hero .hero-buttons,.portal-hero .provider-marquee{justify-content:flex-start!important}
.portal-stage.architectural-portal{position:relative;width:min(940px,100%);height:680px;aspect-ratio:12/8.25;margin:0;isolation:isolate;overflow:visible;background:radial-gradient(ellipse at 50% 48%,rgba(255,255,255,.14),rgba(53,231,255,.07) 24%,rgba(140,92,255,.09) 42%,transparent 68%);filter:drop-shadow(0 30px 60px rgba(0,0,0,.5));contain:layout paint}
.portal-stage.architectural-portal::before{content:"";position:absolute;inset:8% 5% 0;background:radial-gradient(ellipse at 50% 42%,rgba(45,231,255,.07),rgba(255,62,209,.035) 35%,transparent 68%);filter:blur(18px);pointer-events:none}
.portal-architecture{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:1;filter:brightness(1.16) contrast(1.08) drop-shadow(0 0 12px rgba(140,92,255,.12))}
.portal-signal{animation:signalFlow 12s linear infinite}
.portal-white-light{position:absolute;z-index:2;left:50%;top:39%;width:34%;height:49%;transform:translateX(-50%);pointer-events:none;mix-blend-mode:screen}
.portal-white-light::before{content:"";position:absolute;inset:-15% -35% -10%;background:radial-gradient(ellipse at 50% 38%,#fff 0 12%,rgba(255,255,255,.93) 22%,rgba(220,246,255,.55) 43%,rgba(140,110,255,.16) 66%,transparent 76%);filter:blur(16px);animation:whiteCore 3.8s ease-in-out infinite}
.portal-white-light::after{content:"";position:absolute;left:50%;bottom:-42%;width:260%;height:110%;transform:translateX(-50%);clip-path:polygon(44% 0,56% 0,78% 100%,22% 100%);background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(224,248,255,.28) 34%,rgba(165,137,255,.08) 68%,transparent);filter:blur(13px);animation:whiteSpill 4.6s ease-in-out infinite}
.portal-white-light i{position:absolute;left:50%;top:8%;width:2px;height:82%;background:linear-gradient(#fff,rgba(255,255,255,.75),transparent);box-shadow:0 0 12px #fff,0 0 30px rgba(213,246,255,.8);transform-origin:top;opacity:.7}.portal-white-light i:nth-child(1){transform:translateX(-50%) rotate(-17deg)}.portal-white-light i:nth-child(2){transform:translateX(-50%)}.portal-white-light i:nth-child(3){transform:translateX(-50%) rotate(17deg)}
.portal-brand{position:absolute;left:50%;top:24.5%;transform:translateX(-50%);z-index:5;padding:7px 13px;border-radius:999px;background:#05060b;border:1px solid rgba(45,231,255,.35);color:#fff;font:700 9px/1 'Outfit',sans-serif;letter-spacing:1.7px;text-transform:uppercase;box-shadow:0 0 17px rgba(45,231,255,.2);white-space:nowrap}
.model-orb{--accent:var(--vc2-pink);position:absolute;z-index:5;display:flex;align-items:center;gap:8px;min-width:106px;padding:8px 11px 8px 8px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:999px;background:rgba(5,6,12,.9);color:#fff;cursor:default;box-shadow:0 0 16px color-mix(in srgb,var(--accent) 16%,transparent),0 14px 30px rgba(0,0,0,.42);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:archEmerge 1.05s cubic-bezier(.18,.75,.28,1) both,orbFloat 4.2s ease-in-out infinite;animation-delay:var(--delay),calc(var(--delay) + 1.05s);transition:border-color .25s ease,box-shadow .25s ease,filter .25s ease!important}
.model-orb:hover{filter:brightness(1.35);border-color:var(--accent);box-shadow:0 0 15px color-mix(in srgb,var(--accent) 62%,transparent),0 0 38px color-mix(in srgb,var(--accent) 28%,transparent),0 18px 40px rgba(0,0,0,.55)}
.model-orb-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,#090a10);border:1px solid color-mix(in srgb,var(--accent) 52%,transparent);color:var(--accent);font-size:14px;font-weight:800;text-shadow:0 0 10px var(--accent);box-shadow:inset 0 0 12px color-mix(in srgb,var(--accent) 15%,transparent)}
.model-orb-name{font-size:11px;font-weight:650;letter-spacing:.1px}
.orb-gpt{left:10%;top:33%;--accent:#10d9a3;--delay:.08s}.orb-claude{left:6%;top:48%;--accent:#ff8a68;--delay:.16s}.orb-gemini{left:12%;top:63%;--accent:#6aa5ff;--delay:.24s}.orb-grok{left:50%;top:67%;transform:translateX(-50%);--accent:#f7f7ff;--delay:.32s}.orb-deepseek{right:10%;top:33%;--accent:#6e9dff;--delay:.4s}.orb-qwen{right:6%;top:48%;--accent:#9b7aff;--delay:.48s}.orb-kimi{right:12%;top:63%;--accent:#ff67ca;--delay:.56s}
.portal-caption{position:absolute;left:50%;bottom:5.5%;transform:translateX(-50%);z-index:5;color:#b7bac9;font:600 10px/1 'Outfit',sans-serif;letter-spacing:1.8px;text-transform:uppercase;white-space:nowrap}
@keyframes signalFlow{to{stroke-dashoffset:-192}}
@keyframes whiteCore{0%,100%{opacity:.78;transform:scale(.96)}50%{opacity:1;transform:scale(1.08)}}
@keyframes whiteSpill{0%,100%{opacity:.55;transform:translateX(-50%) scaleX(.9)}50%{opacity:.92;transform:translateX(-50%) scaleX(1.08)}}
@keyframes archEmerge{from{opacity:0;filter:blur(8px);margin-top:-40px;transform:scale(.55)}75%{opacity:1}to{opacity:1;filter:blur(0);margin-top:0}}
@keyframes orbFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}

/* Accessibility and responsive behavior */
:focus-visible{outline:2px solid var(--vc2-cyan)!important;outline-offset:3px!important;box-shadow:0 0 0 5px rgba(45,231,255,.12)!important}
@media(max-width:1024px){
  .hero.portal-hero{grid-template-columns:1fr!important;min-height:auto!important;padding:94px 24px 54px!important;gap:12px!important}.portal-hero .hero-right{order:1!important;min-height:520px!important}.portal-hero .hero-left{order:2!important;justify-self:center;text-align:center!important;max-width:760px!important}.portal-hero .hero-buttons,.portal-hero .provider-marquee{justify-content:center!important}.portal-stage.architectural-portal{height:520px;width:min(760px,100%)}
}
@media(max-width:768px){
  header{background:rgba(3,3,8,.92)!important}.card:hover,.feature:hover,.feature-card:hover,.wide-card:hover,.section-card:hover,.stat-card:hover,.plan:hover{transform:none!important}
  .hero.portal-hero{padding:84px 16px 46px!important}.portal-hero .hero-right{min-height:390px!important;min-width:0!important}.portal-stage.architectural-portal{width:100%!important;max-width:100%!important;height:390px;margin:0!important;overflow:hidden}.portal-brand{top:24%;font-size:7px;padding:6px 9px}.model-orb{min-width:0;padding:6px}.model-orb-name{display:none}.model-orb-icon{width:28px;height:28px}.orb-gpt{left:15%;top:34%}.orb-claude{left:11%;top:51%}.orb-gemini{left:18%;top:67%}.orb-grok{top:71%}.orb-deepseek{right:15%;top:34%}.orb-qwen{right:11%;top:51%}.orb-kimi{right:18%;top:67%}.portal-caption{bottom:4%;font-size:8px}.hero-title{line-height:1.45!important}.portal-hero .hero-left{width:100%!important;max-width:100%!important;margin-top:2px!important;padding:0!important}.portal-hero .hero-desc{max-width:100%!important}.portal-hero .hero-buttons{flex-wrap:wrap!important}
}
@media(max-width:390px){.portal-stage.architectural-portal{width:100%!important;margin:0!important}.model-orb-icon{width:26px;height:26px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.model-orb{opacity:1!important;margin-top:0!important}}
