/* A native horizontal gallery. Only the phones change depth; copy stays in flow. */
.library{--library-panel-width:400px;--library-gap:52px;--library-phone-width:280px;padding-block:92px 106px;position:relative;isolation:isolate}
.library-heading{text-align:center}
.library-heading h2{margin-bottom:22px}
.library-heading>p{max-width:570px;margin-inline:auto}
.library-controls{display:flex;justify-content:center;align-items:center;gap:26px;margin-top:30px}
.library-controls[hidden]{display:none}
.library-selectors,.library-arrows{display:flex;gap:6px;align-items:center}
.library-selectors{padding:5px;border:1px solid var(--line);border-radius:100px}
.library-controls button{min-height:44px;min-width:44px;border:0;background:transparent;cursor:pointer;font-size:var(--small);line-height:1.25;transition:background .2s,color .2s}
.library-selectors button{padding:12px 21px;border-radius:100px}
.library-selectors button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.library-arrows button{display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;width:46px;height:46px}
.library-arrows button:disabled{opacity:.3;cursor:default}
.library-track{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:var(--library-panel-width);gap:var(--library-gap);align-items:start;width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:42px max(24px,calc((100% - var(--library-panel-width))/2)) 28px;-webkit-overflow-scrolling:touch}
.library-track::-webkit-scrollbar{display:none}
.library-track:focus-visible{outline-offset:-8px}
.library-panel{min-width:0;position:relative;scroll-snap-align:center;scroll-margin:0}
.library-visual{display:flex;justify-content:center;perspective:1300px;padding-inline:24px}
.library .library-phone{width:var(--library-phone-width);flex:0 0 auto;transform:var(--library-transform,translate3d(0,0,0));opacity:var(--library-phone-opacity,1);transform-origin:50% 50%}
.library .library-phone:before{box-shadow:0 20px 34px #3a231628}
.library-copy{position:relative;text-align:center;padding:46px 8px 0;opacity:var(--library-copy-opacity,1)}
.library-copy h3{font-size:var(--body);font-weight:600;line-height:1.4;letter-spacing:-.015em;margin:0 0 15px;text-wrap:balance}
.library-copy p{font-size:var(--body);line-height:1.55;margin:0}
.library-status{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(hover:hover) and (pointer:fine){.library-selectors button:not([aria-pressed="true"]):hover,.library-arrows button:not(:disabled):hover{background:#1a0f0a0b}}
@media(max-width:1000px){
 .library{--library-panel-width:360px;--library-gap:24px;--library-phone-width:265px;padding-block:70px 88px}
}
@media(max-width:700px){
 .library{--library-panel-width:clamp(212px,calc(100vw - 120px),280px);--library-gap:16px;--library-phone-width:min(270px,calc(100vw - 106px));padding-block:54px 68px}
 .library-heading h2{max-width:330px;margin-inline:auto;margin-bottom:18px}
 .library-heading>p{max-width:390px}
 .library-controls{gap:14px;flex-wrap:wrap;margin-top:24px}
 .library-selectors{gap:2px;padding:4px}
 .library-selectors button{padding-inline:17px}
 .library-arrows{display:none}
 .library-track{padding-top:32px;padding-bottom:24px}
 .library-visual{padding-inline:8px}
 .library-copy{padding:32px 0 0}
 .library-copy h3{font-size:var(--body);margin-bottom:14px}
}
@media(prefers-reduced-motion:reduce){
 .library .library-phone{transform:none;opacity:1}
 .library-copy{opacity:1}
 .library-controls button{transition:none}
}