:root{--tpl-accent:#1f6feb;--tpl-accent-d:#0b4fc0;--tpl-ink:#1d2327;--tpl-line:#d8dce0;--tpl-soft:#f4f6f8}
*,*::before,*::after{box-sizing:border-box}
.tpl-body{margin:0;font:16px/1.7 system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;color:var(--tpl-ink);background:#fff}
.tpl-header,.tpl-footer{padding:12px 16px;text-align:center;background:var(--tpl-soft)}
.tpl-footer:empty{display:none}
.tpl-brand{font-size:1.25rem;font-weight:700;color:inherit;text-decoration:none}
.tpl-header-text,.tpl-footer p{margin:2px 0 0;color:#555}
.tpl-main{max-width:1100px;margin:0 auto;padding:8px 16px 6px}
.tpl-ad{max-width:1100px;margin:4px auto;padding:0 16px;text-align:center;overflow:hidden;line-height:1.2}
.tpl-ad-foot{margin-top:4px;margin-bottom:8px}
.tpl-center{text-align:center}

/* album bar: range counter at the physical left, title centred */
.tpl-albumbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;direction:ltr;margin:4px 0 8px}
.tpl-albumbar h1{grid-column:2;margin:0;font-size:1.5rem;text-align:center;unicode-bidi:plaintext}
.tpl-range{grid-column:1;justify-self:start;font-size:.8rem;color:#777;font-variant-numeric:tabular-nums}
.tpl-intro{margin:0 0 10px;color:#444}

/* grid: 5 per row on desktop, hover pop-out */
.tpl-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.tpl-thumb{position:relative;display:block;aspect-ratio:4/3;border-radius:8px;overflow:hidden;background:#e9ecef;transition:transform .18s ease,box-shadow .18s ease}
.tpl-thumb img{width:100%;height:100%;object-fit:cover;display:block}
@media (hover:hover){.tpl-thumb:hover{transform:scale(1.07);box-shadow:0 8px 22px rgba(0,0,0,.28);z-index:3}}
.tpl-views{position:absolute;right:6px;bottom:6px;display:inline-flex;align-items:center;gap:3px;padding:0 6px;border-radius:10px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;line-height:1.7;direction:ltr}
.tpl-views svg{width:11px;height:11px;fill:currentColor}
@media (max-width:760px){.tpl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:440px){.tpl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* pagination */
.tpl-pagination{margin:14px 0 2px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.tpl-pagination .page-numbers{min-width:42px;height:42px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--tpl-line);border-radius:10px;background:#fff;color:var(--tpl-ink);text-decoration:none;font-size:1.05rem;font-weight:600;transition:background .15s,color .15s,transform .15s,box-shadow .15s}
.tpl-pagination a.page-numbers:hover{background:var(--tpl-accent);border-color:var(--tpl-accent);color:#fff;transform:translateY(-1px)}
.tpl-pagination .current{background:var(--tpl-accent);border-color:var(--tpl-accent);color:#fff;box-shadow:0 2px 8px rgba(31,111,235,.35)}
.tpl-pagination .dots{border:0;background:none;min-width:24px;padding:0}

/* home */
.tpl-home-title{text-align:center;font-size:1.8rem;margin:10px 0}
.tpl-home-count{text-align:center;color:#666;margin:12px 0 4px}
.tpl-enter{display:inline-block;padding:12px 34px;border-radius:12px;background:var(--tpl-accent);color:#fff;text-decoration:none;font-weight:700;font-size:1.1rem;transition:background .15s,transform .15s}
.tpl-enter:hover{background:var(--tpl-accent-d);transform:translateY(-1px)}

/* photo page */
.tpl-text p{margin:0 0 .8em}
.tpl-num{margin:0;font-size:.72rem;font-weight:400;color:#9aa0a6;text-align:left;direction:ltr;letter-spacing:.05em;line-height:1.6}
.tpl-figure{margin:0;text-align:center}
.tpl-image{max-width:100%;height:auto}
.tpl-viewsline{display:flex;align-items:center;justify-content:flex-end;gap:4px;direction:ltr;margin:3px 0;font-size:.8rem;color:#777}
.tpl-viewsline svg{width:14px;height:14px;fill:currentColor}

/* one-row action bar */
.tpl-acts{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:10px 0}
.tpl-act{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 2px;min-width:0;border:1px solid var(--tpl-line);border-radius:10px;background:#fff;color:var(--tpl-ink);font:inherit;font-size:11px;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.tpl-act svg{width:20px;height:20px;fill:currentColor;flex:none}
.tpl-act span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-act:hover{background:var(--tpl-accent);border-color:var(--tpl-accent);color:#fff;transform:translateY(-1px)}
.tpl-whatsapp:hover{background:#25d366;border-color:#25d366}
.tpl-facebook:hover{background:#1877f2;border-color:#1877f2}
.tpl-x:hover{background:#000;border-color:#000}
.tpl-telegram:hover{background:#229ed9;border-color:#229ed9}
@media (min-width:760px){.tpl-act{flex-direction:row;gap:7px;padding:10px 8px;font-size:13px}.tpl-act svg{width:18px;height:18px}}

/* rating */
.tpl-rating{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:10px 0}
.tpl-stars{display:inline-flex;flex-direction:row-reverse;direction:ltr}
.tpl-star{background:none;border:0;padding:0 2px;font-size:32px;line-height:1;color:#c7ccd1;cursor:pointer;transition:color .12s,transform .12s}
.tpl-star.on{color:#f5a623}
.tpl-rating:not(.voted) .tpl-star:hover,.tpl-rating:not(.voted) .tpl-star:hover ~ .tpl-star{color:#f5a623}
.tpl-rating:not(.voted) .tpl-star:hover{transform:scale(1.15)}
.tpl-rating.voted .tpl-star{cursor:default}
.tpl-rating-label{color:#555;font-size:.95rem}
.tpl-rating-msg{color:#1a7f37;font-size:.9rem}

/* previous / album / next, grouped in the centre */
.tpl-nav{display:flex;justify-content:center;align-items:center;gap:10px;margin:14px 0}
.tpl-navbtn{min-width:104px;padding:10px 16px;text-align:center;border:1px solid var(--tpl-line);border-radius:10px;background:#fff;color:var(--tpl-ink);text-decoration:none;font-weight:600;transition:background .15s,color .15s,transform .15s}
a.tpl-navbtn:hover{background:var(--tpl-accent);border-color:var(--tpl-accent);color:#fff;transform:translateY(-1px)}
.tpl-navbtn.off{opacity:.35}
.tpl-navalbum{background:var(--tpl-accent);border-color:var(--tpl-accent);color:#fff}
.tpl-h2{font-size:1.1rem;margin:16px 0 8px}

/* floating jump buttons */
.tpl-jump{position:fixed;right:12px;inset-inline-end:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;z-index:50}
.tpl-jump button{width:42px;height:42px;border:0;border-radius:10px;background:rgba(31,111,235,.85);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25);transition:background .15s,transform .15s}
.tpl-jump button:hover{background:var(--tpl-accent-d);transform:scale(1.06)}
.tpl-jump svg{width:26px;height:26px;fill:currentColor}
@media (max-width:520px){.tpl-jump button{width:36px;height:36px}.tpl-jump{right:6px;inset-inline-end:6px}}

/* full-screen viewer (touch devices) */
.tpl-viewer{position:fixed;inset:0;background:#000;z-index:1000;display:none;flex-direction:column;align-items:center;justify-content:center}
.tpl-viewer.open{display:flex}
.tpl-viewer img{max-width:100%;max-height:calc(100% - 90px);object-fit:contain}
.tpl-viewer-close{position:absolute;top:10px;right:12px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.tpl-wall{margin:16px;padding:13px 26px;border:0;border-radius:12px;background:#fff;color:#000;font:inherit;font-weight:700;cursor:pointer}
@media (hover:none){.tpl-image{cursor:zoom-in}}
