/* Clubbix — tokens (portar 1:1 para React/TS) */
:root{
  --gold:#fbb13c; --orange:#f5841f; --ember:#ea5a1c; --magenta:#b43ac6; --violet:#7c2ba8; --grape:#4e1773; --plum:#2c0e44;
  --brand-grad:linear-gradient(122deg,#f5841f 0%,#ea5a1c 36%,#b43ac6 72%,#7c2ba8 100%);
  --warm-grad:linear-gradient(120deg,#fbb13c,#f5841f 55%,#ea5a1c);
  --purple-grad:linear-gradient(135deg,#b43ac6,#7c2ba8 60%,#4e1773);
  --dark-grad:linear-gradient(160deg,#3a1259 0%,#250a3c 60%,#1c0730 100%);

  --surface-base:#160a28;       /* fundo */
  --surface-raised:#1f1135;     /* cards, inputs */
  --surface-overlay:#2a1843;    /* modais, menus */
  --line:rgba(243,233,245,.10);
  --line-soft:rgba(243,233,245,.08);
  --line-strong:rgba(243,233,245,.20);
  --text:#f3e9f5;
  --text-2:#b9abc8;             /* secundário · 8.3:1 sobre base */
  --text-3:#9a8dab;             /* terciário · 5.9:1 sobre base */
  --ink-soft:#695a78;           /* original do site, só decorativo */
  --danger:#ff8a7a; --danger-bg:rgba(255,138,122,.09); --danger-line:rgba(255,138,122,.38);
  --success:#6fd6a8; --success-bg:rgba(111,214,168,.09); --success-line:rgba(111,214,168,.36);

  --r-sm:14px; --r:20px; --r-lg:30px; --r-pill:999px;
  --glow-orange:0 14px 30px rgba(234,90,28,.34);
  --glow-purple:0 14px 34px rgba(124,43,168,.32);
  --shadow-deep:0 30px 64px rgba(0,0,0,.35);

  --font-display:'Poppins',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --fs-h1:60px; --fs-h2:38px; --fs-h3:30px; --fs-body:16px; --fs-btn:14.4px; --fs-label:12px;
  --focus-ring:2px solid #fbb13c;
  --tap:44px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
@media (max-width:640px){:root{--fs-h1:40px;--fs-h2:30px;--fs-h3:24px}}
@keyframes cbx-spin{to{transform:rotate(360deg)}}
@keyframes cbx-shimmer{0%{background-position:-240px 0}100%{background-position:240px 0}}
@keyframes cbx-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cbx-pop{0%{opacity:0;transform:scale(.9)}100%{opacity:1;transform:none}}
@keyframes cbx-p1{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:.9}100%{opacity:0;transform:translate(-120px,-170px) scale(1)}}
@keyframes cbx-p2{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:.9}100%{opacity:0;transform:translate(110px,-190px) scale(1)}}
@keyframes cbx-p3{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:.9}100%{opacity:0;transform:translate(10px,-230px) scale(1)}}
@keyframes cbx-sheet{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}
@keyframes cbx-scan{from{transform:translateY(0)}to{transform:translateY(236px)}}
/* Ícones (sprite inline #ic-*) */
.ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ic-sm{width:16px;height:16px}
/* Selo de ícone (ilustra estados de tela) */
.cbx-badge{width:64px;height:64px;border-radius:20px;display:flex;align-items:center;justify-content:center;flex:none;color:var(--gold);background:radial-gradient(circle at 30% 20%,rgba(251,177,60,.20),rgba(124,43,168,.16) 70%);border:1px solid rgba(251,177,60,.32);box-shadow:var(--glow-purple)}
.cbx-badge .ic{width:30px;height:30px}
.cbx-badge.warn{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-line);box-shadow:none}
a{color:var(--gold)} a:hover{color:var(--orange)}
body{margin:0;background:var(--surface-base);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased}