/* =========================================================================
   PROSPRENT V1 — FEUILLE DE STYLE
   =========================================================================
   Sommaire :
   1. Variables & thèmes (dark / light)
   2. Reset & base
   3. Arrière-plan immersif & curseur
   4. Navigation
   5. Hero
   6. Compteurs
   7. Catégories
   8. Prompt du jour / cartes de prompt
   9. Bibliothèque & filtres
   10. Nouveautés / À propos / Contact
   11. Footer
   12. Modale
   13. Assistant Prosprent
   14. Surprise-moi & Toast
   15. Animations & reveal
   16. Responsive
   ========================================================================= */

/* ============ 1. VARIABLES & THÈMES ============ */
/* MODIFIABLE — changez ces valeurs pour changer les couleurs du site */
:root{
    --bg-0:#05070d;
    --bg-1:#0a0e18;
    --bg-2:#0d1220;
    --surface:#10162a;
    --surface-hover:#141b33;
    --border:rgba(255,255,255,0.08);
    --border-strong:rgba(255,255,255,0.16);

    --text-0:#f4f6fb;
    --text-1:#c4cbdd;
    --text-2:#8792ab;

    --accent-1:#2e6bff;   /* bleu électrique */
    --accent-2:#5ec8ff;   /* bleu lumineux */
    --accent-3:#8a5cff;   /* violet léger, usage discret */

    --gradient-1:linear-gradient(135deg,var(--accent-1),var(--accent-2));
    --gradient-2:linear-gradient(135deg,var(--accent-3),var(--accent-1));

    --shadow-glow:0 0 40px rgba(46,107,255,0.35);
    --shadow-card:0 20px 60px rgba(0,0,0,0.45);

    --radius-sm:10px;
    --radius-md:16px;
    --radius-lg:24px;

    --ease:cubic-bezier(.16,.8,.24,1);
    --nav-h:76px;
}

[data-theme="light"]{
    --bg-0:#f5f8ff;
    --bg-1:#eef2fc;
    --bg-2:#e7edfb;
    --surface:#ffffff;
    --surface-hover:#f3f6ff;
    --border:rgba(15,25,60,0.08);
    --border-strong:rgba(15,25,60,0.16);

    --text-0:#0b1023;
    --text-1:#333d5c;
    --text-2:#6b7494;

    --accent-1:#2358e6;
    --accent-2:#0ea5e9;
    --accent-3:#6d4bff;

    --shadow-glow:0 0 40px rgba(35,88,230,0.18);
    --shadow-card:0 20px 50px rgba(20,30,70,0.12);
}

