.library-page { margin:0; background:#090a0c; color:#eeeff2; font-family:var(--public-font); color-scheme:dark; overflow-x:clip; overflow-y:visible; }
.library-page *, .library-page *::before, .library-page *::after { box-sizing:border-box; }
.lib-toolbar button,.lib-toolbar input,.lib-toolbar select,.lib-layout button,.lib-dialog button { font:inherit; }
.library-page button { cursor:pointer; }
:is(.lib-toolbar,.lib-layout,.lib-dialog) :is(button,a,input,select):focus-visible { outline:2px solid #94bbff; outline-offset:4px; }
.library-page [hidden] { display:none !important; }
.lib-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.lib-skip { position:fixed; left:20px; top:-80px; z-index:3000; padding:12px; background:#20242e; color:white; }.lib-skip:focus { top:12px; }
.lib-toolbar { position:sticky; top:0; z-index:100; padding:12px 20px; background:rgba(9,10,12,.94); border-bottom:1px solid #202125; backdrop-filter:blur(12px); }
.lib-controls { max-width:1640px; margin:auto; display:flex; gap:18px; align-items:center; padding:6px; border:1px solid #292b30; border-radius:18px; background:linear-gradient(115deg,#17181c,#101114); box-shadow:inset 0 1px 0 #ffffff07; }
.lib-categories { display:flex; gap:3px; overflow-x:auto; scrollbar-width:none; flex:1; min-width:0; }.lib-categories::-webkit-scrollbar { display:none; }
.lib-chip,.lib-glass { color:#adb0b9; background:transparent; border:1px solid transparent; border-radius:999px; padding:10px 12px; white-space:nowrap; font-size:12px !important; line-height:1.2; transition:background .18s,border-color .18s,color .18s; }
.lib-chip:hover,.lib-glass:hover { background:#ffffff07; color:#fff; border-color:#ffffff20; }
.lib-chip[aria-pressed=true],.lib-glass.is-selected,.lib-primary { color:#f5f7ff; border:1px solid transparent; background:linear-gradient(115deg,#232833,#13161d) padding-box,linear-gradient(115deg,#607da8aa,#dbe6f566,#45608599) border-box; box-shadow:inset 0 1px 0 #ffffff10,inset 0 -8px 20px #4479bd09; }
.lib-tools { display:flex; align-items:center; gap:8px; flex-shrink:0; padding-right:3px; }.lib-search { display:flex; align-items:center; gap:8px; width:165px; padding:8px 10px; border:1px solid #303136; border-radius:10px; background:#0c0d10; }
.lib-search input { width:100%; min-width:0; color:#e9eaf0; border:0; background:none; outline:none; font-size:12px; }.lib-search:focus-within { border-color:#7897c1; }.lib-search kbd { color:#92969f; font-size:10px; border:1px solid #34363d; padding:1px 4px; border-radius:3px; }
.lib-sort { max-width:106px; padding:9px 3px; border:0; background:#131417; color:#c5c7ce; font-size:12px !important; }
.lib-icon { width:18px; height:18px; display:block; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.lib-icon-button { display:flex; align-items:center; justify-content:center; padding:9px; border:1px solid #303136; border-radius:10px; background:#16171b; color:#aeb2bc; }
.lib-filter-count:empty { display:none; }.lib-filter-count { font-size:10px; margin-left:5px; color:#aac6ef; }
.lib-layout { max-width:1680px; margin:auto; display:grid; grid-template-columns:82px minmax(0,1fr); gap:20px; padding:0 24px 40px 12px; }
.lib-rail { position:sticky; top:98px; align-self:start; padding-top:29px; display:flex; flex-direction:column; gap:16px; }
.lib-rail button { display:flex; flex-direction:column; gap:8px; align-items:center; background:none; border:0; border-radius:12px; padding:10px 0; color:#858994; font-size:10px; }.lib-rail button svg { width:20px; height:20px; }.lib-rail button:hover,.lib-rail button[aria-pressed=true] { color:#d2dff2; background:#1a1e27; }.lib-rail .lib-rail-divider { height:1px; margin:0 19px; background:#26272c; }
.lib-catalog { min-width:0; }.lib-summary { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:25px 0 20px; }.lib-heading { display:flex; align-items:baseline; gap:14px; }.lib-heading h1 { margin:0; font-size:18px; font-weight:500; letter-spacing:-.5px; }.lib-heading span { font-size:11px; color:#92969f; }.lib-summary-note { color:#9499a3; font-size:11px; display:flex; align-items:center; gap:7px; }.lib-summary-note::before { content:''; width:5px; height:5px; border-radius:50%; background:#8b9eb9; }
.lib-active { display:flex; flex-wrap:wrap; gap:6px; padding-bottom:16px; }.lib-active:empty { display:none; }.lib-active button { padding:7px 10px; border:1px solid #373e4b; border-radius:999px; color:#cad4e4; background:#171b23; font-size:11px; }
.lib-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px 20px; }
.lib-card { position:relative; min-width:0; border:1px solid #27282d; border-radius:15px; background:#111215; overflow:hidden; transition:border-color .2s,transform .2s; }.lib-card:hover { transform:translateY(-2px); border-color:#586170; }
.lib-card-open { padding:0; width:100%; display:block; text-align:left; color:inherit; border:0; background:none; }.lib-preview { aspect-ratio:1.37; overflow:hidden; background:#191a20; }.lib-preview img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .35s; }.lib-card:hover img { transform:scale(1.015); }
.lib-card-info { padding:16px 16px 18px; }.lib-type { font-size:9px; font-weight:500; letter-spacing:1.2px; color:#9b9ea8; text-transform:uppercase; }.lib-card h2 { margin:8px 0 6px; font-size:15px; font-weight:500; letter-spacing:-.3px; line-height:1.25; }.lib-description { margin:0; font-size:11px; color:#969aa5; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lib-card-bottom { margin-top:17px; display:flex; align-items:center; justify-content:space-between; }.lib-price { font-size:12px; color:#e3e5eb; }.lib-price.is-free { color:#b6cdf1; }.lib-format { color:#858a96; font-size:10px; }
.lib-favorite { position:absolute; top:11px; right:11px; padding:7px; display:grid; place-items:center; border:1px solid #ffffff20; border-radius:50%; background:#101217b8; color:#d1d4dc; backdrop-filter:blur(6px); }.lib-favorite[aria-pressed=true] { color:#b0cbff; }.lib-favorite[aria-pressed=true] svg { fill:#809ecf44; }
.lib-grid.is-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.is-list .lib-card-open { display:flex; align-items:center; }.is-list .lib-preview { flex:0 0 40%; aspect-ratio:1.2; }.is-list .lib-card-info { min-width:0; flex:1; }.is-list .lib-favorite { top:auto; bottom:13px; right:12px; }.is-list .lib-format { display:none; }
.lib-empty { padding:70px 20px; text-align:center; border:1px dashed #31333b; border-radius:16px; color:#aeb3be; }.lib-empty h2 { color:#eef0f4; font-weight:500; font-size:20px; }.lib-empty p { font-size:13px; }.lib-empty button { margin-top:10px; }
.lib-footer { display:flex; justify-content:space-between; gap:15px; padding:30px 0 0; margin-top:34px; border-top:1px solid #24252a; color:#848a96; font-size:11px; }.lib-footer a { color:#aaaeb7; text-decoration:none; }
.lib-dialog { margin:auto; color:#edf0f5; background:linear-gradient(135deg,#1a1b20f8,#101114fa); border:1px solid #43464f; border-radius:22px; padding:0; box-shadow:0 24px 80px #0009,inset 0 1px 0 #ffffff0a; max-height:calc(100dvh - 36px); overflow:auto; scrollbar-width:thin; scrollbar-color:#454950 transparent; }.lib-dialog::backdrop { background:transparent; }.lib-dialog[open] { animation:lib-in .2s ease-out; }
.lib-dialog-head { display:flex; align-items:center; justify-content:space-between; padding:21px 22px; border-bottom:1px solid #ffffff0c; position:sticky; top:0; background:#191a1ef5; z-index:2; }.lib-dialog-head h2 { font-size:17px; margin:0; font-weight:500; }.lib-dialog-head p { font-size:11px; color:#999fa9; margin:5px 0 0; }.lib-dialog-close { color:#b4b9c4; border:0; background:none; padding:7px; font-size:23px; line-height:1; }
.lib-filter-body { padding:8px 22px 10px; }.lib-filter-body fieldset { padding:16px 0 10px; margin:0; border:0; }.lib-filter-body legend { padding:0; padding-top:17px; font-size:11px; color:#c3c8d2; }.lib-filter-chips { display:flex; flex-wrap:wrap; gap:6px; }.lib-filter-chips .lib-chip { padding:8px 10px; border-color:#ffffff12; background-color:#ffffff03; font-size:11px !important; }.lib-filter-chips .lib-chip[aria-pressed=true] { border-color:transparent; }
.lib-filter-footer { position:sticky; bottom:0; display:flex; justify-content:space-between; align-items:center; padding:18px 22px; border-top:1px solid #ffffff0d; background:#15161bf5; }.lib-filter-footer button { min-height:38px; }.lib-text-button { border:0; color:#aeb7c5; background:none; font-size:12px; }
#libAsset { width:min(980px,calc(100% - 40px)); }#libAsset .lib-dialog-close { position:absolute; right:14px; top:12px; z-index:3; background:#101217b8; border-radius:50%; width:34px; height:34px; }.lib-detail { display:grid; grid-template-columns:1.45fr 1fr; }.lib-detail-visual { padding:25px; background:#0c0d10; display:flex; align-items:center; }.lib-detail-visual img { width:100%; border-radius:12px; }.lib-detail-info { padding:52px 30px 35px; }.lib-detail-info h2 { font-size:29px; font-weight:500; letter-spacing:-1px; margin:14px 0; }.lib-detail-info p { font-size:13px; color:#a9aeba; line-height:1.7; }.lib-detail-price { font-size:20px; margin:25px 0; }.lib-detail-formats { display:flex; flex-wrap:wrap; gap:6px; }.lib-detail-formats span { padding:7px 10px; border:1px solid #333640; border-radius:8px; font-size:11px; color:#b9c0cd; }.lib-detail-actions { display:flex; gap:8px; margin-top:28px; }.lib-detail-actions button { padding:12px 17px; }.lib-demo-note { font-size:11px !important; color:#969eac !important; }
.lib-utility-body { padding:22px; display:grid; gap:10px; }.lib-utility-body p { font-size:13px; line-height:1.7; color:#aeb5c1; }.lib-utility-body button { text-align:left; padding:14px; border-radius:12px; }.lib-status { position:fixed; z-index:2200; bottom:22px; left:50%; transform:translateX(-50%); border:1px solid #465264; border-radius:12px; padding:12px 18px; background:#1b2029; color:#e0e6f1; font-size:12px; width:max-content; max-width:calc(100% - 30px); box-shadow:0 8px 30px #0006; }
@keyframes lib-in { from { opacity:0; transform:translateX(-8px); } to { opacity:1; transform:translateX(0); } }
@media(min-width:1600px) { .lib-chip { padding-inline:15px; }.lib-search { width:190px; } }
@media(max-width:1250px) { .lib-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.lib-layout { gap:12px; }.lib-controls { gap:8px; }.lib-search { width:145px; } }
@media(max-width:900px) { .lib-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.lib-controls { flex-wrap:wrap; }.lib-categories { flex-basis:100%; }.lib-tools { width:100%; padding:3px 6px; }.lib-search { width:auto; flex:1; }.lib-toolbar { padding:10px 16px; }.lib-detail { grid-template-columns:1fr; }.lib-detail-visual { padding:18px; }.lib-detail-visual img { max-height:40dvh; object-fit:contain; }.lib-detail-info { padding:25px; }.lib-grid.is-list { grid-template-columns:1fr; } }
@media(max-width:600px) { .lib-layout { display:block; padding:0 16px 28px; }.lib-rail { display:none; }.lib-toolbar { padding:8px 12px; }.lib-controls { border-radius:15px; gap:3px; }.lib-tools { gap:6px; }.lib-mobile-filter { display:flex; }.lib-search kbd { display:none; }.lib-sort { max-width:88px; font-size:11px !important; }.lib-icon-button { padding:8px; }.lib-grid { gap:18px 12px; }.lib-card { border-radius:12px; }.lib-preview { aspect-ratio:1.12; }.lib-card-info { padding:13px 11px; }.lib-card h2 { font-size:13px; }.lib-description { font-size:10px; }.lib-type { font-size:8px; letter-spacing:.75px; }.lib-format { display:none; }.lib-card-bottom { margin-top:13px; }.lib-summary { padding:20px 0 16px; }.lib-summary-note { display:none; }.lib-heading { gap:10px; }.lib-favorite { top:7px; right:7px; padding:6px; }.lib-favorite svg { width:15px; height:15px; }.lib-filter-footer { padding-bottom:max(18px,env(safe-area-inset-bottom)); }.lib-dialog[open] { animation:lib-mobile-in .22s ease-out; }.lib-footer { flex-direction:column; gap:10px; }.lib-detail-info h2 { font-size:24px; }#libAsset { width:calc(100% - 20px); }.lib-detail-visual img { max-height:32dvh; } }
@media(max-width:360px) { .lib-grid { grid-template-columns:1fr; }.lib-sort { width:75px; } }
@keyframes lib-mobile-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { :is(.lib-toolbar,.lib-layout,.lib-dialog,.lib-status),:is(.lib-toolbar,.lib-layout,.lib-dialog,.lib-status) *,:is(.lib-toolbar,.lib-layout,.lib-dialog,.lib-status) *::before,:is(.lib-toolbar,.lib-layout,.lib-dialog,.lib-status) *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }.lib-card:hover,.lib-card:hover img { transform:none; } }

/* Library shells reuse the public header width and centered inset on this route only. */
.library-page { --lib-shell-inset:20px; }
.library-page .lib-controls { width:min(calc(100% - var(--lib-shell-inset) * 2),var(--agency-shell,var(--public-header-max-width))); max-width:var(--agency-shell,var(--public-header-max-width)); margin-inline:auto; }
.library-page .lib-toolbar { padding-inline:0; }
.lib-controls { padding:8px 10px; }
.lib-rail { top:calc(var(--lib-toolbar-height,82px) + 12px); gap:12px; }
.lib-rail button { margin-inline:5px; border:1px solid transparent; }
.lib-rail button:hover { border-color:#ffffff18; background:#ffffff04; }
.lib-rail button[aria-pressed=true] { color:#f0f3fa; background:linear-gradient(115deg,#20242c,#121419) padding-box,linear-gradient(115deg,#657e9c77,#d7e1ee66,#48628277) border-box; border-color:transparent; box-shadow:inset 0 1px 0 #ffffff08; }
.lib-utility-panel { position:fixed; inset:auto; margin:0; z-index:1750; width:330px; max-width:calc(100% - 24px); border-radius:18px; background:linear-gradient(125deg,#1a1b20f5,#111216fa); box-shadow:0 18px 54px #0007,inset 0 1px 0 #ffffff08; overflow:hidden; }
.lib-utility-panel[open] { display:flex; flex-direction:column; animation:lib-panel-in .22s cubic-bezier(.22,1,.36,1); }
.lib-utility-panel .lib-dialog-head { position:relative; flex-shrink:0; padding:18px 20px; }
.lib-utility-panel .lib-dialog-head h2 { font-size:16px; }
.lib-utility-panel .lib-dialog-close { width:32px; height:32px; display:grid; place-items:center; padding:0; font-size:20px; border-radius:8px; }
.lib-utility-panel .lib-dialog-close:hover { background:#ffffff08; }
.lib-panel-content { min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#454950 transparent; }
.lib-panel-tabs { display:none; }
.lib-utility-panel .lib-filter-body { padding-inline:20px; }
.lib-utility-panel .lib-filter-footer { padding:15px 20px; }
.lib-utility-panel .lib-utility-body { padding:14px; gap:6px; }
.lib-utility-panel .lib-panel-row { display:flex; justify-content:space-between; gap:10px; padding:13px 12px; border:1px solid #ffffff0c; border-radius:10px; }
.lib-utility-panel .lib-panel-asset { display:flex; align-items:center; gap:12px; padding:8px; border:1px solid transparent; border-radius:10px; background:transparent; color:#e1e5ec; width:100%; }
.lib-panel-asset:hover { border-color:#ffffff18; background:#ffffff04; }
.lib-panel-asset img { width:64px; height:48px; object-fit:cover; border-radius:6px; }
.lib-panel-asset > span:nth-child(2) { min-width:0; flex:1; }
.lib-panel-asset strong { display:block; font-size:12px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lib-panel-asset small { display:block; font-size:11px; color:#9da8b8; margin-top:5px; }
.lib-panel-asset > span:last-child { font-size:14px; color:#a3adbd; }
.lib-panel-empty { padding:6px; }
.lib-panel-empty h3 { margin:4px 0 8px; font-size:14px; font-weight:500; }
.lib-panel-empty p { margin:0 0 15px; font-size:12px; color:#a6aebb; line-height:1.7; }
.lib-panel-empty button { min-height:40px; }
.lib-utility-panel.is-closing { animation:lib-panel-out .2s ease-in forwards; pointer-events:none; }
.lib-utility-panel.is-switching .lib-panel-content { animation:lib-panel-content-in .18s ease-out; }
@keyframes lib-panel-in { from { opacity:0; transform:translateX(-10px); } to { opacity:1; transform:translateX(0); } }
@keyframes lib-panel-out { from { opacity:1; transform:translateX(0); } to { opacity:0; transform:translateX(-10px); } }
@keyframes lib-panel-content-in { from { opacity:.45; transform:translateX(-4px); } to { opacity:1; transform:translateX(0); } }
@media(max-width:1180px) { .library-page { --lib-shell-inset:16px; } }
@media(max-width:900px) {
 .lib-layout { display:block; padding:0 16px 35px; }
 .lib-rail { display:none; }
 .lib-utility-panel { inset:auto 0 0; width:min(100%,640px); max-width:none; max-height:85dvh; margin:0 auto; border-radius:20px 20px 0 0; border-bottom:0; }
 .lib-utility-panel[open] { animation:lib-panel-sheet-in .22s cubic-bezier(.22,1,.36,1); }
 .lib-utility-panel.is-closing { animation:lib-panel-sheet-out .2s ease-in forwards; }
 .lib-panel-tabs { display:flex; flex-shrink:0; gap:3px; overflow:auto; scrollbar-width:none; padding:8px 12px; border-bottom:1px solid #ffffff0c; }
 .lib-panel-tabs .lib-chip { min-height:44px; padding:10px; font-size:11px !important; }
 .lib-filter-chips .lib-chip { min-height:40px; }
 .lib-utility-panel .lib-filter-footer { padding-bottom:max(15px,env(safe-area-inset-bottom)); }
 .lib-panel-asset { min-height:64px; }
}
@keyframes lib-panel-sheet-in { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
@keyframes lib-panel-sheet-out { from { opacity:1; transform:translateY(0); } to { opacity:0; transform:translateY(12px); } }

/* Attached command shelf: the sticky wrapper has no surface of its own. */
.library-page .lib-toolbar { background:transparent; border:0; backdrop-filter:none; -webkit-backdrop-filter:none; pointer-events:none; }
.lib-controls { display:block; position:relative; pointer-events:auto; border:1px solid transparent; background:linear-gradient(115deg,#17181cea,#101114ed) padding-box,linear-gradient(115deg,#6c7e9638,#d8e2f040,#52658230) border-box; backdrop-filter:blur(16px) saturate(108%); -webkit-backdrop-filter:blur(16px) saturate(108%); box-shadow:0 8px 28px #0003,inset 0 1px 0 #ffffff05; transition:background .22s,box-shadow .22s,border-radius .22s; }
.lib-controls.is-sticky { background:linear-gradient(115deg,#181a1eee,#101115f0) padding-box,linear-gradient(115deg,#758ba34a,#e1e9f44a,#63758d3a) border-box; backdrop-filter:blur(20px) saturate(108%); -webkit-backdrop-filter:blur(20px) saturate(108%); box-shadow:0 12px 34px #0005,inset 0 1px 0 #ffffff08; border-radius:17px; }
.lib-control-row { display:flex; align-items:center; gap:18px; min-width:0; }
.lib-control-row .lib-categories { max-width:100%; opacity:1; transform:translateX(0); transition:max-width .22s var(--public-header-ease),opacity .18s,transform .22s; }
.lib-control-row .lib-tools { transition:flex-grow .22s var(--public-header-ease); }
.lib-search { flex:0 0 165px; padding:6px 8px; transition:flex-grow .22s var(--public-header-ease),width .22s var(--public-header-ease),border-color .18s; }
.lib-search button { display:grid; place-items:center; border:0; background:none; color:#aeb7c5; padding:2px; flex-shrink:0; }
.lib-search-close { font-size:20px !important; width:24px; height:24px; border-radius:50%; }
.lib-search-close:hover { color:#fff; background:#ffffff08; }
.lib-controls[data-mode=search] .lib-categories { max-width:0; flex:0 1 0; opacity:0; transform:translateX(-8px); gap:0; }
.lib-controls[data-mode=search] .lib-tools { flex:1; }
.lib-controls[data-mode=search] .lib-search { flex:1 1 165px; width:100%; border-color:#8298b35c; background:#0c0e13b8; }
.lib-controls[data-mode=search] #libSearch { font-size:14px; }
.lib-sort { display:flex; align-items:center; justify-content:space-between; gap:8px; max-width:170px; padding:9px 8px; border:1px solid transparent; border-radius:10px; background:transparent; white-space:nowrap; }
.lib-sort:hover,.lib-sort[aria-expanded=true] { color:#f1f3f9; background:#ffffff06; border-color:#ffffff16; }
#libSortLabel { overflow:hidden; text-overflow:ellipsis; }
.lib-shelf-expansion { height:0; overflow:hidden; opacity:0; transition:height .22s var(--public-header-ease),opacity .18s; }
.lib-controls[data-mode=more] .lib-shelf-expansion,.lib-controls[data-mode=sort] .lib-shelf-expansion { opacity:1; }
.lib-shelf-inner { padding:14px 6px 6px; }
.lib-shelf-inner > nav,.lib-shelf-inner > div { display:flex; flex-wrap:wrap; gap:6px; border-top:1px solid #ffffff10; padding-top:13px; animation:lib-shelf-content-in .2s var(--public-header-ease); }
.lib-shelf-inner .lib-chip { border-color:#ffffff0d; background-color:#ffffff02; }
.lib-controls .lib-chip.is-selected,.lib-controls [data-shelf-mode=more][aria-expanded=true] { color:#f5f7ff; border:1px solid transparent; background:linear-gradient(115deg,#232833,#13161d) padding-box,linear-gradient(115deg,#607da8aa,#dbe6f566,#45608599) border-box; box-shadow:inset 0 1px 0 #ffffff10,inset 0 -8px 20px #4479bd09; }
.lib-library-tools { display:none; }
.lib-rail { top:var(--lib-rail-top,calc(var(--lib-toolbar-height,82px) + 12px)); }
.lib-utility-panel { transform-origin:left var(--lib-unfold-origin-y,32px); }
.lib-utility-panel[open] { animation:lib-rail-unfold .22s var(--public-header-ease); }
.lib-utility-panel.is-closing { animation:lib-rail-fold .2s ease-in forwards; }
@keyframes lib-rail-unfold { from { opacity:0; transform:translateX(-10px) scaleX(.97); } to { opacity:1; transform:translateX(0) scaleX(1); } }
@keyframes lib-rail-fold { from { opacity:1; transform:translateX(0) scaleX(1); } to { opacity:0; transform:translateX(-10px) scaleX(.97); } }
@keyframes lib-shelf-content-in { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:1250px) { .lib-control-row { gap:8px; }.lib-search { flex-basis:145px; } }
@media(max-width:900px) {
 .lib-control-row { flex-wrap:wrap; gap:6px; }
 .lib-control-row .lib-categories { flex-basis:100%; max-height:44px; transition:max-height .22s,opacity .18s,transform .22s; }
 .lib-control-row .lib-tools { width:100%; }
 .lib-search { flex:1; width:auto; }
 .lib-controls[data-mode=search] .lib-categories { flex-basis:100%; max-width:100%; max-height:0; }
 .lib-library-tools { display:flex; }
 .lib-shelf-inner .lib-chip { min-height:40px; }
 .lib-utility-panel[open] { animation:lib-panel-sheet-in .22s var(--public-header-ease); }
 .lib-utility-panel.is-closing { animation:lib-panel-sheet-out .2s ease-in forwards; }
}
@media(max-width:600px) { .lib-sort { max-width:100px; }.lib-search { min-width:0; flex-basis:0; }.lib-search button { min-width:24px; }.lib-control-row { gap:4px; } }

/* The sole main-header exception is document flow, preserving canonical geometry. */
@media(min-width:1181px) {
 body[data-public-header-scroll="natural"] .public-header-positioner > .site-header.public-site-header { position:relative; top:auto; right:auto; left:auto; width:100%; margin:0; }
}
@media(max-width:1180px) {
 body[data-public-header-scroll="natural"]:not(.public-sheet-open) > .site-header.public-site-header { position:relative; top:auto; }
}
.lib-toolbar,.lib-layout,.lib-dialog,.lib-status { font-family:Inter,Arial,sans-serif; }
/* Metadata extends the existing detail information column without changing cards. */
.lib-metadata { margin-top:18px; font-size:12px; color:#b9c0cd; }
.lib-metadata summary { cursor:pointer; padding:10px 0; }
.lib-metadata dl { margin:8px 0; }
.lib-metadata dt { color:#e1e3e8; margin-top:12px; font-weight:500; }
.lib-metadata dd { margin:4px 0 0; color:#a9aeba; line-height:1.6; overflow-wrap:anywhere; }
.lib-metadata summary:focus-visible { outline:2px solid #7eabde; outline-offset:3px; }
/* Attached visual category explorer: the glass shell and catalog remain shared. */
.lib-controls[data-mode=explorer] .lib-shelf-expansion { opacity:1; }
.lib-shelf-expansion { max-height:calc(100dvh - 210px); overflow-y:auto; scrollbar-width:thin; }
.lib-control-row { min-height:36px; }
.lib-control-row .lib-chip { padding-block:8px; }
.lib-control-row .lib-icon-button { padding:8px; }
.lib-controls #libCategories [aria-expanded=true] { color:#f5f7ff; border-color:#b1bfd64a; background:#ffffff06; box-shadow:inset 0 1px 0 #ffffff13; }
.lib-shelf-inner > #libExplorerContent { display:block; padding-top:16px; transition:opacity .1s,transform .16s var(--public-header-ease); }
#libExplorerContent.is-switching { opacity:0; transform:translateY(3px); }
.lib-explorer-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 3px 14px; color:#d4d6db; font-size:12px; }
.lib-explorer-heading .lib-chip { font-size:11px !important; padding:6px 10px; }
.lib-explorer-tiles { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; padding-bottom:8px; }
.lib-explorer-tile { min-width:0; padding:5px 5px 10px; border:1px solid #ffffff0c; border-radius:10px; background:#ffffff02; color:#b9bdc6; text-align:left; transition:transform .18s,border-color .18s,color .18s,background .18s; }
.lib-explorer-image { display:block; border-radius:6px; overflow:hidden; background:#15181d; margin-bottom:10px; }
.lib-explorer-image img { display:block; width:100%; height:auto; aspect-ratio:28/15; object-fit:cover; transition:transform .22s var(--public-header-ease); }
.lib-explorer-tile > span:last-child { display:block; padding-inline:5px; font-size:11px; line-height:1.3; }
.lib-explorer-tile:hover { transform:translateY(-1px); border-color:#a7b8cd44; color:#fff; background:#ffffff04; }
.lib-explorer-tile:hover img { transform:scale(1.025); }
@media(min-width:901px) { .lib-controls { padding-block:8px; }.lib-control-row { height:36px; } }
@media(max-width:1250px) { .lib-explorer-tiles { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:900px) { .lib-explorer-tiles { grid-template-columns:repeat(4,minmax(0,1fr)); }.lib-shelf-expansion { max-height:calc(100dvh - 180px); } }
@media(max-width:600px) { .lib-explorer-tiles { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.lib-shelf-expansion { max-height:calc(100dvh - 160px); }.lib-explorer-tile { min-height:44px; }.lib-control-row .lib-chip { min-height:40px; } }
@media(prefers-reduced-motion:reduce) { .lib-explorer-tile:hover,.lib-explorer-tile:hover img { transform:none; } }
/* The existing asset card expands into a measured catalog-only surface. */
#libAsset.lib-asset-surface { position:fixed; inset:auto; margin:0; padding:0; max-width:none; max-height:none; z-index:90; transform-origin:0 0; overflow:auto; animation:none; border:1px solid #8291a14d; background:linear-gradient(125deg,#191c21fa,#101216fc); box-shadow:0 20px 65px #0008,inset 0 1px 0 #ffffff0a; }
#libAsset.lib-asset-surface[open] { animation:none; }
.lib-asset-surface #libAssetContent { min-height:100%; }
.lib-asset-surface .lib-detail { min-height:100%; }
.lib-asset-surface .lib-detail-visual { min-width:0; padding:24px; align-items:center; }
.lib-asset-surface .lib-detail-info { min-width:0; padding:44px 26px 24px; }
.lib-asset-surface .lib-detail-price { margin:18px 0; }
.lib-asset-surface .lib-detail-actions { flex-wrap:wrap; gap:6px; margin-top:20px; }
.lib-origin-copy { position:absolute; left:0; top:0; transform-origin:0 0; margin:0; pointer-events:none; z-index:4; overflow:hidden; }
.lib-origin-copy .lib-card-open { height:100%; }
.lib-asset-surface.is-opening .lib-dialog-close,.lib-asset-surface.is-closing .lib-dialog-close { opacity:0; }

.lib-card.is-expansion-origin { border-color:#929eaf20; background:#111318; }
.lib-card.is-expansion-origin > * { opacity:0; }
.lib-rail { z-index:110; }
.lib-live-frame { display:block; width:100%; height:540px; max-height:100%; border:0; background:#101217; border-radius:12px; }
.lib-nova-placeholder { margin-top:12px; padding:6px 0; opacity:.48; cursor:default !important; font-size:11px !important; }
.lib-type-demo { width:100%; padding:20px 5px; }
.lib-type-demo label,.lib-type-demo span { font-size:11px; color:#9ca8b6; }
.lib-type-demo input { width:100%; margin:12px 0; border:1px solid #3d4551; border-radius:8px; background:#191d24; padding:12px; color:#e9edf4; }
.lib-type-demo p { font-size:clamp(28px,4vw,58px); letter-spacing:-2px; line-height:1.15; overflow-wrap:anywhere; }
@media(max-width:900px) and (min-width:601px) { .lib-asset-surface .lib-detail { grid-template-columns:1fr 1fr; }.lib-asset-surface .lib-detail-visual { padding:16px; }.lib-asset-surface .lib-detail-info { padding:44px 18px 20px; } }
@media(max-width:600px) { #libAsset.lib-asset-surface { border-radius:20px; }.lib-asset-surface .lib-detail { grid-template-columns:1fr; }.lib-asset-surface .lib-detail-visual { padding:18px; }.lib-asset-surface .lib-detail-info { padding:20px 22px 24px; }.lib-asset-surface .lib-live-frame { height:530px; }.lib-origin-copy { display:none; } }
.lib-asset-surface.is-opening,.lib-asset-surface.is-closing { overflow:hidden !important; }
#libAsset.lib-asset-surface { overflow:hidden; }
.lib-asset-surface #libAssetContent { height:100%; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; }
.lib-asset-surface .lib-detail { height:100%; grid-template-columns:minmax(0,2fr) minmax(280px,1fr); }
.lib-asset-surface[data-preview-kind=image] .lib-detail { grid-template-columns:minmax(0,7fr) minmax(280px,3fr); }
.lib-asset-surface #libAssetContent { overflow:hidden; }
.lib-asset-surface .lib-detail-visual { height:100%; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.lib-asset-surface .lib-detail-info { height:100%; overflow-y:auto; scrollbar-width:thin; border-left:1px solid #ffffff08; }
.lib-asset-surface .lib-live-frame { height:100%; min-height:0; flex:1; }
.lib-image-stage { position:relative; width:100%; flex:1; min-height:0; overflow:hidden; }
.lib-asset-surface .lib-image-stage img { position:absolute; inset:0; width:100%; height:100%; max-height:none; object-fit:contain; border-radius:8px; transform:none; }
.lib-gallery-thumbnails { display:flex; gap:8px; padding-top:12px; height:54px; flex-shrink:0; }
.lib-gallery-thumbnails button { background:#171a20; border:1px solid #ffffff14; border-radius:6px; padding:3px; }
.lib-gallery-thumbnails button[aria-pressed=true] { border-color:#a0b4cb88; }
.lib-gallery-thumbnails img { display:block; width:54px; height:38px; object-fit:cover; }
.lib-asset-surface.is-closing #libAssetContent { pointer-events:none; }
@media(min-width:601px) and (max-width:1100px) { .lib-asset-surface .lib-detail,.lib-asset-surface[data-preview-kind=image] .lib-detail { grid-template-columns:minmax(0,3fr) minmax(240px,2fr); } }
@media(max-width:600px) { .lib-asset-surface #libAssetContent { overflow-y:auto; }.lib-asset-surface .lib-detail,.lib-asset-surface[data-preview-kind=image] .lib-detail { height:auto; grid-template-columns:1fr; }.lib-asset-surface .lib-detail-visual { height:380px; }.lib-asset-surface[data-preview-kind=music] .lib-detail-visual { height:566px; }.lib-asset-surface .lib-detail-info { height:auto; overflow:visible; border-left:0; }.lib-asset-surface .lib-live-frame { height:530px; flex:none; } }
.lib-asset-surface { --lib-preview-padding:24px; --lib-details-width:clamp(280px,30%,440px); --lib-safe-left:env(safe-area-inset-left,0px); --lib-safe-right:env(safe-area-inset-right,0px); --lib-safe-bottom:env(safe-area-inset-bottom,0px); }
.lib-asset-surface .lib-detail,.lib-asset-surface[data-preview-kind=image] .lib-detail { grid-template-columns:minmax(0,1fr) var(--lib-details-width); }
.lib-asset-surface .lib-detail-visual { padding:var(--lib-preview-padding); }
.lib-asset-surface .lib-detail-info { padding:calc(var(--lib-preview-padding) + 20px) var(--lib-preview-padding) var(--lib-preview-padding); }
@media(min-width:1440px) { .lib-asset-surface { --lib-preview-padding:28px; } }
@media(min-width:1024px) and (max-width:1439px) { .lib-asset-surface { --lib-preview-padding:22px; --lib-details-width:clamp(260px,32%,400px); } }
@media(min-width:768px) and (max-width:1023px) { .lib-asset-surface { --lib-preview-padding:18px; --lib-details-width:clamp(220px,34%,300px); } }
@media(max-width:767px) { .lib-asset-surface { --lib-preview-padding:18px; }.lib-asset-surface #libAssetContent { overflow-y:auto; }.lib-asset-surface .lib-detail,.lib-asset-surface[data-preview-kind=image] .lib-detail { height:auto; grid-template-columns:1fr; }.lib-asset-surface .lib-detail-visual { height:380px; }.lib-asset-surface[data-preview-kind=music] .lib-detail-visual { height:576px; }.lib-asset-surface .lib-detail-info { height:auto; overflow:visible; border-left:0; }.lib-asset-surface .lib-live-frame { height:540px; flex:none; }.lib-origin-copy { display:none; } }

/* Purchase tools stay inside the existing asset details surface. */
.lib-commerce { margin-top:24px; padding-top:20px; border-top:1px solid #ffffff0c; }
.lib-purchase-caption { color:#a0a6af; font-size:11px; line-height:1.6; margin:0 0 14px; }
.lib-commerce .lib-buy,.lib-commerce .lib-add { display:flex; justify-content:space-between; align-items:center; width:100%; min-height:46px; padding:12px 16px; margin-bottom:8px; border-radius:12px; font-size:13px; }
.lib-commerce .lib-add { justify-content:center; border:1px solid #a9b2c326; background:#ffffff03; }
.lib-purchase-secondary { display:flex; justify-content:space-between; gap:12px; margin-top:12px; }
.lib-purchase-secondary button { min-height:40px; padding:8px 10px; font-size:12px; }
[data-cart-count] { display:inline-grid; place-items:center; min-width:21px; height:21px; margin-left:6px; border:1px solid #ffffff18; border-radius:50%; font-size:10px; }
.lib-commerce [hidden] { display:none !important; }
.lib-commerce h3 { font-size:20px; letter-spacing:-.6px; margin:22px 0 6px; }
.lib-order-back { padding:8px 0; min-height:40px; font-size:11px; }
.lib-order-item { display:flex; align-items:center; gap:10px; padding:14px 0; border-bottom:1px solid #ffffff0d; }
.lib-order-item img { flex:none; object-fit:cover; border-radius:6px; }
.lib-order-item div { flex:1; min-width:0; }
.lib-order-item strong { display:block; font-size:12px; overflow-wrap:anywhere; }
.lib-order-item small { display:block; margin-top:5px; color:#969da8; font-size:10px; }
.lib-order-item>span { font-size:12px; white-space:nowrap; }
.lib-order-remove { flex:none; min-width:32px; min-height:40px; }
.lib-order-total { display:flex; justify-content:space-between; padding:20px 0 6px; font-size:13px; }
[data-order-review]:focus-visible { outline:1px solid #b7c7dd; outline-offset:6px; border-radius:6px; }

/* Inline search uses the Library pill's existing glass, never a nested surface. */
.lib-controls .lib-search { flex:0 0 36px; width:36px; min-width:0; padding:0; gap:0; border:0; border-radius:0; background:transparent; box-shadow:none; transition:flex-basis 220ms var(--public-header-ease),flex-grow 220ms var(--public-header-ease),width 220ms var(--public-header-ease),gap 220ms; }
.lib-controls .lib-search:focus-within { border:0; }
.lib-controls .lib-search #libSearchActivate { width:36px; height:36px; padding:8px; }
.lib-controls .lib-search input { width:0; flex:0 1 0; padding:0; opacity:0; visibility:hidden; border:0; border-radius:0; background:transparent; box-shadow:none; outline:none; color:#f2f3f6; caret-color:#c8d4e2; transition:opacity 180ms ease,visibility 180ms; }
.lib-search input::placeholder { color:#8f96a1; }
.lib-search input::-webkit-search-cancel-button { -webkit-appearance:none; }
.lib-controls .lib-search kbd,.lib-controls .lib-search-close { opacity:0; visibility:hidden; width:0; min-width:0; padding:0; border:0; overflow:hidden; transition:opacity 180ms ease,visibility 180ms; }
.lib-controls[data-mode=search] .lib-search { flex:1 1 36px; width:100%; gap:10px; background:transparent; border:0; box-shadow:none; }
.lib-controls[data-mode=search] .lib-search input { flex:1 1 0; width:100%; opacity:1; visibility:visible; font-size:14px; }
.lib-controls[data-mode=search] .lib-search kbd { opacity:.6; visibility:visible; width:auto; }
.lib-controls[data-mode=search] .lib-search-close { opacity:1; visibility:visible; width:36px; height:36px; min-width:36px; }
.lib-controls .lib-tools > :not(.lib-search) { transition:opacity 160ms ease,transform 220ms var(--public-header-ease); }
.lib-controls[data-mode=search] .lib-tools > :not(.lib-search) { opacity:0; visibility:hidden; position:absolute; pointer-events:none; transform:translateX(4px); }
.lib-controls[data-mode=search]:focus-within { border-color:#b7c6d266; box-shadow:inset 0 1px 0 #eff5ff12,0 8px 28px #0005; }
.lib-controls[data-mode=search] .lib-control-row { gap:0; }
.lib-search #libSearchActivate:focus-visible,.lib-search-close:focus-visible { outline:1px solid #c4d1df; outline-offset:0; border-radius:8px; }
@media(max-width:900px) {
 .lib-control-row { position:relative; }
 .lib-controls[data-mode=search] .lib-categories { max-height:44px; max-width:100%; flex-basis:100%; visibility:hidden; }
 .lib-controls[data-mode=search] .lib-tools { position:absolute; inset:0; width:100%; padding:0 6px; }
 .lib-controls .lib-search { flex:0 0 36px; }
 .lib-controls .lib-tools { justify-content:flex-end; }
 .lib-controls[data-mode=search] .lib-search { flex:1 1 36px; }
}
@media(prefers-reduced-motion:reduce) { .lib-controls .lib-search,.lib-controls .lib-search input,.lib-controls .lib-search kbd,.lib-controls .lib-search-close,.lib-control-row .lib-categories,.lib-controls .lib-tools > :not(.lib-search) { transition:none; transform:none; } }

.lib-controls .lib-search input { visibility:visible; transition:opacity 180ms ease; }

/* Search owns only the category area and its reserved command zone. */
.lib-controls .lib-control-row { position:relative; }
.lib-controls .lib-search,.lib-controls[data-mode=search] .lib-search { position:static; flex:0 0 120px; width:120px; gap:0; transition:none; }
.lib-controls .lib-search #libSearchActivate { display:flex; align-items:center; justify-content:center; gap:7px; width:120px; white-space:nowrap; font-size:11px; transition:opacity 180ms ease; }
.lib-controls .lib-search input { position:absolute; left:0; top:var(--lib-search-zone-top,0); height:36px; width:0; }
.lib-controls[data-mode=search] .lib-search input { width:max(36px,calc(var(--lib-search-zone-left) - 12px)); flex:none; padding:0 8px; }
.lib-controls[data-mode=search] #libSearchActivate { opacity:0; pointer-events:none; }
.lib-controls .lib-search kbd,.lib-controls[data-mode=search] .lib-search kbd { display:none; }
.lib-controls[data-mode=search] .lib-search-close { position:absolute; left:var(--lib-search-zone-left); top:var(--lib-search-zone-top); width:120px; min-width:120px; height:36px; }
.lib-controls[data-mode=search] .lib-categories { max-width:100%; flex:1; gap:initial; opacity:0; transform:translateX(-6px); }
.lib-controls[data-mode=search] .lib-control-row { gap:18px; }
.lib-controls .lib-tools,.lib-controls[data-mode=search] .lib-tools { flex:none; transition:none; }
.lib-controls[data-mode=search] .lib-tools > :not(.lib-search) { opacity:1; visibility:visible; position:static; pointer-events:auto; transform:none; transition:none; }
@media(max-width:1250px) { .lib-controls[data-mode=search] .lib-control-row { gap:8px; } }
@media(max-width:900px) { .lib-controls[data-mode=search] .lib-tools { position:static; inset:auto; padding:3px 6px; width:100%; }.lib-controls[data-mode=search] .lib-categories { flex-basis:100%; max-height:44px; }.lib-controls[data-mode=search] .lib-control-row { gap:6px; } }
@media(max-width:600px) { .lib-controls[data-mode=search] .lib-control-row { gap:4px; }.lib-controls .lib-search,.lib-controls[data-mode=search] .lib-search { flex-basis:106px; width:106px; }.lib-controls .lib-search #libSearchActivate,.lib-controls[data-mode=search] .lib-search-close { width:106px; min-width:106px; } }

/* Local layout feedback; surrounding Library controls never animate. */
.lib-grid { overflow-anchor:none; }
#libView { transition:background-color 180ms ease,border-color 180ms ease; }
#libView svg { transition:opacity 180ms ease; }
#libView[data-transitioning] svg { opacity:.65; }
#libView[aria-pressed=true] { border-color:#abbcd54d; background-color:#ffffff08; }
@media(prefers-reduced-motion:reduce) { #libView,#libView svg { transition:none; } }

/* Secondary glass tone and a clean, unboxed search utility. */
.lib-controls { background:linear-gradient(115deg,#121317ee,#0d0f12ef) padding-box,linear-gradient(115deg,#6c7e9638,#d8e2f040,#52658230) border-box; }
.lib-controls.is-sticky { background:linear-gradient(115deg,#131519f0,#0d0f13f2) padding-box,linear-gradient(115deg,#758ba34a,#e1e9f44a,#63758d3a) border-box; }
.lib-controls .lib-search-close,.lib-controls .lib-search-close:hover,.lib-controls .lib-search-close:active { color:#f5f6f8; background:transparent; border:0; border-radius:0; box-shadow:none; }
.lib-search-close svg { display:block; width:16px; height:16px; padding:3px; box-sizing:content-box; border-radius:4px; transition:background-color 160ms ease; }
.lib-search-close:hover svg { background:#ffffff06; }
.lib-controls .lib-search-close:focus-visible { outline:1px solid #c4d1df; outline-offset:-5px; border-radius:6px; }
@media(prefers-reduced-motion:reduce) { .lib-search-close svg { transition:none; } }

/* Templates use an isolated, tall website viewport within the shared workspace. */
.lib-template-preview { display:flex; flex-direction:column; width:100%; height:100%; min-height:0; }
.lib-template-controls { display:flex; gap:5px; align-items:center; padding-bottom:12px; flex:none; }
.lib-template-controls span { margin-left:auto; color:#8b929d; font-size:10px; }
.lib-template-controls button { font-size:11px; min-height:36px; }
.lib-template-stage { flex:1; min-height:0; width:100%; display:flex; justify-content:center; overflow:hidden; border-radius:8px; background:#0d0f12; }
.lib-template-viewport { position:relative; height:100%; width:100%; max-width:100%; min-width:0; transition:width 200ms cubic-bezier(.2,.7,.3,1); }
.lib-template-viewport[data-device=tablet] { width:768px; }.lib-template-viewport[data-device=mobile] { width:390px; }
.lib-template-frame { width:100%; height:100%; display:block; border:0; background:#101216; opacity:0; transition:opacity 180ms ease; }.lib-template-frame.is-ready { opacity:1; }
.lib-template-loading { position:absolute; inset:0; display:grid; place-items:center; text-align:center; padding:24px; color:#a2a9b3; font-size:12px; }.lib-template-loading[hidden] { display:none; }
.lib-template-mobile { display:none; }.lib-template-specs { display:grid; gap:8px; margin-top:20px; font-size:11px; line-height:1.6; color:#bac0ca; }.lib-template-specs small { color:#858d99; font-size:10px; }.lib-live-demo-link { display:inline-flex; padding:12px 15px; margin-top:18px; font-size:12px; }
@media(max-width:767px) { .lib-template-controls,.lib-template-stage { display:none; }.lib-template-mobile { display:flex; flex-direction:column; justify-content:center; height:100%; gap:12px; }.lib-template-mobile img { max-height:280px; width:100%; object-fit:contain; }.lib-template-mobile p { font-size:11px; color:#a2a9b3; margin:0; }.lib-template-mobile a { align-self:flex-start; font-size:12px; padding:10px 14px; } }
@media(prefers-reduced-motion:reduce) { .lib-template-viewport,.lib-template-frame { transition:none; } }

/* Three descriptive layout options; card presentation only varies by mode. */
.lib-view-segments { display:flex; flex:none; align-items:center; gap:2px; padding:2px; border:1px solid #ffffff12; border-radius:10px; background:#ffffff02; }
.lib-view-segments .lib-icon-button { display:grid; place-items:center; width:30px; height:32px; min-width:30px; padding:5px; border-radius:7px; color:#969da8; background:transparent; border:1px solid transparent; transition:color 180ms,background-color 180ms,border-color 180ms; }
.lib-view-segments .lib-icon-button[aria-pressed=true] { color:#f4f6fa; background:linear-gradient(120deg,#252b34a0,#15181e); border-color:#afc0d65c; box-shadow:inset 0 1px 0 #ffffff0b; }
.lib-view-segments .lib-icon-button:hover { color:#fff; }.lib-view-segments .lib-icon { width:20px; height:20px; }
.lib-grid.is-large { grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px 24px; }
.lib-grid.is-large .lib-card-info { padding:23px; }.lib-grid.is-large .lib-card h2 { font-size:20px; }
.lib-grid.is-list { grid-template-columns:minmax(0,1fr); gap:12px; }
.is-list .lib-card-open { display:flex; align-items:stretch; padding-right:54px; }
.is-list .lib-preview { flex:0 0 180px; aspect-ratio:1.45; }
.is-list .lib-card-info { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto 1fr; align-content:center; gap:5px 24px; padding:18px 22px; }
.is-list .lib-type { grid-column:1;grid-row:1; }.is-list .lib-card h2 { grid-column:1;grid-row:2; margin:0; }.is-list .lib-description { grid-column:1;grid-row:3; margin:0; }
.is-list .lib-card-bottom { grid-column:2;grid-row:1 / 4; display:flex; flex-direction:column; align-items:flex-end; justify-content:center; gap:8px; margin:0; }.is-list .lib-format { display:block; }
.is-list .lib-favorite { top:50%;bottom:auto;right:14px;transform:translateY(-50%); }
@media(max-width:900px) { .lib-grid.is-large { gap:22px 16px; }.is-list .lib-preview { flex-basis:140px; }.is-list .lib-card-info { padding:16px;gap:5px 12px; } }
@media(max-width:600px) { .lib-grid.is-large { grid-template-columns:minmax(0,1fr); }.lib-grid.is-large .lib-card-info { padding:18px; }.is-list .lib-preview { flex-basis:86px;aspect-ratio:1; }.is-list .lib-card-open { padding-right:38px; }.is-list .lib-card-info { padding:12px 9px;gap:4px 8px; }.is-list .lib-format { display:none; }.is-list .lib-description { font-size:9px; }.is-list .lib-favorite { right:5px; }.lib-view-segments .lib-icon-button { width:28px;min-width:28px; }.lib-tools { gap:4px; } }
@media(prefers-reduced-motion:reduce) { .lib-view-segments .lib-icon-button { transition:none; } }

/* Shared expansion indicators: centered and driven by semantic open state. */
.lib-controls [data-shelf-mode=more],.lib-controls #libSort { display:inline-flex; align-items:center; justify-content:center; gap:5px; }
.lib-chevron { display:block; flex:0 0 12px; width:12px; height:12px; color:#a0a7b1; transform:rotate(0deg); transform-origin:center; transition:transform 180ms ease-out,color 160ms ease-out; }
.lib-controls button:hover>.lib-chevron { color:#d8dde5; }
.lib-controls button[aria-expanded=true]>.lib-chevron { transform:rotate(180deg); color:#f0f3f7; }
@media(prefers-reduced-motion:reduce) { .lib-chevron { transition:none; } }

/* Native brand marks on existing neutral Library chips. */
.lib-brand-badge { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:28px; line-height:1.2; vertical-align:middle; white-space:nowrap; }
.lib-brand-mark { display:block; flex:none; width:16px; height:16px; object-fit:contain; filter:none; }
.lib-brand-mark.brand-nextjs { background:#fff; border-radius:50%; }
.lib-detail-formats .lib-brand-badge>span { padding:0; border:0; background:none; }
.lib-card .lib-format { display:flex; align-items:center; justify-content:flex-end; gap:8px; }.lib-card .lib-brand-badge { min-height:18px; gap:4px; }.lib-card .lib-brand-mark { width:14px; height:14px; }
.lib-supported-badges { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:18px; }.lib-supported-badges>small { flex-basis:100%; color:#8f99a6; font-size:10px; margin-bottom:2px; }.lib-supported-badges>.lib-brand-badge { padding:5px 8px; border:1px solid #ffffff15; border-radius:6px; color:#cbd2dd; font-size:10px; }
.lib-brand-badge:focus-visible { outline:1px solid #b6c8df; outline-offset:3px; border-radius:3px; }
@media(min-width:601px) and (max-width:1599px) { .lib-grid:not(.is-list):not(.is-large) .lib-brand-badge.is-compact:has(.lib-brand-mark) .lib-brand-label { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; } }
@media(max-width:600px) { .lib-card .lib-format { display:none; } }

/* Restrained demo ratings, distinct from purchase verification. */
.lib-rating-line { display:block; margin-top:10px; color:#bac3ce; font-size:10px; line-height:1.4; }.lib-rating-line>span:first-child { color:#d8dfe8; margin-right:3px; }.lib-rating-count { color:#848d9a; }
.lib-rating-detail { margin-top:20px; }.lib-rating-detail strong { font-size:19px; font-weight:500; }.lib-rating-detail [data-rating-summary]>span { color:#bac5d4; font-size:12px; letter-spacing:1px; }.lib-rating-detail small { display:block; margin-top:5px; font-size:10px; color:#9099a6; }.lib-rate-trigger { padding:8px 0; min-height:32px; font-size:10px; color:#c1c9d6; }.lib-rating-detail fieldset { border:0; padding:10px 0 0; margin:0; }.lib-rating-detail legend { font-size:11px; color:#b9c3d1; }.lib-rating-stars { display:flex; gap:4px; }.lib-rating-stars label { position:relative; display:grid;place-items:center;width:36px;height:36px;cursor:pointer;color:#555e6b; }.lib-rating-stars input { position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer; }.lib-rating-stars label>span { font-size:22px; pointer-events:none; transition:color 120ms; }.lib-rating-stars label.is-lit { color:#e1e6ed; }.lib-rating-stars label:focus-within { outline:1px solid #aebdd3;outline-offset:1px;border-radius:5px; }.lib-rating-detail [hidden] { display:none; }
.is-list .lib-rating-line { grid-column:1;grid-row:4;margin-top:2px; }.is-list .lib-card-bottom { grid-row:1 / 5; }
@media(prefers-reduced-motion:reduce) { .lib-rating-stars label>span { transition:none; } }

/* The card stays still; intentional hover reveals media within its existing frame. */
.lib-card.has-hover-preview:hover { transform:none; }.lib-card.has-hover-preview .lib-preview>img:not(.lib-hover-media) { transform:none; }
.lib-preview .lib-hover-media { position:absolute;left:0;top:0;width:100%;height:auto;max-height:none;object-fit:initial;pointer-events:none;opacity:0;z-index:1;transition:opacity 150ms ease;transform-origin:top left; }
.lib-preview video.lib-hover-media { height:100%;object-fit:cover; }.lib-preview .lib-hover-media.is-ready { opacity:1; }
@media(prefers-reduced-motion:reduce) { .lib-preview .lib-hover-media { transition:none; } }

.lib-preview { position:relative; }
.lib-preview .lib-hover-media { transform:none; }

/* One mounted demo, two workspace sizes; no reparenting or duplicate audio. */
.lib-interactive-controls { display:flex;align-items:center;gap:6px;width:100%;padding-bottom:10px;flex:none; }.lib-interactive-controls>span { color:#a4afbd;font-size:10px;flex:1; }.lib-interactive-controls button { font-size:10px;min-height:34px; }.lib-interactive-controls [hidden] { display:none; }
.lib-interactive-viewport { position:relative;display:flex;flex-direction:column;flex:1;min-height:0;width:100%;max-width:100%;align-self:center;transition:width 200ms ease-out; }.lib-interactive-viewport[data-device=tablet] { width:768px; }.lib-interactive-viewport[data-device=mobile] { width:390px; }.lib-interactive-viewport .lib-live-frame { flex:1;height:100%;min-height:0; }.lib-demo-devices { display:flex;gap:5px;padding-bottom:10px;flex:none; }.lib-demo-devices button { font-size:10px;min-height:32px; }
#libAsset.lib-asset-surface.is-full-preview { left:12px!important;top:12px!important;width:calc(100vw - 24px)!important;height:calc(100dvh - 24px)!important;z-index:300;border-radius:18px; }.is-full-preview .lib-detail { grid-template-columns:minmax(0,1fr)!important; }.is-full-preview .lib-detail-info,.is-full-preview>.lib-dialog-close { display:none; }.is-full-preview .lib-detail-visual { height:100%!important;padding:18px; }.is-full-preview #libAssetContent,.is-full-preview .lib-detail { height:100%!important;overflow:hidden!important; }.is-full-preview .lib-live-frame { height:100%!important;flex:1!important; }
.lib-demo-loading { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#101216;color:#aab4c3;font-size:12px;z-index:2;border-radius:10px;padding:20px;text-align:center; }.lib-demo-loading img { width:100%;height:80%;object-fit:contain; }
.lib-type-controls { display:flex;gap:12px;align-items:center;flex-wrap:wrap; }.lib-type-controls label { display:grid;gap:6px; }.lib-type-controls select { background:#1b222c;color:#ecf0f5;border:1px solid #ffffff22;border-radius:5px;padding:6px; }.lib-interactive-viewport.is-light { background:#f0eee7;color:#20252d;border-radius:10px;padding:15px; }
@media(max-width:767px){.lib-interactive-controls { flex-wrap:wrap; }.lib-interactive-controls>span { flex-basis:100%; }.lib-interactive-viewport .lib-live-frame { height:450px;flex:none; }.is-full-preview .lib-interactive-viewport .lib-live-frame { height:100%;flex:1; }.lib-asset-surface[data-preview-kind=interactive] .lib-detail-visual { height:600px; }.is-full-preview .lib-template-stage { display:flex; }.is-full-preview .lib-template-controls { display:flex; }.is-full-preview .lib-template-mobile { display:none; }}
@media(prefers-reduced-motion:reduce){.lib-interactive-viewport { transition:none; }}

.lib-demo-zoom { display:flex;align-items:center;gap:6px;color:#aab4c3;font-size:10px; }.lib-demo-zoom input { width:70px;accent-color:#bccbdc; }

/* Expanded-only discussion: preview geometry remains unchanged. */
.lib-discussion-tabs { display:flex;gap:4px;border-bottom:1px solid #ffffff10;margin-bottom:20px;padding-bottom:8px; }
.lib-discussion-tabs button { padding:8px 10px;border:1px solid transparent;border-radius:8px;background:transparent;color:#9da4af;font-size:12px; }
.lib-discussion-tabs button[aria-selected=true] { color:white;border-color:#b6c8df38;background:#ffffff05; }
.lib-discussion-tabs span { font-size:10px;color:#9da4af; }
.lib-detail-info [role=tabpanel][hidden] { display:none!important; }
.lib-comment-heading { display:flex;align-items:center;justify-content:space-between;gap:8px; }.lib-comment-heading h3 { font-size:15px; }.lib-comment-heading button,.lib-comment-meta button,[data-comment-cancel] { border:0;background:transparent;color:#a8afba;padding:6px;font-size:11px; }.lib-comment-heading button[aria-pressed=true] { color:white; }
.lib-detail-info .lib-comment-prototype { font-size:10px;color:#929aa6; }.lib-comment-composer label { display:block;font-size:12px;margin-bottom:8px; }.lib-comment-composer textarea { width:100%;box-sizing:border-box;resize:vertical;min-height:82px;background:#ffffff03;border:1px solid #ffffff20;border-radius:9px;color:white;padding:10px;font:inherit;font-size:12px; }.lib-comment-composer>div { display:flex;gap:8px;margin-top:8px; }.lib-comment-composer .lib-glass { padding:8px 14px; }
.lib-comment { display:grid;grid-template-columns:26px minmax(0,1fr);gap:9px;padding:16px 0;border-top:1px solid #ffffff0d; }.lib-comment.is-reply { margin-left:22px; }.lib-comment-avatar { width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#ffffff07;color:#d3d8df;font-size:12px; }.lib-comment strong { font-size:12px;font-weight:500; }.lib-comment p { margin:7px 0;font-size:12px;overflow-wrap:anywhere;white-space:pre-wrap; }.lib-comment-meta { color:#858e9c;font-size:10px; }.lib-team-badge { color:#c6ceda;font-size:9px; }.lib-comment-list { margin-top:16px; }[data-comment-status] { font-size:11px!important; }
.lib-discussion-tabs button:focus-visible,.lib-comment-meta button:focus-visible,.lib-comment-heading button:focus-visible,.lib-comment-composer textarea:focus-visible { outline:2px solid #a2b5cd;outline-offset:3px; }
@media(max-width:767px) { .lib-discussion-tabs button { min-height:44px; }.lib-comment-composer textarea { font-size:16px; }.lib-comment-meta button { min-height:40px; } }