:root{--modal-bg: #ffffff;--modal-backdrop-bg: rgba(0, 0, 0, .6);--modal-color: #1a1a1a;--modal-text-secondary: rgba(0, 0, 0, .6);--modal-text-muted: rgba(0, 0, 0, .6);--modal-border-primary-color: rgba(0, 0, 0, .08);--modal-border-hover-color: rgba(0, 0, 0, .12);--modal-border-focus-color: rgba(59, 130, 246, .5);--modal-border-accent-color: rgba(255, 255, 255, .18);--modal-interactive-hover: rgba(0, 0, 0, .04);--modal-interactive-active: rgba(0, 0, 0, .08);--modal-interactive-focus: rgba(59, 130, 246, .1);--modal-close-bg: rgba(0, 0, 0, .04);--modal-close-text: rgba(0, 0, 0, .6);--modal-close-hover-bg: rgba(0, 0, 0, .08);--modal-close-hover-text: rgba(0, 0, 0, .8);--modal-scrollbar-track: rgba(0, 0, 0, .05);--modal-scrollbar-thumb: rgba(0, 0, 0, .2);--modal-scrollbar-thumb-hover: rgba(0, 0, 0, .35);--modal-scrollbar-thumb-active: rgba(0, 0, 0, .5);--modal-scrollbar-border: rgba(255, 255, 255, .1);--modal-surface-elevated: #f8fafc;--modal-surface-subtle: rgba(248, 250, 252, .5);--modal-gradient-highlight: rgba(255, 255, 255, .4);--modal-radius: 16px;--modal-radius-sm: 4px;--modal-radius-md: 8px;--modal-blur-amount: 4px;--modal-animation-scale: .96;--modal-animation-translate-y: -8px;--modal-breakpoint-mobile: 768px;--modal-breakpoint-small: 480px;--modal-close-size: 32px;--modal-close-size-mobile: 28px;--modal-min-width: 300px;--modal-min-height-header: 44px;--modal-min-height-header-mobile: 36px;--modal-min-height-footer: 48px;--modal-min-height-footer-mobile: 44px;--modal-touch-target: 44px;--modal-font-size-title-mobile: 1.25rem;--modal-font-size-description-mobile: .8rem;--modal-font-size-button: 1rem;--modal-font-size-close: 18px;--modal-font-size-close-mobile: 16px;--modal-scrollbar-width: 8px;--modal-scrollbar-margin: 4px;--modal-outline-width: 2px;--modal-outline-offset: 2px;--modal-button-radius: 4px;--modal-button-focus-color: #007bff;--modal-button-primary-bg: #007bff;--modal-button-primary-color: #ffffff;--modal-button-primary-border: #007bff;--modal-button-primary-hover-bg: #0056b3;--modal-button-primary-hover-border: #0056b3;--modal-button-primary-active-bg: #004085;--modal-button-primary-active-border: #004085;--modal-button-secondary-bg: #6c757d;--modal-button-secondary-color: #ffffff;--modal-button-secondary-border: #6c757d;--modal-button-secondary-hover-bg: #545b62;--modal-button-secondary-hover-border: #545b62;--modal-button-secondary-active-bg: #3d4142;--modal-button-secondary-active-border: #3d4142;--modal-button-danger-bg: #dc3545;--modal-button-danger-color: #ffffff;--modal-button-danger-border: #dc3545;--modal-button-danger-hover-bg: #c82333;--modal-button-danger-hover-border: #c82333;--modal-button-danger-active-bg: #a71e2a;--modal-button-danger-active-border: #a71e2a;--modal-button-success-bg: #28a745;--modal-button-success-color: #ffffff;--modal-button-success-border: #28a745;--modal-button-success-hover-bg: #218838;--modal-button-success-hover-border: #218838;--modal-button-success-active-bg: #1e7e34;--modal-button-success-active-border: #1e7e34;--modal-button-warning-bg: #ffc107;--modal-button-warning-color: #000000;--modal-button-warning-border: #ffc107;--modal-button-warning-hover-bg: #e0a800;--modal-button-warning-hover-border: #e0a800;--modal-button-warning-active-bg: #d39e00;--modal-button-warning-active-border: #d39e00;--modal-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06), 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--modal-width-md: 520px;--modal-width-full: 100vw;--modal-z-index-base: 1000;--modal-padding: 1.5rem;--modal-transition-duration: .25s;--modal-transition-easing: cubic-bezier(.4, 0, .2, 1);--modal-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--modal-font-family-mono: "Monaco", "Menlo", "Ubuntu Mono", "Consolas", monospace;--modal-font-size-title: 1.5rem;--modal-font-weight-title: 600;--modal-font-size-description: .875rem;--modal-line-height-title: 1.3;--modal-line-height-description: 1.5;--modal-spacing-xs: .5rem;--modal-spacing-sm: .75rem;--modal-spacing-md: 1rem;--modal-spacing-lg: 1.5rem;--modal-spacing-xl: 2rem;--modal-border: 1px solid var(--modal-border-primary-color);--modal-border-hover: 1px solid var(--modal-border-hover-color)}@media(prefers-color-scheme:dark){:root{--modal-bg: #1f1f23;--modal-backdrop-bg: rgba(0, 0, 0, .8);--modal-color: #f8fafc;--modal-text-secondary: rgba(255, 255, 255, .7);--modal-text-muted: rgba(255, 255, 255, .6);--modal-border-primary-color: rgba(255, 255, 255, .08);--modal-border-hover-color: rgba(255, 255, 255, .12);--modal-border-focus-color: rgba(96, 165, 250, .6);--modal-border-accent-color: rgba(255, 255, 255, .1);--modal-interactive-hover: rgba(255, 255, 255, .06);--modal-interactive-active: rgba(255, 255, 255, .12);--modal-interactive-focus: rgba(96, 165, 250, .15);--modal-close-bg: rgba(255, 255, 255, .06);--modal-close-text: rgba(255, 255, 255, .7);--modal-close-hover-bg: rgba(255, 255, 255, .12);--modal-close-hover-text: rgba(255, 255, 255, .9);--modal-scrollbar-track: rgba(255, 255, 255, .05);--modal-scrollbar-thumb: rgba(255, 255, 255, .25);--modal-scrollbar-thumb-hover: rgba(255, 255, 255, .4);--modal-scrollbar-thumb-active: rgba(255, 255, 255, .55);--modal-scrollbar-border: rgba(0, 0, 0, .1);--modal-surface-elevated: #0f0f14;--modal-surface-subtle: rgba(15, 15, 20, .5);--modal-gradient-highlight: rgba(255, 255, 255, .1);--modal-shadow: 0 4px 6px -1px rgba(0, 0, 0, .3), 0 2px 4px -1px rgba(0, 0, 0, .2), 0 20px 25px -5px rgba(0, 0, 0, .4), 0 10px 10px -5px rgba(0, 0, 0, .2);--modal-border: 1px solid var(--modal-border-primary-color);--modal-border-hover: 1px solid var(--modal-border-hover-color);--modal-button-focus-color: #60a5fa;--modal-button-primary-bg: #3b82f6;--modal-button-primary-hover-bg: #2563eb;--modal-button-primary-active-bg: #1d4ed8;--modal-button-primary-border: #3b82f6;--modal-button-primary-hover-border: #2563eb;--modal-button-primary-active-border: #1d4ed8;--modal-button-secondary-bg: #6b7280;--modal-button-secondary-hover-bg: #4b5563;--modal-button-secondary-active-bg: #374151;--modal-button-secondary-border: #6b7280;--modal-button-secondary-hover-border: #4b5563;--modal-button-secondary-active-border: #374151;--modal-button-danger-bg: #ef4444;--modal-button-danger-hover-bg: #dc2626;--modal-button-danger-active-bg: #b91c1c;--modal-button-danger-border: #ef4444;--modal-button-danger-hover-border: #dc2626;--modal-button-danger-active-border: #b91c1c;--modal-button-success-bg: #22c55e;--modal-button-success-hover-bg: #16a34a;--modal-button-success-active-bg: #15803d;--modal-button-success-border: #22c55e;--modal-button-success-hover-border: #16a34a;--modal-button-success-active-border: #15803d;--modal-button-warning-bg: #eab308;--modal-button-warning-color: #000000;--modal-button-warning-hover-bg: #ca8a04;--modal-button-warning-active-bg: #a16207;--modal-button-warning-border: #eab308;--modal-button-warning-hover-border: #ca8a04;--modal-button-warning-active-border: #a16207}}.modalBackdrop{position:fixed;inset:0;background:var(--modal-backdrop-bg);backdrop-filter:blur(var(--modal-blur-amount));-webkit-backdrop-filter:blur(var(--modal-blur-amount));display:flex;align-items:center;justify-content:center;padding:var(--modal-padding)}.modalBackdrop:has(.modal--full){padding:0;align-items:stretch;justify-content:stretch}@media(max-width:768px){.modalBackdrop{padding:0;align-items:flex-start;justify-content:flex-start}}.modalBackdrop[data-state=opening]{opacity:0;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}.modalBackdrop[data-state=open]{opacity:1;backdrop-filter:blur(var(--modal-blur-amount));-webkit-backdrop-filter:blur(var(--modal-blur-amount))}.modalBackdrop[data-state=closing]{opacity:0;backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}.modalBackdrop{transition:opacity var(--modal-transition-duration) var(--modal-transition-easing),backdrop-filter var(--modal-transition-duration) var(--modal-transition-easing),-webkit-backdrop-filter var(--modal-transition-duration) var(--modal-transition-easing)}.modal{background:var(--modal-bg);color:var(--modal-color);border-radius:var(--modal-radius);box-shadow:var(--modal-shadow);max-width:100%;overflow:hidden;position:relative;outline:none;border:1px solid var(--modal-border-accent-color);display:flex;flex-direction:column;min-height:0;font-family:var(--modal-font-family)}.modal input,.modal textarea{box-sizing:border-box}.modal:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--modal-gradient-highlight),transparent);pointer-events:none}.modal[data-state=opening]{opacity:0;transform:scale(var(--modal-animation-scale)) translateY(var(--modal-animation-translate-y))}.modal[data-state=open]{opacity:1;transform:scale(1) translateY(0)}.modal[data-state=closing]{opacity:0;transform:scale(var(--modal-animation-scale)) translateY(var(--modal-animation-translate-y))}.modal--animated{transition:opacity var(--modal-transition-duration) var(--modal-transition-easing),transform var(--modal-transition-duration) var(--modal-transition-easing)}.modal--auto{width:auto;min-width:var(--modal-min-width);max-height:90vh}.modal--md{width:var(--modal-width-md);max-height:90vh}.modal--full{width:var(--modal-width-full);height:100vh;border-radius:0;max-width:none;max-height:none}.modal--full[data-state=opening]{opacity:0;transform:none}.modal--full[data-state=open]{opacity:1;transform:none}.modal--full[data-state=closing]{opacity:0;transform:none}@media(max-width:768px){.modal--auto,.modal--md{width:100vw;height:100vh;max-width:100vw;max-height:100dvh;margin:0;border-radius:0;display:flex;flex-direction:column}.modal--auto[data-state=opening],.modal--md[data-state=opening]{opacity:0;transform:none}.modal--auto[data-state=open],.modal--md[data-state=open]{opacity:1;transform:none}.modal--auto[data-state=closing],.modal--md[data-state=closing]{opacity:0;transform:none}}.modalHeader{display:grid;grid-template-columns:1fr auto;gap:var(--modal-spacing-sm);align-items:start;padding:var(--modal-spacing-md) var(--modal-spacing-lg) var(--modal-spacing-sm);border-bottom:var(--modal-border);background:linear-gradient(180deg,var(--modal-bg) 0%,var(--modal-surface-subtle) 100%);min-height:var(--modal-min-height-header);flex-shrink:0}@media(max-width:768px){.modalHeader{padding:var(--modal-spacing-sm) var(--modal-spacing-md) var(--modal-spacing-xs);gap:var(--modal-spacing-xs);min-height:var(--modal-min-height-header-mobile)}}.modalHeader:has(.modalTitle:only-child){min-height:40px}@media(max-width:768px){.modalHeader:has(.modalTitle:only-child){min-height:32px}}.modalHeader:not(:has(.modalDescription)){padding-bottom:var(--modal-spacing-sm)}@media(max-width:768px){.modalHeader:not(:has(.modalDescription)){padding-bottom:var(--modal-spacing-xs)}}.modalHeaderContent{display:flex;flex-direction:column;gap:.25rem;min-width:0}.modalTitle{margin:0;font-size:var(--modal-font-size-title);font-weight:var(--modal-font-weight-title);line-height:var(--modal-line-height-title);color:var(--modal-color);letter-spacing:-.025em}@media(max-width:768px){.modalTitle{font-size:var(--modal-font-size-title-mobile);line-height:1.2}}.modalDescription{margin:0;color:var(--modal-text-secondary);font-size:var(--modal-font-size-description);line-height:var(--modal-line-height-description);font-weight:400}@media(max-width:768px){.modalDescription{font-size:var(--modal-font-size-description-mobile);line-height:1.4}}.modalBody{padding:var(--modal-spacing-lg) var(--modal-spacing-xl);overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;word-wrap:break-word;overflow-wrap:break-word}.modalBody img,.modalBody video,.modalBody iframe,.modalBody canvas,.modalBody svg{max-width:100%;height:auto}.modalBody pre{overflow-x:auto;max-width:100%;white-space:pre-wrap;word-break:break-all}.modalBody table{max-width:100%;width:100%;border-collapse:collapse}.modalBody .modal-wide-content{overflow-x:auto;max-width:100%}@media(max-width:768px){.modal--auto .modalBody,.modal--md .modalBody{max-height:none;flex:1;padding:var(--modal-spacing-md)}.modal--full .modalBody{max-height:none;padding:var(--modal-spacing-lg)}}.modalBody::-webkit-scrollbar{width:var(--modal-scrollbar-width)}.modalBody::-webkit-scrollbar-track{background:var(--modal-scrollbar-track);border-radius:var(--modal-radius-sm);margin:var(--modal-scrollbar-margin)}.modalBody::-webkit-scrollbar-thumb{background:var(--modal-scrollbar-thumb);border-radius:var(--modal-radius-sm);border:1px solid var(--modal-scrollbar-border)}.modalBody::-webkit-scrollbar-thumb:hover{background:var(--modal-scrollbar-thumb-hover)}.modalBody::-webkit-scrollbar-thumb:active{background:var(--modal-scrollbar-thumb-active)}.modalBody{scrollbar-width:thin;scrollbar-color:var(--modal-scrollbar-thumb) var(--modal-scrollbar-track)}.modalFooter{display:flex;align-items:center;justify-content:flex-end;gap:var(--modal-spacing-sm);padding:var(--modal-spacing-md) var(--modal-spacing-lg);border-top:var(--modal-border);background:linear-gradient(180deg,var(--modal-surface-subtle) 0%,var(--modal-bg) 100%);min-height:var(--modal-min-height-footer);flex-shrink:0}@media(max-width:768px){.modalFooter{padding:var(--modal-spacing-sm) var(--modal-spacing-md);min-height:var(--modal-min-height-footer-mobile);gap:var(--modal-spacing-xs)}.modal--auto .modalFooter,.modal--md .modalFooter{padding-bottom:max(var(--modal-spacing-sm),env(safe-area-inset-bottom))}.modal--auto .modalFooter:has(button+button),.modal--auto .modalFooter:has([role=button]+[role=button]),.modal--md .modalFooter:has(button+button),.modal--md .modalFooter:has([role=button]+[role=button]){flex-direction:column-reverse;align-items:stretch;gap:var(--modal-spacing-sm)}.modal--auto .modalFooter:has(button+button) button,.modal--auto .modalFooter:has(button+button) [role=button],.modal--auto .modalFooter:has([role=button]+[role=button]) button,.modal--auto .modalFooter:has([role=button]+[role=button]) [role=button],.modal--md .modalFooter:has(button+button) button,.modal--md .modalFooter:has(button+button) [role=button],.modal--md .modalFooter:has([role=button]+[role=button]) button,.modal--md .modalFooter:has([role=button]+[role=button]) [role=button]{width:100%;min-height:var(--modal-touch-target);padding:var(--modal-spacing-md) var(--modal-spacing-lg);font-size:var(--modal-font-size-button);font-weight:500}.modal--full .modalFooter{padding-bottom:max(var(--modal-spacing-md),env(safe-area-inset-bottom))}}@media(max-width:480px){.modalFooter{padding:var(--modal-spacing-xs) var(--modal-spacing-sm);min-height:40px}.modal--auto .modalFooter,.modal--md .modalFooter{padding-bottom:max(var(--modal-spacing-xs),env(safe-area-inset-bottom))}}.modalClose{background:var(--modal-close-bg);border:none;cursor:pointer;padding:var(--modal-spacing-sm);border-radius:var(--modal-radius-md);color:var(--modal-close-text);transition:all .15s cubic-bezier(.4,0,.2,1);width:var(--modal-close-size);height:var(--modal-close-size);display:flex;align-items:center;justify-content:center;font-size:var(--modal-font-size-close);line-height:1;flex-shrink:0}.modalHeader .modalClose{margin-top:-2px;margin-right:-4px}@media(max-width:768px){.modalClose{width:var(--modal-close-size-mobile);height:var(--modal-close-size-mobile);font-size:var(--modal-font-size-close-mobile)}.modalHeader .modalClose{margin-top:-1px;margin-right:-2px}}.modalClose:hover{background:var(--modal-close-hover-bg);color:var(--modal-close-hover-text);transform:scale(1.05)}.modalClose:focus{outline:var(--modal-outline-width) solid var(--modal-border-focus-color);outline-offset:var(--modal-outline-offset);background:var(--modal-interactive-focus)}.modalClose:active{transform:scale(.95);transition-duration:.1s}.modalButton{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--modal-font-family);font-weight:500;border:1px solid;border-radius:var(--modal-button-radius);cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none}.modalButton:focus{outline:var(--modal-outline-width) solid var(--modal-button-focus-color);outline-offset:var(--modal-outline-offset)}.modalButton--small{padding:.375rem .75rem;font-size:.875rem;line-height:1.25}.modalButton--medium{padding:.5rem 1rem;font-size:1rem;line-height:1.5}.modalButton--large{padding:.75rem 1.5rem;font-size:1.125rem;line-height:1.5}.modalButton--primary{background:var(--modal-button-primary-bg);color:var(--modal-button-primary-color);border-color:var(--modal-button-primary-border)}.modalButton--primary:hover:not(.modalButton--disabled){background:var(--modal-button-primary-hover-bg);border-color:var(--modal-button-primary-hover-border)}.modalButton--primary:active:not(.modalButton--disabled){background:var(--modal-button-primary-active-bg);border-color:var(--modal-button-primary-active-border)}.modalButton--secondary{background:var(--modal-button-secondary-bg);color:var(--modal-button-secondary-color);border-color:var(--modal-button-secondary-border)}.modalButton--secondary:hover:not(.modalButton--disabled){background:var(--modal-button-secondary-hover-bg);border-color:var(--modal-button-secondary-hover-border)}.modalButton--secondary:active:not(.modalButton--disabled){background:var(--modal-button-secondary-active-bg);border-color:var(--modal-button-secondary-active-border)}.modalButton--danger{background:var(--modal-button-danger-bg);color:var(--modal-button-danger-color);border-color:var(--modal-button-danger-border)}.modalButton--danger:hover:not(.modalButton--disabled){background:var(--modal-button-danger-hover-bg);border-color:var(--modal-button-danger-hover-border)}.modalButton--danger:active:not(.modalButton--disabled){background:var(--modal-button-danger-active-bg);border-color:var(--modal-button-danger-active-border)}.modalButton--success{background:var(--modal-button-success-bg);color:var(--modal-button-success-color);border-color:var(--modal-button-success-border)}.modalButton--success:hover:not(.modalButton--disabled){background:var(--modal-button-success-hover-bg);border-color:var(--modal-button-success-hover-border)}.modalButton--success:active:not(.modalButton--disabled){background:var(--modal-button-success-active-bg);border-color:var(--modal-button-success-active-border)}.modalButton--warning{background:var(--modal-button-warning-bg);color:var(--modal-button-warning-color);border-color:var(--modal-button-warning-border)}.modalButton--warning:hover:not(.modalButton--disabled){background:var(--modal-button-warning-hover-bg);border-color:var(--modal-button-warning-hover-border)}.modalButton--warning:active:not(.modalButton--disabled){background:var(--modal-button-warning-active-bg);border-color:var(--modal-button-warning-active-border)}.modalButton--disabled{opacity:.6;cursor:not-allowed;pointer-events:none}.modalButton--loading{position:relative}.modalButton__spinner{display:inline-flex;align-items:center;justify-content:center}.modalButton__spinnerIcon{width:1em;height:1em;animation:modalButtonSpin 1s linear infinite}.modalButton__content{display:flex;align-items:center;gap:.5rem}.modalButton__content--loading{opacity:.7}@keyframes modalButtonSpin{0%{transform:rotate(0);stroke-dashoffset:32}50%{stroke-dashoffset:0}to{transform:rotate(360deg);stroke-dashoffset:-32}}.example-container{padding:2rem;font-family:var(--modal-font-family)}.example-container .sections{display:flex;flex-direction:column;gap:2rem;margin-bottom:2rem}.confirmation-modal__data-display{margin-top:1rem;padding:.75rem;background:#f8f9fa;border-radius:4px;font-size:.9em}.confirmation-modal__data-display strong{color:#495057}.demo{border-radius:4px;margin-bottom:1rem;border:1px solid #ddd;overflow:hidden}.demo--success{border-color:#28a745;background:#f8fff9}.demo--info{border-color:#17a2b8;background:#f8fcff}.demo--warning{border-color:#ffc107;background:#fffef8}.demo__header{width:100%;padding:1rem;background:none;border:none;text-align:left;cursor:pointer;transition:background-color .2s ease}.demo__header:hover{background:#00000005}.demo__title{display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.demo__icon{font-size:.8rem;color:#666;transition:transform .2s ease}.demo__heading{margin:0;font-size:1.1rem;font-weight:600;color:inherit}.demo__description{margin:0;font-size:.9em;color:#666;font-weight:400}.demo__content{padding:0 1rem 1rem}.action-demo__button-group{display:flex;gap:.5rem;flex-wrap:wrap}.action-demo__code-hint{font-size:.9em;color:#666;margin:0}.modal-examples__state-section{margin-bottom:2rem}.modal-examples__state-title{margin:0 0 1rem;font-size:1.3rem;font-weight:600}.modal-examples__state-info{background:#f8f9fa;padding:1rem;border-radius:6px;font-family:var(--modal-font-family-mono);font-size:.9em;border:1px solid #e9ecef}.modal-examples__state-item{margin-bottom:.5rem}.modal-examples__state-item:last-child{margin-bottom:0}.modal-examples__state-item strong{color:#495057}.modal-examples__examples-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.modal-examples__status-section{margin-top:2rem;padding:1rem;background:#e7f3ff;border-radius:6px;border:1px solid #b3d7ff}.modal-examples__status-title{margin:0 0 1rem;font-size:1.2rem;font-weight:600;color:#0056b3}.modal-examples__status-list{margin:.5rem 0;padding-left:1.5rem}.modal-examples__status-list li{margin-bottom:.5rem;line-height:1.5}.modal-examples__status-list li:last-child{margin-bottom:0}.modal-examples__status-list li strong{color:#0056b3}.trigger{padding:.75rem 1.5rem;background:#6c757d;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:500;transition:all .2s ease}.trigger:hover{background:#545b62;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.trigger:active{transform:translateY(0)}.trigger:focus{outline:none;box-shadow:0 0 0 2px #6c757d4d}.alternate-trigger{padding:.625rem 1.25rem;background:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.85rem;font-weight:500;transition:all .2s ease}.alternate-trigger:hover{background:#1e7e34;transform:translateY(-1px)}.alternate-trigger:active{transform:translateY(0)}.alternate-trigger:focus{outline:none;box-shadow:0 0 0 2px #28a7454d}.modal-content{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 4px 6px #0000001a;max-width:500px;margin:2rem auto}.modal-content h3{margin:0 0 1rem;color:#495057;font-size:1.5rem;font-weight:600}.modal-content p{margin:0 0 1rem;color:#6c757d;line-height:1.6}.modal-content p code{background:#f8f9fa;padding:.125rem .25rem;border-radius:3px;font-family:var(--modal-font-family-mono);font-size:.875rem;color:#e83e8c}.box{padding:1rem;border-radius:4px;margin:1rem 0;font-size:.9em;color:#000}.box--success{background:#e8f5e8}.box--warning{background:#fff3cd}.box--danger{background:#f8d7da}.icon-trigger{padding:.75rem;background:linear-gradient(135deg,#6f42c1,#5a32a3);color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:1.1rem;width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:0 2px 8px #6f42c14d}.icon-trigger:hover{background:linear-gradient(135deg,#5a32a3,#4c2a85);transform:scale(1.1);box-shadow:0 4px 12px #6f42c166}.icon-trigger:active{transform:scale(1.05)}.icon-trigger:focus{outline:none;box-shadow:0 0 0 3px #6f42c14d}.custom-trigger{padding:.75rem 1.5rem;background:linear-gradient(135deg,#007bff,#0056b3);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:500;transition:all .3s ease;box-shadow:0 2px 4px #007bff33}.custom-trigger:hover{background:linear-gradient(135deg,#0056b3,#004085);transform:translateY(-2px);box-shadow:0 4px 8px #007bff4d}.custom-trigger:active{transform:translateY(0)}.custom-trigger:focus{outline:none;box-shadow:0 0 0 3px #007bff4d}.disabled-trigger{padding:.75rem 1.5rem;background:#e9ecef;border:1px solid #dee2e6;border-radius:6px;font-size:.9rem;font-weight:500;opacity:.6;cursor:pointer}.disabled-trigger--disabled{cursor:not-allowed;color:#adb5bd}.section{padding:1.5rem;background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;transition:all .2s ease}.section:hover{background:#f1f3f4;border-color:#dee2e6}.section__title{margin:0 0 .75rem;color:#495057;font-size:1.25rem;font-weight:600}.section__description{margin:0 0 1rem;color:#6c757d;font-size:.9rem;line-height:1.5}.scroll-lock-modal__main-text{margin-bottom:1rem}.scroll-lock-modal__main-text strong{color:#007bff;font-weight:600}.scroll-lock-modal__description{margin-bottom:1.5rem;line-height:1.5}.scroll-lock-modal__closing-note{font-size:.9em;color:#666;margin-top:1rem;line-height:1.5}.content-block{padding:1rem;margin:.5rem 0;border-radius:4px;color:#000}.content-block--even{background:#f8f9fa}.content-block--odd{background:#e9ecef}.content-block__title{margin:0 0 .5rem;font-size:1rem;font-weight:600}.content-block__text{margin:.5rem 0;font-size:.9em;line-height:1.5}.custom-modal__body{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;padding:2rem}.custom-modal__title{color:#fff;margin-top:0;margin-bottom:1rem;font-size:1.5rem}.custom-modal__description{margin-bottom:1rem;line-height:1.5}.custom-modal__features-box{background:#ffffff1a;padding:1rem;border-radius:6px;margin-top:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.custom-modal__features-list{margin:.5rem 0;padding-left:1rem}.custom-modal__final-note{margin-bottom:0;opacity:.9;line-height:1.5}.custom-modal__footer-button{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);padding:.5rem 1rem;border-radius:4px;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s ease}.scrollable-modal__intro{font-weight:600;margin-bottom:1rem}.accessibility-demo__input{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:4px;margin-top:.5rem}.long-text{padding:0 0 1rem;color:#ccc;margin-bottom:1rem}@media(max-width:768px){.scroll-optimization-demo{padding:1rem}.scroll-optimization-demo__title{font-size:1.5rem}.scroll-optimization-demo__button{width:100%;text-align:center}.scroll-optimization-demo__table-container{-webkit-overflow-scrolling:touch}}@media(max-width:480px){.scroll-optimization-demo{padding:.75rem}.scroll-optimization-demo__title{font-size:1.25rem}.scroll-optimization-demo__button{padding:.625rem 1rem;font-size:.875rem}}.image-section{margin-bottom:2rem}.placeholder-image{width:100%;height:200px;background:linear-gradient(45deg,#7f8993,#e9ecef);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#6c757d;font-weight:500;border:2px dashed #dee2e6}.section-title{margin:0 0 1rem;font-size:1.25rem;font-weight:600;color:#495057}.form-section{margin-bottom:2rem}.form-section .form{display:flex;flex-direction:column;gap:1rem}.form-section .input,.form-section textarea{padding:.5rem;border:1px solid #ced4da;border-radius:4px;width:100%;font-size:1rem;transition:border-color .15s ease}.form-section .input:focus,.form-section textarea:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.form-section .input::placeholder,.form-section textarea::placeholder{color:#6c757d}.form-section textarea{resize:vertical;min-height:100px;font-family:var(--modal-font-family)}.table-intro{margin-bottom:1rem}.table-intro__title{display:block;margin-bottom:.5rem;font-weight:600;color:#495057}.table-intro__description{margin:0;color:#6c757d;line-height:1.5}.table-container{overflow-x:auto;border:1px solid #dee2e6;border-radius:6px;margin-bottom:2rem}.table-container .table{width:100%;min-width:700px;border-collapse:collapse}.table-container .table-head{background:#f8f9fa}.table-container .table-header{padding:.75rem;text-align:left;border-bottom:1px solid #dee2e6;font-weight:600;color:#495057;white-space:nowrap}.table-container .table-row:hover{background:#f8f9fa}.table-container .table-cell{padding:.75rem;border-bottom:1px solid #eee;color:#495057;white-space:nowrap}.table-container .table-button{padding:.25rem .5rem;background:#007bff;color:#fff;border:none;border-radius:3px;cursor:pointer;font-size:.75rem;font-weight:500;transition:background-color .2s ease}.table-container .table-button:hover{background:#0056b3}.table-summary{margin-top:2rem}.table-summary__title{margin:0 0 .5rem;font-size:1.125rem;font-weight:600;color:#495057}.table-summary__text{margin:0;color:#6c757d;line-height:1.5}.header-spacing-demo__modal-content p{margin:0 0 1rem;line-height:1.5}.header-spacing-demo__modal-content ul{margin:.5rem 0;padding-left:1.2rem;line-height:1.5}.header-spacing-demo__modal-content strong{color:#333}.footer-mobile-demo__form{display:flex;flex-direction:column;gap:1rem}.footer-mobile-demo__form-field label{display:block;margin-bottom:.5rem;font-weight:500}.footer-mobile-demo__form-field input,.footer-mobile-demo__form-field textarea{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.footer-mobile-demo__form-field input::placeholder,.footer-mobile-demo__form-field textarea::placeholder{color:#999}.footer-mobile-demo__form-field textarea{resize:vertical}.modal-body-content-types-demo__grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin-bottom:2rem}.modal-body-content-types-demo__trigger-button{padding:1rem;border:none;border-radius:8px;cursor:pointer;text-align:left;transition:all .3s ease;box-shadow:0 2px 4px #0000001a}.modal-body-content-types-demo__trigger-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.modal-body-content-types-demo__trigger-button:active{transform:translateY(0)}.modal-body-content-types-demo__trigger-button--images{background:linear-gradient(135deg,#007bff,#0056b3);color:#fff}.modal-body-content-types-demo__trigger-button--video{background:linear-gradient(135deg,#28a745,#1e7e34);color:#fff}.modal-body-content-types-demo__trigger-button--iframe{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff}.modal-body-content-types-demo__trigger-button--code{background:linear-gradient(135deg,#6f42c1,#5a32a3);color:#fff}.modal-body-content-types-demo__trigger-button--data-viz{background:linear-gradient(135deg,#fd7e14,#e8690b);color:#fff}.modal-body-content-types-demo__trigger-button--wide{background:linear-gradient(135deg,#20c997,#1aa179);color:#fff}.modal-body-content-types-demo__trigger-button--fixed{background:linear-gradient(135deg,#6c757d,#545b62);color:#fff}.modal-body-content-types-demo__trigger-button--edge{background:linear-gradient(135deg,#343a40,#23272b);color:#fff}.modal-body-content-types-demo__trigger-title{font-weight:700;font-size:1rem;margin-bottom:.25rem;display:block}.modal-body-content-types-demo__trigger-description{font-size:.875rem;opacity:.9}.modal-body-content-types-demo__goals{padding:1rem;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef;margin-bottom:2rem}.modal-body-content-types-demo__goals-title{margin:0 0 .75rem;color:#495057;font-size:1.125rem;font-weight:600}.modal-body-content-types-demo__goals-list{margin:0;padding-left:1.5rem;font-size:.9rem;color:#495057}.modal-body-content-types-demo__goal{margin-bottom:.5rem;line-height:1.4}.modal-body-content-types-demo__goal strong{color:#212529}.modal-body-content-types-demo__modal-content .content-section{margin-bottom:1.5rem}.modal-body-content-types-demo__modal-content .content-section:last-child{margin-bottom:0}.modal-body-content-types-demo__modal-content .content-section h4{margin:0 0 .5rem;color:#495057;font-size:1.125rem;font-weight:600}.modal-body-content-types-demo__modal-content .content-section p{margin:0 0 1rem;color:#6c757d;line-height:1.5}.modal-body-content-types-demo__modal-content .content-section p:last-child{margin-bottom:0}.modal-body-content-types-demo__large-image{width:100%;height:400px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.2rem;font-weight:700;margin-bottom:1rem;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.1'%3E%3Ccircle cx='30' cy='30' r='4'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}.modal-body-content-types-demo__image-gallery{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin-bottom:1rem}.modal-body-content-types-demo__gallery-item{aspect-ratio:1;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;transition:transform .2s ease}.modal-body-content-types-demo__gallery-item:hover{transform:scale(1.02)}.modal-body-content-types-demo__video-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;margin-bottom:1rem}.modal-body-content-types-demo__video-progress{position:absolute;bottom:10px;left:10px;right:10px;height:4px;background:#ffffff4d;border-radius:2px}.modal-body-content-types-demo__video-progress-fill{width:40%;height:100%;background:#ff4757;border-radius:2px}.modal-body-content-types-demo__video-controls{display:flex;align-items:center;gap:1rem;padding:1rem;background:#f8f9fa;border-radius:8px;margin-bottom:1rem}.modal-body-content-types-demo__video-controls button{padding:.5rem 1rem;background:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:500}.modal-body-content-types-demo__video-controls button:hover{background:#1e7e34}.modal-body-content-types-demo__video-controls span{font-size:.9rem;color:#666}.modal-body-content-types-demo__code-block{background:#2d3748;color:#e2e8f0;padding:1rem;border-radius:8px;overflow-x:auto;font-size:.875rem;line-height:1.5;margin-bottom:1rem;font-family:var(--modal-font-family-mono)}.modal-body-content-types-demo__json-example{background:#f8f9fa;padding:1rem;border-radius:8px;border:1px solid #e9ecef;margin-bottom:1rem}.modal-body-content-types-demo__json-example h5{margin:0 0 .5rem;color:#495057;font-size:1rem}.modal-body-content-types-demo__json-example pre{background:#fff;padding:.75rem;border-radius:4px;border:1px solid #ddd;overflow-x:auto;font-size:.8rem;margin:0;font-family:var(--modal-font-family-mono)}.modal-body-content-types-demo__wide-table{overflow-x:auto;border:1px solid #ddd;border-radius:8px;margin-bottom:1rem}.modal-body-content-types-demo__wide-table table{width:100%;min-width:800px;border-collapse:collapse}.modal-body-content-types-demo__wide-table th,.modal-body-content-types-demo__wide-table td{padding:.75rem;text-align:left;border-bottom:1px solid #eee}.modal-body-content-types-demo__wide-table th{background:#f8f9fa;border-bottom:1px solid #ddd;min-width:150px;font-weight:600}.modal-body-content-types-demo__wide-element{background:linear-gradient(90deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4,#ffeaa7);height:60px;border-radius:8px;margin-bottom:1rem;width:1200px;max-width:100%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1.1rem}.modal-body-content-types-demo__chart-svg{width:100%;height:200px;border:1px solid #ddd;border-radius:8px;margin-bottom:1rem}.modal-body-content-types-demo__canvas-viz{width:100%;height:150px;background:#000;border-radius:8px;position:relative;overflow:hidden;margin-bottom:1rem}.modal-body-content-types-demo__data-point{position:absolute;border-radius:50%;animation:pulse 2s infinite alternate}.modal-body-content-types-demo__viz-label{position:absolute;top:10px;left:10px;color:#fff;font-size:.9rem}.modal-body-content-types-demo__sticky-header{position:sticky;top:0;background:#007bff;color:#fff;padding:.75rem 1rem;margin-bottom:1rem;border-radius:6px;z-index:1;font-weight:500}.modal-body-content-types-demo__content-block{padding:1rem;margin-bottom:1rem;border-radius:6px}.modal-body-content-types-demo__content-block--even{background:#f8f9fa}.modal-body-content-types-demo__content-block--odd{background:#e9ecef}.modal-body-content-types-demo__content-block strong{color:#495057}.modal-body-content-types-demo__content-block p{margin:.5rem 0 0;color:#666;line-height:1.4}.modal-body-content-types-demo__positioning-container{position:relative;height:200px;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef;padding:1rem}.modal-body-content-types-demo__positioning-container h5{margin:0 0 .5rem;color:#495057}.modal-body-content-types-demo__positioning-container p{margin:0;color:#6c757d;line-height:1.4}.modal-body-content-types-demo__floating-button{position:absolute;bottom:15px;right:15px;width:50px;height:50px;border-radius:50%;background:#28a745;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0003;border:none;font-size:1.2rem;transition:transform .2s ease}.modal-body-content-types-demo__floating-button:hover{transform:scale(1.1)}.modal-body-content-types-demo__iframe-placeholder{width:100%;height:300px;border:2px dashed #ccc;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f8f9fa;margin-bottom:1rem}.modal-body-content-types-demo__iframe-placeholder-icon{font-size:2rem;margin-bottom:.5rem}.modal-body-content-types-demo__iframe-placeholder-title{font-weight:700;margin-bottom:.5rem}.modal-body-content-types-demo__iframe-placeholder-description{font-size:.9rem;color:#666;text-align:center;max-width:300px}.modal-body-content-types-demo__embedded-widget{border:1px solid #ddd;border-radius:8px;overflow:hidden;margin-bottom:1rem}.modal-body-content-types-demo__embedded-widget-header{background:#007bff;color:#fff;padding:.75rem 1rem;font-size:.9rem;font-weight:700}.modal-body-content-types-demo__embedded-widget-content{padding:1rem}.modal-body-content-types-demo__embedded-widget-metric{display:flex;gap:1rem;align-items:center;margin-bottom:1rem}.modal-body-content-types-demo__embedded-widget-circle{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700}.modal-body-content-types-demo__embedded-widget-info h6{font-weight:700;margin:0 0 .25rem}.modal-body-content-types-demo__embedded-widget-info p{font-size:.9rem;color:#666;margin:0}.modal-body-content-types-demo__embedded-widget-progress{height:4px;background:#e9ecef;border-radius:2px;overflow:hidden}.modal-body-content-types-demo__embedded-widget-progress-fill{width:42%;height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:2px}.modal-body-content-types-demo__minimal-content{padding:1rem;text-align:center;color:#666}.modal-body-content-types-demo__features-box{padding:1rem;border-radius:6px;border:1px solid}.modal-body-content-types-demo__features-box--info{background:#e7f3ff;border-color:#b3d7ff;color:#0c5460}.modal-body-content-types-demo__features-box--warning{background:#fff3cd;border-color:#ffeaa7;color:#856404}.modal-body-content-types-demo__features-box--success{background:#d4edda;border-color:#c3e6cb;color:#155724}.modal-body-content-types-demo__features-box strong{display:block;margin-bottom:.5rem;font-weight:600}.modal-body-content-types-demo__features-box ul{margin:.5rem 0 0;padding-left:1.2rem}.modal-body-content-types-demo__features-box li{margin-bottom:.25rem;line-height:1.4}@keyframes pulse{0%{opacity:.4;transform:scale(.8)}to{opacity:1;transform:scale(1.2)}}@media(max-width:768px){.modal-body-content-types-demo__grid{grid-template-columns:1fr}.modal-body-content-types-demo__trigger-button,.modal-body-content-types-demo__goals{padding:.75rem}.modal-body-content-types-demo__goals-title{font-size:1rem}.modal-body-content-types-demo__image-gallery{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}.modal-body-content-types-demo__video-controls{flex-direction:column;align-items:stretch;gap:.5rem}.modal-body-content-types-demo__wide-table{font-size:.875rem}}@media(max-width:480px){.modal-body-content-types-demo__trigger-button{padding:.625rem}.modal-body-content-types-demo__trigger-title{font-size:.9rem}.modal-body-content-types-demo__trigger-description{font-size:.8rem}.modal-body-content-types-demo__goals{padding:.5rem}.modal-body-content-types-demo__goals-list{font-size:.85rem}.modal-body-content-types-demo__image-gallery{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:.75rem}.modal-body-content-types-demo__code-block{font-size:.8rem}}.mobile-responsive-test code{background:#0000001a;padding:.2rem .4rem;border-radius:3px;font-family:var(--modal-font-family-mono);font-size:.85rem}.mobile-responsive-test__modal-content p{margin-bottom:1rem;line-height:1.6;color:#495057}.mobile-responsive-test__modal-content p code{background:#f8f9fa;padding:.2rem .4rem;border-radius:3px;font-family:var(--modal-font-family-mono);font-size:.9rem;color:#e83e8c}.programmatic-modal-example__actions{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.programmatic-modal-example__button{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-size:.875rem;font-weight:500;transition:all .2s ease;white-space:nowrap}.programmatic-modal-example__button:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.programmatic-modal-example__button:active{transform:translateY(0)}.programmatic-modal-example__button--info{background:#007bff;color:#fff}.programmatic-modal-example__button--info:hover{background:#0056b3}.programmatic-modal-example__button--success{background:#28a745;color:#fff}.programmatic-modal-example__button--success:hover{background:#1e7e34}.programmatic-modal-example__button--secondary{background:#6c757d;color:#fff}.programmatic-modal-example__button--secondary:hover{background:#545b62}.programmatic-modal-example__button--warning{background:#ffc107;color:#212529}.programmatic-modal-example__button--warning:hover{background:#e0a800}.programmatic-modal-example__status{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;margin-bottom:1rem;background:linear-gradient(135deg,#e7f3ff,#d1ecf1);border:1px solid #b3d9ff;border-radius:6px;font-size:.9rem;animation:slideIn .3s ease-out}.programmatic-modal-example__status-text{color:#0c5460;font-weight:500;flex:1}.programmatic-modal-example__status-close{background:none;border:none;color:#0c5460;cursor:pointer;padding:.25rem;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin-left:.5rem;transition:all .2s ease}.programmatic-modal-example__status-close:hover{background:#0c54601a}.programmatic-modal-example__states{margin-bottom:1rem;padding:1rem;background:#f8f9fa;border-radius:6px;border:1px solid #dee2e6}.programmatic-modal-example__states-title{display:block;margin-bottom:.5rem;color:#495057;font-weight:600;font-size:.9rem}.programmatic-modal-example__states-list{margin:0;padding:0;list-style:none}.programmatic-modal-example__state{display:flex;align-items:center;justify-content:space-between;padding:.25rem 0;font-size:.85rem}.programmatic-modal-example__state-label{color:#6c757d;font-weight:500}.programmatic-modal-example__state-indicator{font-weight:600;padding:.125rem .5rem;border-radius:12px;font-size:.75rem;transition:all .2s ease}.programmatic-modal-example__state-indicator--open{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.programmatic-modal-example__state-indicator--closed{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.programmatic-modal-example__usage{padding:1rem;background:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;margin-bottom:1rem}.programmatic-modal-example__usage-title{display:block;margin-bottom:.5rem;color:#856404;font-weight:600;font-size:.9rem}.programmatic-modal-example__usage-list{margin:0;padding-left:1rem;color:#856404}.programmatic-modal-example__usage-list li{margin-bottom:.25rem;font-size:.85rem;line-height:1.4}.programmatic-modal-example__usage-list li code{background:#8564041a;color:#533f03;padding:.125rem .25rem;border-radius:3px;font-family:var(--modal-font-family-mono);font-size:.8rem}.programmatic-modal-example__modal-content p{margin-bottom:1rem;line-height:1.6;color:#495057}.programmatic-modal-example__modal-content p:last-child{margin-bottom:0}.programmatic-modal-example__modal-content .highlight{background:#fff3cd;padding:.125rem .25rem;border-radius:3px}.programmatic-modal-example__modal-description{font-size:.9rem;color:#6c757d;margin-bottom:0}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.programmatic-modal-example__actions{flex-direction:column;align-items:stretch}.programmatic-modal-example__button{width:100%;text-align:center}.programmatic-modal-example__status{padding:.5rem .75rem;font-size:.85rem}.programmatic-modal-example__state{font-size:.8rem}.programmatic-modal-example__usage{padding:.75rem}.programmatic-modal-example__usage-list li{font-size:.8rem}}@media(max-width:480px){.programmatic-modal-example__button{padding:.625rem .75rem;font-size:.8rem}.programmatic-modal-example__status{padding:.5rem;font-size:.8rem}.programmatic-modal-example__states,.programmatic-modal-example__usage{padding:.5rem}.programmatic-modal-example__usage-list li code{font-size:.75rem}}.auto-modal__content{padding:1rem}.auto-modal__footer-button{padding:.5rem 1rem;background:#6c757d;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.auto-modal__footer-button:hover{background:#545b62}.auto-modal__footer-button:focus{outline:2px solid #6c757d;outline-offset:2px}.md-modal__content{padding:1rem}.md-modal__use-cases{margin-bottom:1rem}.md-modal__form{margin-top:1rem}.md-modal__form-field{margin-bottom:1rem}.md-modal__label{display:block;margin-bottom:.5rem;font-weight:500}.md-modal__input{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:4px;font-size:1rem}.md-modal__input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 2px #007bff40}.md-modal__footer-button{padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.md-modal__footer-button:focus{outline:2px solid currentColor;outline-offset:2px}.md-modal__footer-button--cancel{background:#6c757d;color:#fff;margin-right:.5rem}.md-modal__footer-button--cancel:hover{background:#545b62}.md-modal__footer-button--save{background:#007bff;color:#fff}.md-modal__footer-button--save:hover{background:#0056b3}.full-modal__cards-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));margin-top:2rem}.full-modal__card{padding:1rem;background:#f8f9fa;border-radius:8px;border:1px solid #e9ecef}.full-modal__card h4{margin:0 0 1rem;color:#495057}.full-modal__card p{margin:0;line-height:1.5;color:#6c757d}.custom-modal__content{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none}.custom-modal__header{border-bottom:1px solid rgba(255,255,255,.2)}.custom-modal__description{color:#fffc}.custom-modal__close{color:#fff}.custom-modal__body{padding:2rem}.custom-modal__title{color:#fff;margin-bottom:1rem;font-size:1.5rem}.custom-modal__intro{color:#ffffffe6;line-height:1.6;margin-bottom:1.5rem}.custom-modal__features-box{margin-top:1.5rem;padding:1rem;background:#ffffff1a;border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.custom-modal__features-title{font-weight:600;margin-bottom:.5rem}.custom-modal__features-list{margin-top:.5rem;padding-left:1.5rem}.custom-modal__features-list li{margin-bottom:.25rem}.custom-modal__footer{border-top:1px solid rgba(255,255,255,.2)}.custom-modal__footer-button{padding:.75rem 1.5rem;background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s ease}.custom-modal__footer-button:hover{background:#ffffff4d}.custom-modal__footer-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.no-backdrop-modal__content{padding:2rem}.no-backdrop-modal__warning-box{padding:1rem;background:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;margin-bottom:1rem}.no-backdrop-modal__warning-box strong{color:#856404}.no-backdrop-modal__description{margin-bottom:1rem;line-height:1.5}.no-backdrop-modal__description code{background:#0000001a;padding:.2em .4em;border-radius:3px;font-family:var(--modal-font-family-mono)}.no-backdrop-modal__features-list{margin-top:1rem;padding-left:1.5rem}.no-backdrop-modal__features-list li{margin-bottom:.5rem}.no-backdrop-modal__code-example{margin-top:1.5rem;padding:1rem;background:#f8f9fa;border-radius:4px;font-family:var(--modal-font-family-mono);font-size:.9em;border:1px solid #e9ecef}.no-backdrop-modal__footer-button{padding:.75rem 1.5rem;background:#fd7e14;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.no-backdrop-modal__footer-button:hover{background:#e8650e}.no-backdrop-modal__footer-button:focus{outline:2px solid #fd7e14;outline-offset:2px}