.stock-library { --al-gap: 18px; position: relative; padding-bottom: 12px; }
.al-intro { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:4px 0 20px; }
.al-eyebrow { display:block; color:var(--accent); font-size:10px; font-weight:700; letter-spacing:1.8px; margin-bottom:10px; }
.al-intro h2 { margin:0 0 9px; font-size:23px; letter-spacing:-.6px; line-height:1.4; }
.al-intro p { color:var(--muted); font-size:13px; margin:0; line-height:1.7; }
.al-intro-actions { display:flex; gap:10px; flex-shrink:0; }
.al-intro-actions .btn .ic { width:16px; height:16px; }
.al-provider-btn { border:0; background:transparent; padding:0; font:inherit; cursor:pointer; }
.al-provider-btn:hover small { color:var(--accent); }
.al-sources { display:flex; align-items:center; flex-wrap:wrap; gap:14px; padding:12px 16px; margin-bottom:22px; background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius); }
.al-provider { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--ink); }
.al-provider i { width:6px; height:6px; background:var(--dim); border-radius:50%; }
.al-provider.ready i { background:var(--keep); box-shadow:0 0 0 3px var(--keep-soft); }
.al-provider small { font-size:10px; color:var(--dim); }
.al-sources a { display:inline-flex; align-items:center; gap:4px; font-size:11px; }
.al-sources .al-arrow { width:12px; height:12px; transform:rotate(180deg); }
.al-offline { display:flex; align-items:center; gap:5px; color:var(--muted); margin-left:auto; font-size:11px; }
.al-offline .ic { width:14px; height:14px; color:var(--keep); }
.al-workspace { padding:18px 20px 14px; border:1px solid var(--line); background:var(--bg-2); border-radius:12px; }
.al-scopes { display:flex; gap:22px; border-bottom:1px solid var(--line); margin-bottom:18px; }
.al-scopes button { position:relative; padding:0 0 14px; border:0; border-radius:0; background:transparent; font:inherit; font-size:13px; color:var(--muted); cursor:pointer; white-space:nowrap; }
.al-scopes button[aria-selected=true] { color:var(--accent); font-weight:650; }
.al-scopes button[aria-selected=true]::after { content:""; position:absolute; height:2px; background:var(--accent); bottom:-1px; left:0; right:0; }
.al-scopes b { display:inline-block; font-size:10px; font-weight:500; background:var(--bg-3); color:var(--muted); padding:1px 5px; border-radius:4px; margin-left:5px; }
.al-scopes button[aria-selected=true] b { background:var(--accent-soft); color:var(--accent); }
.al-search { display:flex; gap:10px; }
.al-search > label { flex:1; position:relative; display:flex; align-items:center; min-width:0; }
.al-search > label > .ic { position:absolute; left:13px; width:18px; height:18px; color:var(--dim); pointer-events:none; }
.al-search input { width:100%; padding-left:40px; height:43px; font-size:13px; }
.al-search .btn { min-width:80px; }
.al-topics { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-top:16px; }
.al-topics button { background:transparent; color:var(--muted); border:1px solid transparent; border-radius:6px; padding:6px 10px; font:inherit; font-size:12px; cursor:pointer; }
.al-topics button:hover { background:var(--bg-3); color:var(--ink); }
.al-topics button.active { color:var(--accent); background:var(--accent-soft); }
.al-topics button small { margin-left:5px; font-size:10px; color:var(--dim); }
.al-topics button.active small { color:var(--accent); }
.al-topics button.empty { opacity:.45; }
.al-gen h2 { display:flex; align-items:center; gap:8px; }
.al-gen h2 .ic { width:20px; height:20px; color:var(--accent); }
.al-gen textarea { width:100%; resize:vertical; min-height:80px; font:inherit; font-size:13px; }
.al-gen-ideas { display:flex; flex-wrap:wrap; gap:6px; margin:-4px 0 14px; }
.al-gen-ideas .chip { cursor:pointer; font-size:11px; border:1px solid var(--line); background:var(--bg-3); }
.al-gen-row { display:flex; gap:16px; flex-wrap:wrap; align-items:flex-end; }
.al-gen-row .field { margin:0; }
.al-gen-status { min-height:22px; margin:14px 0 4px; font-size:12px; color:var(--muted); display:flex; align-items:center; gap:8px; }
.al-gen-status .spin { width:14px; height:14px; border:2px solid var(--line-2); border-top-color:var(--accent); border-radius:50%; animation:al-spin .8s linear infinite; }
@keyframes al-spin { to { transform:rotate(360deg); } }
.modal:has(.al-gen) .box { width:min(620px,94vw); max-height:90vh; overflow:auto; }
.al-filters { display:flex; align-items:center; gap:10px; border-top:1px solid var(--line); padding-top:13px; margin-top:14px; flex-wrap:wrap; }
.al-type { display:flex; padding:3px; gap:2px; background:var(--bg-3); border-radius:6px; }
.al-type button { padding:4px 10px; border:0; border-radius:4px; background:transparent; color:var(--muted); font:inherit; font-size:11px; cursor:pointer; }
.al-type button[aria-pressed=true] { background:var(--bg-2); color:var(--ink); box-shadow:0 1px 3px #0001; }
.al-filters select { padding:6px 28px 6px 9px; font-size:11px; width:auto; min-width:100px; height:30px; background-color:var(--bg-2); }
.al-sort { margin-left:auto; }
.al-filters .btn.text, .al-result-head .btn.text { background:transparent; border-color:transparent; color:var(--muted); }
.al-notices:empty { display:none; }
.al-presenter-guide { display:flex; align-items:center; gap:12px; margin-top:16px; padding:14px 16px; border:1px solid var(--line); border-radius:9px; background:var(--accent-soft); }
.al-presenter-guide[hidden] { display:none; }
.al-presenter-guide > .ic { width:22px; height:22px; color:var(--accent); flex-shrink:0; }
.al-presenter-guide > div { flex:1; }
.al-presenter-guide b { display:block; font-size:12px; }
.al-presenter-guide span { display:block; font-size:11px; color:var(--muted); margin-top:5px; line-height:1.7; }
.al-presenter-guide > button { white-space:nowrap; }
.al-presenter-tips { border-left:2px solid var(--accent); padding:2px 0 2px 10px; margin-bottom:16px; color:var(--muted); font-size:11px; line-height:1.7; }
.al-presenter-tips b { color:var(--ink); font-weight:600; }
.al-presenter-tips p { margin:5px 0; }
.al-notices > .hint { padding:10px 2px 0; }
.al-notice { display:flex; align-items:center; gap:9px; padding:12px 14px; background:var(--warn-soft); border:1px solid var(--line); border-radius:8px; font-size:12px; margin-top:14px; color:var(--muted); }
.al-notice > .ic { width:17px; height:17px; flex-shrink:0; }
.al-notice span { flex:1; }
.al-notice.error { color:var(--cut); background:var(--cut-soft); }
.al-result-head { display:flex; align-items:center; gap:10px; margin:25px 0 14px; min-height:30px; }
.al-result-head h3 { margin:0; font-size:15px; font-weight:650; overflow-wrap:anywhere; }
.al-result-head > span { font-size:11px; color:var(--dim); }
.al-result-head > button { margin-left:auto; flex-shrink:0; }
.al-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--al-gap); }
.al-card { background:var(--bg-2); border:1px solid var(--line); border-radius:10px; overflow:hidden; min-width:0; transition:box-shadow .16s, border-color .16s, transform .16s; }
.al-card:hover { border-color:var(--line-2); box-shadow:0 5px 20px #0000000c; transform:translateY(-2px); }
.al-card.selected { border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.al-card-image { position:relative; aspect-ratio:16/10; background:var(--bg-3); overflow:hidden; }
.al-open { display:block; position:absolute; inset:0; padding:0; border:0; background:transparent; width:100%; cursor:zoom-in; }
.al-open > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.al-card[data-al-shape="portrait"] .al-open > img, .al-card[data-al-shape="square"] .al-open > img { object-fit:contain; }
.al-backdrop { position:absolute; inset:-12px; background-size:cover; background-position:center; filter:blur(18px) saturate(1.1) brightness(.82); transform:scale(1.08); }
.al-card:hover .al-open > img { transform:scale(1.035); }
.al-image-fallback { display:flex; flex-direction:column; gap:8px; align-items:center; justify-content:center; width:100%; height:100%; color:var(--dim); }
.al-image-fallback > .ic { width:28px; height:28px; }
.al-image-fallback small { font-size:10px; }
.al-check { position:absolute; top:10px; left:10px; cursor:pointer; border-radius:5px; background:#10152450; padding:4px; display:flex; align-items:center; justify-content:center; }
.al-check input { margin:0; width:15px; height:15px; accent-color:var(--accent); cursor:pointer; }
.al-favorite { position:absolute; right:10px; top:10px; display:grid; place-items:center; border:1px solid #ffffff50; width:29px; height:29px; border-radius:7px; background:#10152450; color:white; cursor:pointer; backdrop-filter:blur(8px); }
.al-favorite .ic { width:16px; height:16px; }
.al-favorite.active { background:#fff; color:#a16b00; border-color:white; }
.al-favorite.active .ic { fill:#ffc654; }
.al-kind, .al-local { position:absolute; bottom:9px; display:flex; gap:5px; align-items:center; color:#fff; background:#1118278c; border-radius:4px; padding:3px 6px; font-size:10px; pointer-events:none; backdrop-filter:blur(8px); }
.al-kind { left:10px; }
.al-kind .ic { width:11px; height:11px; }
.al-local { right:10px; background:#1118275c; }
.al-card-body { padding:13px 13px 10px; }
.al-title { display:block; width:100%; padding:0; border:0; color:var(--ink); background:transparent; text-align:left; font:inherit; font-size:13px; font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; cursor:pointer; }
.al-title:hover { color:var(--accent); }
.al-card-meta { display:flex; justify-content:space-between; align-items:center; gap:5px; color:var(--dim); font-size:10px; margin-top:7px; }
.al-card-tags { display:flex; gap:5px; margin:11px 0; height:18px; overflow:hidden; }
.al-card-tags > span { padding:2px 5px; font-size:10px; background:var(--bg-3); color:var(--muted); border-radius:3px; white-space:nowrap; }
.al-card-actions { display:flex; align-items:center; gap:4px; border-top:1px solid var(--line); padding-top:9px; }
.al-card-actions > .btn { background:transparent; border-color:transparent; color:var(--accent); padding:3px 0; margin-right:auto; font-size:11px; min-width:0; }
.al-card-actions .btn .ic, .al-card-actions .icon-btn .ic { width:14px; height:14px; }
.al-card-actions .icon-btn { width:28px; height:28px; }
.al-card-actions .al-saved { color:var(--keep); opacity:.85; }
.al-more { text-align:center; margin:23px 0; }
.al-more:has([hidden]) { margin:0; }
.al-empty { display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:270px; border:1px dashed var(--line-2); border-radius:12px; text-align:center; padding:30px; background:var(--bg-2); }
.al-empty > .ic { width:42px; height:42px; padding:9px; box-sizing:content-box; border-radius:15px; color:var(--accent); background:var(--accent-soft); }
.al-empty h3 { font-size:16px; margin:18px 0 0; }
.al-empty p { color:var(--muted); font-size:12px; margin:10px 0 20px; line-height:1.7; }
.al-selection { position:sticky; bottom:16px; z-index:10; display:flex; align-items:center; gap:12px; padding:12px 16px; margin-top:20px; border:1px solid var(--accent); background:var(--bg-2); box-shadow:0 8px 35px #0003; border-radius:12px; }
.al-selection[hidden] { display:none; }
.al-selected-thumbs { display:flex; padding-left:3px; }
.al-selected-thumbs img { width:36px; height:36px; object-fit:cover; border:2px solid var(--bg-2); border-radius:6px; margin-left:-4px; }
.al-selection strong { font-size:12px; white-space:nowrap; }
.al-selection-spacer { flex:1; }
.al-selection .btn { font-size:12px; }
.al-help { border-top:1px solid var(--line); padding-top:16px; margin-top:26px; color:var(--muted); font-size:12px; }
.al-help summary { cursor:pointer; display:flex; align-items:center; gap:7px; }
.al-help summary .ic { width:15px; height:15px; }
.al-help p { max-width:900px; line-height:1.9; }
.stock-library.dragging::after { content:"松开鼠标，导入图片与视频"; position:absolute; inset:0; z-index:20; display:grid; place-items:center; background:var(--bg-2); opacity:.94; border:2px dashed var(--accent); border-radius:12px; color:var(--accent); font-size:23px; pointer-events:none; }
.al-skeleton > div { border:1px solid var(--line); background:var(--bg-2); border-radius:10px; overflow:hidden; padding-bottom:22px; }
.al-skeleton span { display:block; aspect-ratio:16/10; background:var(--bg-3); }
.al-skeleton i { display:block; margin:15px 15px 0; height:10px; border-radius:4px; width:65%; background:var(--bg-3); }
.al-skeleton i:last-child { width:40%; margin-top:10px; }
.modal:has(.al-preview) .box { width:min(1080px,94vw); max-width:1080px; max-height:90vh; overflow:auto; padding:20px; }
.al-preview { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(250px,1fr); gap:24px; }
.al-preview-media { border-radius:9px; background:#10131a; display:flex; align-items:center; justify-content:center; min-height:280px; max-height:68vh; overflow:hidden; position:relative; }
.al-preview-media > img, .al-preview-media > video { display:block; width:100%; height:auto; max-height:68vh; object-fit:contain; }
.al-preview-media > button { position:absolute; bottom:20px; }
.al-preview-info { min-width:0; padding:8px 0; }
.al-preview-info h2 { font-size:21px; margin:0 0 20px; overflow-wrap:anywhere; }
.al-preview-facts { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:20px; }
.al-preview-facts > span { color:var(--dim); font-size:11px; }
.al-preview-facts strong { display:block; color:var(--ink); margin-top:6px; font-size:12px; font-weight:500; }
.al-preview-tags { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:20px; }
.al-license { display:flex; gap:8px; background:var(--bg-3); padding:12px; border-radius:8px; color:var(--muted); font-size:11px; line-height:1.8; }
.al-license > .ic { width:16px; height:16px; flex-shrink:0; color:var(--keep); margin-top:2px; }
.al-license b { font-weight:600; color:var(--ink); }
.al-license p { margin:5px 0; }
.al-preview-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.al-preview-actions .btn { font-size:12px; }
.al-import-drop { position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:8px; border:1px dashed var(--line-2); background:var(--bg-3); border-radius:10px; min-height:145px; margin:18px 0; padding:15px; cursor:pointer; }
.al-import-drop > .ic { color:var(--accent); width:28px; height:28px; }
.al-import-drop > span { font-size:11px; color:var(--muted); }
.al-import-drop input { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; }
.al-import-status { margin:16px 0; font-size:12px; color:var(--muted); line-height:1.8; }
.al-import-status .err { overflow-wrap:anywhere; }
.modal:has(.al-import) .box, .modal:has(#stEditForm) .box { max-height:90vh; overflow:auto; }
.al-job-banner { display:flex; align-items:center; gap:12px; border:1px solid var(--accent); background:var(--accent-soft); padding:14px 18px; margin-bottom:18px; border-radius:10px; font-size:13px; }
.al-job-banner .ic { color:var(--accent); }
.al-job-banner > a { margin-left:auto; white-space:nowrap; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.stock-library button:focus-visible, .stock-library input:focus-visible, .stock-library summary:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(min-width:1700px) { .al-grid { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media(max-width:1150px) { .al-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .al-scopes { gap:16px; } .al-offline { display:none; } }
@media(max-width:850px) { .al-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .al-intro { align-items:flex-start; } .al-intro h2 { font-size:20px; } .al-intro-actions .btn { font-size:11px; padding:7px 9px; } .al-workspace { padding:15px; } .al-preview { grid-template-columns:1fr; } .al-preview-media { min-height:200px; max-height:45vh; } .al-preview-media > img,.al-preview-media > video { max-height:45vh; } .al-selected-thumbs { display:none; } .al-selection { gap:8px; padding:10px; } .al-selection .btn { font-size:11px; padding:7px; } }
@media(max-width:600px) { .al-intro { flex-wrap:wrap; gap:14px; } .al-scopes { gap:16px; overflow:auto; } .al-scopes button { font-size:11px; } .al-sources { gap:10px; } .al-provider small { display:none; } .al-grid { gap:12px; } .al-card-body { padding:10px; } .al-card-meta { font-size:9px; } .al-card-actions > .btn { font-size:10px; } .al-filters { gap:6px; } .al-sort { margin-left:0; } .al-result-head { flex-wrap:wrap; } .al-result-head h3 { font-size:14px; } .al-result-head > span { font-size:10px; } .al-selection { flex-wrap:wrap; } .al-selection-spacer { display:none; } .al-selection #stUseSelection { margin-left:auto; } .al-job-banner { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { .al-card, .al-open > img { transition:none; } }