:root{--teal:#0f766e;--cyan:#06b6d4;--sky:#0ea5e9;--green:#10b981}
*{font-family:Vazirmatn,Tahoma,sans-serif}
body{margin:0;min-height:100vh;background:linear-gradient(160deg,#ecfdf5 0%,#e0f7fa 45%,#e0f2fe 100%);color:#0f3b3a;overflow-x:hidden}
.bubbles{position:fixed;inset:0;pointer-events:none;z-index:0}
.bubbles span{position:absolute;bottom:-80px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.9),rgba(6,182,212,.15));animation:rise linear infinite}
.bubbles span:nth-child(1){left:8%;width:40px;height:40px;animation-duration:18s}
.bubbles span:nth-child(2){left:25%;width:18px;height:18px;animation-duration:12s;animation-delay:3s}
.bubbles span:nth-child(3){left:48%;width:60px;height:60px;animation-duration:24s;animation-delay:1s}
.bubbles span:nth-child(4){left:66%;width:24px;height:24px;animation-duration:15s;animation-delay:6s}
.bubbles span:nth-child(5){left:82%;width:36px;height:36px;animation-duration:20s;animation-delay:2s}
.bubbles span:nth-child(6){left:93%;width:14px;height:14px;animation-duration:11s;animation-delay:5s}
@keyframes rise{to{transform:translateY(-115vh);opacity:0}}
.glass{background:rgba(255,255,255,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.wave{animation:waveMove 9s linear infinite}
@keyframes waveMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.pulse-dot{animation:pd 1.6s ease-out infinite}
@keyframes pd{0%{box-shadow:0 0 0 0 rgba(16,185,129,.7)}100%{box-shadow:0 0 0 12px rgba(16,185,129,0)}}
.eq span{display:inline-block;width:4px;margin:0 1.5px;background:linear-gradient(#22d3ee,#0ea5e9);border-radius:2px;height:6px}
.eq.on span{animation:eq .9s ease-in-out infinite alternate}
.eq.on span:nth-child(2){animation-delay:.2s}.eq.on span:nth-child(3){animation-delay:.4s}.eq.on span:nth-child(4){animation-delay:.1s}.eq.on span:nth-child(5){animation-delay:.3s}
@keyframes eq{from{height:4px}to{height:28px}}
.acc{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s ease}
.acc.open{grid-template-rows:1fr}
.acc>div{overflow:hidden}
.ripple{position:absolute;inset:0;border-radius:9999px;border:3px solid #22d3ee;animation:rip 1s ease-out forwards;pointer-events:none}
@keyframes rip{from{transform:scale(1);opacity:1}to{transform:scale(2.2);opacity:0}}
.fade-in{animation:fi .6s ease both}
@keyframes fi{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.glow{box-shadow:0 0 0 2px #22d3ee,0 6px 24px rgba(6,182,212,.35)}
input[type=range]{accent-color:#06b6d4}
.scroll::-webkit-scrollbar{width:6px}.scroll::-webkit-scrollbar-thumb{background:#99f6e4;border-radius:3px}