
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');
:root{--fx-bg:#050506;--fx-panel:rgba(15,15,18,.86);--fx-line:rgba(255,255,255,.10);--fx-line2:rgba(255,255,255,.18);--fx-text:#f5f2ed;--fx-muted:#92929c;--fx-red:#e30613;--fx-blue:#4f78ff;--fx-green:#3ed484;--fx-ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}
body.fx-page{background:var(--fx-bg)!important;color:var(--fx-text)!important;font-family:Inter,sans-serif!important}
body.fx-page::before{content:"";position:fixed;inset:0;z-index:-6;background:radial-gradient(circle at 12% 8%,rgba(227,6,19,.17),transparent 28%),radial-gradient(circle at 88% 18%,rgba(79,120,255,.09),transparent 28%),#050506}
.fx-grid{position:fixed;inset:44% -20% -30%;z-index:-5;opacity:.095;pointer-events:none;transform:perspective(720px) rotateX(70deg);background-image:linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(transparent,#000 20%,transparent 94%)}
.fx-grain{position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.03;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
.fx-page .btn-neon,.fx-page .logout-btn,.fx-page .download-btn,.fx-page .chat-btn,.fx-page .bpm-btn{
 border:1px solid var(--fx-line2)!important;border-radius:999px!important;background:rgba(255,255,255,.025)!important;color:var(--fx-text)!important;font-family:Inter,sans-serif!important;text-transform:none!important;letter-spacing:0!important;transition:.35s var(--fx-ease)!important
}
.fx-page .btn-neon:hover,.fx-page .logout-btn:hover,.fx-page .download-btn:hover,.fx-page .chat-btn:hover,.fx-page .bpm-btn:hover{
 background:var(--fx-red)!important;border-color:var(--fx-red)!important;color:#fff!important;box-shadow:0 14px 36px rgba(227,6,19,.22)!important;transform:translateY(-2px)
}
.fx-page input,.fx-page select,.fx-page textarea{border:1px solid var(--fx-line2)!important;border-radius:14px!important;background:rgba(0,0,0,.35)!important;color:#fff!important;font-family:Inter,sans-serif!important}
.fx-page input:focus,.fx-page select:focus,.fx-page textarea:focus{border-color:var(--fx-red)!important;box-shadow:0 0 0 4px rgba(227,6,19,.1)!important}
.fx-page footer{border-top:1px solid var(--fx-line)!important;background:#070708!important}
.fx-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s var(--fx-ease),transform .65s var(--fx-ease)}.fx-reveal.visible{opacity:1;transform:none}

/* HUB OUTILS */
body.tools-page{padding-bottom:110px!important}
.tools-page .hero-mini{height:auto!important;min-height:54svh!important;padding:140px 20px 70px!important;margin-top:0!important;align-items:flex-start!important;text-align:left!important;border-bottom:1px solid var(--fx-line)!important}
.tools-page .hero-mini::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,6,.96),rgba(5,5,6,.38) 70%,rgba(5,5,6,.8)),radial-gradient(circle at 78% 38%,rgba(227,6,19,.22),transparent 30%)}
.tools-page .hero-mini>div{width:min(1200px,92vw);margin:auto!important}
.tools-page .hero-mini h1{font:700 clamp(48px,8vw,105px)/.94 Space Grotesk!important;letter-spacing:-.05em;text-transform:none!important}
.tools-page .hero-mini .tagline{font:600 10px JetBrains Mono!important;letter-spacing:.15em!important;text-transform:uppercase;margin-top:20px!important}
.tools-page .tools-section{width:min(1200px,92vw)!important;max-width:none!important;padding:78px 0!important}
.tools-page .tools-grid{grid-template-columns:repeat(12,1fr)!important;gap:22px!important}
.tools-page .tool-card{grid-column:span 6;min-height:330px;align-items:flex-start!important;text-align:left!important;padding:34px!important;border:1px solid var(--fx-line)!important;border-radius:24px!important;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.01))!important;box-shadow:0 28px 75px rgba(0,0,0,.32)!important;overflow:hidden}
.tools-page .tool-card::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.06),transparent 70%);transform:translateX(-120%);transition:.9s var(--fx-ease)}.tools-page .tool-card:hover::before{transform:translateX(120%)}
.tools-page .tool-icon{width:74px;height:74px;border:1px solid rgba(227,6,19,.35);border-radius:22px;display:grid;place-items:center;background:rgba(227,6,19,.08);font-size:31px!important;margin-bottom:28px!important}
.tools-page .tool-title{font:700 30px Space Grotesk!important;text-transform:none!important}.tools-page .tool-desc{font-size:15px!important;line-height:1.7!important;color:var(--fx-muted)!important;max-width:520px}.tools-page .btn-neon{margin-top:auto}
.tools-page .tool-card.disabled{opacity:.45}.tools-page .hud-corner::before,.tools-page .hud-corner::after{display:none}

