
*{margin:0;padding:0;box-sizing:border-box;}
:root{--purple:#713aff;--pink:#eb34ff;--blue:#5189d9;--cyan:#05eab8;--dark:#08060f;--dark2:#0d0a1e;--c:#713aff;}
body{background:var(--dark);color:#f6f7f7;font-family:'DM Sans',sans-serif;min-height:100vh;}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(8,6,15,.9);backdrop-filter:blur(12px);border-bottom:1px solid rgba(113,58,255,.15);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;}
.nav-logo{font-family:'Saira Extra Condensed',sans-serif;font-size:22px;font-weight:900;letter-spacing:2px;text-decoration:none;color:#f6f7f7;}
.nav-back{font-size:13px;color:rgba(255,255,255,.5);text-decoration:none;display:flex;align-items:center;gap:6px;transition:color .2s;}
.nav-back:hover{color:#f6f7f7;}

/* MAIN */
.page{padding:96px 24px 60px;max-width:1200px;margin:0 auto;}
.page-title{font-family:'Saira Extra Condensed',sans-serif;font-size:52px;font-weight:900;text-transform:uppercase;margin-bottom:8px;}
.page-sub{font-size:15px;color:rgba(255,255,255,.5);margin-bottom:40px;line-height:1.6;}

/* ALBUMS */
.album-card{background:#110e1f;border:1px solid rgba(113,58,255,.15);border-radius:16px;overflow:hidden;cursor:pointer;transition:transform .2s,border-color .2s;margin-bottom:32px;}
.album-card:hover{transform:translateY(-2px);border-color:rgba(113,58,255,.4);}
.album-header{padding:20px 24px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.album-naam{font-family:'Saira Extra Condensed',sans-serif;font-size:26px;font-weight:900;text-transform:uppercase;}
.album-meta{font-size:13px;color:rgba(255,255,255,.4);margin-top:4px;}
.album-grid{display:grid;gap:3px;padding:0 3px 3px;}
.album-grid img{width:100%;height:100%;object-fit:cover;display:block;transition:opacity .2s;}
.album-grid img:hover{opacity:.85;}
.album-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.5);cursor:pointer;background:none;border:none;color:rgba(255,255,255,.5);font-family:'DM Sans',sans-serif;padding:0;}
.album-toggle:hover{color:#f6f7f7;}

/* LIGHTBOX */
#lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.97);z-index:9999;flex-direction:column;align-items:center;justify-content:center;}
#lightbox.open{display:flex;}
.lb-close{position:absolute;top:16px;right:20px;background:rgba(255,255,255,.08);border:none;color:#fff;font-size:22px;cursor:pointer;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.lb-close:hover{background:rgba(255,255,255,.15);}
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.08);border:none;color:#fff;font-size:24px;cursor:pointer;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.lb-prev{left:16px;}
.lb-next{right:16px;}
.lb-prev:hover,.lb-next:hover{background:rgba(255,255,255,.18);}
#lb-img{max-width:90vw;max-height:72vh;object-fit:contain;border-radius:6px;}
.lb-bottom{margin-top:16px;text-align:center;}
.lb-counter{font-size:13px;color:rgba(255,255,255,.4);margin-bottom:12px;}
.lb-dl-btn{background:linear-gradient(135deg,#eb34ff,#713aff);color:#fff;border:none;padding:13px 32px;border-radius:8px;font-family:'Saira Extra Condensed',sans-serif;font-size:20px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:opacity .2s;}
.lb-dl-btn:hover{opacity:.9;}

/* DOWNLOAD MODAL */
#dl-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:10000;align-items:center;justify-content:center;padding:20px;}
#dl-modal.open{display:flex;}
.dl-box{background:#110e1f;border:1px solid rgba(113,58,255,.3);border-radius:16px;padding:32px;max-width:420px;width:100%;}
.dl-title{font-family:'Saira Extra Condensed',sans-serif;font-size:26px;font-weight:900;text-transform:uppercase;margin-bottom:8px;}
.dl-sub{font-size:13px;color:rgba(255,255,255,.5);margin-bottom:22px;line-height:1.6;}
.dl-label{display:block;font-size:10px;color:rgba(255,255,255,.4);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:5px;}
.dl-input{width:100%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:11px 14px;color:#fff;font-size:14px;outline:none;margin-bottom:12px;font-family:'DM Sans',sans-serif;}
.dl-input:focus{border-color:rgba(113,58,255,.6);}
.dl-btns{display:flex;gap:10px;margin-top:8px;}
.dl-submit{flex:1;background:linear-gradient(135deg,#eb34ff,#713aff);color:#fff;border:none;padding:13px;border-radius:8px;font-family:'Saira Extra Condensed',sans-serif;font-size:20px;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;}
.dl-cancel{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#fff;padding:13px 16px;border-radius:8px;cursor:pointer;font-size:14px;}

/* LOADING */
.loading{text-align:center;padding:60px;color:rgba(255,255,255,.3);font-size:15px;}
.spinner{width:32px;height:32px;border:3px solid rgba(113,58,255,.2);border-top-color:#713aff;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px;}
@keyframes spin{to{transform:rotate(360deg);}}

@media(max-width:600px){
  .page{padding:80px 16px 40px;}
  .page-title{font-size:36px;}
  nav{padding:0 16px;}
  .album-header{padding:16px;}
}
