.demo-viewer{min-height:100vh;background:#0f0f13;display:flex;flex-direction:column}.demo-topbar{position:sticky;top:0;z-index:100;background:#0f0f13f2;backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.06)}.demo-topbar-inner{max-width:1600px;margin:0 auto;padding:0 1.5rem;height:44px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.demo-back-btn{display:flex;align-items:center;gap:.5rem;color:#ffffff80;font-size:.8rem;font-weight:600;text-decoration:none;transition:color .2s;white-space:nowrap}.demo-back-btn:hover{color:#cfff71}.demo-tabs{display:flex;align-items:center;gap:2px;background:#ffffff0a;border-radius:10px;padding:3px}.demo-tab{display:flex;align-items:center;gap:.4rem;padding:.4rem .8rem;border:none;border-radius:8px;background:transparent;color:#fff6;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .2s}.demo-tab:hover{color:#ffffffb3}.demo-tab.active{background:#ffffff1a;color:#fff}.demo-tab-icon{font-size:1rem}.demo-tab-label{white-space:nowrap}.demo-controls{display:flex;align-items:center;gap:.5rem}.demo-toggle-group{display:flex;align-items:center;gap:2px;background:#ffffff0a;border-radius:10px;padding:3px}.demo-toggle-btn{display:flex;align-items:center;gap:.35rem;padding:.35rem .7rem;border:none;border-radius:7px;background:transparent;color:#fff6;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s}.demo-toggle-btn:hover{color:#ffffffb3}.demo-toggle-btn.active{background:#ffffff1a;color:#fff}.demo-toggle-btn.active.new{color:#cfff71}.demo-toggle-btn.active.current{color:#f97316}.demo-toggle-dot{width:6px;height:6px;border-radius:50%;background:currentColor}.demo-viewport{flex:1;display:flex;align-items:flex-start;justify-content:center;padding:.75rem;overflow:auto}.demo-device{position:relative;width:100%;max-width:1400px;transition:all .4s cubic-bezier(.4,0,.2,1)}.demo-device.mobile{max-width:390px;margin:1rem auto}.demo-phone-frame{position:relative;background:#1a1a1f;border-radius:2.5rem 2.5rem 0 0;padding:.75rem .75rem 0;border:2px solid rgba(255,255,255,.08);border-bottom:none}.demo-phone-notch{width:120px;height:28px;margin:0 auto .5rem;background:#0f0f13;border-radius:0 0 1rem 1rem}.demo-phone-bar{background:#1a1a1f;border-radius:0 0 2.5rem 2.5rem;padding:.75rem;border:2px solid rgba(255,255,255,.08);border-top:none;display:flex;justify-content:center}.demo-phone-bar:after{content:"";width:100px;height:4px;background:#ffffff26;border-radius:2px}.demo-iframe-container{position:relative;width:100%;overflow:hidden;border-radius:12px;background:#fff}.demo-device.mobile .demo-iframe-container{border-radius:0;height:750px}.demo-device.desktop .demo-iframe-container{border-radius:12px;border:1px solid rgba(255,255,255,.08);height:calc(100vh - 60px)}.demo-iframe{width:100%;height:100%;border:none;display:block}.demo-placeholder{width:100%;height:100%;min-height:500px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a2e,#16213e)}.demo-placeholder-inner{text-align:center;padding:3rem}.demo-placeholder-icon{font-size:3rem;display:block;margin-bottom:1rem}.demo-placeholder-inner h3{color:#fff;font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.demo-placeholder-inner p{color:#ffffff80;font-size:.9rem;max-width:320px;line-height:1.5}.demo-annotations-overlay{position:absolute;inset:0;pointer-events:none;z-index:10}.annotation-dot-wrapper{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;z-index:20}.annotation-dot{position:relative;width:32px;height:32px;border-radius:50%;border:2px solid #CFFF71;background:#cfff7126;backdrop-filter:blur(4px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.annotation-dot:hover,.annotation-dot.active{background:#cfff714d;transform:scale(1.15)}.annotation-pulse{position:absolute;inset:-4px;border-radius:50%;border:2px solid rgba(207,255,113,.4);animation:annotationPulse 2s ease-out infinite}@keyframes annotationPulse{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.annotation-icon{color:#cfff71;font-size:1rem;font-weight:700;line-height:1}.annotation-tooltip{position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%);width:280px;background:#0f0f13f2;backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:1rem;pointer-events:auto;z-index:30;box-shadow:0 20px 40px #00000080}.annotation-tooltip:before{content:"";position:absolute;top:-6px;left:50%;transform:translate(-50%) rotate(45deg);width:12px;height:12px;background:#0f0f13f2;border-left:1px solid rgba(255,255,255,.1);border-top:1px solid rgba(255,255,255,.1)}.annotation-tooltip-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.annotation-tooltip-label{color:#fff;font-size:.85rem;font-weight:700}.annotation-tooltip-impact{color:#cfff71;font-size:.75rem;font-weight:700;background:#cfff711a;padding:.15rem .5rem;border-radius:6px;border:1px solid rgba(207,255,113,.2)}.annotation-tooltip-desc{color:#fff9;font-size:.78rem;line-height:1.5;margin:0}.demo-version-badge{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);padding:.55rem 1.5rem;border-radius:999px;font-size:.82rem;font-weight:500;letter-spacing:.04em;text-transform:uppercase;z-index:50;backdrop-filter:blur(16px);transition:all .3s;pointer-events:none;animation:badgeFadeIn .5s ease-out}@keyframes badgeFadeIn{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.demo-version-badge.new,.demo-version-badge.current{background:#ffffffd9;color:#1a1a1a;border:1px solid rgba(0,0,0,.08);box-shadow:0 4px 16px #0000001a}@media(max-width:768px){.demo-topbar-inner{flex-wrap:wrap;height:auto;padding:.5rem 1rem;gap:.5rem}.demo-tabs{order:3;width:100%;justify-content:center}.demo-back-btn{order:1}.demo-controls{order:2}.demo-tab-label{display:none}.demo-viewport{padding:.5rem}}[data-astro-cid-umzwufyd],[data-astro-cid-umzwufyd]:before,[data-astro-cid-umzwufyd]:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:#0f0f13;-webkit-font-smoothing:antialiased}