.media-main { padding-top: 36px; }
.media-gate {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}
.media-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: space-between;
  align-items: flex-end;
  margin: 28px 0 0;
}
.media-filters, .media-upload {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.media-filters input,
.media-upload input {
  height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: var(--elevated);
  min-width: 140px;
}
.media-file-btn { cursor: pointer; }
.media-table-wrap { margin-top: 8px; overflow: auto; padding: 0; }
.media-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.media-table th {
  text-align: left;
  color: var(--muted);
  font-weight: 500;
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.media-table td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.media-table tr:last-child td { border-bottom: 0; }
.media-table .name {
  font-weight: 500;
}
.media-table .sub {
  display: block;
  font-size: 11px;
  color: var(--muted);
  margin-top: 4px;
  word-break: break-all;
}
.media-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media (max-width: 720px) {
  .media-table th:nth-child(3),
  .media-table td:nth-child(3) { display: none; }
}

/* Asset library */
.lib-cats { display:flex; flex-wrap:wrap; gap:8px; margin:24px 0 16px; }
.lib-cat {
  display:inline-flex; align-items:center; height:34px; padding:0 14px;
  border-radius:999px; border:1px solid var(--line); background:var(--elevated);
  font-size:13px; text-decoration:none; color:inherit;
}
.lib-cat.is-active { background:var(--ink, #1a1a1a); color:var(--paper, #f7f6f2); border-color:transparent; }
.lib-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; }
.lib-card {
  display:block; padding:18px; border-radius:16px; border:1px solid var(--line);
  background:var(--elevated); text-decoration:none; color:inherit;
}
.lib-card h3 { margin:0 0 8px; font-size:16px; }
.lib-card p { margin:0; font-size:13px; color:var(--muted); line-height:1.45; }
.lib-section-title { margin:28px 0 12px; font-size:18px; font-weight:600; }
.lib-asset-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.lib-asset-card {
  display:block; border-radius:16px; border:1px solid var(--line); overflow:hidden;
  background:var(--elevated); text-decoration:none; color:inherit;
}
.lib-asset-meta { padding:12px 14px 14px; display:flex; flex-direction:column; gap:4px; }
.lib-asset-title { font-size:clamp(22px,4vw,32px); margin:8px 0; }
.lib-views {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; margin:18px 0;
}
.lib-view-label { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.lib-dl-row { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:8px; }
.media-personal summary { cursor:pointer; font-weight:500; padding:8px 0; }

/* co: no watermark overlay — text-free asset images */
.bh-preview-frame {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  background: #f7f6f2;
}
.bh-preview-frame img {
  display: block;
  width: 100%;
  height: auto;
}
.lib-view-board { grid-column: 1 / -1; }
.lib-outside-labels {
  list-style: none; margin: 8px 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 6px 12px;
  font-size: 12px; color: var(--muted);
}

/* cz: five libraries — sub-tabs, filters, counts, facts, lightbox */
.lib-count{font-size:12px;font-weight:500;color:var(--muted);margin-left:6px}
.lib-subtabs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}
.lib-subtabs small{opacity:.7;margin-left:4px}
.lib-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:0 0 10px}
.lib-filter{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.lib-filter select,.lib-filter input{font:inherit;font-size:13px;padding:6px 8px;border:1px solid var(--line,rgba(0,0,0,.15));border-radius:8px;background:var(--paper,#fff);color:var(--ink,#1a1a1a);min-width:120px}
.lib-filter-q{flex:1 1 200px}.lib-filter-q input{width:100%}
.lib-result-count{font-size:12px;margin:4px 0 12px}
.lib-more-row{text-align:center;margin:20px 0}
.lib-facts{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;font-size:13px;margin:10px 0 14px}
.lib-facts dt{color:var(--muted)}.lib-facts dd{margin:0}
.lib-zoom-btn{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.lib-lightbox{position:fixed;inset:0;z-index:2147483646;max-width:100vw;overflow:hidden;background:rgba(10,10,10,.92);display:flex;flex-direction:column}
.lib-lb-bar{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;padding:10px;color:#eee}
.lib-lb-bar .bh-btn{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.25)}
.lib-lb-zoom{min-width:48px;text-align:center;font-size:13px}
.lib-lb-stage{flex:1;overflow:hidden;display:flex;align-items:center;justify-content:center;touch-action:none}
.lib-lb-stage img{max-width:96vw;max-height:84vh;transform-origin:center center;user-select:none;cursor:grab}
@media (max-width:520px){.lib-filter select{min-width:0;width:44vw}.lib-asset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.lib-asset-meta{padding:8px 10px 10px}}

/* da: lightbox above WuShi; widget hidden while open so it never covers Close */
html.lib-lb-open #wushiRoot,html.lib-lb-open .wushi-fab,html.lib-lb-open .wushi-card{visibility:hidden!important;pointer-events:none!important}
/* db: when a WuShi session is live, the widget shows a compact status + End pill at the bottom;
   reserve that strip so the pill never covers the image or the bar controls */
html.wushi-lb-live .lib-lightbox{padding-bottom:64px}
html.wushi-lb-live .lib-lb-stage img{max-height:calc(84vh - 64px)}

/* dc: mobile list views (≤480px) — collapse secondary filters, short intro, one-line scrolling tabs. Desktop: new nodes hidden / display:contents, layout unchanged. */
.lib-lead-short,.lib-filter-toggle,.lib-filter-clear,.lib-chips{display:none}
.lib-filter-more{display:contents}
@media (max-width:480px){
  html.lib-list-view .media-main{padding-top:12px}
  html.lib-list-view .lib-kicker{display:none}
  html.lib-list-view .media-main>h1.bh-wordmark{margin:0 0 6px}
  html.lib-list-view .lib-lead{display:none}
  html.lib-list-view .lib-lead-short{display:block;margin:0 0 4px}
  html.lib-list-view .lib-cats{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:10px 0 4px;padding-bottom:2px}
  html.lib-list-view .lib-cats::-webkit-scrollbar,html.lib-list-view .lib-subtabs::-webkit-scrollbar{display:none}
  html.lib-list-view .lib-cat{flex:0 0 auto;height:44px;min-width:44px;justify-content:center;white-space:nowrap}
  html.lib-list-view .lib-subtabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 0 8px}
  html.lib-list-view .lib-section-title{margin:8px 0 8px}
  html.lib-list-view .lib-filters{gap:8px;margin:0 0 6px}
  html.lib-list-view .lib-filter-q{order:-3;flex:1 1 100%}
  html.lib-list-view .lib-filter-q input{min-height:44px;box-sizing:border-box}
  html.lib-list-view .lib-filter-toggle,html.lib-list-view .lib-filter-clear{display:inline-flex;align-items:center;justify-content:center;order:-2;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--elevated);color:inherit;font:inherit;font-size:14px;cursor:pointer}
  html.lib-list-view .lib-filter-toggle{flex:1 1 auto}
  html.lib-list-view .lib-filter-toggle::after{content:"▾";margin-left:8px;font-size:12px}
  html.lib-list-view .lib-filter-toggle[aria-expanded="true"]::after{content:"▴"}
  html.lib-list-view .lib-filter-clear{flex:0 0 auto}
  html.lib-list-view .lib-chips{display:flex;flex-wrap:wrap;gap:8px;order:-1;flex:1 1 100%}
  html.lib-list-view .lib-chip{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border-radius:999px;border:1px solid transparent;background:var(--ink,#1a1a1a);color:var(--paper,#f7f6f2);font:inherit;font-size:14px;cursor:pointer}
  html.lib-list-view .lib-filter-more{display:none}
  html.lib-list-view .lib-filters.is-expanded .lib-filter-more{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;flex:1 1 100%;order:0}
  html.lib-list-view .lib-filter-more .lib-filter select{width:100%;min-width:0;min-height:44px}
  html.lib-list-view .lib-result-count{margin:2px 0 8px}
}

/* dd: ≤480px list views — WuShi entry docks in the sticky header's right slot (never over cards; cards scroll under the header).
   Same button/handlers/session state; 44px target (+8px hit ring). A user-dragged position (inline left/top) still wins. Not in shell mode. */
@media (max-width:480px){
  html.lib-list-view:not(.bh-shell) .bh-top{padding-right:66px}
  html.lib-list-view:not(.bh-shell) .wushi-fab:not([style*="left"]){top:calc(18px + env(safe-area-inset-top,0px));bottom:auto;right:14px;width:44px;height:44px}
}

/* de: ≤480px content-first home + asset detail. New nodes (.de-more/.de-key/.de-fold-home) never show on desktop.
   Secondary intro and long explanation fold behind 「了解更多」/"More about"; same text, fonts and image sizes unchanged. */
.de-more,.de-key,.de-fold-home{display:none}
@media (max-width:480px){
  html.lib-home-view .media-main,html.lib-detail-view .media-main{padding-top:12px}
  html.lib-home-view .lib-kicker,html.lib-detail-view .lib-kicker{display:none}
  html.lib-home-view .media-main>h1.bh-wordmark{margin:0 0 6px}
  html.lib-home-view .lib-lead,html.lib-detail-view .lib-lead{display:none}
  html.lib-home-view .lib-lead-short{display:block;margin:0 0 10px}
  html.lib-home-view #catNav{display:none}
  html.lib-home-view .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  html.lib-home-view .lib-card{display:flex;align-items:center;min-height:56px;box-sizing:border-box;padding-top:12px;padding-bottom:12px}
  html.lib-home-view .lib-card h3{margin:0}
  html.lib-home-view .lib-card p{display:none}
  html.lib-home-view .lib-section-title{margin-top:18px}
  .de-more{display:block;margin:12px 0 0}
  .de-more-toggle{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);background:var(--elevated);color:inherit;font:inherit;font-size:14px;cursor:pointer}
  .de-more-toggle::after{content:"▾";margin-left:8px;font-size:12px}
  .de-more-toggle[aria-expanded="true"]::after{content:"▴"}
  #libraryRoot.de-more-open .de-fold-home{display:block;margin-top:10px}
  .de-lib-descs{margin:8px 0 0;padding-left:18px;color:var(--muted);line-height:1.55}
  .de-lib-descs b{color:var(--ink,inherit);font-weight:600}
  /* detail: site title visually hidden (still in DOM for screen readers), category strip one line */
  html.lib-detail-view .media-main>h1.bh-wordmark{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  html.lib-detail-view .lib-cats{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:4px 0 4px;padding-bottom:2px}
  html.lib-detail-view .lib-cats::-webkit-scrollbar{display:none}
  html.lib-detail-view .lib-cat{flex:0 0 auto;height:44px;min-width:44px;justify-content:center;white-space:nowrap}
  html.lib-detail-view #libraryRoot{display:flex;flex-direction:column}
  html.lib-detail-view #libraryRoot>*{order:20}
  html.lib-detail-view #libraryRoot>.de-back{order:1;margin:8px 0 0}
  html.lib-detail-view #libraryRoot>.lib-asset-title{order:2}
  html.lib-detail-view #libraryRoot>.lib-views{order:3;margin-top:4px}
  html.lib-detail-view #libraryRoot>.de-key{order:4;display:block;margin:10px 0 0;font-size:14px;line-height:1.5}
  html.lib-detail-view #libraryRoot>.de-note{order:5;margin:6px 0 0}
  html.lib-detail-view #libraryRoot>.lib-dl-row{order:6}
  html.lib-detail-view #libraryRoot>#dlStatus{order:7}
  html.lib-detail-view #libraryRoot>.de-more{order:8;margin-top:0}
  html.lib-detail-view #libraryRoot>.bh-lede.de-fold{order:9}
  html.lib-detail-view #libraryRoot>.lib-facts{order:10}
  html.lib-detail-view #libraryRoot:not(.de-more-open)>.de-fold{display:none}
  /* WuShi entry docks in the header slot on home/detail too (same rule as dd lists; same button, handlers and session) */
  html.lib-home-view:not(.bh-shell) .bh-top,html.lib-detail-view:not(.bh-shell) .bh-top{padding-right:66px}
  html.lib-home-view:not(.bh-shell) .wushi-fab:not([style*="left"]),html.lib-detail-view:not(.bh-shell) .wushi-fab:not([style*="left"]){top:calc(18px + env(safe-area-inset-top,0px));bottom:auto;right:14px;width:44px;height:44px}
}