/* ============================================================
   THEME.CSS — Design tokens partagés (Autel/Abysse + Échoppe)
   ============================================================ */

:root {
    /* Couleurs */
    --bg-deep: #050505;
    --bg-dark: #070303;
    --bg-glass: rgba(20, 20, 20, 0.7);
    --panel-bg: rgba(15, 8, 8, 0.96);

    --accent-blood: #8a0303;
    --accent-blood-soft: rgba(138, 3, 3, 0.15);
    --accent-pink: #ffb6c1;
    --accent-pink-soft: rgba(255, 182, 193, 0.15);
    --accent-gold: #d4af37;

    --text-main: #eaeaea;
    --text-dim: #ddd;
    --text-muted: #777;
    --text-muted-warm: #887;

    --rare-1: #aaaaaa;
    --rare-2: #4a90e2;
    --rare-3: #9b59b6;
    --rare-4: #f1c40f;

    /* Typo */
    --font-goth: 'Cinzel Decorative', cursive;
    --font-hand: 'La Belle Aurore', cursive;
    --font-ui: 'Poppins', sans-serif;

    --fs-xs: clamp(0.68rem, 0.65rem + 0.15vw, 0.75rem);
    --fs-sm: clamp(0.78rem, 0.75rem + 0.15vw, 0.85rem);
    --fs-md: clamp(0.9rem, 0.87rem + 0.2vw, 1rem);
    --fs-lg: clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
    --fs-xl: clamp(1.6rem, 1.4rem + 1vw, 2rem);
    --fs-xxl: clamp(2.2rem, 1.9rem + 1.5vw, 2.9rem);

    /* Espacement */
    --sp-1: 4px;
    --sp-2: 8px;
    --sp-3: 12px;
    --sp-4: 16px;
    --sp-5: 20px;
    --sp-6: 28px;
    --sp-7: 40px;

    /* Rayons & ombres */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-pill: 30px;

    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.6);
    --shadow-deep: 0 15px 35px rgba(0, 0, 0, 0.9);
    --glow-blood: 0 0 15px rgba(138, 3, 3, 0.3);
    --glow-pink: 0 0 15px rgba(255, 182, 193, 0.35);

    /* Easings */
    --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
    --dur-fast: 0.2s;
    --dur-base: 0.3s;
    --dur-slow: 0.6s;
    --dur-view: 0.45s;
}

/* Reset partagé minimal */
.td-reset, .td-reset * {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

/* Composants partagés : bouton tactile générique */
.btn-tactile {
    transition: transform var(--dur-fast) var(--ease-standard),
                background var(--dur-base) var(--ease-standard),
                box-shadow var(--dur-base) var(--ease-standard);
}
.btn-tactile:active {
    transform: scale(0.96);
}

/* Toast partagé (utilisé par l'Échoppe, réutilisable ailleurs) */
@keyframes td-slide-up-fade {
    0% { opacity: 0; transform: translateY(20px); }
    10% { opacity: 1; transform: translateY(0); }
    90% { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(-20px); }
}

/* Scrollbars masquées (mobile-first, geste natif conservé) */
.td-no-scrollbar { scrollbar-width: none; }
.td-no-scrollbar::-webkit-scrollbar { display: none; }