/* BPM */
body.bpm-page{padding-bottom:110px!important}
.bpm-page .analyzer-container{min-height:100svh;padding:135px 20px 75px!important;position:relative}
.bpm-page .analyzer-container::before{content:"";position:absolute;width:58vw;height:58vw;right:-18vw;top:-15vw;border:1px solid rgba(227,6,19,.14);border-radius:50%;animation:fxSpin 24s linear infinite}
@keyframes fxSpin{to{transform:rotate(360deg)}}
.bpm-page .hud-box{width:min(920px,94vw)!important;max-width:none!important;padding:clamp(24px,5vw,48px)!important;border:1px solid var(--fx-line)!important;border-radius:28px!important;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.012))!important;box-shadow:0 36px 110px rgba(0,0,0,.48)!important;backdrop-filter:blur(20px)}
.bpm-page .hud-corner::before,.bpm-page .hud-corner::after{display:none}
.bpm-page h1.scanner-title{font:700 clamp(42px,7vw,76px)/.95 Space Grotesk!important;text-transform:none!important;letter-spacing:-.05em;margin:0 0 12px!important}
.bpm-page .subtitle{font:600 10px JetBrains Mono!important;text-transform:uppercase;letter-spacing:.13em!important;margin-bottom:34px!important}
.bpm-page .drop-zone{min-height:280px;border:1px dashed rgba(255,255,255,.24)!important;border-radius:23px!important;background:rgba(255,255,255,.015)!important;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:36px!important}
.bpm-page .drop-zone:hover,.bpm-page .drop-zone.dragover{border-color:var(--fx-red)!important;background:rgba(227,6,19,.055)!important;box-shadow:inset 0 0 50px rgba(227,6,19,.07)!important}
.bpm-page .drop-icon{width:80px;height:80px;border:1px solid rgba(227,6,19,.35);border-radius:24px;display:grid!important;place-items:center;background:rgba(227,6,19,.08);font-size:32px!important;color:var(--fx-red)!important}
.bpm-page .drop-text{font:600 15px Space Grotesk!important;text-transform:none!important;line-height:1.55!important}
.bpm-page .results-grid{gap:16px!important}.bpm-page .data-panel{min-height:190px;border:1px solid var(--fx-line)!important;border-radius:20px!important;background:rgba(0,0,0,.26)!important}.bpm-page .data-label{font:500 9px JetBrains Mono!important;text-transform:uppercase;letter-spacing:.1em!important;color:var(--fx-muted)!important}.bpm-page .data-value{font:700 clamp(42px,7vw,72px) Space Grotesk!important;color:var(--fx-text)!important;text-shadow:none!important}.bpm-page .data-panel:first-child .data-value{color:var(--fx-red)!important}