/* ============ 2. RESET & BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

html{scroll-behavior:smooth;}

body{
    background:var(--bg-0);
    color:var(--text-0);
    font-family:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
    line-height:1.6;
    overflow-x:hidden;
    transition:background .4s var(--ease),color .4s var(--ease);
    cursor:default;
}

img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
input{font:inherit;color:inherit;}
ul{list-style:none;}

h1,h2,h3{
    font-family:'Space Grotesk','Inter',sans-serif;
    font-weight:700;
    letter-spacing:-0.02em;
    line-height:1.1;
}

::selection{background:var(--accent-1);color:#fff;}

:focus-visible{
    outline:2px solid var(--accent-2);
    outline-offset:3px;
    border-radius:4px;
}

.eyebrow{
    display:inline-block;
    font-size:.8rem;
    font-weight:600;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--accent-2);
    margin-bottom:.75rem;
}

section{
    position:relative;
    padding:min(10vw,110px) min(6vw,80px);
    max-width:1400px;
    margin:0 auto;
}

.section-head{
    text-align:center;
    max-width:640px;
    margin:0 auto 3rem;
}
.section-head h2{
    font-size:clamp(1.8rem,4vw,2.6rem);
    margin-bottom:.75rem;
}
.section-head__desc{color:var(--text-2);font-size:1.05rem;}

.btn{
    display:inline-flex;
    align-items:center;
    gap:.5rem;
    padding:.9rem 1.7rem;
    border-radius:100px;
    font-weight:600;
    font-size:.98rem;
    transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease);
    white-space:nowrap;
}
.btn--primary{
    background:var(--gradient-1);
    color:#fff;
    box-shadow:var(--shadow-glow);
}
.btn--primary:hover{
    transform:translateY(-3px) scale(1.02);
    box-shadow:0 0 60px rgba(46,107,255,0.55);
}
.btn__arrow{transition:transform .35s var(--ease);}
.btn--primary:hover .btn__arrow{transform:translateX(5px);}

.btn--ghost{
    background:transparent;
    color:var(--text-0);
    border:1px solid var(--border-strong);
}
.btn--ghost:hover{
    background:var(--surface-hover);
    border-color:var(--accent-2);
}

/* ============ 3. ARRIÈRE-PLAN IMMERSIF & CURSEUR ============ */
.bg-scene{
    position:fixed;
    inset:0;
    z-index:-2;
    overflow:hidden;
    pointer-events:none;
}
.bg-halo{
    position:absolute;
    border-radius:50%;
    filter:blur(90px);
    opacity:.35;
    will-change:transform;
    animation:float 18s ease-in-out infinite;
}
.bg-halo--1{
    width:44vw;height:44vw;
    top:-10%;left:-10%;
    background:radial-gradient(circle,var(--accent-1),transparent 70%);
    animation-duration:22s;
}
.bg-halo--2{
    width:38vw;height:38vw;
    bottom:-15%;right:-8%;
    background:radial-gradient(circle,var(--accent-2),transparent 70%);
    animation-duration:26s;
    animation-delay:-6s;
}
.bg-halo--3{
    width:26vw;height:26vw;
    top:40%;left:55%;
    background:radial-gradient(circle,var(--accent-3),transparent 70%);
    animation-duration:20s;
    animation-delay:-3s;
    opacity:.2;
}
@keyframes float{
    0%,100%{transform:translate(0,0) scale(1);}
    50%{transform:translate(4%,-6%) scale(1.08);}
}
#particleCanvas{position:absolute;inset:0;width:100%;height:100%;opacity:.5;}

