/* ============================================================================
   TARA — skin-aurora.css (UI-2, light finalist "Aurora Glass").
   Ported from ../S43-login-previews/light-A-aurora.html (owner-passed final).
   Every selector is scoped under html[data-ui="aurora"]; styles apply to the
   #gate scaffold built by js/auth.js + the scene DOM built by
   js/gate-skin-aurora.js. Loaded after skin.css so it wins.
   ========================================================================== */

/* ---- palette / tokens (from the final) --------------------------------- */
html[data-ui="aurora"] #gate{
  --au-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --au-deva: "Nirmala UI", "Noto Sans Devanagari", "Mangal", system-ui, sans-serif;
  --au-bg: #eef2fb;
  --au-bg-2: #f6f8ff;
  --au-ink: #1a2038;
  --au-ink-soft: #5a6382;
  --au-ink-faint: #8b93b0;
  --au-glass: rgba(255,255,255,0.55);
  --au-glass-2: rgba(255,255,255,0.38);
  --au-glass-brd: rgba(255,255,255,0.75);
  --au-glass-brd-2: rgba(120,130,180,0.16);
  --au-field: rgba(255,255,255,0.7);
  --au-field-brd: rgba(120,130,180,0.22);
  --au-accent: #6366f1;
  --au-teal: #0ea5a4;
  --au-rose: #fb7185;
  --au-gold: #d4a017;
  --au-up: #16a06f;
  --au-down: #e5484d;
  --au-grad: linear-gradient(120deg, #6366f1 0%, #0ea5a4 55%, #fb7185 120%);
  --au-grad-soft: linear-gradient(120deg, rgba(99,102,241,.14), rgba(14,165,164,.12) 55%, rgba(251,113,133,.12));
  --au-shadow-1: 0 1px 2px rgba(30,40,90,.06), 0 8px 24px rgba(40,50,110,.09);
  --au-shadow-2: 0 8px 30px rgba(40,50,110,.14), 0 30px 60px rgba(40,50,110,.14);
  --au-glow: 0 0 0 4px rgba(99,102,241,.14);
  --au-radius: 22px;
  --au-radius-sm: 13px;
  --au-ease: cubic-bezier(.22,.61,.36,1);
  --au-ease-back: cubic-bezier(.34,1.56,.64,1);

  font-family: var(--au-font);
  color: var(--au-ink);
  background: var(--au-bg);
  -webkit-font-smoothing: antialiased;
}
html[data-ui="aurora"] body{ background:#eef2fb; }

/* ---- aurora background atmosphere (filled by gate-skin-aurora.js) ------ */
html[data-ui="aurora"] #gate .gp-bg{ background:var(--au-bg, #eef2fb); overflow:hidden; }
html[data-ui="aurora"] #gate .au-sky{ position:absolute; inset:0;
  background:
    radial-gradient(60% 55% at 15% 20%, rgba(160,180,255,.28), transparent 60%),
    radial-gradient(50% 50% at 85% 15%, rgba(120,240,220,.22), transparent 60%),
    radial-gradient(55% 55% at 80% 85%, rgba(255,170,200,.24), transparent 62%),
    radial-gradient(60% 60% at 20% 90%, rgba(190,170,255,.22), transparent 62%); }
html[data-ui="aurora"] #gate .au-blob{ position:absolute; border-radius:50%; filter:blur(60px);
  opacity:.45; mix-blend-mode:multiply; will-change:transform; }
