:root{--page-bg:#090f24;--card-bg:rgba(11, 20, 45, 0.64);--card-border:rgba(214, 226, 255, 0.30);--text:#f8fafc;--text-soft:#d8e2f5;--muted:#b7c2d7;--accent:#f6c1ff;--accent-2:#7dd3fc;--accent-warm:#fff0d4;--phrase:#fff7e8;--shadow:0 30px 100px rgba(0, 0, 0, 0.42);--radius-xl:32px;--radius-pill:999px;--max-card-width:760px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,segoe ui,sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--page-bg);color:var(--text)}body{position:relative}.scene{position:relative;width:100%;height:100dvh;min-height:100vh;display:grid;place-items:center;padding:clamp(14px,3vw,28px);overflow:hidden;isolation:isolate;background:radial-gradient(circle at 18% 28%,rgba(45,212,191,.18),transparent 28%),radial-gradient(circle at 82% 16%,rgba(217,70,239,.2),transparent 30%),radial-gradient(circle at 70% 80%,rgba(59,130,246,.14),transparent 28%),linear-gradient(145deg,#061024 0%,#10183e 48%,#050814 100%)}.scene::before,.scene::after{content:"";position:absolute;inset:-18%;pointer-events:none;z-index:-2}.scene::before{background:radial-gradient(circle at 12% 22%,rgba(255,255,255,.14) 0 2px,transparent 3px),radial-gradient(circle at 38% 50%,rgba(255,255,255,.1) 0 1.5px,transparent 2.5px),radial-gradient(circle at 72% 18%,rgba(246,193,255,.12) 0 2px,transparent 3px),radial-gradient(circle at 88% 64%,rgba(125,211,252,.12) 0 2px,transparent 3px),radial-gradient(circle at 64% 84%,rgba(255,255,255,.12) 0 1.5px,transparent 2.5px);background-size:220px 220px,180px 180px,260px 260px,200px 200px,160px 160px;animation:starDrift 36s linear infinite;opacity:.9}.scene::after{background:linear-gradient(120deg,transparent 0%,rgba(63,217,255,.14) 16%,transparent 30%),linear-gradient(300deg,transparent 18%,rgba(214,76,255,.16) 34%,transparent 50%),linear-gradient(30deg,transparent 50%,rgba(133,118,255,.12) 64%,transparent 78%);filter:blur(18px);transform:scale(1.15)rotate(-8deg);animation:auroraShift 14s ease-in-out infinite alternate;z-index:-1}.page-card{position:relative;width:min(var(--max-card-width),100%);height:min(720px,calc(100dvh - 26px));min-height:0;padding:clamp(22px,4.2vw,46px);display:grid;grid-template-rows:auto 1fr auto;gap:clamp(18px,3.2vw,30px);border-radius:var(--radius-xl);border:1px solid var(--card-border);background:linear-gradient(145deg,rgba(255,255,255,8%),rgba(255,255,255,3%)),radial-gradient(circle at 86% 8%,rgba(217,70,239,.22),transparent 34%),radial-gradient(circle at 8% 94%,rgba(56,189,248,.14),transparent 34%),var(--card-bg);box-shadow:var(--shadow),inset 0 1px rgba(255,255,255,.2);backdrop-filter:blur(18px)saturate(150%);-webkit-backdrop-filter:blur(18px)saturate(150%);overflow:hidden;transform-style:preserve-3d;transition:transform 180ms ease}.page-card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(216,180,254,.18),rgba(125,211,252,.42));mask:linear-gradient(#000 0 0)content-box,linear-gradient(#000 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#000 0 0)content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;pointer-events:none}.page-card::after{content:"";position:absolute;width:320px;height:320px;top:-140px;right:-150px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.12),transparent 68%);filter:blur(10px);pointer-events:none}.brand{display:flex;align-items:center;gap:clamp(14px,3vw,24px);z-index:1}.logo-wrap{position:relative;width:clamp(80px,15vw,120px);height:clamp(80px,15vw,120px);flex:none;display:grid;place-items:center;cursor:pointer}.logo-orbit{position:absolute;inset:4px;border-radius:50%;border:1px solid rgba(255,231,173,.28);animation:orbitSpin 12s linear infinite;box-shadow:0 0 18px rgba(246,193,255,.16)}.logo-orbit::before,.logo-orbit::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#fff0a3;box-shadow:0 0 12px rgba(255,240,163,.95)}.logo-orbit::before{top:8px;left:18px}.logo-orbit::after{right:8px;bottom:24px;background:#f6c1ff;box-shadow:0 0 12px rgba(246,193,255,.95)}.logo-pulse{position:absolute;inset:16px;border-radius:50%;background:radial-gradient(circle,rgba(246,193,255,.28),transparent 64%);animation:logoPulse 2.8s ease-in-out infinite}.brand-logo{position:relative;z-index:2;width:clamp(58px,11vw,86px);height:clamp(58px,11vw,86px);border-radius:50%;object-fit:cover;background:rgba(255,255,255,8%);box-shadow:0 14px 28px rgba(0,0,0,.32),0 0 0 6px rgba(255,255,255,7%),0 0 28px rgba(246,193,255,.16);animation:logoFloat 4.8s ease-in-out infinite}.brand-title{margin:0;font-size:clamp(2rem,6vw,3.3rem);line-height:1;letter-spacing:-.05em;font-weight:800}.brand-subtitle{margin:8px 0 0;font-size:clamp(1rem,2.8vw,1.4rem);line-height:1.35;color:var(--text-soft)}.content{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:clamp(16px,3vw,28px);z-index:1;min-height:0}.badge{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.16);background:linear-gradient(135deg,rgba(168,85,247,.34),rgba(37,99,235,.24)),rgba(255,255,255,5%);box-shadow:inset 0 1px rgba(255,255,255,.16),0 12px 28px rgba(0,0,0,.22);font-size:clamp(1rem,2.8vw,1.2rem);font-weight:700}.badge-icon{color:var(--accent);text-shadow:0 0 16px rgba(246,193,255,.8);animation:twinkle 2.4s ease-in-out infinite}.phrase{margin:0;max-width:10.8ch;font-family:Georgia,times new roman,serif;font-weight:700;font-size:clamp(3.6rem,12.4vw,6.6rem);line-height:.9;letter-spacing:-.07em;text-wrap:balance;color:var(--phrase);text-shadow:0 2px 0 rgba(255,255,255,.14),0 18px 48px rgba(0,0,0,.36)}.glow-divider{position:relative;width:min(280px,70%);height:1px;background:linear-gradient(90deg,transparent,rgba(255,247,232,.48),transparent)}.glow-divider::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:12px;border-radius:3px;transform:translate(-50%,-50%)rotate(45deg);background:var(--phrase);box-shadow:0 0 18px rgba(255,247,232,.92),0 0 34px rgba(251,113,133,.42)}.date-pill{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:56px;padding:0 22px;border-radius:var(--radius-pill);background:rgba(12,26,58,.52);border:1px solid rgba(125,211,252,.22);box-shadow:inset 0 1px rgba(255,255,255,.12),0 14px 32px rgba(0,0,0,.18);font-size:clamp(1rem,3vw,1.3rem);color:var(--text)}.date-pill svg{width:22px;height:22px;flex:none;color:var(--accent-warm)}.footer{display:flex;flex-direction:column;align-items:center;gap:18px;color:var(--muted);font-size:clamp(.94rem,2.4vw,1.08rem);z-index:1}.footer::before{content:"✦";width:100%;display:flex;align-items:center;justify-content:center;color:var(--accent);opacity:.82;text-shadow:0 0 16px rgba(246,193,255,.7);background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent)50%/100% 1px no-repeat}.footer-line{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-align:center;flex-wrap:wrap}.footer-dot{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#f6c1ff 0 30%,rgba(246,193,255,.18) 54%,transparent 74%);box-shadow:0 0 16px rgba(246,193,255,.55);flex:none}@media(max-width:620px){:root{--radius-xl:26px}.scene{padding:14px}.page-card{width:100%;height:calc(100dvh - 28px);padding:20px;gap:18px}.brand{gap:14px}.logo-wrap{width:76px;height:76px}.brand-logo{width:56px;height:56px}.brand-title{font-size:clamp(1.9rem,10vw,2.5rem)}.brand-subtitle{font-size:.98rem}.content{gap:16px}.badge{min-height:44px;padding:0 16px}.phrase{max-width:10.2ch;font-size:clamp(3rem,14.8vw,4.7rem)}.date-pill{width:100%;min-height:52px;padding:0 16px;font-size:clamp(.96rem,4vw,1.08rem)}}@media(max-width:390px){.page-card{padding:18px}.phrase{font-size:clamp(2.7rem,14vw,4.1rem)}.date-pill svg{display:none}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}@keyframes starDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(90px,-120px,0)}}@keyframes auroraShift{from{transform:scale(1.15)rotate(-10deg)translate3d(-2%,-1%,0);opacity:.72}to{transform:scale(1.22)rotate(-3deg)translate3d(3%,2%,0);opacity:.95}}@keyframes orbitSpin{to{transform:rotate(360deg)}}@keyframes logoPulse{0%,100%{transform:scale(.84);opacity:.35}50%{transform:scale(1.18);opacity:.78}}@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes twinkle{0%,100%{opacity:.72;transform:scale(1)rotate(0)}50%{opacity:1;transform:scale(1.14)rotate(8deg)}}@keyframes hangFloat{0%,100%{transform:translateY(0)rotate(-1.2deg)}50%{transform:translateY(-5px)rotate(1.2deg)}}.easter-mode .scene::after{opacity:1;filter:blur(22px)saturate(140%)}