.cursor-dot,.cursor-halo{
    position:fixed;
    top:0;left:0;
    border-radius:50%;
    pointer-events:none;
    z-index:9999;
    transform:translate(-50%,-50%);
    will-change:transform;
}
.cursor-dot{
    width:8px;height:8px;
    background:var(--accent-2);
    transition:width .2s var(--ease),height .2s var(--ease),background .2s var(--ease);
}
.cursor-halo{
    width:34px;height:34px;
    border:1px solid var(--accent-2);
    opacity:.5;
    transition:width .3s var(--ease),height .3s var(--ease),opacity .3s var(--ease),transform .08s linear;
}
.cursor-dot.is-active{width:12px;height:12px;background:#fff;}
.cursor-halo.is-active{width:54px;height:54px;opacity:.9;border-color:var(--accent-1);}

@media (hover:none), (pointer:coarse){
    .cursor-dot,.cursor-halo{display:none;}
    body{cursor:auto;}
}

/* ============ 4. NAVIGATION ============ */
.nav{
    position:fixed;
    top:0;left:0;right:0;
    z-index:900;
    height:var(--nav-h);
    display:flex;
    align-items:center;
    background:transparent;
    border-bottom:1px solid transparent;
    transition:background .4s var(--ease),border-color .4s var(--ease),backdrop-filter .4s var(--ease);
}
.nav.is-scrolled{
    background:color-mix(in srgb, var(--bg-0) 78%, transparent);
    backdrop-filter:blur(16px) saturate(140%);
    border-bottom-color:var(--border);
}
.nav__inner{
    width:100%;
    max-width:1400px;
    margin:0 auto;
    padding:0 min(6vw,48px);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
}

.logo{display:flex;align-items:center;gap:.6rem;}
.logo__mark{width:30px;height:30px;flex-shrink:0;}
.logo__mark svg{width:100%;height:100%;}
.logo__mark--small{width:26px;height:26px;}
.logo__text{display:flex;align-items:baseline;gap:.35rem;font-family:'Space Grotesk',sans-serif;}
.logo__name{font-weight:700;font-size:1.15rem;letter-spacing:-0.01em;}
.logo__version{
    font-size:.65rem;
    font-weight:700;
    color:var(--bg-0);
    background:var(--gradient-1);
    padding:.15rem .4rem;
    border-radius:6px;
}

.nav__links{display:flex;align-items:center;gap:2rem;}
.nav__link{
    font-size:.92rem;
    font-weight:500;
    color:var(--text-1);
    position:relative;
    padding:.3rem 0;
    transition:color .3s var(--ease);
}
.nav__link::after{
    content:"";
    position:absolute;
    left:0;bottom:-2px;
    width:0;height:2px;
    background:var(--gradient-1);
    transition:width .3s var(--ease);
}
.nav__link:hover{color:var(--text-0);}
.nav__link:hover::after{width:100%;}

.nav__actions{display:flex;align-items:center;gap:.9rem;}

.theme-toggle{
    position:relative;
    width:46px;height:46px;
    border-radius:50%;
    border:1px solid var(--border-strong);
    display:flex;align-items:center;justify-content:center;
    background:var(--surface);
    transition:transform .3s var(--ease),border-color .3s var(--ease);
    overflow:hidden;
}
.theme-toggle:hover{transform:rotate(-12deg) scale(1.05);border-color:var(--accent-2);}
.theme-toggle__icon{
    position:absolute;
    font-size:1.15rem;
    transition:transform .45s var(--ease),opacity .45s var(--ease);
}
.theme-toggle__icon--moon{opacity:1;transform:translateY(0) rotate(0);}
.theme-toggle__icon--sun{opacity:0;transform:translateY(20px) rotate(-40deg);}
[data-theme="light"] .theme-toggle__icon--moon{opacity:0;transform:translateY(-20px) rotate(40deg);}
[data-theme="light"] .theme-toggle__icon--sun{opacity:1;transform:translateY(0) rotate(0);}

.hamburger{
    display:none;
    width:42px;height:42px;
    border-radius:50%;
    border:1px solid var(--border-strong);
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    background:var(--surface);
}
.hamburger span{
    width:18px;height:2px;
    background:var(--text-0);
    border-radius:2px;
    transition:transform .35s var(--ease),opacity .35s var(--ease);
}
.hamburger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.is-open span:nth-child(2){opacity:0;}
.hamburger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-menu{
    display:none;
    flex-direction:column;
    background:color-mix(in srgb, var(--bg-0) 92%, transparent);
    backdrop-filter:blur(20px);
    border-bottom:1px solid var(--border);
    max-height:0;
    overflow:hidden;
    transition:max-height .45s var(--ease);
}
.mobile-menu.is-open{max-height:420px;}
.mobile-menu__link{
    padding:1.1rem min(6vw,48px);
    border-bottom:1px solid var(--border);
    font-weight:500;
}

/* ============ 5. HERO ============ */
.hero{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding-top:var(--nav-h);
    position:relative;
    overflow:hidden;
}

.hero__core{
    position:absolute;
    top:50%;left:50%;
    width:min(70vw,640px);
    height:min(70vw,640px);
    transform:translate(-50%,-50%);
    pointer-events:none;
    z-index:0;
}
.core{
    position:absolute;
    inset:0;
    border-radius:50%;
    will-change:transform;
}
.core--outer{
    background:radial-gradient(circle at 35% 30%, rgba(94,200,255,0.18), transparent 65%);
    animation:spin 40s linear infinite;
}
.core--mid{
    inset:12%;
    border:1px solid var(--border-strong);
    border-radius:50%;
    animation:spin 30s linear infinite reverse;
}
.core--inner{
    inset:32%;
    background:radial-gradient(circle at 40% 35%, var(--accent-2), var(--accent-1) 55%, transparent 100%);
    filter:blur(2px);
    box-shadow:0 0 90px rgba(46,107,255,0.55);
    animation:pulse 6s ease-in-out infinite;
}
.core__ring{
    position:absolute;
    inset:2%;
    border-radius:50%;
    border:1px dashed var(--border);
    animation:spin 60s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes pulse{
    0%,100%{transform:scale(1);opacity:.9;}
    50%{transform:scale(1.06);opacity:1;}
}

.hero__content{position:relative;z-index:1;max-width:800px;padding:0 1.5rem;}
.hero__title{
    font-size:clamp(2.6rem,8vw,5.2rem);
    background:linear-gradient(135deg,var(--text-0),var(--accent-2));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    margin-bottom:.5rem;
}
.hero__version{
    font-size:.4em;
    vertical-align:super;
    background:var(--gradient-1);
    -webkit-background-clip:text;
    background-clip:text;
}
.hero__slogan{
    font-size:clamp(1.1rem,2.4vw,1.5rem);
    font-weight:600;
    color:var(--text-0);
    margin-bottom:1.2rem;
}
.hero__desc{
    color:var(--text-2);
    font-size:1.05rem;
    max-width:560px;
    margin:0 auto 2.4rem;
}
.hero__cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}

.scroll-hint{
    position:absolute;
    bottom:2.2rem;left:50%;
    transform:translateX(-50%);
    width:26px;height:42px;
    border:2px solid var(--border-strong);
    border-radius:20px;
}
.scroll-hint span{
    display:block;
    width:4px;height:8px;
    background:var(--accent-2);
    border-radius:3px;
    margin:6px auto 0;
    animation:scrollDot 1.8s ease-in-out infinite;
}
@keyframes scrollDot{
    0%{transform:translateY(0);opacity:1;}
    70%{transform:translateY(14px);opacity:0;}
    100%{opacity:0;}
}

/* ============ 6. COMPTEURS ============ */
.stats__grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1.5rem;
}
.stat-card{
    text-align:center;
    padding:2.2rem 1rem;
    border-radius:var(--radius-md);
    background:var(--surface);
    border:1px solid var(--border);
}
.stat-card__number{
    display:block;
    font-family:'Space Grotesk',sans-serif;
    font-size:clamp(2.2rem,5vw,3.2rem);
    font-weight:700;
    background:var(--gradient-1);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.stat-card__label{color:var(--text-2);font-weight:500;}

/* ============ 7. CATÉGORIES ============ */
.categories__grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:1.3rem;
    perspective:1000px;
}
.category-card{
    position:relative;
    padding:1.8rem 1.5rem;
    border-radius:var(--radius-md);
    background:var(--surface);
    border:1px solid var(--border);
    cursor:pointer;
    overflow:hidden;
    transition:transform .45s var(--ease),border-color .45s var(--ease),box-shadow .45s var(--ease);
    transform-style:preserve-3d;
}
.category-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(94,200,255,0.16), transparent 60%);
    opacity:0;
    transition:opacity .4s var(--ease);
}
.category-card:hover{
    transform:translateY(-8px) rotateX(3deg) rotateY(-3deg);
    border-color:var(--accent-2);
    box-shadow:var(--shadow-card);
}
.category-card:hover::before{opacity:1;}
.category-card__icon{font-size:2.1rem;margin-bottom:.9rem;display:block;}
.category-card__name{font-size:1.15rem;font-weight:700;margin-bottom:.4rem;}
.category-card__desc{color:var(--text-2);font-size:.9rem;margin-bottom:1rem;min-height:2.7em;}
.category-card__count{
    display:inline-block;
    font-size:.78rem;
    font-weight:600;
    color:var(--accent-2);
    background:rgba(94,200,255,0.1);
    padding:.3rem .7rem;
    border-radius:100px;
}

