:root{--bg:#1c1f2e;--surface:#ffffff0f;--border:#ffffff1f;--purple:#9e48f0;--blue:#5c85fa;--bright-blue:#2b99fa;--accent-gradient:linear-gradient(135deg, var(--purple), var(--blue));--text-primary:#f3f4f6;--text-secondary:#ebebf599;--sans:system-ui, "Segoe UI", Roboto, sans-serif;font:18px/145% var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text-secondary);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{background:linear-gradient(to bottom right, #9e48f026, #5c85fa26, var(--bg));background-attachment:fixed}#root{flex-direction:column;max-width:1200px;height:100%;margin:0 auto;display:flex}.app{flex-direction:column;flex:1;align-items:center;height:100%;display:flex;overflow:hidden}.header{flex-shrink:0;justify-content:space-between;align-items:center;width:100%;padding:16px 24px;display:flex}.logo{letter-spacing:-.5px;background:linear-gradient(to right, var(--purple), var(--blue));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:22px;font-weight:700}.hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;min-height:0;padding:0 24px 12px;display:flex;overflow:hidden}.hero h1{color:var(--text-primary);letter-spacing:-1.5px;flex-shrink:0;max-width:700px;font-size:clamp(28px,5vw,48px);font-weight:600;line-height:1.1}.hero h1 em{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-style:normal}.hero p{color:var(--text-secondary);flex-shrink:0;max-width:520px;font-size:clamp(14px,2vw,18px);line-height:1.5}.footer{text-align:center;width:100%;color:var(--text-secondary);border-top:1px solid var(--border);flex-direction:column;flex-shrink:0;align-items:center;gap:8px;padding:16px 24px 12px;font-size:13px;display:flex}.app-store-badge{opacity:.45;pointer-events:none;filter:grayscale();flex-direction:column;align-items:center;gap:6px;display:flex}.app-store-badge img{height:40px}.coming-soon{text-transform:uppercase;letter-spacing:1.5px;color:var(--purple);opacity:.8;font-size:11px;font-weight:600}@media (width<=768px){.header{padding:12px 16px}.hero{gap:14px;padding:0 16px}.hero p{display:none}.footer{gap:6px;padding:10px 16px;font-size:12px}.app-store-badge img{height:34px}}@media (height<=600px){.hero{gap:10px}.hero p{display:none}}.viewer-container{flex-direction:column;flex:1;align-items:center;gap:16px;width:100%;min-height:0;display:flex}.viewer{border:1px solid var(--border);background:#000;border-radius:20px;flex:1;width:100%;max-width:560px;min-height:0;max-height:70vh;position:relative;overflow:hidden;box-shadow:0 0 80px #9e48f026,0 24px 48px #00000080}.viewer-img{object-fit:cover;will-change:opacity, transform;width:100%;height:100%;position:absolute;inset:0}.viewer-img.visible{opacity:1;transition:opacity .8s,transform 2s;transform:scale(1)}.viewer-img.hidden{opacity:0;transition:opacity .3s;transform:scale(1)}.viewer-img.zooming-out{opacity:0;transition:opacity 1.2s,transform 2s;transform:scale(1.4)}.viewer-img.zooming-in{opacity:1;transition:opacity 1s .8s,transform 2s;transform:scale(1.15)}.flash-overlay{opacity:0;pointer-events:none;z-index:2;background:linear-gradient(135deg,#9e48f099,#5c85fa99);position:absolute;inset:0}.flash-overlay.active{animation:2s flash}@keyframes flash{0%{opacity:0}20%{opacity:.7}50%{opacity:.3}to{opacity:0}}.viewer-label{z-index:3;-webkit-backdrop-filter:blur(12px);color:#fff;letter-spacing:.3px;white-space:nowrap;text-overflow:ellipsis;background:#0009;border-radius:24px;max-width:90%;padding:8px 20px;font-size:14px;font-weight:500;position:absolute;bottom:20px;left:50%;overflow:hidden;transform:translate(-50%)}.viewer-label.travelling{background:linear-gradient(135deg,#9e48f0b3,#5c85fab3)}.viewer-dots{flex-shrink:0;gap:8px;display:flex}.dot{background:#fff3;border-radius:50%;width:8px;height:8px;transition:background .3s,transform .3s}.dot.active{background:var(--purple);transform:scale(1.25)}@media (width<=768px){.viewer-container{gap:12px}.viewer{border-radius:16px;max-width:100%;max-height:65vh}.viewer-label{padding:6px 14px;font-size:12px;bottom:14px}.dot{width:6px;height:6px}}