.shutters-accordion{--shutters-animation-duration: .35s;--shutters-animation-easing: cubic-bezier(.4, 0, .2, 1);--shutters-animation-easing-close: cubic-bezier(.4, 0, 1, 1);--shutters-focus-color: Highlight;--shutters-focus-color: -webkit-focus-ring-color;--shutters-divider-color: color-mix(in srgb, currentColor 12%, transparent);--shutters-text-color: inherit;--shutters-padding-x: .25rem;--shutters-padding-y: .75rem;box-sizing:border-box;color:var(--shutters-text-color);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}.shutters-accordion *,.shutters-accordion *:before,.shutters-accordion *:after{box-sizing:inherit}.shutters-item{border-bottom:1px solid var(--shutters-divider-color)}.shutters-item:last-child{border-bottom:none}.shutters-header{cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none;width:100%;padding:var(--shutters-padding-y) var(--shutters-padding-x);border:none;background:transparent;color:inherit;font:inherit;text-align:inherit;transition:opacity .15s ease}.shutters-header:hover{opacity:.85}.shutters-header:focus-visible{outline:2px solid var(--shutters-focus-color);outline-offset:2px;border-radius:2px}.shutters-title{flex:1;text-align:left}.shutters-icon:before{content:"+";display:inline-block;font-size:1.125em;line-height:1;transition:transform var(--shutters-animation-duration) var(--shutters-animation-easing)}.opened .shutters-icon:before{transform:rotate(45deg)}.shutters-content{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--shutters-animation-duration) var(--shutters-animation-easing-close);transition-behavior:allow-discrete}.opened .shutters-content{grid-template-rows:1fr;transition-timing-function:var(--shutters-animation-easing)}.shutters-body{min-height:0;overflow:hidden;opacity:0;padding-inline:var(--shutters-padding-x);transition:opacity calc(var(--shutters-animation-duration) * .75) ease}.opened .shutters-body{opacity:1;transition-delay:.04s}@media(prefers-reduced-motion:reduce){.shutters-content,.shutters-body,.shutters-icon:before,.shutters-header{transition:none!important}.shutters-body{opacity:1}}:root{--shutters-bg-color: #fff;--shutters-border-color: #000;--shutters-focus-color: #0066cc;--shutters-hover-bg: #f5f5f5;--shutters-text-color: #111;--shutters-divider-color: #e5e5e5}.shutters-accordion{background-color:var(--shutters-bg-color);--shutters-padding-x: clamp(.5rem, 2vw, 1rem);--shutters-padding-y: clamp(.5rem, 2vw, 1rem)}.shutters-item{border-bottom-color:var(--shutters-border-color, var(--shutters-divider-color))}.shutters-item.opened .shutters-header{background-color:var(--shutters-hover-bg)}.shutters-header{background-color:var(--shutters-bg-color);color:var(--shutters-text-color);font-size:clamp(.85rem,2vw,1rem);font-weight:500;padding:var(--shutters-padding-y) var(--shutters-padding-x);transition:background-color .15s ease,opacity .15s ease}.shutters-header:hover{opacity:1;background-color:var(--shutters-hover-bg)}.shutters-header:focus-visible{outline-color:var(--shutters-focus-color);outline-offset:-2px}.shutters-icon{color:var(--shutters-text-color);font-size:clamp(1rem,2vw,1.2rem)}.shutters-body{color:var(--shutters-text-color);line-height:1.6}.opened .shutters-body>*:first-child{margin-top:1rem}.shutters-body p{margin:0 0 1rem}.shutters-body p:last-child{margin-bottom:1rem}.shutters-body ul,.shutters-body ol{margin:0 0 1rem;padding-left:1.5rem}.shutters-body ul:last-child,.shutters-body ol:last-child{margin-bottom:0}.shutters-body li{margin-bottom:.25rem}.shutters-body li:last-child{margin-bottom:0}body{font-family:system-ui,-apple-system,sans-serif;line-height:1.6;margin:0;padding:2rem;background-color:#f9f9f9}html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;z-index:100;padding:.75rem 1rem;background:#111;color:#fff;text-decoration:none;font-weight:600;border-radius:0 0 4px}.skip-link:focus{left:0;top:0;width:auto;height:auto;overflow:visible}.container{max-width:840px;margin:0 auto}h1,h2{color:#333}h2{font-size:22px}.project-logo{font-size:2.75rem;font-weight:700;margin:0;animation:doorHinge 5s cubic-bezier(.4,0,1,1) infinite;transform-origin:center bottom}.site-header-bar{margin-bottom:.25rem}.site-nav{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;margin-bottom:.5rem}.site-nav a{font-size:.875rem;font-weight:500;color:#444;text-decoration:none;padding:.35rem .15rem;border-bottom:2px solid transparent;transition:color .15s ease,border-color .15s ease}.site-nav a:hover{color:#111}.site-nav a:focus-visible{outline:2px solid #0066cc;outline-offset:2px;border-radius:2px}.site-nav a[aria-current=page]{color:#111;border-bottom-color:#111}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.project-taglines{padding-bottom:1.25rem;.project-title{font-size:1.125rem;font-weight:600;margin:0;line-height:1.35}.project-tagline{font-size:.9375rem;font-weight:400;margin:.35rem 0 0;color:#555}p{font-size:14px;font-weight:200;margin-top:.35rem}}.page-nav{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem}.page-nav a{display:inline-block;padding:.35rem .85rem;font-size:.8125rem;font-weight:500;color:#444;text-decoration:none;background:#fff;border:1px solid #ddd;border-radius:999px;transition:border-color .15s ease,color .15s ease,background-color .15s ease}.page-nav a:hover{color:#111;border-color:#999;background:#fafafa}.page-nav a:focus-visible{outline:2px solid #0066cc;outline-offset:2px}.page-nav a[aria-current=page]{color:#111;border-color:#111;background:#f0f0f0}.project-logo-link{color:inherit;text-decoration:none}.project-logo-link:hover{opacity:.85}.about-main>.section-card{margin-bottom:1.25rem}.about-main>.section-card:last-child{margin-bottom:0}.about-main{padding-top:.5rem}.page-zone{padding-top:4rem;margin-top:4rem;border-top:1px solid #e0e0e0;scroll-margin-top:1.5rem}.page-zone:first-of-type{padding-top:2rem;margin-top:0;border-top:none}.zone-header{margin-bottom:2rem}.zone-label{margin:0 0 .35rem;font-size:.6875rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#595959}.zone-title{margin:0;font-size:1.625rem;font-weight:700;color:#111;letter-spacing:-.02em}.zone-desc{margin:.5rem 0 0;max-width:42rem;font-size:.9375rem;color:#666;line-height:1.55}.zone-desc-secondary{margin-top:.75rem}.section-card{background:#fff;border:1px solid #e8e8e8;border-radius:8px;padding:1.5rem}.page-zone>.section-card{margin-bottom:1.25rem}.page-zone>.section-card:last-child{margin-bottom:0}.section-title{margin:0 0 .75rem;font-size:1.0625rem;font-weight:600;color:#222}.section-card>p:first-of-type{margin-top:0;color:#555;font-size:.9375rem}.intro-definition{margin-bottom:1.25rem}.intro-definition p:last-child{margin-bottom:0}#faq,.fact-sheet{margin-bottom:1.25rem}.fact-sheet-list{display:grid;grid-template-columns:minmax(8rem,11rem) 1fr;gap:.5rem 1.25rem;margin:0}.fact-sheet-list dt{margin:0;font-weight:600;color:#333}.fact-sheet-list dd{margin:0;color:#555}@media(max-width:480px){.fact-sheet-list{grid-template-columns:1fr;gap:.15rem 0}.fact-sheet-list dt:not(:first-child){margin-top:.75rem}}@keyframes doorHinge{0%{clip-path:inset(0 0 0 0);transform:rotateX(0)}50%{clip-path:inset(0 0 50% 0);transform:rotateX(0)}55%{clip-path:inset(0 0 0 0);transform:rotateX(-15deg)}65%{clip-path:inset(0 0 0 0);transform:rotateX(10deg)}75%{clip-path:inset(0 0 0 0);transform:rotateX(-5deg)}85%{clip-path:inset(0 0 0 0);transform:rotateX(2deg)}to{clip-path:inset(0 0 0 0);transform:rotateX(0)}}.demo-accordion{margin:.75rem 0 0}.how-to-use{padding:0;background:transparent;border:none;border-radius:0}.how-to-use .section-title{font-size:1.0625rem;margin-bottom:1.5rem;padding-bottom:.75rem;border-bottom:1px solid #eee}.how-to-use h3{font-size:1rem;color:#222;margin-top:0;margin-bottom:.75rem;font-weight:600}.guide-section{margin-bottom:2.5rem}.guide-section:last-child{margin-bottom:0}.guide-section p{margin:0 0 1rem;color:#333;line-height:1.6}.code-block{position:relative;margin:1rem 0}.code-block pre{margin:0}.how-to-use pre,.snippet-panel pre{background-color:#f5f5f5;border:1px solid #ddd;border-radius:4px;padding:2.25rem 1rem 1rem;overflow-x:auto;margin:1rem 0}.copy-btn{position:absolute;top:.5rem;right:.5rem;z-index:1;padding:.25rem .6rem;font-family:system-ui,sans-serif;font-size:.75rem;font-weight:500;color:#333;background:#fff;border:1px solid #ccc;border-radius:4px;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.copy-btn:hover{background:#f0f0f0;border-color:#999}.copy-btn:focus-visible{outline:2px solid #0066cc;outline-offset:2px}.copy-btn--success{color:#0a6640;border-color:#0a6640}.snippet-tabs{display:flex;flex-wrap:wrap;gap:.25rem;margin:1rem 0 0;border-bottom:1px solid #ddd}.snippet-tab{margin:0;padding:.5rem 1rem;font-family:system-ui,sans-serif;font-size:.875rem;font-weight:500;color:#555;background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:color .15s ease,border-color .15s ease}.snippet-tab:hover{color:#111}.snippet-tab[aria-selected=true]{color:#000;border-bottom-color:#000}.snippet-tab:focus-visible{outline:2px solid #0066cc;outline-offset:-2px}.snippet-panels{margin-bottom:1rem}.snippet-panel[hidden]{display:none}.how-to-use code{font-family:Monaco,Menlo,Consolas,monospace;font-size:.9rem;line-height:1.5;color:#333}.how-to-use pre code{display:block;white-space:pre}.how-to-use p code,.how-to-use .option-desc code{background-color:#f5f5f5;border:1px solid #ddd;border-radius:3px;padding:.2rem .4rem;font-size:.85rem;color:#9b1c54;white-space:nowrap}.options-table{border:1px solid #ddd;border-radius:4px;overflow:hidden;margin:1rem 0}.option-row{display:grid;grid-template-columns:200px 1fr;border-bottom:1px solid #ddd;transition:background-color .15s ease}.option-row:last-child{border-bottom:none}.option-row:hover{background-color:#f9f9f9}.option-name{padding:1rem;background-color:#f5f5f5;font-weight:600;border-right:1px solid #ddd;display:flex;align-items:center}.option-name code{background-color:transparent;border:none;padding:0;color:#000;font-size:.9rem}.option-desc{padding:1rem;color:#333;line-height:1.6}.compare-table{width:100%;border-collapse:collapse;margin:1rem 0 0;font-size:.875rem}.compare-table th,.compare-table td{border:1px solid #ddd;padding:.65rem .75rem;text-align:left;vertical-align:top}.compare-table thead th{background:#f5f5f5;font-weight:600}.compare-table tbody th[scope=row]{background:#fafafa;font-weight:600}.changelog-highlights ul{margin:0;padding-left:1.25rem;color:#444}.changelog-highlights li+li{margin-top:.35rem}@media(max-width:768px){.page-zone{padding-top:3rem;margin-top:3rem}.zone-title{font-size:1.375rem}.section-card{padding:1.25rem}.how-to-use{padding:0}.how-to-use h3{font-size:.9375rem}.how-to-use pre{padding:.75rem}.how-to-use code{font-size:.85rem}.option-row{grid-template-columns:1fr}.option-name{border-right:none;border-bottom:1px solid #ddd}}@media(max-width:480px){body{padding:1.25rem}.page-nav a{font-size:.75rem;padding:.3rem .7rem}.section-card{padding:1rem;border-radius:6px}.how-to-use{padding:0;border-left:none;border-right:none;border-radius:0}.how-to-use h3{font-size:.875rem}.guide-section{margin-bottom:2rem}.how-to-use pre{padding:.5rem;margin:.75rem -.5rem}.how-to-use code{font-size:.8rem}}footer{margin-top:3rem;padding:2rem 0;border-top:1px solid #ccc;text-align:center;font-size:.9rem;color:#666;line-height:1.6}footer a{color:#333;text-decoration:underline}footer a:hover{color:#000}footer code{background-color:#f5f5f5;border:1px solid #ddd;border-radius:3px;padding:.15rem .35rem;font-size:.85rem;color:#9b1c54}.version-badge{display:inline-block;font-size:.75rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;background:#111;color:#fff;padding:.25rem .6rem;border-radius:3px;margin-bottom:.5rem}.package-links{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.package-links a{display:inline-flex;color:#111;line-height:0;transition:opacity .15s ease}.package-links a:hover{opacity:.65}.package-links a:focus-visible{outline:2px solid #0066cc;outline-offset:2px;border-radius:2px}.package-links svg{display:block}.package-links a[aria-label="View on GitHub"] svg{width:22px;height:22px}.package-links a[aria-label="View on npm"] svg{width:27px;height:27px}.styling-compare{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin:1rem 0}.styling-panel{border:1px solid #eee;border-radius:6px;padding:1rem;background:#fafafa}.styling-panel h3{margin:0 0 .5rem;font-size:1rem}.styling-panel p{font-size:.85rem;color:#555;margin:0 0 1rem}.panel-core-only.shutters-accordion{background:transparent}.panel-core-only .shutters-header{background:transparent!important;font-weight:inherit!important}.panel-core-only .shutters-header:hover{background:transparent!important;opacity:.85}@media(max-width:640px){.styling-compare{grid-template-columns:1fr}}.motion-lab-intro{margin-bottom:1rem}.motion-lab{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}.motion-lab-col{background:#fafafa;border:1px solid #eee;border-radius:6px;padding:1rem}.motion-lab-col h3{font-size:.95rem;margin:0 0 .25rem}.motion-lab-note{font-size:.8rem;color:#666;margin:0 0 .75rem}.maxheight-accordion{border:1px solid #ddd;border-radius:4px;overflow:hidden;background:#fff}.maxheight-item+.maxheight-item{border-top:1px solid #ddd}.maxheight-header{display:block;width:100%;padding:.75rem 1rem;background:#fff;border:none;font:inherit;font-weight:600;text-align:left;cursor:pointer}.maxheight-header:hover{background:#f5f5f5}.maxheight-header:focus-visible{outline:2px solid #0066cc;outline-offset:-2px}.maxheight-panel{max-height:0;overflow:hidden;transition:max-height .35s cubic-bezier(.4,0,.2,1)}.maxheight-item.is-open .maxheight-panel{max-height:120px}.maxheight-body{padding:.75rem 1rem}.maxheight-body p{margin:0;font-size:.9rem}.details-accordion details{border:1px solid #ddd;border-radius:4px;background:#fff;margin-bottom:.5rem}.details-accordion details:last-of-type{margin-bottom:0}.details-accordion summary{padding:.75rem 1rem;min-height:24px;box-sizing:border-box;cursor:pointer;font-weight:600}.details-accordion summary:focus-visible{outline:2px solid #0066cc;outline-offset:-2px}.details-body{padding:0 1rem .75rem}.details-body p{margin:0;font-size:.9rem}@media(max-width:768px){.motion-lab{grid-template-columns:1fr}}.floatingchat-container-wrap,.floatingchat-container-wrap-mobi{position:fixed!important;left:auto!important;top:auto!important;right:max(1rem,env(safe-area-inset-right,0px))!important;bottom:max(1rem,env(safe-area-inset-bottom,0px))!important;width:0!important;height:0!important;overflow:visible!important;z-index:10000!important;pointer-events:none!important}.floatingchat-container-wrap>.floatingchat-container,.floatingchat-container-wrap-mobi>.floatingchat-container-mobi{position:fixed!important;left:auto!important;top:auto!important;right:max(1rem,env(safe-area-inset-right,0px))!important;bottom:max(1rem,env(safe-area-inset-bottom,0px))!important;width:min(195px,calc(100vw - 2rem))!important;height:auto!important;min-height:65px!important;pointer-events:auto!important}.floating-chat-kofi-popup-iframe,.floating-chat-kofi-popup-iframe-mobi{left:auto!important;right:max(1rem,env(safe-area-inset-right,0px))!important;bottom:calc(max(1rem,env(safe-area-inset-bottom,0px)) + 4.5rem)!important;top:auto!important;max-width:min(calc(100vw - 2rem),420px)!important;z-index:10000!important}.floating-chat-kofi-popup-iframe-closer,.floating-chat-kofi-popup-iframe-closer-mobi{left:auto!important;right:calc(max(1rem,env(safe-area-inset-right,0px)) + 12.5rem)!important;z-index:10001!important}