/* ============ 8. CARTES DE PROMPT ============ */
.library__grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:1.3rem;
}
.prompt-card{
    padding:1.6rem;
    border-radius:var(--radius-md);
    background:var(--surface);
    border:1px solid var(--border);
    cursor:pointer;
    display:flex;
    flex-direction:column;
    gap:.7rem;
    transition:transform .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);
}
.prompt-card:hover{
    transform:translateY(-6px);
    border-color:var(--accent-2);
    box-shadow:var(--shadow-card);
}
.prompt-card__top{display:flex;align-items:center;justify-content:space-between;}
.prompt-card__icon{font-size:1.5rem;}
.prompt-card__badges{display:flex;gap:.4rem;}
.badge{
    font-size:.68rem;
    font-weight:700;
    padding:.2rem .5rem;
    border-radius:100px;
    text-transform:uppercase;
    letter-spacing:.03em;
}
.badge--new{background:rgba(94,200,255,0.15);color:var(--accent-2);}
.badge--pop{background:rgba(138,92,255,0.15);color:var(--accent-3);}
.prompt-card__title{font-size:1.05rem;font-weight:700;line-height:1.35;}
.prompt-card__cat{font-size:.75rem;color:var(--accent-2);font-weight:600;text-transform:uppercase;letter-spacing:.05em;}
.prompt-card__desc{color:var(--text-2);font-size:.9rem;flex-grow:1;}
.prompt-card__footer{display:flex;align-items:center;justify-content:space-between;margin-top:.4rem;}
.prompt-card__ai{display:flex;gap:.3rem;flex-wrap:wrap;}
.ai-chip{
    font-size:.68rem;
    padding:.2rem .5rem;
    border-radius:100px;
    background:var(--bg-1);
    border:1px solid var(--border);
    color:var(--text-2);
}
.prompt-card__open{
    font-size:.85rem;
    font-weight:600;
    color:var(--accent-2);
    display:flex;
    align-items:center;
    gap:.3rem;
}
.prompt-card--daily{cursor:default;}