html[data-ui="aurora"] #gate .au-b1{ width:46vw; height:46vw; left:-8vw; top:-8vw;
  background:radial-gradient(circle, #8ea2ff, transparent 68%); animation:au-drift1 26s cubic-bezier(.22,.61,.36,1) infinite alternate; }
html[data-ui="aurora"] #gate .au-b2{ width:40vw; height:40vw; right:-6vw; top:-4vw;
  background:radial-gradient(circle, #5eead4, transparent 68%); animation:au-drift2 32s cubic-bezier(.22,.61,.36,1) infinite alternate; }
html[data-ui="aurora"] #gate .au-b3{ width:44vw; height:44vw; right:2vw; bottom:-12vw;
  background:radial-gradient(circle, #fca5c4, transparent 68%); animation:au-drift3 30s cubic-bezier(.22,.61,.36,1) infinite alternate; }
html[data-ui="aurora"] #gate .au-b4{ width:38vw; height:38vw; left:0; bottom:-10vw;
  background:radial-gradient(circle, #c4b5fd, transparent 68%); animation:au-drift4 28s cubic-bezier(.22,.61,.36,1) infinite alternate; }
@keyframes au-drift1{ to{ transform:translate(8vw,6vh) scale(1.15); } }
@keyframes au-drift2{ to{ transform:translate(-7vw,8vh) scale(1.1); } }
@keyframes au-drift3{ to{ transform:translate(-6vw,-7vh) scale(1.18); } }
@keyframes au-drift4{ to{ transform:translate(7vw,-6vh) scale(1.12); } }
html[data-ui="aurora"] #gate .au-grain{ position:absolute; inset:0; opacity:.035; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

/* ---- top bar ------------------------------------------------------------ */
html[data-ui="aurora"] #gate .gp-name{ color:var(--au-ink); font-weight:800; letter-spacing:.2px; }
html[data-ui="aurora"] #gate .gp-tag{ color:var(--au-ink-faint); opacity:1; letter-spacing:2.4px; font-weight:600; }
/* 🪙 S170: aurora-gate के logo का tile (padding+grad+shadow) हटाया — icon edge-to-edge, कोई background नहीं */
html[data-ui="aurora"] #gate .gp-logo{ width:34px; height:34px; align-items:center; justify-content:center; }
html[data-ui="aurora"] #gate .gp-live{ display:inline-flex; align-items:center; gap:7px;
  font-weight:700; padding:7px 13px; border-radius:999px;
  background:var(--au-glass); border:1px solid var(--au-glass-brd);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:var(--au-shadow-1); }
html[data-ui="aurora"] #gate .gp-live[data-state="live"]{ color:var(--au-up); border-color:var(--au-glass-brd); }
html[data-ui="aurora"] #gate .gp-live[data-state="demo"]{ color:var(--au-gold); border-color:var(--au-glass-brd); }
html[data-ui="aurora"] #gate .gate-theme{ width:40px; height:40px; border-radius:13px;
  border:1px solid var(--au-glass-brd); background:var(--au-glass); color:var(--au-ink);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); box-shadow:var(--au-shadow-1);
  transition:transform .3s var(--au-ease-back), box-shadow .3s var(--au-ease); }
html[data-ui="aurora"] #gate .gate-theme:hover{ transform:translateY(-2px); }
html[data-ui="aurora"] #gate .gate-theme:active{ transform:translateY(0) scale(.95); }

/* ---- glass card base (scene cards + auth card) -------------------------- */
html[data-ui="aurora"] #gate .au-card,
html[data-ui="aurora"] #gate .gate-card{
  position:relative; background:var(--au-glass); border:1px solid var(--au-glass-brd);
  border-radius:var(--au-radius);
  backdrop-filter:blur(22px) saturate(150%); -webkit-backdrop-filter:blur(22px) saturate(150%);
  box-shadow:var(--au-shadow-2); }
html[data-ui="aurora"] #gate .au-card::after,
html[data-ui="aurora"] #gate .gate-card::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,.28), transparent 40%); }
html[data-ui="aurora"] #gate .au-card{ animation:au-in .7s var(--au-ease) both; }
html[data-ui="aurora"] #gate .au-chart{ animation-delay:.09s; }
html[data-ui="aurora"] #gate .gate-card{ animation:au-in .7s var(--au-ease) .06s both; max-width:460px; padding:clamp(22px,3vw,32px); }
@keyframes au-in{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }

/* ---- scene: hero panel -------------------------------------------------- */
html[data-ui="aurora"] #gate .gp-scene{ display:flex; flex-direction:column; gap:16px; }
html[data-ui="aurora"] #gate .au-hero{ overflow:hidden; padding:22px; }
html[data-ui="aurora"] #gate .au-hero-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:6px; }
html[data-ui="aurora"] #gate .au-h1{ margin:0; font-size:clamp(20px,2.4vw,27px); font-weight:800; letter-spacing:-.4px; line-height:1.12; color:var(--au-ink); }
html[data-ui="aurora"] #gate .au-sub{ margin:6px 0 0; color:var(--au-ink-soft); font-size:13.5px; max-width:42ch; line-height:1.5; }
html[data-ui="aurora"] #gate .au-chip{ flex:0 0 auto; font-size:11px; font-weight:700; letter-spacing:.4px;
  padding:7px 12px; border-radius:999px; color:#fff; background:var(--au-grad);
  box-shadow:var(--au-shadow-1); white-space:nowrap; }
html[data-ui="aurora"] #gate .au-art{ position:relative; width:100%; height:clamp(200px,25vh,280px); margin-top:10px; }
html[data-ui="aurora"] #gate .au-art svg{ position:absolute; inset:0; width:100%; height:100%; }
html[data-ui="aurora"] #gate .au-par{ transition:transform .5s var(--au-ease); will-change:transform; }

