:root{--ocean-dark: #0a1628;--ocean-mid: #0d2847;--ocean-light: #1a4a7a;--coral-pink: #FF6B9D;--coral-orange: #FF6B35;--coral-purple: #9B59B6;--sand: #f5e6d3;--text-primary: #e8f4ff;--text-secondary: rgba(232, 244, 255, .7);--card-bg: rgba(15, 35, 65, .85)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.6}.ocean{min-height:100vh;background:linear-gradient(180deg,#0a1628,#0d2847,#1a4a7a 60%,#2d6a9f,#4a90c4);position:relative;overflow:hidden;padding:2rem;display:flex;flex-direction:column;align-items:center}.bubbles{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.bubble{position:absolute;bottom:-20px;width:calc(8px + var(--i) * 3px);height:calc(8px + var(--i) * 3px);background:radial-gradient(circle at 30% 30%,#fff6,#ffffff1a);border-radius:50%;animation:rise calc(6s + var(--i) * 1.5s) infinite;left:calc(5% + var(--i) * 8%);animation-delay:calc(var(--i) * -.8s)}@keyframes rise{0%{transform:translateY(0) scale(1);opacity:.6}50%{opacity:.8}to{transform:translateY(-110vh) scale(.3);opacity:0}}.content{position:relative;z-index:1;max-width:900px;width:100%}.header{text-align:center;margin-bottom:2.5rem;animation:fadeInDown 1s ease-out}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.tag{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.7rem;letter-spacing:.25em;text-transform:uppercase;color:var(--coral-pink);border:1px solid rgba(255,107,157,.4);padding:.3rem .8rem;border-radius:2rem;margin-bottom:1rem;background:#ff6b9d1a}.title{font-size:clamp(2.5rem,6vw,4rem);font-weight:700;letter-spacing:-.03em;color:var(--text-primary);margin-bottom:.5rem;text-shadow:0 2px 20px rgba(0,0,0,.3)}.coral-text{background:linear-gradient(135deg,var(--coral-pink),var(--coral-orange),var(--coral-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{font-size:1.15rem;color:var(--text-secondary);font-style:italic;letter-spacing:.05em}.coral-card{background:var(--card-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:1.5rem;overflow:hidden;margin-bottom:2.5rem;animation:fadeInUp 1s ease-out .3s both;box-shadow:0 20px 60px #0000004d}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.coral-illustration{background:linear-gradient(135deg,#1a4a7a80,#0d2847cc);padding:1.5rem;display:flex;justify-content:center;border-bottom:1px solid rgba(255,255,255,.05)}.coral-svg{width:100%;max-width:400px;height:auto}.fan-coral{transform-origin:bottom center;animation:sway 4s ease-in-out infinite}.branch-coral{transform-origin:bottom center;animation:sway 5s ease-in-out infinite reverse}.brain-coral{animation:pulse 3s ease-in-out infinite}@keyframes sway{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.polyp{animation:polypBloom 2s ease-in-out infinite}.polyp:nth-child(2){animation-delay:.5s}.polyp:nth-child(3){animation-delay:1s}@keyframes polypBloom{0%,to{r:5;opacity:.8}50%{r:7;opacity:1}}.grass-blade{transform-origin:bottom center;animation:grassSway 3s ease-in-out infinite}.grass-blade:nth-child(2){animation-delay:.3s;animation-duration:3.5s}.grass-blade:nth-child(3){animation-delay:.6s;animation-duration:2.8s}@keyframes grassSway{0%,to{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}.fish{animation:swim 8s ease-in-out infinite}.fish-2{animation:swimReverse 10s ease-in-out infinite}@keyframes swim{0%{transform:translate(0)}25%{transform:translate(-10px,5px)}50%{transform:translate(-5px,-5px)}75%{transform:translate(5px,3px)}to{transform:translate(0)}}@keyframes swimReverse{0%{transform:translate(0)}25%{transform:translate(8px,-4px)}50%{transform:translate(5px,6px)}75%{transform:translate(-3px,-3px)}to{transform:translate(0)}}.text-content{padding:2rem 2.5rem}.text-content p{color:var(--text-secondary);font-size:1.05rem;margin-bottom:1.25rem;line-height:1.8}.text-content p:last-child{margin-bottom:0}.text-content strong{color:var(--text-primary);font-weight:600}.text-content em{color:var(--coral-pink);font-style:italic}.highlight{color:var(--coral-orange);font-weight:500;position:relative}.highlight:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--coral-orange),transparent);border-radius:1px}.quote{display:inline;color:var(--text-primary);font-weight:600;font-style:italic;padding:.15em .4em;background:linear-gradient(135deg,#ff6b9d26,#9b59b626);border-radius:.25rem;border-left:3px solid var(--coral-pink)}.closing{font-style:italic;text-align:center;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.08);color:var(--text-primary)!important}.fact-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem;animation:fadeInUp 1s ease-out .6s both}.fact{background:var(--card-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);border-radius:1rem;padding:1.5rem;text-align:center;display:flex;flex-direction:column;gap:.5rem;transition:transform .3s ease,border-color .3s ease}.fact:hover{transform:translateY(-4px);border-color:#ff6b9d4d}.fact-icon{font-size:2rem}.fact-label{font-size:1.75rem;font-weight:700;background:linear-gradient(135deg,var(--coral-pink),var(--coral-orange));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.fact-desc{font-size:.85rem;color:var(--text-secondary);line-height:1.4}.ocean:before{content:"";position:fixed;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(ellipse at 30% 20%,rgba(74,144,196,.15) 0%,transparent 50%),radial-gradient(ellipse at 70% 30%,rgba(45,106,159,.1) 0%,transparent 40%);animation:lightRays 15s ease-in-out infinite alternate;pointer-events:none;z-index:0}@keyframes lightRays{0%{transform:rotate(0) scale(1)}to{transform:rotate(10deg) scale(1.1)}}@media(max-width:640px){.ocean{padding:1.5rem 1rem}.text-content{padding:1.5rem}.fact-cards{grid-template-columns:1fr}}