/* ============ 9. BIBLIOTHÈQUE & FILTRES ============ */
.library__controls{
    display:flex;
    flex-wrap:wrap;
    gap:1rem;
    justify-content:space-between;
    align-items:center;
    margin-bottom:2rem;
}
.filters{display:flex;gap:.6rem;flex-wrap:wrap;}
.filter-btn{
    padding:.6rem 1.2rem;
    border-radius:100px;
    border:1px solid var(--border-strong);
    color:var(--text-1);
    font-weight:600;
    font-size:.88rem;
    transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.filter-btn:hover{border-color:var(--accent-2);}
.filter-btn.is-active{
    background:var(--gradient-1);
    color:#fff;
    border-color:transparent;
}
.search-wrap{flex-grow:1;max-width:320px;}
.search-input{
    width:100%;
    padding:.65rem 1rem;
    border-radius:100px;
    border:1px solid var(--border-strong);
    background:var(--surface);
    color:var(--text-0);
}
.search-input::placeholder{color:var(--text-2);}

.category-active{
    display:flex;
    align-items:center;
    gap:1rem;
    margin-bottom:1.5rem;
    padding:.7rem 1.1rem;
    border-radius:100px;
    background:var(--surface);
    border:1px solid var(--border);
    width:fit-content;
    font-size:.9rem;
}
.category-active button{color:var(--accent-2);font-weight:600;}

.library__empty{text-align:center;color:var(--text-2);padding:3rem 0;}

/* ============ 10. NOUVEAUTÉS / À PROPOS / CONTACT ============ */
.about__inner,.contact__inner{
    max-width:720px;
    margin:0 auto;
    text-align:center;
}
.about__inner h2,.contact__inner h2{
    font-size:clamp(1.7rem,4vw,2.3rem);
    margin-bottom:1.2rem;
}
.about__text{color:var(--text-1);margin-bottom:1rem;font-size:1.05rem;}
.contact__text{color:var(--text-2);margin-bottom:1.8rem;}

/* ============ 11. FOOTER ============ */
.footer{
    border-top:1px solid var(--border);
    padding:3.5rem min(6vw,80px) 0;
}
.footer__inner{
    max-width:1400px;
    margin:0 auto;
    display:flex;
    flex-wrap:wrap;
    gap:2.5rem;
    justify-content:space-between;
    padding-bottom:2.5rem;
}
.footer__brand{display:flex;gap:.7rem;align-items:flex-start;}
.footer__name{font-weight:700;font-family:'Space Grotesk',sans-serif;}
.footer__slogan{color:var(--text-2);font-size:.88rem;margin-top:.2rem;}
.footer__links{display:flex;flex-wrap:wrap;gap:1.3rem;}
.footer__links a{color:var(--text-2);font-size:.9rem;transition:color .3s var(--ease);}
.footer__links a:hover{color:var(--accent-2);}
.footer__contact a{color:var(--accent-2);font-weight:600;font-size:.9rem;}
.footer__bottom{
    max-width:1400px;
    margin:0 auto;
    padding:1.5rem 0;
    border-top:1px solid var(--border);
    text-align:center;
    color:var(--text-2);
    font-size:.82rem;
}

/* ============ 12. MODALE ============ */
.modal-overlay{
    position:fixed;
    inset:0;
    background:rgba(3,5,12,0.7);
    backdrop-filter:blur(6px);
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1.5rem;
    opacity:0;
    pointer-events:none;
    transition:opacity .35s var(--ease);
}
.modal-overlay.is-open{opacity:1;pointer-events:all;}
.modal{
    background:var(--bg-1);
    border:1px solid var(--border-strong);
    border-radius:var(--radius-lg);
    max-width:640px;
    width:100%;
    max-height:85vh;
    overflow-y:auto;
    padding:2.2rem;
    position:relative;
    transform:scale(.92) translateY(20px);
    opacity:0;
    transition:transform .4s var(--ease),opacity .4s var(--ease);
}
.modal-overlay.is-open .modal{transform:scale(1) translateY(0);opacity:1;}
.modal__close{
    position:absolute;
    top:1.2rem;right:1.2rem;
    width:36px;height:36px;
    border-radius:50%;
    background:var(--surface);
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    transition:background .3s var(--ease),transform .3s var(--ease);
}
.modal__close:hover{background:var(--surface-hover);transform:rotate(90deg);}

.modal__cat{font-size:.78rem;color:var(--accent-2);font-weight:700;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem;}
.modal__title{font-size:1.5rem;margin-bottom:.7rem;padding-right:2rem;}
.modal__desc{color:var(--text-2);margin-bottom:1.2rem;}
.modal__ai{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1.4rem;}
.modal__prompt{
    background:var(--bg-0);
    border:1px solid var(--border);
    border-radius:var(--radius-sm);
    padding:1.3rem;
    font-size:.92rem;
    line-height:1.7;
    color:var(--text-1);
    white-space:pre-wrap;
    max-height:340px;
    overflow-y:auto;
    margin-bottom:1.4rem;
}
.modal__actions{display:flex;gap:.8rem;flex-wrap:wrap;}
.modal__actions .btn{flex:1;justify-content:center;min-width:150px;}
.btn--fav.is-active{background:var(--gradient-2);color:#fff;box-shadow:var(--shadow-glow);}
.copy-confirm{
    display:inline-flex;
    align-items:center;
    gap:.4rem;
}

/* ============ 13. ASSISTANT PROSPRENT ============ */
.assistant-fab{
    position:fixed;
    bottom:1.8rem;
    right:1.8rem;
    z-index:850;
    display:flex;
    align-items:center;
    gap:.6rem;
    padding:.9rem 1.3rem;
    border-radius:100px;
    background:var(--gradient-1);
    color:#fff;
    font-weight:700;
    box-shadow:var(--shadow-glow);
    transition:transform .35s var(--ease);
}
.assistant-fab:hover{transform:translateY(-4px) scale(1.03);}
.assistant-fab__icon{font-size:1.2rem;}

.assistant-overlay{
    position:fixed;
    inset:0;
    background:rgba(3,5,12,0.7);
    backdrop-filter:blur(6px);
    z-index:1000;
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    padding:1.8rem;
    opacity:0;
    pointer-events:none;
    transition:opacity .35s var(--ease);
}
.assistant-overlay.is-open{opacity:1;pointer-events:all;}
.assistant-panel{
    width:100%;
    max-width:400px;
    max-height:78vh;
    background:var(--bg-1);
    border:1px solid var(--border-strong);
    border-radius:var(--radius-lg);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    transform:translateY(30px) scale(.95);
    opacity:0;
    transition:transform .4s var(--ease),opacity .4s var(--ease);
}
.assistant-overlay.is-open .assistant-panel{transform:translateY(0) scale(1);opacity:1;}
.assistant-panel__header{
    padding:1.2rem 1.4rem;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-weight:700;
    border-bottom:1px solid var(--border);
    background:var(--surface);
}
.assistant-panel__close{
    width:30px;height:30px;
    border-radius:50%;
    background:var(--bg-0);
    display:flex;align-items:center;justify-content:center;
}
.assistant-panel__body{
    padding:1.4rem;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
    gap:1rem;
}
.assistant-question{font-weight:600;font-size:1.02rem;}
.assistant-options{display:flex;flex-wrap:wrap;gap:.6rem;}
.assistant-option{
    padding:.65rem 1rem;
    border-radius:12px;
    border:1px solid var(--border-strong);
    font-size:.9rem;
    transition:background .3s var(--ease),border-color .3s var(--ease);
}
.assistant-option:hover{background:var(--surface-hover);border-color:var(--accent-2);}
.assistant-msg{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:var(--radius-sm);
    padding:.9rem 1rem;
    font-size:.92rem;
    color:var(--text-1);
}
.assistant-result{
    padding:.9rem 1rem;
    border-radius:var(--radius-sm);
    border:1px solid var(--border);
    background:var(--bg-0);
    cursor:pointer;
    transition:border-color .3s var(--ease);
}
.assistant-result:hover{border-color:var(--accent-2);}
.assistant-result__title{font-weight:700;font-size:.92rem;margin-bottom:.2rem;}
.assistant-result__desc{font-size:.82rem;color:var(--text-2);}
.assistant-restart{
    align-self:flex-start;
    font-size:.82rem;
    color:var(--accent-2);
    font-weight:600;
}

/* ============ 14. SURPRISE-MOI & TOAST ============ */
.surprise-fab{
    position:fixed;
    bottom:1.8rem;
    left:1.8rem;
    z-index:850;
    width:56px;height:56px;
    border-radius:50%;
    background:var(--surface);
    border:1px solid var(--border-strong);
    font-size:1.4rem;
    display:flex;align-items:center;justify-content:center;
    box-shadow:var(--shadow-card);
    transition:transform .4s var(--ease),border-color .4s var(--ease);
}
.surprise-fab:hover{transform:rotate(-14deg) scale(1.08);border-color:var(--accent-2);}
.surprise-fab.is-spinning{animation:diceSpin .9s ease-in-out;}
@keyframes diceSpin{
    0%{transform:rotate(0);}
    50%{transform:rotate(340deg) scale(1.15);}
    100%{transform:rotate(360deg);}
}

.toast{
    position:fixed;
    bottom:2rem;
    left:50%;
    transform:translate(-50%,20px);
    background:var(--gradient-1);
    color:#fff;
    padding:.85rem 1.4rem;
    border-radius:100px;
    font-weight:600;
    font-size:.9rem;
    box-shadow:var(--shadow-glow);
    z-index:1100;
    opacity:0;
    pointer-events:none;
    transition:transform .4s var(--ease),opacity .4s var(--ease);
}
.toast.is-visible{opacity:1;transform:translate(-50%,0);}

/* ============ 15. ANIMATIONS & REVEAL ============ */
.reveal{
    opacity:0;
    transform:translateY(24px);
    transition:opacity .8s var(--ease),transform .8s var(--ease);
}
.reveal.is-visible{opacity:1;transform:translateY(0);}

@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{
        animation-duration:.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.001ms !important;
        scroll-behavior:auto !important;
    }
    .reveal{opacity:1;transform:none;}
}

/* ============ 16. RESPONSIVE ============ */
@media (max-width:960px){
    .nav__links{display:none;}
    .hamburger{display:flex;}
    .mobile-menu{display:flex;}
    .stats__grid{grid-template-columns:1fr;}
}

@media (max-width:640px){
    section{padding:70px 5vw;}
    .hero{padding-top:calc(var(--nav-h) + 20px);}
    .hero__cta{flex-direction:column;width:100%;}
    .hero__cta .btn{width:100%;justify-content:center;}
    .assistant-fab__label{display:none;}
    .assistant-fab{padding:1rem;border-radius:50%;}
    .surprise-fab{width:50px;height:50px;bottom:1.2rem;left:1.2rem;}
    .assistant-fab{bottom:1.2rem;right:1.2rem;}
    .assistant-overlay{padding:0;align-items:flex-end;}
    .assistant-panel{max-width:100%;max-height:80vh;border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
    .library__controls{flex-direction:column;align-items:stretch;}
    .search-wrap{max-width:none;}
    .modal{padding:1.5rem;max-height:90vh;}
    .core--outer{filter:blur(2px);}
}

@media (min-width:1600px){
    section{padding-left:0;padding-right:0;}
}