/* ---- scene: chart card -------------------------------------------------- */
html[data-ui="aurora"] #gate .au-chart{ padding:18px 18px 14px; display:flex; flex-direction:column; min-height:210px; }
html[data-ui="aurora"] #gate .au-chart-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:4px; }
html[data-ui="aurora"] #gate .au-lbl{ font-size:12px; font-weight:700; letter-spacing:.4px; color:var(--au-ink-faint); text-transform:uppercase; }
html[data-ui="aurora"] #gate .au-price-row{ display:flex; align-items:baseline; gap:10px; }
html[data-ui="aurora"] #gate .au-price{ font-size:clamp(22px,3vw,30px); font-weight:800; letter-spacing:-.5px; font-variant-numeric:tabular-nums; color:var(--au-ink); }
html[data-ui="aurora"] #gate .au-delta{ font-size:13px; font-weight:700; }
html[data-ui="aurora"] #gate .au-candles{ width:100%; flex:1; display:block; min-height:140px; }

/* ---- ticker strip ------------------------------------------------------- */
html[data-ui="aurora"] #gate .gp-ticker{ background:var(--au-glass);
  border-top:1px solid var(--au-glass-brd-2); border-bottom:1px solid var(--au-glass-brd-2);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  color:var(--au-ink-soft); font-weight:600; }
html[data-ui="aurora"] #gate .gp-ticker .tk b{ color:var(--au-ink-soft); font-weight:700; }
html[data-ui="aurora"] #gate .gp-ticker .tk .num{ color:var(--au-ink); font-weight:700; font-variant-numeric:tabular-nums; }
html[data-ui="aurora"] #gate .gp-ticker .tk .up{ color:var(--au-up); background:rgba(22,160,111,.12); padding:1px 7px; border-radius:7px; font-size:11.5px; }
html[data-ui="aurora"] #gate .gp-ticker .tk .dn{ color:var(--au-down); background:rgba(229,72,77,.12); padding:1px 7px; border-radius:7px; font-size:11.5px; }

/* ---- rotating quotes (motivation strip look) ---------------------------- */
html[data-ui="aurora"] #gate .gp-quotes{ color:var(--au-ink); }
html[data-ui="aurora"] #gate .gq-text{ font-weight:600; color:var(--au-ink); }
html[data-ui="aurora"] #gate .gq-creed .gq-text{ font-style:italic; font-size:14.5px; }
html[data-ui="aurora"] #gate .gq-verse .gq-text{ font-family:var(--au-deva); font-weight:600; }
html[data-ui="aurora"] #gate .gq-meaning{ font-family:var(--au-deva); color:var(--au-ink-soft); opacity:1; }
html[data-ui="aurora"] #gate .gq-attr{ color:var(--au-ink-faint); opacity:1; font-weight:700; }
html[data-ui="aurora"] #gate .gq-dots .qd{ background:var(--au-ink-faint); opacity:.35; transition:all .4s; }
html[data-ui="aurora"] #gate .gq-dots .qd.on{ opacity:1; width:18px; border-radius:5px; background:var(--au-accent); }

/* ---- auth card internals ------------------------------------------------ */
/* 🪙 S170: aurora-gate के gate-brand logo का tile भी हटाया — icon पर कोई background नहीं */
html[data-ui="aurora"] #gate .gate-brand .name{ background:none; -webkit-background-clip:initial; background-clip:initial;
  color:var(--au-ink); font-weight:800; letter-spacing:.2px; }
html[data-ui="aurora"] #gate .gate-brand .sub{ color:var(--au-ink-faint); }
html[data-ui="aurora"] #gate .gate-tabs{ background:var(--au-glass-2); border:1px solid var(--au-field-brd); border-radius:var(--au-radius-sm); }
html[data-ui="aurora"] #gate .gate-tabs button{ color:var(--au-ink-soft); border-radius:10px; transition:all .3s var(--au-ease); }
html[data-ui="aurora"] #gate .gate-tabs button.on{ color:#fff; background:var(--au-grad); border:none; box-shadow:var(--au-shadow-1); }
html[data-ui="aurora"] #gate .gate-hello{ font-size:11px; font-weight:700; letter-spacing:1.6px;
  text-transform:uppercase; color:var(--au-accent); opacity:1; margin:10px 0 12px; }
html[data-ui="aurora"] #gate .gcur{ display:none; }
html[data-ui="aurora"] #gate label.f{ font-size:12.5px; font-weight:700; color:var(--au-ink-soft); margin:14px 0 7px; }
html[data-ui="aurora"] #gate .gin input{ height:48px; padding:0 14px; border-radius:var(--au-radius-sm);
  border:1.5px solid var(--au-field-brd); background:var(--au-field); color:var(--au-ink);
  font-weight:500; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  transition:border-color .3s, box-shadow .3s, background .3s; }
