.examples-scope{--surface-0:0 0% 100%;--surface-1:60 5% 98%;--surface-2:60 4% 95%;--surface-3:50 4% 91%;--surface-4:50 3% 82%;--surface-5:50 2% 62%;--ink-1:0 0% 10%;--ink-2:40 1% 29%;--ink-3:60 2% 48%;--ink-4:60 2% 63%;--signal-red:0 48% 49%;--signal-amber:33 48% 45%;--signal-green:150 30% 42%;--brand-accent:207 44% 48%;--surface-canvas:var(--surface-0);--border-primary:0 0% 0%/0.08;--foreground:var(--ink-1);color-scheme:light;color:hsl(var(--foreground));font-family:var(--font-sans,"Satoshi",-apple-system,sans-serif)}.examples-nav-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}@media (max-width:768px){.examples-nav-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:480px){.examples-nav-grid{grid-template-columns:1fr}}.examples-nav-card{position:relative;padding:16px;border-radius:10px;border:1px solid hsl(var(--border-primary));background:hsl(var(--surface-0));cursor:pointer;transition:all .18s ease;display:flex;flex-direction:column;gap:8px}.examples-nav-card:hover{background:hsl(var(--surface-1));border-color:hsl(var(--ink-4)/.2)}.examples-nav-card[data-active=true]{border-color:hsl(var(--brand-accent));box-shadow:0 0 0 1px hsl(var(--brand-accent)/.3),0 2px 8px hsl(var(--brand-accent)/.08)}.examples-nav-card-icon{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:hsl(var(--surface-2));color:hsl(var(--ink-2));flex-shrink:0}.examples-nav-card[data-active=true] .examples-nav-card-icon{background:hsl(var(--brand-accent)/.1);color:hsl(var(--brand-accent))}.examples-nav-card-title{font-size:14px;font-weight:600;color:hsl(var(--ink-1))}.examples-nav-card-meta{font-size:11px;color:hsl(var(--ink-3))}.examples-slide-main{width:100%;aspect-ratio:960/540;overflow:hidden;position:relative;border-radius:8px;box-shadow:0 1px 8px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);background:#fff}.examples-thumbnail-strip{display:flex;gap:8px;overflow-x:auto;padding:4px 0;scrollbar-width:thin}.examples-thumbnail{flex-shrink:0;width:120px;aspect-ratio:960/540;overflow:hidden;position:relative;border-radius:4px;border:2px solid transparent;cursor:pointer;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06);transition:border-color .15s}.examples-thumbnail:hover{border-color:hsl(var(--ink-4)/.3)}.examples-thumbnail[data-active=true]{border-color:hsl(var(--brand-accent))}.examples-thumbnail-label{position:absolute;bottom:0;left:0;right:0;padding:2px 6px;font-size:8px;font-weight:600;color:hsl(var(--ink-3));background:hsl(var(--surface-0)/.85);backdrop-filter:blur(4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.examples-code-chrome{position:relative;border-radius:10px;border:1px solid hsl(var(--border-primary));background:hsl(var(--surface-0));overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.04)}.examples-code-tabs{display:flex;border-bottom:1px solid hsl(var(--border-primary))}.examples-code-tab{padding:8px 16px;font-size:12px;font-weight:500;color:hsl(var(--ink-3));cursor:pointer;transition:all .15s;background:none;border:none;border-bottom:2px solid transparent}.examples-code-tab:hover{color:hsl(var(--ink-2))}.examples-code-tab[data-active=true]{color:hsl(var(--ink-1));border-bottom-color:hsl(var(--brand-accent))}.examples-code-body{padding:16px;max-height:320px;overflow:auto;font-size:12px;line-height:1.6;color:hsl(var(--ink-1));font-family:var(--font-mono,"Geist Mono","JetBrains Mono",monospace);white-space:pre;margin:0;scrollbar-width:thin}.examples-feature-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.examples-feature-item{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:hsl(var(--ink-2));line-height:1.4}.examples-feature-check{width:18px;height:18px;flex-shrink:0;margin-top:1px;color:hsl(var(--signal-green))}.examples-pro-callout{border-left:3px solid hsl(var(--brand-accent));padding:16px 16px 16px 20px;border-radius:0 8px 8px 0;background:hsl(var(--brand-accent)/.04)}.examples-pro-callout-title{font-size:13px;font-weight:600;color:hsl(var(--brand-accent));margin-bottom:10px;display:flex;align-items:center;gap:6px}.examples-pro-item{display:flex;align-items:flex-start;gap:8px;font-size:12px;color:hsl(var(--ink-2));line-height:1.4}.examples-pro-item+.examples-pro-item{margin-top:6px}.examples-pro-dot{width:6px;height:6px;border-radius:50%;background:hsl(var(--brand-accent));flex-shrink:0;margin-top:5px}.examples-pro-highlight{margin-top:12px;padding:10px 12px;border-radius:6px;background:hsl(var(--brand-accent)/.06);font-size:12px;font-weight:500;color:hsl(var(--brand-accent));line-height:1.4}.examples-audience-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:11px;font-weight:500;color:hsl(var(--ink-3));background:hsl(var(--surface-2))}.examples-section-number{font-family:var(--font-mono,monospace);font-size:12px;letter-spacing:.08em;color:hsl(var(--ink-3));font-weight:600;text-transform:uppercase}.examples-try-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:8px;border:1px solid hsl(var(--border-primary));background:hsl(var(--surface-1));font-family:var(--font-mono,monospace);font-size:13px;color:hsl(var(--ink-2))}.examples-try-bar code{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.examples-copy-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:6px;border:1px solid hsl(var(--border-primary));background:hsl(var(--surface-0));font-size:11px;font-weight:500;color:hsl(var(--ink-3));cursor:pointer;transition:all .15s;flex-shrink:0}.examples-copy-btn:hover{background:hsl(var(--surface-2));color:hsl(var(--ink-2))}.examples-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}@media (max-width:900px){.examples-detail-grid{grid-template-columns:1fr}}.examples-tier-badge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:4px;font-size:10px;font-weight:600;letter-spacing:.02em;line-height:1;vertical-align:middle;margin-left:6px}.examples-tier-badge--free{background:hsl(var(--signal-green)/.1);color:hsl(var(--signal-green))}.examples-tier-badge--pro{background:hsl(var(--signal-amber)/.1);color:hsl(var(--signal-amber))}.examples-download-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;border-radius:8px;border:none;background:hsl(var(--brand-accent));color:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .18s ease}.examples-download-btn:hover:not(:disabled){background:hsl(var(--brand-accent)/.85);box-shadow:0 2px 8px hsl(var(--brand-accent)/.2)}.examples-download-btn:disabled{opacity:.6;cursor:not-allowed}.examples-download-spinner{animation:examplesSpinner .8s linear infinite}@keyframes examplesSpinner{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.examples-fade-in{animation:examplesFadeIn .35s cubic-bezier(.16,1,.3,1)}@keyframes examplesFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}