body{margin:0;background:#0B0A10}
a{color:#C6FF3D}a:hover{color:#E4FF9A}
.tab{appearance:none;border:1px solid #2A2735;background:transparent;color:#E9E6F2;font:600 14px Manrope,system-ui,sans-serif;padding:12px 18px;border-radius:999px;cursor:pointer;min-height:44px}
.tab:hover{border-color:#C6FF3D}
.tab-on{background:#C6FF3D;color:#0B0A10;border-color:#C6FF3D}
.blink{animation:blink 1.1s ease-in-out infinite;background:#FF3DA8;border-color:#FF3DA8;color:#0B0A10;font-weight:800}
@keyframes blink{0%,100%{box-shadow:0 0 0 0 rgba(255,61,168,.7);opacity:1}50%{box-shadow:0 0 0 10px rgba(255,61,168,0);opacity:.55}}
.banner{animation:glow 1.6s ease-in-out infinite}
@keyframes glow{0%,100%{border-color:#FF3DA8}50%{border-color:#C6FF3D}}
.tab,.row,.btn,.banner,.pbtn,.langsel{transition:transform .25s ease,background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease}
.tab:hover,.btn:hover,.pbtn:hover,.langsel:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(198,255,61,.18)}
.row:hover{transform:translateX(4px)}
[dir=rtl] .row:hover{transform:translateX(-4px)}
.banner:hover{transform:scale(1.01)}
.tab:active,.btn:active,.row:active,.pbtn:active{transform:scale(.96)}
.tab:focus-visible,.btn:focus-visible,.row:focus-visible,.pbtn:focus-visible,.banner:focus-visible,.langsel:focus-visible{outline:2px solid #C6FF3D;outline-offset:3px}
.pbtn{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:999px;border:1px solid #2A2735;background:transparent;color:#E9E6F2;cursor:pointer;padding:0}
.pbtn:hover{border-color:#C6FF3D;color:#C6FF3D}
.pbtn-main{width:40px;height:40px;background:#C6FF3D;border-color:#C6FF3D;color:#0B0A10}
.pbtn-main:hover{background:#E4FF9A;color:#0B0A10}
[dir=rtl] .flip svg{transform:scaleX(-1)}
.langsel{appearance:none;-webkit-appearance:none;border:1px solid #2A2735;background:#0F0E15;color:#E9E6F2;font:600 14px Manrope,system-ui,sans-serif;padding:0 36px 0 38px;border-radius:999px;cursor:pointer;min-height:44px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23C6FF3D' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23B7B2C6' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat,no-repeat;background-position:14px center,right 14px center}
.langsel:hover{border-color:#C6FF3D}
.langsel option{background:#14121C;color:#E9E6F2}
.eq{display:inline-flex;gap:3px;align-items:flex-end;height:14px}
.eq i{display:block;width:3px;height:4px;background:#C6FF3D;border-radius:2px}
.eq-on i{animation:eq .9s ease-in-out infinite}
.eq-on i:nth-child(2){animation-delay:.2s}.eq-on i:nth-child(3){animation-delay:.4s}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}
.stage{width:300px;height:300px;max-width:100%;perspective:900px}
.spin{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:spin3d 9s linear infinite}
.lg{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:visible}
.l1{transform:translateZ(-24px);opacity:.35;filter:drop-shadow(0 0 18px #FF3DA8)}
.l2{transform:translateZ(-12px);opacity:.55;filter:drop-shadow(0 0 10px #C6FF3D)}
.l3{transform:translateZ(0);filter:drop-shadow(0 0 14px rgba(255,255,255,.35))}
.hero-glow{position:absolute;inset:-80px;z-index:0;pointer-events:none;background:url(/assets/hero.jpg) center 70%/cover no-repeat;animation:glowhue 22s linear infinite,glowdrift 16s ease-in-out infinite alternate}
@keyframes glowhue{from{filter:blur(48px) saturate(1.8) brightness(.55) hue-rotate(0deg)}to{filter:blur(48px) saturate(1.8) brightness(.55) hue-rotate(360deg)}}
@keyframes glowdrift{from{transform:scale(1.15) translate(0,0)}to{transform:scale(1.3) translate(-4%,3%)}}
.hero-shade{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(11,10,16,.72) 0%,rgba(11,10,16,.35) 60%,rgba(11,10,16,.15) 100%)}
[dir=rtl] .hero-shade{background:linear-gradient(270deg,rgba(11,10,16,.72) 0%,rgba(11,10,16,.35) 60%,rgba(11,10,16,.15) 100%)}
.hero-photo{-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
@keyframes spin3d{0%{transform:rotateX(14deg) rotateY(0deg)}50%{transform:rotateX(-10deg) rotateY(180deg)}100%{transform:rotateX(14deg) rotateY(360deg)}}
.day{appearance:none;aspect-ratio:1/1;min-height:44px;border-radius:12px;border:1px solid #2A2735;background:#14121C;color:#E9E6F2;font:700 15px Manrope,system-ui,sans-serif;cursor:pointer;transition:transform .2s ease,background-color .2s ease,border-color .2s ease}
.day-free:hover{border-color:#C6FF3D;transform:translateY(-2px)}
.day-booked{background:#2A1220;border-color:#5A1F3E;color:#C98AAA;cursor:not-allowed;text-decoration:line-through}
.day-off{background:transparent;border-color:#1A1822;color:#5E5970;cursor:not-allowed}
.day-sel{background:#C6FF3D;border-color:#C6FF3D;color:#0B0A10}
.fld{display:flex;flex-direction:column;gap:6px;font-size:14px;color:#B7B2C6}
.inp{background:#0F0E15;border:1px solid #2A2735;border-radius:12px;color:#E9E6F2;font:500 15px Manrope,system-ui,sans-serif;padding:12px 14px;min-height:44px;box-sizing:border-box;width:100%;transition:border-color .2s ease}
.inp:focus{outline:none;border-color:#C6FF3D}
.psy-bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.35;animation:hue 20s linear infinite}
.psy-bg i{position:absolute;display:block;border-radius:50%;filter:blur(80px)}
.b1{width:45vmax;height:45vmax;background:#FF3DA8;top:-15vmax;left:-12vmax;animation:drift1 22s ease-in-out infinite}
.b2{width:50vmax;height:50vmax;background:#7B3DFF;bottom:-22vmax;right:-14vmax;animation:drift2 27s ease-in-out infinite}
.b3{width:28vmax;height:28vmax;background:#C6FF3D;top:35%;left:45%;opacity:.55;animation:drift3 33s ease-in-out infinite}
@keyframes hue{from{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(18vw,14vh) scale(1.2)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-16vw,-18vh) scale(.85)}}
@keyframes drift3{0%,100%{transform:translate(0,0)}33%{transform:translate(-22vw,10vh)}66%{transform:translate(12vw,-16vh)}}
.psy-text{background:linear-gradient(90deg,#C6FF3D,#3DFFE0,#FF3DA8,#B07DFF,#C6FF3D);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flow 6s linear infinite}
@keyframes flow{to{background-position:300% 0}}
.stage{position:relative}
.rings{position:absolute;left:-10%;top:-10%;width:120%;height:120%;animation:rot 28s linear infinite;pointer-events:none}
.rings2{animation-direction:reverse;animation-duration:19s}
@keyframes rot{to{transform:rotate(360deg)}}
.follow{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .18s ease-out}
.stage[data-track="1"] .spin{animation:none;transform:none}
.stage{cursor:crosshair;touch-action:pan-y}
.stage:hover .rings{animation-duration:6s}
.card{transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.card:hover{transform:translateY(-6px) rotate(-.6deg);border-color:#FF3DA8;box-shadow:0 14px 40px rgba(255,61,168,.22),0 0 0 1px rgba(198,255,61,.25) inset}
.card:hover:nth-child(even){transform:translateY(-6px) rotate(.6deg);border-color:#C6FF3D;box-shadow:0 14px 40px rgba(198,255,61,.2)}
@media (prefers-reduced-motion:reduce){.blink,.banner,.spin,.eq-on i,.psy-bg,.psy-bg i,.psy-text,.rings{animation:none}.hero-glow{animation:none;filter:blur(48px) saturate(1.8) brightness(.55);transform:scale(1.15)}.tab,.row,.btn,.banner,.pbtn,.day,.inp,.card,.langsel{transition:none}}
.row{appearance:none;width:100%;text-align:start;display:flex;gap:16px;align-items:center;padding:14px 16px;border-radius:14px;border:1px solid #2A2735;background:#14121C;color:#E9E6F2;cursor:pointer;font:500 15px Manrope,system-ui,sans-serif;min-height:56px}
.row:hover{border-color:#C6FF3D}
.row-on{border-color:#C6FF3D;background:#1B2310}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:999px;font:700 15px Manrope,system-ui,sans-serif;text-decoration:none}
.btn-acid{background:#C6FF3D;color:#0B0A10}.btn-acid:hover{background:#E4FF9A;color:#0B0A10}
.btn-ghost{border:1px solid #3A3648;color:#E9E6F2}.btn-ghost:hover{border-color:#C6FF3D;color:#C6FF3D}
.btn-pink{background:#FF3DA8;color:#0B0A10}.btn-pink:hover{background:#FF7DC4;color:#0B0A10}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
img,video{max-width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid #2A2735;background:#0F0E15;color:#E9E6F2;font:600 14px Manrope,system-ui,sans-serif;text-decoration:none;transition:transform .25s ease,border-color .25s ease,color .25s ease}
.chip:hover{border-color:#C6FF3D;color:#C6FF3D;transform:translateY(-2px)}
.fan{margin-top:64px;padding:36px 32px;border-radius:28px;background:linear-gradient(135deg,#1A0F17,#120F1E 60%,#0F1A10);border:1px solid #2A2735;display:flex;flex-wrap:wrap;gap:24px 40px;align-items:center;justify-content:space-between}
.fan form{display:flex;flex-wrap:wrap;gap:10px;flex:1 1 380px;min-width:0}
.fan .inp{flex:1 1 220px;width:auto}
.fan-msg{flex-basis:100%;margin:0;font-size:14px;min-height:1.4em}
.fan-ok{color:#C6FF3D}.fan-err{color:#FF7DC4}
@media (prefers-reduced-motion:reduce){.chip{transition:none}html{scroll-behavior:auto}}
/* phones: one swipeable row of tabs instead of three stacked rows inside the sticky header */
@media (max-width:760px){
  #nav{flex-wrap:nowrap!important;overflow-x:auto;width:100%;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px;mask-image:linear-gradient(90deg,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}
  [dir=rtl] #nav{mask-image:linear-gradient(270deg,#000 88%,transparent);-webkit-mask-image:linear-gradient(270deg,#000 88%,transparent)}
  #nav::-webkit-scrollbar{display:none}
  #nav .tab,#nav .langsel{flex:none}
  #nav .tab{padding:10px 16px}
}
