input{font-family:inherit}
.ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 26px;border-radius:999px;border:1.5px solid rgba(255,255,255,.28);color:#EAEEF8;font-weight:600;font-size:14px;transition:background .2s,border-color .2s}
.ghost:hover{background:rgba(255,255,255,.08);border-color:#fff}
.fchip{padding:10px 18px;border-radius:999px;border:1.5px solid rgba(255,255,255,.22);background:transparent;color:#EAEEF8;font-weight:600;font-size:14px;cursor:pointer;min-height:44px;transition:background .2s,color .2s,border-color .2s}
.fchip:hover{border-color:#fff}
.fchip.on{background:#fff;color:#0E1424;border-color:#fff}
.crumb{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;letter-spacing:.08em;color:#9AA6C4}
.crumb a:hover{color:#fff}
.foot-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}

/* halaman ini */
.viewer{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:24px;align-items:stretch}
.gal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;grid-auto-flow:dense}
.gtile{position:relative;overflow:hidden;border-radius:20px;max-width:100%}
.gal .gtile{aspect-ratio:4/5;border:0;padding:0;cursor:pointer;text-align:left;transition:transform .3s}
.gal .gtile:hover{transform:translateY(-4px) rotate(-1deg)}
.gal .gtile.wide{grid-column:span 2;aspect-ratio:auto;min-height:300px}
.gal .gtile.sel{outline:3px solid #FFC95C;outline-offset:3px}
.g0{background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 7px,transparent 7px 14px),linear-gradient(160deg,#34426F,#1A2236)}
.g0::before{content:"";position:absolute;left:50%;bottom:0;width:50%;height:48%;transform:translateX(-50%);background:#9DB0FF;border-radius:999px 999px 0 0}
.g1{background:repeating-linear-gradient(45deg,rgba(14,20,36,.08) 0 7px,transparent 7px 14px),linear-gradient(160deg,#FFC95C,#F2A93B)}
.g1::before{content:"";position:absolute;right:14%;top:14%;width:30%;aspect-ratio:1/1;border-radius:50%;background:#0E1424}
.g2{background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 7px,transparent 7px 14px),linear-gradient(160deg,#27325A,#121A2E)}
.g2::before{content:"";position:absolute;left:14%;bottom:0;width:30%;height:62%;background:#FFC95C;border-radius:999px 999px 0 0}
.g2::after{content:"";position:absolute;left:52%;bottom:0;width:22%;height:38%;background:#34426F;border-radius:999px 999px 0 0}
.g3{background:repeating-linear-gradient(45deg,rgba(14,20,36,.08) 0 7px,transparent 7px 14px),linear-gradient(160deg,#B9C6FF,#9DB0FF)}
.g3::before{content:"";position:absolute;left:12%;top:16%;width:44%;height:4px;background:#0E1424;box-shadow:0 18px 0 -0px #0E1424}
.g3::after{content:"";position:absolute;left:12%;top:42%;width:34%;height:4px;background:#0E1424}
.g4{background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 7px,transparent 7px 14px),linear-gradient(160deg,#222C47,#0E1424)}
.g4::before{content:"";position:absolute;left:50%;top:50%;width:46%;aspect-ratio:1/1;transform:translate(-50%,-50%);border-radius:50%;border:4px solid #9DB0FF}
.g5{background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 7px,transparent 7px 14px),linear-gradient(160deg,#34426F,#1A2236)}
.g5::before{content:"";position:absolute;right:12%;bottom:0;width:32%;height:56%;background:#fff;border-radius:999px 999px 0 0}
.gtag{position:absolute;left:10px;bottom:10px;z-index:2;font-family:'DM Mono',ui-monospace,monospace;font-size:11px;color:#fff;background:rgba(14,20,36,.78);padding:4px 8px;border-radius:6px;max-width:calc(100% - 20px)}

@media (max-width:1120px){.links{display:none}.menubtn{display:inline-flex}}
@media (max-width:960px){.viewer{grid-template-columns:minmax(0,1fr)}.gal{grid-template-columns:repeat(3,minmax(0,1fr))}.foot-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.gal{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.foot-cols{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* foto unggahan */
.gtile.photo{background:#1A2236}
.gimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}
.gimg.contain{object-fit:contain;background:#0E1424}
.gimg.loaded{opacity:1}
.gimg.gagal{display:none}

/* daftar album (folder) */
.albums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.acard{display:flex;flex-direction:column;gap:6px;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer;font:inherit}
.acard .acover{display:block;aspect-ratio:4/3;border-radius:24px;border:1px solid rgba(255,255,255,.10);transition:transform .3s}
.acard:hover .acover{transform:translateY(-4px)}
.acard .aname{margin-top:10px;font-family:'Bricolage Grotesque','Plus Jakarta Sans',system-ui,sans-serif;font-weight:700;font-size:22px;line-height:1.1;letter-spacing:-.02em;color:#fff}
.acard .ameta{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;color:#9AA6C4}
@media (max-width:960px){.albums{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.albums{grid-template-columns:minmax(0,1fr)}}
