/* Aurora Prism — Aerius Pulse design system (bright light, iridescent, playful).
   Loaded by every page: landing, dashboard, admin, blog, legal, download. */
:root {
  --ap-bg: #FBFBFF;
  --ap-ink: #1A1530;
  --ap-ink-2: #4C4470;
  --ap-ink-3: #6B6390;
  --ap-line: #ECE9F7;
  --ap-glass: rgba(255, 255, 255, .66);
  --ap-glass-strong: rgba(255, 255, 255, .86);
  --ap-violet: #7C3AED;
  --ap-magenta: #C026D3;
  --ap-cyan: #06B6D4;
  --ap-pink: #EC4899;
  --ap-good: #15803D;
  --ap-bad: #B91C1C;
  --ap-grad: linear-gradient(120deg, #7C3AED, #C026D3);
  --ap-holo: linear-gradient(90deg, #06B6D4, #8B5CF6, #EC4899, #06B6D4);
  --ap-font-display: 'Bricolage Grotesque', 'Figtree', system-ui, sans-serif;
  --ap-font: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ap-radius: 22px;
  --ap-shadow: 0 10px 30px rgba(91, 33, 182, .08);
}
html { -webkit-text-size-adjust: 100%; }
body { background: var(--ap-bg); color: var(--ap-ink); font-family: var(--ap-font); }
h1, h2, h3, .ap-display { font-family: var(--ap-font-display); letter-spacing: -.03em; }
::selection { background: #DDD6FE; }
:focus-visible { outline: 3px solid #A78BFA; outline-offset: 2px; border-radius: 10px; }

/* ── keyframes ── */
@keyframes ap-aurora { 0% { transform: translate3d(-8%, -4%, 0) rotate(0) scale(1) } 50% { transform: translate3d(6%, 4%, 0) rotate(12deg) scale(1.12) } 100% { transform: translate3d(-4%, 6%, 0) rotate(-8deg) scale(1.04) } }
@keyframes ap-float { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-12px) } }
@keyframes ap-blink { 0%, 92%, 100% { transform: scaleY(1) } 95% { transform: scaleY(.1) } }
@keyframes ap-ping { 0% { transform: scale(1); opacity: .9 } 100% { transform: scale(2.6); opacity: 0 } }
@keyframes ap-shine { 0% { left: -60% } 60%, 100% { left: 130% } }
@keyframes ap-hue { 0% { background-position: 0% 50% } 100% { background-position: 200% 50% } }
@keyframes ap-spin { to { transform: rotate(360deg) } }
@keyframes ap-pop-in { 0% { opacity: 0; transform: translateY(10px) scale(.96) } 100% { opacity: 1; transform: none } }
@keyframes ap-shimmer { 0% { background-position: -400px 0 } 100% { background-position: 400px 0 } }
@keyframes ap-think { 0%, 100% { transform: rotate(-6deg) } 50% { transform: rotate(6deg) } }
@keyframes ap-jump { 0%, 100% { transform: translateY(0) } 30% { transform: translateY(-18px) } 60% { transform: translateY(0) scale(.97, 1.03) } }
@keyframes ap-dots { 0%, 100% { opacity: .25 } 50% { opacity: 1 } }

/* ── background aurora ── */
.ap-aurora { position: fixed; inset: -20% -10% auto -10%; height: 110vh; z-index: 0; pointer-events: none;
  background: radial-gradient(40% 50% at 20% 30%, #A5F3FC 0%, transparent 70%), radial-gradient(35% 45% at 70% 25%, #DDD6FE 0%, transparent 70%),
              radial-gradient(40% 40% at 55% 70%, #FBCFE8 0%, transparent 70%), radial-gradient(30% 35% at 85% 65%, #FEF08A 0%, transparent 70%);
  filter: blur(30px); opacity: .75; animation: ap-aurora 16s ease-in-out infinite alternate; }
.ap-aurora.soft { opacity: .45; }
.ap-above { position: relative; z-index: 1; }
.ap-holo-text { background: var(--ap-holo); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: ap-hue 6s linear infinite; }

/* ── surfaces ── */
.ap-glass, .card { background: var(--ap-glass); border: 1px solid rgba(255, 255, 255, .95); border-radius: var(--ap-radius); box-shadow: var(--ap-shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.card { padding: 1.25rem; animation: ap-pop-in .35s ease-out both; }
.ap-lift { transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s; }
.ap-lift:hover { transform: translateY(-5px); box-shadow: 0 26px 56px rgba(91, 33, 182, .15); }

/* ── buttons: every button gets a little personality ── */
.btn, .ap-btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  background: var(--ap-grad); color: #fff; border: 0; border-radius: 14px; padding: .65rem 1.15rem; font: 700 .92rem var(--ap-font);
  text-decoration: none; cursor: pointer; box-shadow: 0 8px 20px rgba(124, 58, 237, .25);
  transition: transform .22s cubic-bezier(.3, 1.6, .5, 1), box-shadow .22s, filter .2s; }
.btn::after, .ap-btn::after { content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .6), transparent); transform: skewX(-20deg); animation: ap-shine 3.4s ease-in-out infinite; }
.btn:hover, .ap-btn:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 14px 30px rgba(124, 58, 237, .35); color: #fff; }
.btn:active, .ap-btn:active { transform: translateY(1px) scale(.96); }
.btn:disabled, .ap-btn[aria-busy="true"] { cursor: progress; filter: saturate(.7); }
.btn:disabled::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: ap-spin .7s linear infinite; }
.btn2, .ap-btn2 { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; cursor: pointer; text-decoration: none;
  color: var(--ap-ink); border-radius: 14px; padding: .58rem 1rem; font: 600 .9rem var(--ap-font); border: 1.5px solid #D9D3F0;
  background: linear-gradient(90deg, #E0F7FF, #F5E8FF) no-repeat left / 0% 100%, rgba(255, 255, 255, .8);
  transition: background-size .45s ease, transform .2s cubic-bezier(.3, 1.6, .5, 1), border-color .2s; }
.btn2:hover, .ap-btn2:hover { background-size: 100% 100%, auto; border-color: #B9A8F5; transform: translateY(-2px); color: var(--ap-ink); }
.btn2:active, .ap-btn2:active { transform: scale(.96); }
.btn2:disabled { opacity: .55; cursor: not-allowed; }
.ap-btn-dark { background: var(--ap-ink); box-shadow: 0 8px 20px rgba(26, 21, 48, .25); }
.ap-btn-lg { padding: 1rem 1.75rem; font-size: 1.05rem; border-radius: 18px; }
.ap-ring { position: relative; isolation: isolate; overflow: hidden; }
.ap-ring::before { content: ""; position: absolute; inset: -60%; background: conic-gradient(#22D3EE, #8B5CF6, #EC4899, #FACC15, #22D3EE); animation: ap-spin 3s linear infinite; z-index: -2; }
.ap-ring::after { content: ""; position: absolute; inset: 2px; border-radius: inherit; background: #fff; z-index: -1; }

/* fun tooltip on hover (text set by fun.js) */
[data-tip] { position: relative; }
[data-tip]:hover::before { content: attr(data-tip); position: absolute; z-index: 60; bottom: calc(100% + 10px); left: 50%; transform: translateX(-50%);
  width: max-content; max-width: 240px; white-space: normal; padding: .5rem .75rem; border-radius: 12px; background: var(--ap-ink); color: #fff;
  font: 600 .75rem/1.35 var(--ap-font); box-shadow: 0 10px 24px rgba(26, 21, 48, .25); animation: ap-pop-in .2s ease-out both; pointer-events: none; }
@media (hover: none) { [data-tip]:hover::before { display: none; } }

/* ── forms ── */
.inp, .ap-input { width: 100%; box-sizing: border-box; border: 1.5px solid #DDD6F3; border-radius: 14px; padding: .65rem .85rem; font: 500 .92rem var(--ap-font);
  color: var(--ap-ink); background: rgba(255, 255, 255, .85); transition: border-color .2s, box-shadow .25s, transform .2s; }
.inp:hover { border-color: #C4B5FD; }
.inp:focus { outline: none; border-color: #8B5CF6; box-shadow: 0 0 0 4px rgba(139, 92, 246, .18), 0 6px 16px rgba(139, 92, 246, .12); }
.inp::placeholder { color: #9C95BC; }
select.inp { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #7C3AED 50%), linear-gradient(135deg, #7C3AED 50%, transparent 50%);
  background-position: calc(100% - 18px) 55%, calc(100% - 12px) 55%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 2rem; }
input[type="checkbox"] { accent-color: #7C3AED; width: 1.05rem; height: 1.05rem; }
input[type="color"] { border: 0; width: 2.2rem; height: 2.2rem; border-radius: 10px; background: none; cursor: pointer; }

/* ── chips / badges ── */
.chip { display: inline-flex; align-items: center; font-size: .7rem; font-weight: 700; padding: .18rem .55rem; border-radius: 999px; background: #EDE9FE; color: #5B21B6; transition: transform .2s; }
.chip:hover { transform: translateY(-1px) rotate(-2deg); }

/* ── nav (dashboard) ── */
.ap-nav-item { display: flex; justify-content: space-between; align-items: center; padding: .55rem .8rem; border-radius: 14px; color: var(--ap-ink-2); font-weight: 600; text-decoration: none;
  transition: background .2s, transform .2s, color .2s; }
.ap-nav-item:hover { background: rgba(255, 255, 255, .85); transform: translateX(3px); color: var(--ap-ink); }
.ap-nav-item.active { background: var(--ap-ink); color: #fff; box-shadow: 0 8px 20px rgba(26, 21, 48, .2); }
.ap-nav-item.active .chip { background: rgba(255, 255, 255, .18); color: #fff; }

/* ── loaders ── */
.ap-loader { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: var(--ap-bg); transition: opacity .4s; }
.ap-loader.hide { opacity: 0; pointer-events: none; }
.ap-loader-inner { display: flex; flex-direction: column; align-items: center; gap: 14px; text-align: center; padding: 0 24px; }
.ap-loader-line { font-weight: 700; color: var(--ap-ink-2); max-width: 320px; }
.ap-dots span { animation: ap-dots 1s infinite; } .ap-dots span:nth-child(2) { animation-delay: .2s } .ap-dots span:nth-child(3) { animation-delay: .4s }
.ap-skeleton { border-radius: 14px; min-height: 1rem; background: linear-gradient(90deg, #F1EEFB 0, #FFFFFF 40%, #F1EEFB 80%); background-size: 800px 100%; animation: ap-shimmer 1.4s linear infinite; }
.ap-busy { position: fixed; z-index: 70; right: max(16px, env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: center; gap: 10px; padding: 10px 16px 10px 10px; border-radius: 999px; background: var(--ap-glass-strong); border: 1px solid #fff; box-shadow: 0 14px 34px rgba(91, 33, 182, .2); backdrop-filter: blur(16px); font-weight: 700; font-size: .85rem; max-width: 360px; }
.ap-toast { position: fixed; z-index: 80; left: 50%; transform: translateX(-50%); bottom: calc(18px + env(safe-area-inset-bottom, 0px)); max-width: min(92vw, 460px);
  padding: 12px 18px; border-radius: 16px; background: var(--ap-ink); color: #fff; font-weight: 600; font-size: .9rem; box-shadow: 0 16px 40px rgba(26, 21, 48, .3); animation: ap-pop-in .3s ease-out both; }

/* ── Pulsy moods ── */
.pulsy { display: inline-block; line-height: 0; }
.pulsy.idle { animation: ap-float 3.6s ease-in-out infinite; }
.pulsy.think { animation: ap-think 1.2s ease-in-out infinite; }
.pulsy.happy { animation: ap-jump 1s ease-in-out infinite; }
.pulsy .eyes { transform-origin: 140px 127px; animation: ap-blink 4.5s infinite; }
.pulsy .ping { transform-origin: 140px 20px; animation: ap-ping 1.8s ease-out infinite; }

/* tables */
table { border-collapse: separate; border-spacing: 0; }
th { font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ap-ink-3); font-weight: 700; padding: .4rem .5rem; }
td { padding: .55rem .5rem; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ── one-link start, channel tiles, recovery code ── */
.ap-magic{position:relative;overflow:hidden}
.ap-magic::after{content:"";position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(124,58,237,.10),transparent 40%);animation:ap-spin 9s linear infinite;pointer-events:none}
@keyframes ap-spin{to{transform:rotate(360deg)}}
.ap-big-input{font-size:1.15rem;padding:.95rem 1.1rem}
.ap-dots::after{content:"";display:inline-block;width:1.2em;text-align:left;animation:ap-dots 1.2s steps(4) infinite}
@keyframes ap-dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}
.ap-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:.8rem .4rem;border-radius:1.1rem;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.55);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.ap-tile:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(80,40,160,.15)}
.ap-logo{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:14px;color:#fff;font-weight:900;font-size:1rem;flex-shrink:0;box-shadow:0 6px 14px rgba(0,0,0,.15)}
.ap-dot{width:10px;height:10px;border-radius:50%;background:#cbd5e1}
.ap-tile .ap-dot{position:absolute;top:8px;right:8px}
.ap-dot.ok{background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
.ap-dot.share{background:#f59e0b;box-shadow:0 0 0 4px rgba(245,158,11,.18)}
.ap-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:1.6rem;font-weight:800;letter-spacing:.12em;padding:.8rem;border-radius:1rem;background:linear-gradient(135deg,#f5f3ff,#ecfeff);border:2px dashed #a78bfa;user-select:all}
.ap-codebox{width:5.2rem!important;text-align:center;font-family:ui-monospace,Menlo,monospace;font-weight:800;letter-spacing:.15em;text-transform:uppercase;transition:transform .15s ease,box-shadow .15s ease}
.ap-codebox:focus{transform:scale(1.06);box-shadow:0 0 0 3px rgba(124,58,237,.35)}
.ap-pop{animation:ap-pop .35s cubic-bezier(.2,1.4,.4,1)}
@keyframes ap-pop{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}
@media (prefers-reduced-motion:reduce){.ap-magic::after,.ap-dots::after,.ap-pop{animation:none}}