@import url('/static/studio-local.css?v=044-user-prompt-authority');
/* Libraries and selection: bounded grids, visible filenames, one purpose per surface. */
.mockup-card>a>img,.mockup-card button>img{width:100%;height:190px;object-fit:contain;background:#f5f3ee}
.mockup-card-info{padding:12px}.mockup-card-info>b,.mockup-card-info>small,.mockup-card button>small{display:block;overflow-wrap:anywhere}.mockup-card-info>small{color:var(--muted);margin:5px 0}
.mockup-card.active{outline:3px solid #2b5284;outline-offset:-3px}.mockup-card button[aria-pressed=true]:after{content:'✓ Đã chọn';display:block;color:#244d7b;font-weight:700;padding:6px}
.mockup-rename-row{display:flex;align-items:center;gap:12px;margin:10px 0}.mockup-rename-row img{width:66px;height:66px;object-fit:contain}.mockup-rename-row input{flex:1;min-width:0}.mockup-revision-preview{width:100%;max-height:280px;object-fit:contain;border-radius:12px;background:#f6f4ef}
#ml-upload-panel{margin:18px 0;padding:18px;border:1px solid #dbe2ec;border-radius:12px}#ml-upload-status{overflow-wrap:anywhere}
.icon-match-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:10px}.icon-match{position:relative;border:1px solid #dbe2ec;border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}.icon-match:has(input:checked){background:#eef4ff;border-color:#31557f}.icon-match input{position:absolute;top:10px;left:10px;width:auto}.icon-match img{height:100px;width:100%;object-fit:contain;background:white}.icon-match small{font-size:11px;color:#59677a}.icon-detail-preview{max-width:180px;height:150px;object-fit:contain;display:block;margin:auto}.style-file{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e0e5ee;border-radius:10px}.style-file img{width:65px;height:65px;object-fit:contain;background:white}.style-file .grow{min-width:0;overflow-wrap:anywhere}.style-file .grow small{display:block}.style-file button{white-space:normal}.style-image-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:8px}#matched-icons-panel{margin:20px 0;padding:16px;border:1px solid #dbe2ec;border-radius:12px}#matched-icons-panel section+section{margin-top:16px}.pager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0}.empty-icon{font-size:30px;display:block;height:60px}
@media(max-width:600px){.mockup-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mockup-card>a>img,.mockup-card button>img{height:130px}.mockup-card-info{padding:8px}.style-file{flex-wrap:wrap}.mockup-card-info .button-row{gap:3px}}