/* ============================================================
   V1DPlayer — Global CSS (shared tokens, reset, helpers)
   Tiny file, safe to load on every page.
   ============================================================ */

:root {
    /* Core palette */
    --v-bg:        #000000;
    --v-surface:   #0d0d0f;
    --v-card:      #111114;
    --v-border:    rgba(255, 255, 255, 0.08);
    --v-text:      #ffffff;
    --v-muted:     rgba(255, 255, 255, 0.62);
    --v-dim:       rgba(255, 255, 255, 0.38);

    /* Neon accents */
    --v-accent:    #ff0080;
    --v-accent-2:  #ff3aa0;
    --v-glow:      0 0 24px rgba(255, 0, 128, 0.45);

    /* Motion */
    --v-ease:      cubic-bezier(.25, .9, .2, 1);
    --v-fast:      .18s;
    --v-slow:      .35s;

    /* Radius */
    --r-sm: 10px;
    --r-md: 14px;
    --r-lg: 20px;
    --r-pill: 999px;
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--v-bg);
    color: var(--v-text);
    font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overscroll-behavior: none;
}

a {
    color: var(--v-accent);
    text-decoration: none;
    transition: color var(--v-fast) var(--v-ease);
}

a:hover { color: var(--v-accent-2); }

button {
    font-family: inherit;
    border: 0;
    cursor: pointer;
    background: transparent;
    color: inherit;
}

/* Accent utilities */
.v-accent { color: var(--v-accent); }
.v-pill {
    border-radius: var(--r-pill);
    padding: 12px 22px;
    background: var(--v-accent);
    color: #fff;
    font-weight: 600;
    letter-spacing: .2px;
    transition: transform var(--v-fast) var(--v-ease),
                box-shadow var(--v-fast) var(--v-ease),
                background var(--v-fast) var(--v-ease);
}
.v-pill:hover   { background: var(--v-accent-2); box-shadow: var(--v-glow); }
.v-pill:active  { transform: scale(0.97); }

/* Glass card */
.v-glass {
    background: rgba(22, 22, 28, 0.55);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    border: 1px solid var(--v-border);
    border-radius: var(--r-lg);
}

/* Selection */
::selection { background: var(--v-accent); color: #fff; }

/* Scrollbar (desktop only) */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .12); border-radius: 3px; }