:root {
  --bg: #07070d; --panel: #12121e; --panel2: #1a1a2a; --line: #2a2a42;
  --text: #f3f3ff; --muted: #9a9abb; --pink: #ff2fa0; --purple: #8a5cff; --cyan: #29d3ff;
  --ok: #20d97a; --bad: #ff4d6d; --warn: #ffb02e;
  color-scheme: dark;
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; min-height: 100%; }
body { background: var(--bg); color: var(--text); font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Arial, sans-serif; }
a { color: var(--cyan); }
.logo { font-weight: 900; letter-spacing: 1px; direction: ltr; display: inline-flex; gap: .3em; align-items: baseline; }
.logo .tlv { background: linear-gradient(90deg, var(--cyan), var(--purple)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.logo .disco { background: linear-gradient(90deg, var(--purple), var(--pink)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.btn { background: linear-gradient(90deg, var(--purple), var(--pink)); color: #fff; border: 0; border-radius: 10px; padding: 10px 16px; font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.btn.ghost { background: var(--panel2); border: 1px solid var(--line); color: var(--text); }
.btn.danger { background: #3a1420; border: 1px solid var(--bad); color: #ffb3c1; }
.btn:disabled { opacity: .5; cursor: default; }
input, select, textarea { background: var(--bg); color: var(--text); border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; font: inherit; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--purple); outline-offset: 1px; }