/* Explore uses the shared product tokens; this layer only owns discovery. */
.library-panel { padding:0; border:0; background:transparent; box-shadow:none; overflow:visible; }
.library-heading { flex-wrap:nowrap; align-items:flex-start; gap:24px; margin:0 0 28px; }
.library-heading .section-label { color:var(--accent); font-size:11px; letter-spacing:1.8px; }
.library-heading h1 { margin:12px 0 10px; font-size:clamp(30px,3.6vw,48px); line-height:1.12; letter-spacing:-1.8px; font-weight:680; }
.library-heading p { color:var(--muted); margin:0; font-size:16px; line-height:1.6; }
.library-heading>.icon-button { flex:0 0 44px; margin-top:1px; color:var(--muted); background:transparent; border:1px solid var(--line); }
.library-heading>.icon-button:hover { background:white; }
.library-panel .catalog-tabs { display:inline-flex; max-width:100%; margin:0 0 24px; padding:4px; gap:3px; background:#e9eeee; border:1px solid #e0e7e6; border-radius:14px; }
.library-panel .catalog-tabs button { border:0; border-radius:10px; min-height:44px; padding:10px 24px; font-size:14px; color:#52646a; font-weight:550; }
.library-panel .catalog-tabs button[aria-selected=true] { color:var(--ink); background:white; box-shadow:0 1px 5px #203e3912; }
.catalog-discovery { margin-bottom:28px; }
.catalog-search-row { display:flex; gap:12px; }
.catalog-search-field { display:flex; align-items:center; min-width:0; flex:1; border:1px solid #ccd9d7; border-radius:16px; background:#fff; box-shadow:0 2px 5px #203e3903; transition:border-color .16s,box-shadow .16s; }
.catalog-search-field:focus-within { border-color:var(--accent); box-shadow:0 0 0 3px #087f741a; }
.catalog-search-field>svg { width:22px; height:22px; flex:0 0 22px; margin-left:20px; color:#71847f; }
.library-panel .catalog-search-field .catalog-search { min-width:0; width:100%; height:58px; min-height:58px; padding:16px 14px; margin:0; border:0; border-radius:16px; font-size:16px; outline:none; box-shadow:none; background:transparent; }
.catalog-search::-webkit-search-cancel-button { display:none; }
.catalog-search-field .icon-button { flex:0 0 44px; margin-right:7px; color:var(--muted); background:transparent; }
.catalog-search-field .icon-button:hover { background:var(--soft); }
.library-panel .catalog-filter-toggle { display:flex; align-items:center; justify-content:center; gap:9px; min-width:116px; flex-shrink:0; border-radius:16px; font-size:14px; padding:12px 18px; }
.catalog-filter-toggle>svg { width:20px; height:20px; }
.library-panel .catalog-filter-toggle[aria-expanded=true] { color:#075f57; background:#e8f3ef; border-color:#99c6ba; }
.catalog-filter-count { min-width:21px; height:21px; display:grid; place-items:center; border-radius:50%; background:var(--accent); color:#fff; font-size:11px; font-variant-numeric:tabular-nums; }
.library-panel .catalog-quick-categories { display:flex; flex-wrap:nowrap; gap:8px; padding:16px 4px 8px; margin:0 -4px; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; scrollbar-color:#b6c8c3 transparent; scroll-padding-inline:6px; }
.library-panel .catalog-quick-categories .category-chip { flex:0 0 auto; min-height:44px; padding:10px 14px; font-size:13px; border:1px solid transparent; border-radius:24px; background:#eaf0ed; color:#4c625a; line-height:1.4; white-space:nowrap; }
.library-panel .catalog-quick-categories .category-chip:hover { background:#dce9e2; color:#234f40; }
.library-panel .catalog-quick-categories .category-chip[aria-pressed=true] { color:#fff; background:#254f45; border-color:#254f45; }
.library-panel .catalog-filters { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto; align-items:end; gap:18px; margin:14px 0 0; padding:22px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.library-panel .catalog-filters>label { display:flex; min-width:0; flex-direction:column; gap:8px; font-size:12px; }
.library-panel .catalog-filters select { width:100%; margin:0; font-size:14px; background:#fff; }
.library-panel .catalog-filters>.catalog-people-filter { flex-direction:row; align-items:center; align-self:end; min-height:44px; padding:0 4px; gap:10px; font-size:13px; }
.catalog-people-filter input { width:18px; height:18px; margin:0; flex-shrink:0; }
.catalog-filter-hint { grid-column:1/-1; margin:0; color:var(--muted); font-size:12px; }
.catalog-active-row { display:flex; gap:12px; align-items:flex-start; }
.catalog-active-row:has(.catalog-active-filters:empty) { display:none; }
.catalog-active-filters { display:flex; flex:1; min-width:0; flex-wrap:wrap; gap:8px; padding-top:12px; }
.catalog-active-filters button { display:flex; align-items:center; gap:10px; max-width:100%; min-height:44px; padding:10px 13px; border:1px solid #c6dcd3; border-radius:10px; background:#eff7f3; color:#315e4d; font-size:12px; overflow-wrap:anywhere; text-align:left; line-height:1.4; }
.catalog-active-filters button:hover { border-color:#8fb8a9; background:#e4f1ea; }
#catalog-clear { flex-shrink:0; margin-top:12px; padding:10px 5px; }
.catalog-results-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.catalog-results-heading>div { display:flex; align-items:baseline; gap:12px; min-width:0; }
.catalog-results-heading h2 { font-size:20px; letter-spacing:-.45px; line-height:1.4; margin:0; }
.library-panel #library-status { min-height:0; margin:0; font-size:12px; }
.catalog-refresh { display:flex; gap:7px; align-items:center; padding:10px 4px; color:var(--muted); font-size:12px; }
.catalog-refresh svg { width:17px; height:17px; }
.catalog-refresh:hover { background:transparent; color:var(--accent); }
.catalog-browse-note { font-size:12px; color:var(--muted); margin:1px 0 20px; line-height:1.5; }
.library-panel .sticker-list { grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin:0; }
.library-panel .catalog-card { border:1px solid #e1e8e4; border-radius:20px; padding:8px; overflow:visible; box-shadow:0 2px 4px #1d3c2e03; background:#fff; }
.library-panel .catalog-card:hover { border-color:#bfd2c7; box-shadow:0 8px 24px #1d3c2e09; }
.library-panel .sticker-list[aria-busy=true] { opacity:.55; }
.catalog-card-media { position:relative; min-width:0; }
.library-panel .catalog-card .catalog-preview { position:relative; border-radius:13px; background:#eef3ef; color:#53695c; }
.library-panel .catalog-card:nth-child(3n+2) .catalog-preview { background:#eff0f5; }
.library-panel .catalog-card:nth-child(3n) .catalog-preview { background:#f5f1eb; }
.catalog-card .catalog-preview img { padding:8px; width:100%; height:100%; object-fit:contain; border-radius:16px; }
.catalog-preview-cue { position:absolute; left:12px; bottom:12px; border:1px solid #ffffffc0; border-radius:24px; background:#fffffff2; color:#284538; padding:8px 12px; font-size:11px; font-weight:600; line-height:1.2; box-shadow:0 2px 8px #203e3912; pointer-events:none; opacity:0; transform:translateY(4px); transition:opacity .16s,transform .16s; }
.catalog-preview:hover .catalog-preview-cue,.catalog-preview:focus-visible .catalog-preview-cue { opacity:1; transform:none; }
.catalog-card-media .catalog-favorite { position:absolute; top:8px; right:8px; width:44px; min-width:44px; min-height:44px; height:44px; padding:0; border-radius:50%; border:1px solid #e3ebe7; background:#fffffff2; color:#50675c; box-shadow:0 2px 4px #193d2810; display:grid; place-items:center; font-size:0; }
.catalog-card-media .catalog-favorite:hover { border-color:#9ac2ae; background:#fff; color:var(--accent); }
.catalog-card-media .catalog-favorite[aria-pressed=true] { color:#087f5a; background:#effaf4; }
.catalog-card-copy { padding:5px 10px 10px; display:flex; flex-direction:column; flex:1; cursor:pointer; }
.catalog-card-copy h3 { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.library-panel .catalog-card h3 { font-size:16px; font-weight:620; line-height:1.4; letter-spacing:-.2px; margin:10px 0 5px; overflow-wrap:anywhere; }
.library-panel .catalog-card-categories { margin:0; font-size:12px; line-height:1.55; color:#66776e; }
.catalog-card-price { font-size:11px; color:#567363; margin:auto 0 0; padding-top:14px; line-height:1.4; }
.catalog-card-price::after { content:'↗'; float:right; font-size:16px; line-height:1; color:#496658; }
.library-panel .catalog-card-actions { margin:12px 2px 2px; }
.library-panel .catalog-feedback { margin:16px 0 0; padding:52px 24px; border:1px solid #d9e4dd; border-radius:20px; background:#fff; }
.library-panel .catalog-feedback[data-state=error] { border-color:#e7d3bc; background:#fffbf5; }
.library-panel .catalog-feedback[data-state=loading] { background:linear-gradient(110deg,#f9fbfa,#fff); }
.library-panel .catalog-more { margin:30px auto 0; min-width:160px; background:#fff; }
.catalog-create-banner { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:26px 30px; margin-top:40px; border:1px solid #dce7e0; border-radius:20px; background:#edf4ef; }
.catalog-create-banner h2 { font-size:18px; letter-spacing:-.35px; margin:0 0 5px; }
.catalog-create-banner p { font-size:13px; margin:0; color:#617367; }
.catalog-create-banner .secondary { display:flex; align-items:center; gap:20px; flex-shrink:0; background:transparent; color:#28533e; border-color:#b6ccbf; font-size:13px; }
.catalog-create-banner .secondary:hover { background:#fff; }
@media(max-width:1100px) {
  .library-panel .sticker-list { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
}
@media(max-width:760px) {
  .library-heading { margin-bottom:24px; gap:12px; }
  .library-heading h1 { font-size:34px; letter-spacing:-1.1px; max-width:450px; }
  .library-heading p { font-size:14px; }
  .library-panel .catalog-filters { grid-template-columns:repeat(2,minmax(0,1fr)); padding:18px; gap:16px; }
  .library-panel .catalog-filters>.catalog-people-filter { grid-column:1/-1; }
  .library-panel .sticker-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .catalog-results-heading>div { flex-wrap:wrap; gap:4px 12px; }
  .catalog-create-banner { padding:22px; }
}
@media(max-width:500px) {
  body[data-view=library] main { padding-top:25px; }
  .library-heading { margin-bottom:21px; gap:8px; }
  .library-heading .section-label { font-size:10px; }
  .library-heading h1 { font-size:30px; line-height:1.15; letter-spacing:-1.1px; margin:10px 0 8px; }
  .library-heading p { font-size:13px; line-height:1.55; }
  .library-heading>.icon-button { flex-basis:44px; width:44px; height:44px; border:0; margin-right:-6px; }
  .library-panel .catalog-tabs { display:flex; margin-bottom:18px; }
  .library-panel .catalog-tabs button { flex:1; padding:10px; font-size:13px; }
  .catalog-search-row { gap:8px; }
  .library-panel .catalog-search-field .catalog-search { height:52px; min-height:52px; padding:14px 9px; font-size:16px; }
  .catalog-search-field { border-radius:13px; }
  .catalog-search-field>svg { width:18px; height:18px; flex-basis:18px; margin-left:13px; }
  .catalog-search-field .icon-button { margin-right:1px; flex-basis:44px; width:44px; }
  .library-panel .catalog-filter-toggle { min-width:52px; padding:10px; border-radius:13px; gap:5px; }
  .catalog-filter-toggle>span:first-of-type { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
  .catalog-filter-count { min-width:18px; height:18px; font-size:10px; }
  .library-panel .catalog-quick-categories { gap:7px; padding-top:12px; padding-bottom:9px; }
  .library-panel .catalog-quick-categories .category-chip { font-size:12px; padding:10px 13px; }
  .catalog-discovery { margin-bottom:17px; }
  .catalog-active-row { gap:8px; flex-wrap:wrap; }
  .catalog-active-filters { flex-basis:100%; }
  #catalog-clear { margin-top:0; }
  .catalog-results-heading { gap:10px; }
  .catalog-results-heading h2 { font-size:18px; }
  .catalog-results-heading>div { flex-direction:column; gap:2px; }
  .library-panel #library-status { font-size:11px!important; }
  .catalog-browse-note { margin:4px 0 16px; font-size:11px; }
  .library-panel .sticker-list { gap:12px; }
  .library-panel .catalog-card { padding:6px; border-radius:16px; }
  .library-panel .catalog-card .catalog-preview { border-radius:10px; }
  .catalog-card .catalog-preview img { padding:5px; border-radius:12px; }
  .catalog-card-copy { padding:2px 5px 7px; }
  .library-panel .catalog-card h3 { font-size:14px; letter-spacing:-.1px; margin-top:8px; }
  .library-panel .catalog-card-categories { font-size:11px; }
  .catalog-card-price { font-size:10px; margin-top:auto; padding-top:12px; }
  .catalog-card-media .catalog-favorite { top:3px; right:3px; width:44px; height:44px; }
  .catalog-preview-cue { display:none; }
  .catalog-create-banner { margin-top:28px; padding:22px; flex-direction:column; align-items:flex-start; gap:16px; }
  .catalog-create-banner h2 { font-size:17px; }
  .catalog-create-banner p { font-size:12px; }
  .library-panel .catalog-feedback { padding:36px 20px; }
  .catalog-feedback-title { font-size:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .catalog-preview-cue { transition:none; transform:none; }
  .catalog-search-field { transition:none; }
}
/* Preserve native hidden semantics against layout rules above. */
.library-panel [hidden] { display:none!important; }

/* One motion preference covers the grid and its protected preview sheet. */
.catalog-results-heading>.catalog-results-actions { display:flex; flex-direction:row; align-items:center; gap:12px; flex-shrink:0; }
.catalog-motion-toggle { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; min-width:44px; color:var(--muted); font-size:12px; white-space:nowrap; }
.catalog-motion-toggle:hover { color:var(--accent); }
.catalog-motion-icon { display:block; width:16px; height:16px; flex:0 0 16px; background:currentColor; mask:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 3h3v14H5zm7 0h3v14h-3z'/%3E%3C/svg%3E"); }
[data-motion=paused]>.catalog-motion-icon { mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m6 3 11 7-11 7z'/%3E%3C/svg%3E"); }
.catalog-detail-motion-toggle { align-self:center; margin:4px 0; }
@media(max-width:760px) {
  .catalog-results-heading>.catalog-results-actions { gap:4px; }
  .catalog-results-actions .catalog-motion-label { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
  .catalog-results-actions .catalog-motion-toggle { padding:10px; }
}
