:root{--font-brand:"Outfit", sans-serif;--font-body:"Inter", sans-serif;--color-primary:#f97316;--color-primary-hover:#ea580c;--color-bg-dark:#0f172a;--color-text-light:#f8fafc;--color-text-muted:#94a3b8;--glass-bg:#0f172a80;--glass-border:#ffffff1a;--glass-shadow:0 25px 50px -12px #00000080}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--color-bg-dark);color:var(--color-text-light);justify-content:center;align-items:flex-start;min-height:100vh;display:flex;position:relative;overflow:hidden auto}.background-video{z-index:0;object-fit:cover;width:auto;min-width:100%;height:auto;min-height:100%;position:fixed;top:50%;left:50%;transform:translate(-50%)translateY(-50%)}#app{z-index:1;width:100%;min-height:100vh;position:relative}.background-overlay{z-index:1;background:linear-gradient(135deg,#0f172ab3 0%,#0f172a4d 100%);width:100%;height:100%;position:fixed;top:0;left:0}.preview-container{z-index:2;justify-content:center;align-items:flex-start;width:100%;min-height:100vh;padding:2rem 1rem;display:flex;position:relative}.glass-card{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);width:100%;max-width:800px;box-shadow:var(--glass-shadow);opacity:0;border-radius:24px;margin:2rem auto;padding:1.5rem;animation:.8s cubic-bezier(.16,1,.3,1) forwards slideUp;transform:translateY(20px)}@media (width>=768px){.glass-card{padding:3rem}}@keyframes slideUp{to{opacity:1;transform:translateY(0)}}header{text-align:center;margin-bottom:2.5rem}.brand-title{font-family:var(--font-brand);letter-spacing:-.02em;background:linear-gradient(135deg,#fff 0%,#cbd5e1 100%);-webkit-text-fill-color:transparent;text-shadow:0 4px 12px #0000001a;-webkit-background-clip:text;margin-bottom:.5rem;font-size:3.5rem;font-weight:800}.subtitle{font-family:var(--font-brand);letter-spacing:.2em;color:var(--color-primary);text-transform:uppercase;font-size:1rem;font-weight:600}.content-area{text-align:center;margin-bottom:3rem}.description{color:var(--color-text-light);margin-bottom:2.5rem;font-size:1.125rem;line-height:1.6}.action-buttons{justify-content:center;display:flex}.primary-btn{background:linear-gradient(135deg, var(--color-primary) 0%, #c2410c 100%);color:#fff;font-family:var(--font-brand);cursor:pointer;border:none;border-radius:9999px;align-items:center;gap:.75rem;padding:1rem 2rem;font-size:1.125rem;font-weight:600;transition:all .3s;display:flex;box-shadow:0 10px 25px -5px #ea580c66}.primary-btn:hover{background:linear-gradient(135deg, #fb923c 0%, var(--color-primary) 100%);transform:translateY(-2px);box-shadow:0 20px 35px -5px #ea580c80}.primary-btn:active{transform:translateY(1px)}.primary-btn svg{transition:transform .3s}.primary-btn:hover svg{transform:translate(4px)}.status-indicator{border-top:1px solid var(--glass-border);justify-content:center;align-items:center;gap:.5rem;padding-top:1.5rem;display:flex}.pulse{background-color:#22c55e;border-radius:50%;width:8px;height:8px;animation:2s infinite pulse-animation;box-shadow:0 0 #22c55eb3}.status-text{color:var(--color-text-muted);letter-spacing:.05em;text-transform:uppercase;font-size:.875rem;font-weight:500}@keyframes pulse-animation{0%{box-shadow:0 0 #22c55eb3}70%{box-shadow:0 0 0 10px #22c55e00}to{box-shadow:0 0 #22c55e00}}.scrollable-tracks{grid-template-columns:1fr;gap:1rem;margin-bottom:2rem;display:grid}@media (width>=768px){.scrollable-tracks{grid-template-columns:1fr 1fr}}.social-btn{color:var(--color-text-light);font-family:var(--font-brand);background:#ffffff0d;border:1px solid #ffffff1a;border-radius:9999px;padding:.75rem 1.5rem;font-weight:500;text-decoration:none;transition:all .3s}.social-btn:hover{border-color:var(--color-primary);color:var(--color-primary);background:#ffffff1a;transform:translateY(-2px);box-shadow:0 4px 12px #f9731633}