:root{--space-1: #140b2e;--space-2: #26134f;--space-3: #3b1d70;--ink: #fff8ff;--ink-soft: #d9c9ff;--sun: #ffd23f;--candy: #ff5d8f;--sky: #4cc9f0;--lime: #9ef01a;--grape: #b388ff;--tang: #ff9e1b;--card-radius: 28px;font-family:"Baloo 2",Comic Sans MS,Segoe UI,ui-rounded,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;color:var(--ink);background:radial-gradient(1200px 700px at 85% -10%,#5b2a86 0%,transparent 60%),radial-gradient(900px 600px at -10% 30%,#1b4dbf44 0%,transparent 60%),radial-gradient(1000px 800px at 50% 110%,#ff5d8f2e 0%,transparent 55%),linear-gradient(180deg,var(--space-1) 0%,var(--space-2) 55%,var(--space-3) 100%);background-attachment:fixed;overflow-x:hidden}img{display:block;max-width:100%}h1,h2,h3{margin:0;line-height:1.05;font-weight:800;letter-spacing:.5px}p{margin:0;line-height:1.5}a{color:inherit}button{font:inherit;color:inherit;cursor:pointer}.star-field{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;overflow:hidden}.star-field .star{position:absolute;border-radius:50%;background:#fff;animation:twinkle 3s ease-in-out infinite}@keyframes twinkle{0%,to{opacity:.15;transform:scale(.8)}50%{opacity:.9;transform:scale(1.2)}}.magic-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:12px clamp(14px,4vw,44px);background:#140b2ec7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:2px solid rgba(179,136,255,.35)}.magic-brand{display:inline-flex;align-items:center;gap:10px;font-size:1.35rem;font-weight:800;text-decoration:none}.magic-brand .brand-bolt{display:grid;place-items:center;width:40px;height:40px;border-radius:14px;font-size:1.3rem;background:linear-gradient(135deg,var(--sun),var(--tang));box-shadow:0 0 18px #ffd23f88;animation:brand-wiggle 4s ease-in-out infinite}@keyframes brand-wiggle{0%,to{transform:rotate(-6deg)}50%{transform:rotate(8deg) scale(1.08)}}.magic-brand small{display:block;font-size:.68rem;font-weight:700;color:var(--ink-soft);letter-spacing:1.5px;text-transform:uppercase}.magic-nav{display:flex;flex-wrap:wrap;gap:8px}.magic-nav a{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:6px 14px;border-radius:999px;border:2px solid rgba(179,136,255,.4);background:#3b1d7099;font-weight:700;font-size:.95rem;text-decoration:none;transition:transform .15s ease,background .15s ease,border-color .15s ease}.magic-nav a:hover{transform:translateY(-2px) scale(1.05);background:#b388ff59}.magic-nav a.active{background:linear-gradient(135deg,var(--candy),var(--grape));border-color:#fff6;box-shadow:0 4px 18px #ff5d8f66}.magic-nav a:focus-visible,.big-btn:focus-visible,.portal-card:focus-visible,button:focus-visible{outline:3px solid var(--sun);outline-offset:3px}.page{width:min(1160px,100%);margin:0 auto;padding:clamp(20px,4vw,48px) clamp(14px,4vw,40px) 80px}.page-hero{text-align:center;padding:clamp(18px,4vw,40px) 0 clamp(22px,4vw,44px)}.hero-eyebrow{display:inline-block;padding:6px 16px;border-radius:999px;background:#ffd23f26;border:2px dashed rgba(255,210,63,.55);color:var(--sun);font-weight:800;font-size:.85rem;letter-spacing:2px;text-transform:uppercase;margin-bottom:18px}.page-hero h1{font-size:clamp(2.4rem,7.5vw,4.6rem);background:linear-gradient(100deg,var(--sun) 10%,var(--candy) 40%,var(--sky) 75%,var(--lime) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 rgba(0,0,0,.35))}.page-hero .hero-sub{margin:16px auto 0;max-width:640px;font-size:clamp(1.05rem,2.4vw,1.3rem);color:var(--ink-soft)}.portal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:clamp(14px,2.5vw,26px)}.portal-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;border-radius:var(--card-radius);border:3px solid rgba(255,255,255,.16);text-decoration:none;color:var(--ink);background:var(--portal-bg, linear-gradient(150deg, #3b1d70, #26134f));box-shadow:0 10px 30px #00000059;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.portal-card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(400px 220px at 80% -20%,rgba(255,255,255,.28),transparent 65%);pointer-events:none}.portal-card:hover{transform:translateY(-6px) rotate(-.6deg) scale(1.02);border-color:#ffffff8c;box-shadow:0 18px 44px #00000073,0 0 30px var(--portal-glow, #b388ff55)}.portal-emoji{font-size:clamp(2.6rem,5vw,3.4rem);line-height:1;filter:drop-shadow(0 4px 6px rgba(0,0,0,.4))}.portal-card h3,.portal-card h2{font-size:clamp(1.3rem,2.6vw,1.65rem)}.portal-card p{color:#ffffffd9;font-size:.98rem}.tag-ready{background:linear-gradient(135deg,var(--lime),#38b000);color:#10250a;border:2px solid #ffffff88}.portal-cta{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;background:#ffffffeb;color:#241243;font-weight:800;font-size:.95rem}.big-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:12px 28px;border:3px solid rgba(255,255,255,.35);border-radius:999px;font-weight:800;font-size:1.1rem;text-decoration:none;color:#241243;background:linear-gradient(135deg,var(--sun),var(--tang));box-shadow:0 6px #0000004d,0 10px 26px #ffd23f59;transition:transform .12s ease,box-shadow .12s ease}.big-btn:hover{transform:translateY(-3px) scale(1.03)}.big-btn:active{transform:translateY(2px);box-shadow:0 2px #0000004d}.big-btn.btn-candy{background:linear-gradient(135deg,var(--candy),var(--grape));color:#fff;box-shadow:0 6px #0000004d,0 10px 26px #ff5d8f66}.big-btn.btn-sky{background:linear-gradient(135deg,var(--sky),#4361ee);color:#fff;box-shadow:0 6px #0000004d,0 10px 26px #4cc9f066}.big-btn.btn-ghost{background:#ffffff1a;color:var(--ink);box-shadow:none}.big-btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}.magic-panel{border-radius:var(--card-radius);border:3px solid rgba(179,136,255,.3);background:#140b2ea6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:clamp(18px,3vw,30px);box-shadow:0 12px 34px #00000059}.panel-title{display:flex;align-items:center;gap:10px;font-size:clamp(1.3rem,3vw,1.8rem);margin-bottom:14px}.song-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:16px}.song-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:22px;border:3px solid hsl(var(--song-hue, 280) 80% 70% / .5);background:radial-gradient(300px 160px at 90% -30%,hsl(var(--song-hue, 280) 90% 70% / .35),transparent 70%),#140b2eb3;text-align:left;transition:transform .15s ease,box-shadow .15s ease}.song-card:hover{transform:translateY(-3px)}.song-card.playing{border-color:hsl(var(--song-hue, 280) 95% 70%);box-shadow:0 0 26px hsl(var(--song-hue, 280) 95% 65% / .6);animation:song-pulse 1s ease-in-out infinite}@keyframes song-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.song-emoji{font-size:2rem;line-height:1}.song-card h3{font-size:1.1rem}.song-card .song-source{color:var(--ink-soft);font-size:.85rem}.song-mood{align-self:flex-start;padding:3px 12px;border-radius:999px;font-size:.75rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;background:hsl(var(--song-hue, 280) 85% 65% / .25);color:hsl(var(--song-hue, 280) 95% 82%);border:1px solid hsl(var(--song-hue, 280) 85% 70% / .5)}.song-play{margin-top:6px;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 18px;border:none;border-radius:999px;font-weight:800;background:hsl(var(--song-hue, 280) 90% 68%);color:#241243;box-shadow:0 4px #0000004d}.song-play:active{transform:translateY(2px);box-shadow:none}.magic-footer{padding:26px clamp(14px,4vw,44px) 40px;text-align:center;color:var(--ink-soft);font-size:.95rem}.magic-footer .footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-bottom:12px;font-weight:700}html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .5s ease,transform .5s ease}html.js .reveal.shown{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}