html[data-ui="aurora"] #gate .gin input::placeholder{ color:var(--au-ink-faint); font-weight:400; }
html[data-ui="aurora"] #gate .gin input:focus{ outline:none; border-color:var(--au-accent);
  box-shadow:var(--au-glow); background:var(--au-bg-2); }
html[data-ui="aurora"] #gate .geye{ position:absolute; right:8px; width:36px; height:36px;
  border-radius:9px; color:var(--au-ink-faint); display:grid; place-items:center; opacity:1;
  transition:color .3s, background .3s; }
html[data-ui="aurora"] #gate .geye:hover{ color:var(--au-accent); background:var(--au-glass-2); }
html[data-ui="aurora"] #gate .gin input[type="password"],
html[data-ui="aurora"] #gate #gPass{ padding-right:46px; }

/* buttons */
html[data-ui="aurora"] #gate .btn{ border-radius:var(--au-radius-sm); font-weight:700; letter-spacing:.2px;
  border:1.5px solid var(--au-field-brd); background:var(--au-field); color:var(--au-ink);
  box-shadow:var(--au-shadow-1);
  transition:transform .3s var(--au-ease-back), box-shadow .3s var(--au-ease), border-color .3s; }
html[data-ui="aurora"] #gate .btn:hover{ transform:translateY(-2px); box-shadow:var(--au-shadow-2); border-color:var(--au-accent); }
html[data-ui="aurora"] #gate .btn:active{ transform:translateY(0) scale(.985); }
html[data-ui="aurora"] #gate .btn.primary{ border:none; color:#fff; background:var(--au-grad);
  background-size:180% 180%; box-shadow:0 8px 22px rgba(99,102,241,.32);
  transition:transform .3s var(--au-ease-back), box-shadow .3s var(--au-ease), background-position .6s var(--au-ease); }
html[data-ui="aurora"] #gate .btn.primary:hover{ transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(99,102,241,.4); background-position:100% 0; filter:none; }
html[data-ui="aurora"] #gate .btn.primary::after{ display:none; }
html[data-ui="aurora"] #gate .btn.primary:focus-visible{ outline:none; box-shadow:var(--au-glow), 0 14px 30px rgba(99,102,241,.4); }
html[data-ui="aurora"] #gate .btn.primary:disabled{ opacity:.45; box-shadow:none; transform:none; }
html[data-ui="aurora"] #gate .gbtn-google{ border:1.5px solid var(--au-field-brd); background:var(--au-field);
  color:var(--au-ink); font-weight:700; box-shadow:var(--au-shadow-1);
  transition:transform .3s var(--au-ease-back), box-shadow .3s, border-color .3s; }
html[data-ui="aurora"] #gate .gbtn-google:hover{ transform:translateY(-2px); box-shadow:var(--au-shadow-2); border-color:var(--au-accent); }

/* error / note / status */
html[data-ui="aurora"] #gate .gate-err{ color:var(--au-down); font-weight:600; }
html[data-ui="aurora"] #gate .gate-note{ color:var(--au-ink-faint); }
html[data-ui="aurora"] #gate .gate-note b{ color:var(--au-ink-soft); }
html[data-ui="aurora"] #gate .gate-icon{ width:88px; height:88px; margin:6px auto 10px; border-radius:26px;
  display:grid; place-items:center; font-size:40px; background:var(--au-grad-soft); border:1px solid var(--au-glass-brd); }
html[data-ui="aurora"] #gate .gate-card h2{ color:var(--au-ink); font-weight:800; letter-spacing:-.5px; }
html[data-ui="aurora"] #gate .gate-photo .gate-avatar{ background-color:var(--au-field); border:1.5px solid var(--au-field-brd); }
html[data-ui="aurora"] #gate .spinner{ border-color:rgba(99,102,241,.25); border-top-color:var(--au-accent); }
html[data-ui="aurora"] #gate .muted{ color:var(--au-ink-faint); }

/* ---- responsive --------------------------------------------------------- */
@media (max-width:980px){
  html[data-ui="aurora"] #gate .au-art{ height:clamp(170px,22vh,240px); }
  html[data-ui="aurora"] #gate .au-chart{ min-height:180px; }
}

/* ---- reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  html[data-ui="aurora"] #gate .au-blob{ animation:none; }
  html[data-ui="aurora"] #gate .au-card,
  html[data-ui="aurora"] #gate .gate-card{ animation:none; }
  html[data-ui="aurora"] #gate .au-par{ transition:none; }
}
