.ds-demo-page{--ds-demo-hero-from:#ef4056;--ds-demo-hero-to:#c62828;background:var(--ds-bg-soft,#f0f0f1);min-height:100vh}.ds-demo-header{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--ds-border);background:#ffffffeb;position:sticky;top:0}.ds-demo-header-inner{justify-content:space-between;align-items:center;gap:16px;padding:14px 0;display:flex}.ds-demo-logo{align-items:center;gap:10px;text-decoration:none;display:inline-flex}.ds-demo-logo-text{color:var(--ds-brand);font-size:1.125rem;font-weight:800}.ds-demo-badge-template{color:var(--ds-text-muted);background:var(--ds-bg-soft);border:1px solid var(--ds-border);border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700}.ds-demo-nav{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.ds-demo-nav a{color:var(--ds-text-secondary);border-radius:8px;padding:8px 12px;font-size:13px;font-weight:600;text-decoration:none;transition:background .2s,color .2s}.ds-demo-nav a:hover{background:var(--ds-bg-soft);color:var(--ds-text)}.ds-demo-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-family:inherit;font-size:14px;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s,filter .2s;display:inline-flex}.ds-demo-btn--primary{background:var(--ds-brand);color:#fff;box-shadow:0 4px 14px #ef405659}.ds-demo-btn--primary:hover{filter:brightness(.95);transform:translateY(-1px)}.ds-demo-btn--ghost{color:var(--ds-brand);border:2px solid var(--ds-brand);background:#fff}.ds-demo-btn--ghost:hover{background:#fff5f6}.ds-demo-btn--white{color:var(--ds-brand);background:#fff}.ds-demo-btn--white:hover{background:#f8f8f8}.ds-demo-hero{background:linear-gradient(135deg, var(--ds-demo-hero-from) 0%, var(--ds-demo-hero-to) 55%, #880e4f 100%);color:#fff;padding:56px 0 64px;position:relative;overflow:hidden}.ds-demo-hero:before{content:"";pointer-events:none;background:radial-gradient(circle at 20% 30%,#ffffff1f 0%,#0000 50%),radial-gradient(circle at 80% 70%,#00000026 0%,#0000 45%);position:absolute;inset:0}.ds-demo-hero-grid{z-index:1;grid-template-columns:1fr;align-items:center;gap:40px;display:grid;position:relative}@media (min-width:992px){.ds-demo-hero-grid{grid-template-columns:1.05fr .95fr}}.ds-demo-hero-tag{background:#fff3;border:1px solid #ffffff59;border-radius:999px;margin-bottom:16px;padding:6px 14px;font-size:12px;font-weight:700;display:inline-block}.ds-demo-hero h1{margin:0 0 16px;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;line-height:1.35}.ds-demo-hero-lead{opacity:.92;max-width:520px;margin:0 0 24px;font-size:15px;line-height:1.75}.ds-demo-hero-actions{flex-wrap:wrap;gap:12px;margin-bottom:28px;display:flex}.ds-demo-stats{flex-wrap:wrap;gap:20px;display:flex}.ds-demo-stat{text-align:center;min-width:72px}.ds-demo-stat strong{font-size:1.5rem;font-weight:800;display:block}.ds-demo-stat span{opacity:.85;font-size:12px}.ds-demo-hero-preview{cursor:pointer;background:#1a1a1a;border:3px solid #ffffff40;border-radius:16px;transition:transform .25s;overflow:hidden;box-shadow:0 24px 48px #00000040}.ds-demo-hero-preview:hover{transform:scale(1.02)}.ds-demo-hero-preview img{vertical-align:top;width:100%;height:auto;display:block}.ds-demo-hero-preview-hint{text-align:center;opacity:.8;margin-top:10px;font-size:12px}.ds-demo-section{padding:48px 0}.ds-demo-section--alt{background:var(--ds-bg)}.ds-demo-section-head{text-align:center;max-width:640px;margin:0 auto 32px}.ds-demo-section-head h2{color:var(--ds-text);margin:0 0 10px;font-size:1.5rem;font-weight:800}.ds-demo-section-head p{color:var(--ds-text-muted);margin:0;font-size:14px;line-height:1.7}.ds-demo-features{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;display:grid}.ds-demo-feature{background:var(--ds-bg);border:1px solid var(--ds-border);border-radius:14px;padding:20px;transition:box-shadow .2s,border-color .2s}.ds-demo-section--alt .ds-demo-feature{background:var(--ds-bg-soft)}.ds-demo-feature:hover{box-shadow:var(--ds-shadow);border-color:#d0d0d2}.ds-demo-feature-icon{margin-bottom:10px;font-size:1.75rem}.ds-demo-feature h3{color:var(--ds-text);margin:0 0 6px;font-size:15px;font-weight:700}.ds-demo-feature p{color:var(--ds-text-muted);margin:0;font-size:13px;line-height:1.6}.ds-demo-feature p code{background:var(--ds-bg-soft);border:1px solid var(--ds-border);direction:ltr;unicode-bidi:isolate;border-radius:4px;padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.ds-demo-tech{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.ds-demo-tech span{background:var(--ds-bg);border:1px solid var(--ds-border);color:var(--ds-text-secondary);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600}.ds-demo-filters{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:28px;display:flex}.ds-demo-filter{border:1px solid var(--ds-border);background:var(--ds-bg);color:var(--ds-text-secondary);cursor:pointer;border-radius:999px;padding:8px 16px;font-family:inherit;font-size:13px;font-weight:600;transition:all .2s}.ds-demo-filter:hover{border-color:var(--ds-brand);color:var(--ds-brand)}.ds-demo-filter.is-active{background:var(--ds-brand);border-color:var(--ds-brand);color:#fff}.ds-demo-gallery{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.ds-demo-card{background:var(--ds-bg);border:1px solid var(--ds-border);border-radius:16px;transition:box-shadow .2s,transform .2s;overflow:hidden}.ds-demo-card:hover{box-shadow:var(--ds-shadow-lg);transform:translateY(-3px)}.ds-demo-card-thumb{aspect-ratio:16/10;cursor:zoom-in;background:#e8e8e8;border:none;width:100%;padding:0;font-family:inherit;display:block;position:relative;overflow:hidden}.ds-demo-card-thumb img{object-fit:cover;object-position:top center;width:100%;height:100%;transition:transform .35s}.ds-demo-card:hover .ds-demo-card-thumb img{transform:scale(1.03)}.ds-demo-card-zoom{color:#fff;opacity:0;background:#00000073;justify-content:center;align-items:center;font-size:13px;font-weight:700;transition:opacity .2s;display:flex;position:absolute;inset:0}.ds-demo-card-thumb:hover .ds-demo-card-zoom,.ds-demo-card-thumb:focus-visible .ds-demo-card-zoom{opacity:1}.ds-demo-card-count{color:#fff;background:#000000a6;border-radius:6px;padding:4px 8px;font-size:11px;font-weight:700;position:absolute;top:10px;left:10px}.ds-demo-card-body{padding:16px}.ds-demo-card-title{color:var(--ds-text);align-items:center;gap:8px;margin:0 0 6px;font-size:15px;font-weight:700;display:flex}.ds-demo-card-desc{color:var(--ds-text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0 0 12px;font-size:12px;line-height:1.55;display:-webkit-box;overflow:hidden}.ds-demo-card-actions{flex-wrap:wrap;gap:8px;display:flex}.ds-demo-card-link{color:var(--ds-brand);background:#fff5f6;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;text-decoration:none;transition:background .2s}.ds-demo-card-link:hover{background:#ffe8eb}.ds-demo-card-link--live{background:var(--ds-brand);color:#fff}.ds-demo-card-link--live:hover{filter:brightness(.92)}.ds-demo-purchase{color:#fff;text-align:center;background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);border-radius:20px;padding:40px 32px}.ds-demo-purchase h2{margin:0 0 12px;font-size:1.375rem;font-weight:800}.ds-demo-purchase>p{opacity:.88;max-width:520px;margin:0 auto 24px;font-size:14px;line-height:1.7}.ds-demo-purchase-list{text-align:right;margin-bottom:28px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;max-width:720px;margin-inline:auto;display:grid}.ds-demo-purchase-list li{opacity:.9;background:#ffffff14;border-radius:10px;padding:10px 14px;font-size:13px;list-style:none}.ds-demo-purchase-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.ds-demo-footer{text-align:center;color:var(--ds-text-muted);border-top:1px solid var(--ds-border);background:var(--ds-bg);padding:28px 0;font-size:13px}.ds-demo-footer a{color:var(--ds-brand);font-weight:600;text-decoration:none}.ds-demo-lightbox{z-index:1000;background:#000000eb;flex-direction:column;padding:16px;display:flex;position:fixed;inset:0}.ds-demo-lightbox-top{flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.ds-demo-lightbox-title{color:#fff;margin:0;font-size:15px;font-weight:700}.ds-demo-lightbox-label{color:#ffffffa6;margin:2px 0 0;font-size:12px}.ds-demo-lightbox-close{color:#fff;cursor:pointer;background:#ffffff1f;border:none;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;transition:background .2s;display:flex}.ds-demo-lightbox-close:hover{background:#ffffff38}.ds-demo-lightbox-stage{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative}.ds-demo-lightbox-img-wrap{border-radius:8px;max-width:100%;max-height:calc(100vh - 180px);overflow:auto;box-shadow:0 8px 32px #00000080}.ds-demo-lightbox-img-wrap img{max-width:100%;height:auto;margin:0 auto;display:block}.ds-demo-lightbox-nav{color:#fff;cursor:pointer;background:#ffffff26;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;transition:background .2s;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.ds-demo-lightbox-nav:hover{background:#ffffff47}.ds-demo-lightbox-nav--prev{right:12px}.ds-demo-lightbox-nav--next{left:12px}.ds-demo-lightbox-nav:disabled{opacity:.25;cursor:default}.ds-demo-lightbox-bottom{flex-wrap:wrap;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding-top:16px;display:flex}.ds-demo-lightbox-dot{cursor:pointer;background:#ffffff59;border:none;border-radius:50%;width:10px;height:10px;padding:0;transition:background .2s,transform .2s}.ds-demo-lightbox-dot.is-active{background:var(--ds-brand);transform:scale(1.2)}.ds-demo-lightbox-footer{flex-shrink:0;justify-content:center;gap:12px;margin-top:12px;display:flex}@media (max-width:767px){.ds-demo-header-inner{flex-wrap:wrap}.ds-demo-nav{display:none}.ds-demo-lightbox-nav{width:40px;height:40px}}[x-cloak]{display:none!important}.ds-demo-versions{grid-template-columns:1fr;align-items:stretch;gap:20px;display:grid}@media (min-width:900px){.ds-demo-versions{grid-template-columns:1fr 1fr}}.ds-demo-version{background:var(--ds-bg);border:1px solid var(--ds-border);border-radius:16px;flex-direction:column;padding:24px;transition:box-shadow .2s,border-color .2s;display:flex}.ds-demo-version:hover{box-shadow:var(--ds-shadow-lg);border-color:#d0d0d2}.ds-demo-version--next{border-color:#ef405659;box-shadow:0 4px 20px #ef405614}.ds-demo-version__top{align-items:center;gap:10px;margin-bottom:14px;display:flex}.ds-demo-version__icon{font-size:1.5rem;line-height:1}.ds-demo-version__title{color:var(--ds-text);margin:0;font-size:1.15rem;font-weight:800}.ds-demo-version__tag{border:1px solid var(--ds-border);color:var(--ds-text-muted);background:var(--ds-bg-soft);border-radius:999px;margin-inline-start:auto;padding:4px 10px;font-size:11px;font-weight:700}.ds-demo-version--next .ds-demo-version__tag{color:#fff;background:var(--ds-brand);border-color:var(--ds-brand)}.ds-demo-version__lead{color:var(--ds-text-muted);margin:0 0 16px;font-size:14px;line-height:1.8}.ds-demo-version__list{gap:10px;margin:0 0 18px;padding:0;list-style:none;display:grid}.ds-demo-version__list li{color:var(--ds-text-secondary);padding-inline-start:24px;font-size:14px;line-height:1.7;position:relative}.ds-demo-version__list li:before{content:"✓";inset-inline-start:0;color:var(--ds-green,#00a049);font-weight:700;position:absolute;top:0}.ds-demo-version__stack{background:var(--ds-bg-soft);border:1px solid var(--ds-border);border-radius:12px;margin-bottom:18px;padding:14px 16px}.ds-demo-version--next .ds-demo-version__stack{background:#ef40560a;border-color:#ef40562e}.ds-demo-version__stack-title{letter-spacing:.04em;color:var(--ds-text-muted);margin:0 0 12px;font-size:11px;font-weight:800}.ds-demo-version__stack-list{grid-template-columns:1fr;gap:10px;margin:0;padding:0;list-style:none;display:grid}@media (min-width:480px){.ds-demo-version__stack-list{grid-template-columns:1fr 1fr}}.ds-demo-version__stack-item{align-items:baseline;gap:8px;min-width:0;display:flex}.ds-demo-version__stack-item:before{content:"";background:var(--ds-border);border-radius:50%;flex:none;width:6px;height:6px;transform:translateY(-2px)}.ds-demo-version--next .ds-demo-version__stack-item:before{background:var(--ds-brand)}.ds-demo-version__stack-name{color:var(--ds-text);white-space:nowrap;font-size:13px;font-weight:700}.ds-demo-version__stack-role{color:var(--ds-text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.ds-demo-version__actions{flex-wrap:wrap;gap:10px;margin-top:auto;display:flex}.ds-demo-version__note{color:var(--ds-text-muted);margin:10px 0 0;font-size:12px}