/* ESPACE MEMBRE */
body.member-page{min-height:100svh!important;overflow:auto!important;padding:90px 20px!important;display:grid!important;place-items:center!important}
.member-page .auth-container{width:min(980px,96vw)!important;max-width:none!important;padding:0!important;border:1px solid var(--fx-line)!important;border-radius:28px!important;background:linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.012))!important;box-shadow:0 36px 120px rgba(0,0,0,.5)!important;display:grid;grid-template-columns:.9fr 1.1fr;overflow:hidden}
.member-page .auth-container::before,.member-page .auth-container::after{display:none}
.member-page .brand-logo{margin:0!important;padding:45px!important;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;text-align:left!important;background:radial-gradient(circle at 30% 20%,rgba(227,6,19,.22),transparent 35%),#09090b;min-height:570px}
.member-page .brand-logo img{width:75px!important;margin:0 0 auto!important}.member-page .brand-title{font:700 clamp(36px,5vw,62px)/.95 Space Grotesk!important;letter-spacing:-.04em!important;text-transform:none}.member-page .brand-title::after{content:"Connexion et création de compte";display:block;margin-top:16px;font:500 11px JetBrains Mono;color:var(--fx-muted);letter-spacing:.08em}
.member-page .auth-container>form,.member-page .accordion-header,.member-page .accordion-content,.member-page .back-link{grid-column:2;padding-left:42px;padding-right:42px}
.member-page .auth-container>form{padding-top:52px}.member-page .input-group{margin-bottom:15px!important}.member-page .btn-neon{min-height:50px!important}
.member-page .accordion-header{margin:26px 0 0!important;padding-top:22px!important;border-top:1px solid var(--fx-line)!important;color:var(--fx-muted)!important;text-transform:none!important;font-weight:600}.member-page .accordion-content.open{max-height:620px!important;padding-top:18px!important}.member-page .back-link{padding-bottom:35px!important;color:var(--fx-muted)!important}
.member-page .system-alert{top:22px!important;border-radius:16px!important;background:rgba(12,12,15,.95)!important;backdrop-filter:blur(18px);box-shadow:0 20px 65px rgba(0,0,0,.45)!important}

/* DASHBOARD */
body.dashboard-page{padding-bottom:110px!important}
.dashboard-page>header{height:78px!important;background:rgba(8,8,10,.84)!important;border-bottom:1px solid var(--fx-line)!important;backdrop-filter:blur(20px)!important}.dashboard-page>header .brand span{font-family:Space Grotesk!important;text-transform:none!important}.dashboard-page .dashboard-container{width:min(1220px,94vw)!important;max-width:none!important;margin:120px auto 60px!important;padding:0!important;gap:58px!important}
.dashboard-page .dashboard-container::before{content:"Espace membre";font:600 10px JetBrains Mono;color:var(--fx-red);letter-spacing:.13em;text-transform:uppercase}
.dashboard-page .section-title{border:0!important;padding:0!important;margin-bottom:24px!important;font:700 clamp(25px,4vw,40px) Space Grotesk!important;text-transform:none!important}.dashboard-page .section-title>span:last-child{font:500 9px JetBrains Mono!important}
.dashboard-page .hud-border,.dashboard-page .sound-card,.dashboard-page .ticket-list,.dashboard-page .ticket-chat,.dashboard-page #noChatSelect{border:1px solid var(--fx-line)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.01))!important;box-shadow:0 25px 70px rgba(0,0,0,.25)!important}.dashboard-page .hud-border::before,.dashboard-page .hud-border::after{display:none}
.dashboard-page .resa-scroll{gap:15px!important;scroll-snap-type:x mandatory;scrollbar-width:none}.dashboard-page .resa-scroll::-webkit-scrollbar{display:none}.dashboard-page .resa-card{min-width:310px!important;border-radius:20px!important;padding:24px!important;scroll-snap-align:start}.dashboard-page .resa-date{font:700 25px Space Grotesk!important}.dashboard-page .resa-time{color:var(--fx-red)!important;font-family:JetBrains Mono!important}.dashboard-page .resa-details{line-height:1.7!important}
.dashboard-page .sounds-grid{gap:15px!important}.dashboard-page .sound-card{padding:18px!important}.dashboard-page .ticket-panel{gap:15px!important}.dashboard-page .ticket-item{border-bottom:1px solid var(--fx-line)!important;border-radius:12px;margin:6px!important}.dashboard-page .ticket-item.active{border-left:0!important;background:rgba(227,6,19,.1)!important;box-shadow:inset 3px 0 var(--fx-red)}.dashboard-page .msg{border-radius:16px!important}.dashboard-page .msg-me{background:rgba(255,255,255,.06)!important}.dashboard-page .msg-admin{background:rgba(227,6,19,.08)!important}.dashboard-page .chat-input{border-top:1px solid var(--fx-line)!important;background:rgba(0,0,0,.3)!important}.dashboard-page .popup-overlay{backdrop-filter:blur(15px)}.dashboard-page .popup-box{border:1px solid var(--fx-line2)!important;border-radius:22px!important;background:#101013!important}

/* VISITE */
body.tour-page{background:#000!important}
.tour-page #tour-wrapper{background:#000!important;scroll-behavior:smooth;scroll-snap-type:x proximity}.tour-page #scene-image{filter:saturate(.88) contrast(1.04);cursor:grab!important}.tour-page #scene-image:active{cursor:grabbing!important}
.tour-page .hotspot{filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}.tour-page .hs-nav,.tour-page .hs-info{border:1px solid rgba(255,255,255,.45)!important;background:rgba(8,8,10,.58)!important;backdrop-filter:blur(14px);box-shadow:0 0 0 8px rgba(255,255,255,.035),0 0 24px rgba(227,6,19,.22)!important}.tour-page .hs-info{border-color:rgba(79,120,255,.7)!important;color:#9bb1ff!important}.tour-page .hs-label{top:118%!important;padding:7px 10px!important;border:1px solid var(--fx-line2)!important;border-radius:999px!important;background:rgba(5,5,6,.8)!important;backdrop-filter:blur(12px);font:600 8px JetBrains Mono!important;letter-spacing:.08em}
.tour-page .ui-layer{bottom:82px!important;width:min(650px,calc(100% - 24px))!important;left:50%!important;transform:translateX(-50%)!important;padding:18px 20px!important;border:1px solid var(--fx-line)!important;border-radius:22px!important;background:rgba(8,8,10,.76)!important;backdrop-filter:blur(20px) saturate(140%);box-shadow:0 20px 65px rgba(0,0,0,.45)!important}.tour-page .room-title{font:700 clamp(21px,5vw,32px) Space Grotesk!important;text-transform:none!important;text-shadow:none!important}.tour-page .room-desc{font-size:12px!important;color:var(--fx-muted)!important}.tour-page .btn-quit{border:1px solid var(--fx-line2)!important;border-radius:999px!important;background:rgba(255,255,255,.03)!important;padding:9px 17px!important;font:600 10px Inter!important}
.tour-page .modal-overlay{background:rgba(0,0,0,.86)!important;backdrop-filter:blur(18px)!important}.tour-page .modal-box{border:1px solid var(--fx-line2)!important;border-radius:24px!important;background:#101013!important;overflow:hidden!important;box-shadow:0 35px 110px rgba(0,0,0,.65)!important}.tour-page .modal-img{height:260px!important}.tour-page .modal-content{padding:25px!important}.tour-page .modal-title{font:700 25px Space Grotesk!important;text-transform:none!important;color:#fff!important}.tour-page .close-modal{border-radius:50%!important;border:1px solid var(--fx-line2)!important;background:rgba(0,0,0,.6)!important}.tour-page #swipe-hint{font:600 10px JetBrains Mono!important;letter-spacing:.1em!important;text-transform:uppercase}
.tour-scene-nav{position:fixed;top:92px;left:50%;transform:translateX(-50%);z-index:150;display:flex;gap:8px;padding:8px;border:1px solid var(--fx-line);border-radius:999px;background:rgba(8,8,10,.68);backdrop-filter:blur(18px)}.tour-scene-nav button{width:34px;height:34px;border:1px solid var(--fx-line);border-radius:50%;background:transparent;color:var(--fx-muted);font:600 9px JetBrains Mono}.tour-scene-nav button.active{background:var(--fx-red);border-color:var(--fx-red);color:#fff;box-shadow:0 0 18px rgba(227,6,19,.35)}

@media(max-width:760px){
 .tools-page .tools-grid{display:block!important}.tools-page .tool-card{margin-bottom:15px}
 .member-page{padding:20px 12px 95px!important}.member-page .auth-container{grid-template-columns:1fr!important}.member-page .brand-logo{min-height:235px;padding:25px!important}.member-page .brand-logo img{width:55px!important}.member-page .brand-title{font-size:38px!important}.member-page .auth-container>form,.member-page .accordion-header,.member-page .accordion-content,.member-page .back-link{grid-column:1;padding-left:22px;padding-right:22px}.member-page .auth-container>form{padding-top:28px}
 .dashboard-page .dashboard-container{margin-top:100px!important}.dashboard-page .ticket-panel{grid-template-columns:1fr!important;height:auto!important}.dashboard-page .ticket-list{height:180px!important}.dashboard-page .ticket-chat{height:430px!important}.dashboard-page .resa-card{min-width:82vw!important}
 .tour-page .ui-layer{bottom:calc(78px + env(safe-area-inset-bottom))!important}.tour-page .modal-overlay{align-items:flex-end!important;padding:10px!important}.tour-page .modal-box{max-height:75svh!important;border-radius:24px 24px 12px 12px!important}.tour-scene-nav{top:78px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.fx-reveal{opacity:1;transform:none}}
