.alert{--alert-color: var(--theme-color-info, #0369a1);--alert-bg: color-mix(in srgb, var(--alert-color) 8%, var(--theme-bg-surface, #f8fafc));margin:var(--space-4) 0;border-radius:var(--radius-lg, .75rem);background:var(--alert-bg);overflow:hidden;box-shadow:0 0 0 1px color-mix(in srgb,var(--alert-color) 15%,transparent),0 4px 12px #00000014;border-left:10px solid var(--alert-color);border-right:10px solid var(--alert-color);transition:box-shadow .3s ease,transform .2s ease}.alert:hover{transform:translateY(-2px);box-shadow:0 0 0 1px color-mix(in srgb,var(--alert-color) 25%,transparent),0 8px 24px #0000001f}.alert__row{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-3, .75rem) var(--space-4, 1rem);background:linear-gradient(90deg,rgba(0,0,0,.02) 0%,transparent 100%)}.alert__icon{font-size:1.1rem;flex-shrink:0;color:var(--alert-color)}.alert__title{flex:1;font-weight:700;font-size:var(--text-xs, .75rem);text-transform:uppercase;letter-spacing:.04em;color:var(--alert-color)}.alert__toggle,.alert__expand{display:flex;align-items:center;gap:var(--space-2, .5rem);padding:var(--space-1, .25rem) var(--space-3, .75rem);font-size:var(--text-xs, .75rem);font-weight:500;color:var(--theme-text-muted, #64748b);background:var(--theme-bg-surface-secondary, #f1f5f9);border:1px solid var(--theme-border-primary, #e2e8f0);border-radius:var(--radius-md, .375rem);cursor:pointer;transition:all .2s ease}.alert__expand{width:100%;justify-content:center;border-radius:0;border-left:none;border-right:none;padding:var(--space-2, .5rem);background:var(--theme-bg-surface-secondary, #f1f5f9)}.alert__toggle:hover{background:var(--theme-bg-surface-tertiary, #e2e8f0);color:var(--theme-text-secondary, #475569);transform:translateY(-1px)}.alert__expand:hover{background:var(--theme-bg-surface-tertiary, #e2e8f0)}.alert__chevron{font-size:8px;color:var(--theme-text-muted, #64748b)}.alert__content{padding:var(--space-4, 1rem);font-size:var(--text-sm, .875rem);line-height:1.7;color:var(--theme-text-secondary, #475569)}.alert__content>:first-child{margin-top:0}.alert__content>:last-child{margin-bottom:0}.alert--note,.alert--info{--alert-color: var(--theme-color-info, #0369a1)}.alert--tip{--alert-color: var(--theme-color-success, #15803d)}.alert--warning{--alert-color: var(--theme-color-warning, #ca8a04)}.alert--important{--alert-color: var(--theme-color-primary, #2563eb)}.alert--caution{--alert-color: var(--theme-color-error, #dc2626)}.cmp-collapsible{margin:var(--spacing-6) 0;border:1px solid var(--theme-border-primary);border-radius:var(--radius-lg);overflow:hidden;background:var(--theme-bg-primary)}.cmp-collapsible__trigger{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-4);background:var(--theme-bg-surface-secondary);cursor:pointer;user-select:none;font-weight:600;color:var(--theme-text-primary);transition:all var(--transition-fast) ease;list-style:none}.cmp-collapsible__trigger:hover{background:var(--theme-bg-surface-tertiary)}.cmp-collapsible__trigger:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:calc(var(--focus-ring-offset) * -1)}.cmp-collapsible__trigger::-webkit-details-marker{display:none}.cmp-collapsible__icon{font-size:1.2em;flex-shrink:0}.cmp-collapsible__emoji{font-size:1.3em;line-height:1;flex-shrink:0}.cmp-collapsible__title{flex:1;font-size:var(--text-sm);line-height:1.4}.cmp-collapsible__chevron{display:flex;align-items:center;justify-content:center;flex-shrink:0}.cmp-collapsible__chevron svg{display:block;color:var(--theme-text-muted);transition:transform var(--transition-fast) ease}.cmp-collapsible[open] .cmp-collapsible__chevron svg{transform:rotate(180deg)}.cmp-collapsible__content{padding:var(--spacing-4);background:var(--theme-bg-primary);border-top:1px solid var(--theme-border-primary)}.cmp-collapsible__content>:first-child{margin-top:0}.cmp-collapsible__content>:last-child{margin-bottom:0}.cmp-collapsible__content p{margin:0 0 var(--spacing-2) 0}.cmp-collapsible__content p:last-child{margin-bottom:0}.cmp-collapsible__content ul,.cmp-collapsible__content ol{margin:0;padding-left:var(--spacing-6)}.tabbed-code{margin:var(--space-6) 0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--theme-border-primary)}.tabbed-tabs{display:flex;gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--theme-bg-surface-secondary);border-bottom:1px solid var(--theme-border-primary);overflow-x:auto}.tabbed-tab{padding:var(--space-2) var(--space-4);background:transparent;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;color:var(--theme-text-secondary);cursor:pointer;transition:all var(--transition-fast) ease;white-space:nowrap}.tabbed-tab:hover{color:var(--theme-text-primary);background:var(--theme-bg-surface-tertiary)}.tabbed-tab.active{color:var(--theme-color-primary);background:var(--theme-bg-primary)}.tabbed-panels{background:var(--theme-bg-surface-secondary);padding:var(--space-2)}.tabbed-panels pre{margin:0!important}.tabbed-placeholder{display:none;color:var(--theme-text-muted);font-size:var(--text-sm);font-style:italic;padding:var(--space-4);text-align:center}.tabbed-placeholder[data-visible=true]{display:block}.cmp-figure{margin:var(--space-8) 0;content-visibility:auto;contain-intrinsic-size:0 200px}.cmp-figure--collapsible .cmp-figure__details{display:block;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--theme-border-primary)}.cmp-figure--collapsible .cmp-figure__details:not([open]) .cmp-figure__wrapper{display:none}.cmp-figure--collapsible .cmp-figure__summary{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--theme-bg-surface-secondary);cursor:pointer;user-select:none;list-style:none}.cmp-figure--collapsible .cmp-figure__summary::-webkit-details-marker{display:none}.cmp-figure__icon{flex-shrink:0;color:var(--theme-text-muted)}.cmp-figure__title{font-weight:500;font-size:var(--text-sm);color:var(--theme-text-primary)}.cmp-figure__chevron svg{margin-left:auto;color:var(--theme-text-muted);transition:transform var(--transition-fast) ease}.cmp-figure--collapsible .cmp-figure__details[open] .cmp-figure__chevron svg{transform:rotate(180deg)}.cmp-figure__wrapper{background:var(--theme-bg-surface-secondary);padding:var(--space-2);width:100%;max-width:100%}.cmp-figure__image-container{position:relative;display:flex;align-items:center;justify-content:center;min-height:100px}.cmp-figure__image{max-width:100%;height:auto;border-radius:var(--radius-md);display:block;transition:opacity .3s ease}.cmp-figure__image--error{display:none}.cmp-figure__image-fallback{display:none;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-6);color:var(--theme-text-muted);text-align:center}.cmp-figure__image-container:has(.cmp-figure__image--error) .cmp-figure__image-fallback{display:flex}.cmp-figure__image-fallback svg{opacity:.5}.cmp-figure__caption{padding:var(--space-3) var(--space-4);background:var(--theme-bg-surface-secondary);text-align:center;font-size:var(--text-sm);color:var(--theme-text-muted);font-style:italic;border-top:1px solid var(--theme-border-primary)}.cmp-figure--align-left{float:left;margin-right:var(--space-6);max-width:45%}.cmp-figure--align-right{float:right;margin-left:var(--space-6);max-width:45%}.cmp-figure--align-center{text-align:center}.cmp-figure--align-center .cmp-figure__wrapper{margin-left:auto;margin-right:auto}.cmp-figure__image-container{cursor:zoom-in}.cmp-video{margin:var(--space-8) 0}.cmp-video__details{display:block;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--theme-border-primary)}.cmp-video__details:not([open]) .cmp-video__wrapper{display:none}.cmp-video__summary{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--theme-bg-surface-secondary);cursor:pointer;user-select:none;list-style:none}.cmp-video__summary::-webkit-details-marker{display:none}.cmp-video__icon svg{flex-shrink:0;color:var(--theme-text-muted)}.cmp-video__title{font-weight:500;font-size:var(--text-sm);color:var(--theme-text-primary)}.cmp-video__chevron svg{margin-left:auto;color:var(--theme-text-muted);transition:transform var(--transition-fast) ease}.cmp-video__details[open] .cmp-video__chevron svg{transform:rotate(180deg)}.cmp-video__wrapper{position:relative;overflow:hidden;background:var(--theme-bg-surface-tertiary)}.cmp-video__aspect-ratio{position:relative;width:100%}.cmp-video__aspect-ratio iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}.cmp-video-facade .cmp-video__facade{position:absolute;inset:0;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;z-index:1}.cmp-video-facade .cmp-video__facade:after{content:"";position:absolute;inset:0;background:#0006}.cmp-video__play{position:relative;z-index:2;width:72px;height:72px;border-radius:50%;background:#fffffff2;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--theme-text-primary);transition:transform .2s ease,background .2s ease}.cmp-video__play:hover{transform:scale(1.1);background:#fff}.cmp-video__play svg{margin-left:4px;width:32px;height:32px}preview-collapsible{display:block;margin:var(--spacing-6) 0;border:1px solid var(--theme-border-primary);border-radius:var(--radius-lg);overflow:hidden;background:var(--theme-bg-primary)}preview-collapsible .pc-trigger{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4) var(--spacing-4);background:var(--theme-bg-surface-secondary);cursor:pointer;user-select:none;font-weight:600;color:var(--theme-text-primary);border:none;width:100%;text-align:left;transition:all var(--transition-fast) ease}preview-collapsible .pc-trigger:hover{background:var(--theme-bg-surface-tertiary)}preview-collapsible .pc-emoji{font-size:1.3em;line-height:1;flex-shrink:0}preview-collapsible .pc-title{flex:1;font-size:var(--text-sm)}preview-collapsible .pc-chevron{display:flex;align-items:center;transition:transform var(--transition-fast) ease}preview-collapsible .pc-chevron svg{color:var(--theme-text-muted)}preview-collapsible[open] .pc-chevron svg{transform:rotate(180deg)}preview-collapsible .pc-content{padding:var(--spacing-4);background:var(--theme-bg-primary);border-top:1px solid var(--theme-border-primary)}preview-tabbed-code{display:block;margin:var(--space-6) 0;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--theme-border-primary)}preview-tabbed-code .pt-tabs{display:flex;gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--theme-bg-surface-secondary);border-bottom:1px solid var(--theme-border-primary);overflow-x:auto}preview-tabbed-code .pt-tab{padding:var(--space-2) var(--space-4);background:transparent;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;color:var(--theme-text-secondary);cursor:pointer;transition:all var(--transition-fast) ease;white-space:nowrap}preview-tabbed-code .pt-tab:hover{color:var(--theme-text-primary);background:var(--theme-bg-surface-tertiary)}preview-tabbed-code .pt-tab.active{color:var(--theme-color-primary);background:var(--theme-bg-primary)}preview-tabbed-code .pt-panels{background:var(--theme-bg-surface-secondary);padding:var(--space-2)}preview-tabbed-code .pt-panel{display:none}preview-tabbed-code .pt-panel.active{display:block}preview-code-copy{display:inline-flex;position:absolute;top:var(--space-2);right:var(--space-2);z-index:10}preview-code-copy .pcc-btn{display:flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--theme-bg-surface);border:1px solid var(--theme-border-primary);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--theme-text-secondary);cursor:pointer;transition:all var(--transition-fast) ease}preview-code-copy .pcc-btn:hover{background:var(--theme-bg-surface-secondary);color:var(--theme-text-primary)}preview-code-copy .pcc-btn.copied{background:var(--theme-color-success);border-color:var(--theme-color-success);color:#fff}preview-quiz{display:block;margin:var(--space-8) 0}preview-quiz .pq-card{background:var(--theme-bg-surface-secondary);border:1px solid var(--theme-border-primary);border-radius:var(--radius-lg);padding:var(--space-6)}preview-quiz .pq-title{font-size:var(--text-lg);font-weight:700;color:var(--theme-text-primary);margin-bottom:var(--space-4)}preview-quiz .pq-question{font-size:var(--text-base);font-weight:600;color:var(--theme-text-primary);margin-bottom:var(--space-3)}preview-quiz .pq-options{display:flex;flex-direction:column;gap:var(--space-2)}preview-quiz .pq-option{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--theme-bg-primary);border:2px solid var(--theme-border-primary);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast) ease}preview-quiz .pq-option:hover{border-color:var(--theme-color-primary)}preview-quiz .pq-option.correct{background:color-mix(in srgb,var(--theme-color-success, #22c55e) 15%,transparent);border-color:var(--theme-color-success)}preview-quiz .pq-option.incorrect{background:color-mix(in srgb,var(--theme-color-error, #ef4444) 15%,transparent);border-color:var(--theme-color-error)}preview-quiz .pq-feedback{margin-top:var(--space-4);padding:var(--space-4);border-radius:var(--radius-md);font-weight:500;display:none}preview-quiz .pq-feedback.show{display:block}preview-quiz .pq-feedback.correct{background:color-mix(in srgb,var(--theme-color-success, #22c55e) 15%,transparent);color:var(--theme-color-success)}preview-quiz .pq-feedback.incorrect{background:color-mix(in srgb,var(--theme-color-error, #ef4444) 15%,transparent);color:var(--theme-color-error)}