/* CG Gallery v1.1.3 */
.cg-gallery-wrap *, .cg-viewer * { box-sizing: border-box; }
.cg-gallery-wrap { width: 100%; display: block; margin-bottom: 0; padding-bottom: 0; }
.cg-folders-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; width: 100%; margin-bottom: 20px; }
.cg-folders-grid[data-columns="1"] { grid-template-columns: 1fr; }
.cg-folders-grid[data-columns="2"] { grid-template-columns: repeat(2, 1fr); }
.cg-folders-grid[data-columns="4"] { grid-template-columns: repeat(4, 1fr); }
.cg-folders-grid[data-columns="5"] { grid-template-columns: repeat(5, 1fr); }
.cg-folders-grid[data-columns="6"] { grid-template-columns: repeat(6, 1fr); }
@media (max-width: 900px) { .cg-folders-grid, .cg-folders-grid[data-columns="3"], .cg-folders-grid[data-columns="4"], .cg-folders-grid[data-columns="5"], .cg-folders-grid[data-columns="6"] { grid-template-columns: repeat(2, 1fr); gap: 16px; } }
@media (max-width: 600px) { .cg-folders-grid, .cg-folders-grid[data-columns="1"], .cg-folders-grid[data-columns="2"], .cg-folders-grid[data-columns="3"], .cg-folders-grid[data-columns="4"], .cg-folders-grid[data-columns="5"], .cg-folders-grid[data-columns="6"] { grid-template-columns: 1fr !important; gap: 14px; } }
.cg-folder-card { display:flex; flex-direction:column; width:100%; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 2px 12px rgba(0,0,0,.09); cursor:pointer; transition:transform .22s ease,box-shadow .22s ease; }
.cg-folder-card:hover, .cg-folder-card:active { transform:translateY(-4px); box-shadow:0 8px 24px rgba(0,0,0,.15); }
.cg-folder-cover { position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; background:#ddd; flex-shrink:0; }
@supports not (aspect-ratio: 16/9) { .cg-folder-cover { padding-top:56.25%; } .cg-folder-cover img { position:absolute; inset:0; } }
.cg-folder-cover img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .32s ease; }
.cg-folder-card:hover .cg-folder-cover img { transform:scale(1.05); }
.cg-folder-overlay { position:absolute; inset:0; background:rgba(0,0,0,.28); display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .22s; }
.cg-folder-card:hover .cg-folder-overlay, .cg-folder-card:active .cg-folder-overlay { opacity:1; }
.cg-view-btn { background:#fff; color:#111; padding:8px 20px; border-radius:30px; font-size:12px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; white-space:nowrap; }
.cg-folder-info { padding:12px 14px 14px; background:#fff; flex-shrink:0; display:flex; flex-direction:column; gap:6px; }
.cg-folder-title { margin:0; font-size:15px; font-weight:700; color:#1a1a1a; line-height:1.35; word-break:break-word; }
.cg-folder-meta { display:flex; align-items:center; justify-content:space-between; font-size:13px; color:#888; gap:8px; }
.cg-folder-date { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cg-folder-count { display:flex; align-items:center; gap:4px; font-weight:600; color:#555; white-space:nowrap; flex-shrink:0; }
.cg-folder-count svg { width:14px; height:14px; flex-shrink:0; }
@media (max-width: 600px) { .cg-folder-info { padding:10px 12px 12px; gap:5px; } .cg-folder-title { font-size:14px; } .cg-folder-meta { font-size:12px; } }
.cg-no-folders { color:#888; font-size:15px; }
.cg-viewer { position:fixed; top:0; left:0; width:100%; height:100%; z-index:999999; background:#111; display:flex; flex-direction:column; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px); }
.cg-viewer-topbar { flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:rgba(0,0,0,.75); gap:10px; min-height:50px; }
.cg-viewer-counter { flex-shrink:0; font-size:13px; color:rgba(255,255,255,.7); min-width:46px; white-space:nowrap; }
.cg-viewer-title { flex:1; min-width:0; text-align:center; font-size:14px; font-weight:600; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cg-viewer-close { flex-shrink:0; background:rgba(255,255,255,.15); border:none; color:#fff; font-size:22px; width:36px; height:36px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; transition:background .2s; -webkit-tap-highlight-color:transparent; }
.cg-viewer-close:hover, .cg-viewer-close:active { background:rgba(255,255,255,.3); }
.cg-viewer-stage { flex:1 1 0; min-height:0; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#000; }
.cg-viewer-img-wrap { width:100%; height:100%; display:flex; align-items:center; justify-content:center; position:relative; }
#cgViewerImg { max-width:100%; max-height:100%; object-fit:contain; display:block; user-select:none; -webkit-user-drag:none; }
.cg-viewer-prev, .cg-viewer-next { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.13); border:none; color:#fff; font-size:38px; width:48px; height:48px; border-radius:50%; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2; padding:0; line-height:1; transition:background .2s; -webkit-tap-highlight-color:transparent; }
.cg-viewer-prev:hover, .cg-viewer-prev:active, .cg-viewer-next:hover, .cg-viewer-next:active { background:rgba(255,255,255,.28); }
.cg-viewer-prev { left:12px; } .cg-viewer-next { right:12px; }
@media (max-width:600px) { .cg-viewer-prev, .cg-viewer-next { width:36px; height:36px; font-size:26px; background:rgba(0,0,0,.4); } .cg-viewer-prev { left:4px; } .cg-viewer-next { right:4px; } }
.cg-viewer-strip-wrap { flex:0 0 auto; height:84px; padding:8px 10px; background:rgba(0,0,0,.92); overflow:hidden; }
.cg-viewer-strip { display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:6px; height:100%; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.cg-viewer-strip::-webkit-scrollbar { display:none; }
.cg-strip-thumb { flex:0 0 auto; width:62px; height:62px; border-radius:5px; overflow:hidden; cursor:pointer; opacity:.45; border:2px solid transparent; transition:opacity .15s,border-color .15s; -webkit-tap-highlight-color:transparent; }
.cg-strip-thumb img { width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.cg-strip-thumb:hover, .cg-strip-thumb:active { opacity:.8; }
.cg-strip-thumb.active { opacity:1; border-color:#fff; }
@media (max-width:600px) { .cg-viewer-strip-wrap { height:70px; padding:6px 8px; } .cg-strip-thumb { width:54px; height:54px; } }
.cg-viewer-spinner { position:absolute; top:50%; left:50%; width:32px; height:32px; margin:-16px 0 0 -16px; border:3px solid rgba(255,255,255,.15); border-top-color:#fff; border-radius:50%; animation:cgSpin .65s linear infinite; }
@keyframes cgSpin { to { transform:rotate(360deg); } }
