/* ── 基于 data_interface 的应用画廊 ───────────────────────────────────── */
.sidebar-header .method-gallery-trigger{margin-left:0}
.ui-gallery-trigger{margin-left:auto;flex-shrink:0;padding:4px 7px;border:1px solid rgba(233,69,96,.6);border-radius:4px;background:rgba(233,69,96,.08);color:#ff9dad;font-size:10px;font-weight:bold;letter-spacing:.2px;cursor:pointer;transition:all .2s}
.ui-gallery-trigger:hover,.ui-gallery-trigger.active{background:#e94560;color:#fff;border-color:#e94560;box-shadow:0 0 14px rgba(233,69,96,.28)}
.ui-gallery-trigger span{font-size:12px;margin-left:2px}
.ui-gallery{position:absolute;left:260px;right:0;top:0;bottom:0;z-index:45;display:none;flex-direction:column;overflow:hidden;background:radial-gradient(circle at 92% 0%,rgba(233,69,96,.18),transparent 30%),linear-gradient(145deg,#111d38 0%,#10172d 54%,#0d1427 100%);border-left:1px solid rgba(233,69,96,.45);box-shadow:-18px 0 38px rgba(0,0,0,.32)}
.ui-gallery.open{display:flex;animation:uiGalleryIn .24s ease-out both}
@keyframes uiGalleryIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
.ui-gallery-head{display:flex;align-items:flex-start;gap:20px;padding:24px 28px 18px;background:radial-gradient(circle at 72% 0%,rgba(78,201,176,.16),transparent 32%),radial-gradient(circle at 14% 0%,rgba(233,69,96,.2),transparent 38%);border-bottom:1px solid rgba(233,69,96,.2);flex-shrink:0}
.ui-gallery-kicker{color:#ff8ea3;font:10px/1.2 Consolas,"Microsoft YaHei",sans-serif;letter-spacing:2px;text-transform:uppercase}
.ui-gallery-head h2{margin-top:7px;color:#f4f8ff;font-size:24px;letter-spacing:1px}
.ui-gallery-head p{max-width:760px;margin-top:7px;color:#a0abc2;font-size:11px;line-height:1.65}
.ui-gallery-foundation-note{padding:9px 11px;border-left:3px solid #4ec9b0;border-radius:0 5px 5px 0;background:rgba(78,201,176,.08);color:#b9c7dc!important}
.ui-gallery-foundation-note strong{color:#e8fff9}
.ui-gallery-foundation-note code{padding:1px 4px;border:1px solid rgba(78,201,176,.25);border-radius:3px;background:rgba(9,22,38,.75);color:#7fe5d2;font:10px Consolas,"Microsoft YaHei",sans-serif}
.ui-gallery-proof{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}
.ui-gallery-proof span{padding:4px 8px;border:1px solid rgba(78,201,176,.24);border-radius:999px;background:rgba(16,30,55,.65);color:#91e1d0;font-size:10px}
.ui-gallery-head-actions{display:flex;align-items:flex-start;gap:8px;margin-left:auto;padding-top:2px}
.ui-gallery-metric{min-width:72px;padding:9px 12px;border:1px solid rgba(233,69,96,.25);border-radius:8px;background:rgba(16,30,55,.75);text-align:center}
.ui-gallery-metric strong{display:block;color:#f3f7ff;font:700 20px/1 Consolas,"Microsoft YaHei",sans-serif}
.ui-gallery-metric span{display:block;margin-top:5px;color:#8491ad;font-size:10px}
.ui-gallery-close{margin-left:2px;padding:5px 9px;border:1px solid #344568;border-radius:5px;background:rgba(17,27,49,.72);color:#c0c9dc;font-size:11px;cursor:pointer;transition:all .18s}
.ui-gallery-close:hover{color:#fff;border-color:#e94560;background:rgba(233,69,96,.18)}
.ui-gallery-toolbar{display:flex;align-items:center;gap:12px;padding:12px 24px;border-bottom:1px solid rgba(52,69,104,.65);background:rgba(12,20,39,.68);flex-shrink:0}
.ui-gallery-filters{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.ui-gallery-filter{padding:5px 10px;border:1px solid #2c3d61;border-radius:5px;background:transparent;color:#93a2bd;font-size:10px;cursor:pointer;transition:all .18s}
.ui-gallery-filter:hover{border-color:#ff7187;color:#ffd1d8}
.ui-gallery-filter.active{border-color:#e94560;background:rgba(233,69,96,.16);color:#ffb2bd;box-shadow:0 0 10px rgba(233,69,96,.12)}
.ui-gallery-search{display:flex;align-items:center;gap:6px;margin-left:auto;width:min(270px,30vw);padding:5px 9px;border:1px solid #2c3d61;border-radius:5px;background:#121d35;color:#ff8094}
.ui-gallery-search span{font-size:14px;color:#ff8094}
.ui-gallery-search input{width:100%;border:0;outline:0;background:transparent;color:#dce7f6;font-size:11px}
.ui-gallery-search input::placeholder{color:#62718c}
.ui-gallery-count{color:#71819f;font-size:10px;white-space:nowrap}
.ui-gallery-grid{flex:1;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));align-content:start;gap:15px;padding:18px 24px 30px}
.ui-gallery-card{position:relative;display:flex;flex-direction:column;min-width:0;min-height:300px;padding:9px;border:1px solid rgba(83,107,151,.55);border-radius:12px;background:linear-gradient(145deg,rgba(27,43,75,.94),rgba(16,28,53,.97));color:#dbe6f8;text-align:left;cursor:pointer;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s;animation:uiCardIn .32s ease both}
.ui-gallery-card::before{content:"";position:absolute;left:0;top:0;width:52px;height:2px;background:#e94560;box-shadow:0 0 14px rgba(233,69,96,.55)}
.ui-gallery-card:hover{transform:translateY(-3px);border-color:rgba(255,113,135,.9);box-shadow:0 12px 26px rgba(0,0,0,.3),0 0 0 1px rgba(233,69,96,.12)}
@keyframes uiCardIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.ui-gallery-thumb{display:flex;align-items:center;justify-content:center;height:clamp(160px,13.5vw,220px);flex:0 0 clamp(160px,13.5vw,220px);aspect-ratio:16/9;overflow:hidden;border:1px solid #263858;border-radius:7px;background:#080f1d}
.ui-gallery-thumb img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .25s}
.ui-gallery-card:hover .ui-gallery-thumb img{transform:scale(1.025)}
.ui-gallery-card-meta{display:flex;align-items:center;gap:7px;margin:10px 2px 0}
.ui-gallery-product{color:#ff91a2;font:700 11px/1 Consolas,"Microsoft YaHei",sans-serif;letter-spacing:1px}
.ui-gallery-view{padding:3px 6px;border:1px solid rgba(128,154,198,.4);border-radius:3px;color:#9eafd0;font:9px/1 Consolas,"Microsoft YaHei",sans-serif}
.ui-gallery-mask{margin-left:auto;color:#83d8c9;font-size:9px}
.ui-gallery-card h3{margin:8px 2px 0;color:#f0f5ff;font-size:14px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ui-gallery-card p{display:-webkit-box;overflow:hidden;margin:5px 2px 1px;color:#94a4c1;font-size:10px;line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.ui-gallery-empty{grid-column:1/-1;padding:70px 20px;text-align:center;color:#71819f;font-size:12px}
.ui-gallery-lightbox{position:fixed;inset:0;z-index:10020;display:flex;align-items:center;justify-content:center;padding:28px;background:rgba(3,8,18,.86);backdrop-filter:blur(5px)}
.ui-gallery-lightbox[hidden]{display:none}
.ui-gallery-lightbox-card{display:flex;flex-direction:column;width:min(1420px,96vw);height:min(94vh,980px);border:1px solid rgba(233,69,96,.6);border-radius:13px;background:#0e1729;box-shadow:0 24px 70px rgba(0,0,0,.55);overflow:hidden}
.ui-gallery-lightbox-head{display:flex;align-items:center;gap:10px;padding:11px 14px;background:#14233c;border-bottom:1px solid #273c5f;flex-shrink:0}
.ui-gallery-lightbox-head strong{color:#f4f8ff;font-size:13px}
.ui-gallery-lightbox-head span{color:#ff91a2;font:10px Consolas,"Microsoft YaHei",sans-serif}
.ui-gallery-lightbox-head button{margin-left:auto;padding:5px 10px;border:1px solid #475c7d;border-radius:5px;background:#1a2c49;color:#dce7f6;font-size:11px;cursor:pointer}
.ui-gallery-lightbox-head button:hover{border-color:#ff7187;color:#fff}
.ui-gallery-lightbox-image{display:flex;align-items:center;justify-content:center;min-height:0;flex:1;padding:16px;background:#080f1d}
.ui-gallery-lightbox-image img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.ui-gallery-lightbox-foot{display:flex;align-items:center;gap:12px;padding:9px 14px;background:#101d34;border-top:1px solid #273c5f;color:#9ba9c0;font-size:10px;flex-shrink:0}
.ui-gallery-lightbox-foot strong{color:#c9d4e7;font-weight:normal}
@media(max-width:820px){
  .ui-gallery{left:0}
  .ui-gallery-head{padding:18px 18px 14px}
  .ui-gallery-head h2{font-size:20px}
  .ui-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(245px,1fr));padding:14px 16px 24px}
  .ui-gallery-toolbar{padding:10px 16px}
}
@media(max-width:560px){
  .sidebar-header .ui-gallery-trigger{padding:4px 5px}
  .ui-gallery-head{display:block;padding:14px 14px 12px}
  .ui-gallery-head h2{font-size:18px}
  .ui-gallery-head p{font-size:10px}
  .ui-gallery-head-actions{margin:12px 0 0}
  .ui-gallery-toolbar{display:block;padding:8px 12px}
  .ui-gallery-search{width:100%;margin:8px 0 0}
  .ui-gallery-count{display:block;margin-top:7px}
  .ui-gallery-grid{grid-template-columns:1fr;gap:10px;padding:12px}
  .ui-gallery-thumb{height:205px;flex-basis:205px}
  .ui-gallery-lightbox{padding:10px}
  .ui-gallery-lightbox-card{height:92vh}
}