:root{
  --bg:#04070d; --panel:#0a1120; --panel-2:#0f1a30; --line:#1b2740;
  --blue:#2f7bff; --blue-dim:#1a4fd6; --blue-glow:#6fa8ff;
  --text:#eaf0fb; --muted:#7a88a8; --danger:#ff5c6a; --ok:#3ddc84;
}
html[data-theme="light"]{
  --bg:#f5f7fb; --panel:#ffffff; --panel-2:#eef2fa; --line:#dde3ef;
  --blue:#2f7bff; --blue-dim:#1a4fd6; --blue-glow:#1a4fd6;
  --text:#131a2a; --muted:#5b6478; --danger:#d63447; --ok:#12965a;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{background:var(--bg); color:var(--text); font-family:'Space Grotesk',sans-serif; line-height:1.5; transition:background .25s ease, color .25s ease;}
h1,h2,h3,.serif{font-family:'Newsreader',serif;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit; cursor:pointer;}

.shell{display:grid; grid-template-columns:250px 1fr; min-height:100vh;}
@media(max-width:900px){ .shell{grid-template-columns:1fr;} }

/* ---- sidebar ---- */
.sidebar{
  border-right:1px solid var(--line); padding:28px 22px; position:sticky; top:0; height:100vh;
  display:flex; flex-direction:column; justify-content:space-between;
}
@media(max-width:900px){ .sidebar{position:relative; height:auto; border-right:none; border-bottom:1px solid var(--line);} }
.brand{display:flex; align-items:center; gap:10px; margin-bottom:38px;}
.brand-mark{width:8px; height:28px; background:linear-gradient(var(--blue),var(--blue-dim)); border-radius:2px;}
.brand-text .t1{font-family:'Newsreader',serif; font-weight:600; font-size:16px;}
.brand-text .t2{font-size:11px; color:var(--muted); letter-spacing:0.3px;}
.sidenav{display:flex; flex-direction:column; gap:2px;}
.sidenav .navlink{
  font-size:14px; color:var(--muted); padding:10px 12px; border-radius:7px; cursor:pointer;
  border-left:2px solid transparent; display:flex; align-items:center; gap:10px;
}
.sidenav .navlink:hover{color:var(--text); background:var(--panel);}
.sidenav .navlink.active{color:var(--text); background:var(--panel-2); border-left-color:var(--blue);}
.sidenav .dot{width:5px; height:5px; border-radius:50%; background:var(--muted);}
.sidenav .navlink.active .dot{background:var(--blue-glow);}
.side-foot{display:flex; flex-direction:column; gap:10px;}
.admin-btn{background:transparent; border:1px solid var(--line); color:var(--muted); padding:10px 14px; border-radius:7px; font-size:13px; text-align:left;}
.admin-btn:hover{border-color:var(--blue); color:var(--text);}

/* ---- main ---- */
.main{padding:0;}
.admin-bar{background:linear-gradient(90deg,rgba(47,123,255,0.14),transparent); border-bottom:1px solid var(--line); padding:12px 40px; font-size:13px; display:flex; gap:14px; align-items:center;}
.admin-bar b{color:var(--blue-glow);}
.admin-bar button{background:transparent; border:1px solid var(--line); color:var(--text); padding:6px 14px; border-radius:6px; font-size:12.5px;}

.hero{padding:70px 40px 20px; max-width:760px;}
.hero .eyebrow{font-size:12.5px; color:var(--blue-glow); letter-spacing:1px; margin-bottom:20px; font-family:'Space Grotesk';}
.hero h1{font-size:52px; font-weight:500; font-style:italic; line-height:1.08; margin-bottom:22px;}
.hero p{color:var(--muted); font-size:15.5px; max-width:480px; margin-bottom:30px;}
.hero-cta{display:flex; gap:14px;}
.btn-primary{background:var(--blue); color:#fff; padding:13px 24px; border-radius:6px; border:none; font-weight:600; font-size:14px;}
.btn-primary:hover{background:var(--blue-dim);}
.btn-ghost{border:1px solid var(--line); color:var(--text); padding:13px 24px; border-radius:6px; background:transparent; font-size:14px; font-weight:500;}
.btn-ghost:hover{border-color:var(--blue);}

.stats-row{display:flex; padding:50px 40px; gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); flex-wrap:wrap;}
.stat{flex:1; min-width:140px; padding:0 30px; border-left:1px solid var(--line);}
.stat:first-child{border-left:none; padding-left:0;}
.stat .num{font-family:'Newsreader',serif; font-size:36px; font-style:italic; color:var(--blue-glow);}
.stat .lbl{font-size:12px; color:var(--muted); margin-top:6px;}
@media(max-width:700px){ .stat{border-left:none; padding:16px 0;} }

.sec{padding:56px 40px; max-width:980px;}
.sec-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:28px; gap:16px; flex-wrap:wrap;}
.sec-head h2{font-size:24px; font-weight:500; font-style:italic;}
.sec-head p{color:var(--muted); font-size:13.5px; margin-top:5px;}
.viewall{font-size:13px; color:var(--blue-glow); font-weight:500; cursor:pointer;}
.viewall:hover{text-decoration:underline;}

/* ---- events as editorial rows ---- */
.tabs{display:flex; gap:22px; margin-bottom:26px; border-bottom:1px solid var(--line);}
.tabbtn{padding:0 0 12px; background:none; border:none; border-bottom:2px solid transparent; color:var(--muted); font-size:14px;}
.tabbtn.active{color:var(--text); border-color:var(--blue);}
.ev-row{
  display:flex; gap:24px; padding:22px 0; border-bottom:1px solid var(--line); align-items:center;
}
.ev-row:last-child{border-bottom:none;}
.ev-thumb{width:96px; aspect-ratio:1/1; flex-shrink:0; background:var(--panel); border-radius:6px; overflow:hidden;}
.ev-thumb img{width:100%; height:100%; object-fit:cover; filter:saturate(0.9);}
.ev-date{font-family:'Newsreader',serif; font-style:italic; font-size:14px; color:var(--muted); width:110px; flex-shrink:0;}
.ev-body{flex:1;}
.ev-title{font-size:16.5px; font-weight:500; margin-bottom:5px;}
.ev-desc{font-size:13.5px; color:var(--muted); max-width:520px;}
.ev-meta{font-size:11.5px; color:var(--blue-glow); margin-bottom:4px; text-transform:uppercase; letter-spacing:0.3px;}
.ev-tag{font-size:11px; padding:4px 10px; border-radius:3px; white-space:nowrap;}
.tag-up{background:rgba(47,123,255,0.14); color:var(--blue-glow);}
.tag-done{background:rgba(122,136,168,0.12); color:var(--muted);}
.del-x{background:none; border:none; color:var(--muted); font-size:15px; margin-left:10px;}
.del-x:hover{color:var(--danger);}
.edit-x{background:none; border:none; color:var(--muted); font-size:15px; margin-left:4px;}
.edit-x:hover{color:var(--blue-glow);}
.empty{padding:40px 0; color:var(--muted); font-size:14px; border-bottom:1px dashed var(--line);}

/* ---- gallery masonry-ish ---- */
.gal-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:2px;}
.gcard{position:relative; background:var(--panel);}
.gcard .mw{aspect-ratio:1/1; overflow:hidden;}
.gcard img,.gcard video{width:100%; height:100%; object-fit:cover; filter:saturate(0.9);}
.gcard .cap{position:absolute; bottom:0; left:0; right:0; padding:14px; background:linear-gradient(transparent,rgba(4,7,13,0.92)); opacity:0; transition:.2s;}
.gcard:hover .cap{opacity:1;}
.gcard .cap .name{font-size:13px; font-weight:600;}
.gcard .cap .prog{font-size:11.5px; color:var(--muted);}
.gcard .rm{position:absolute; top:8px; right:8px; background:rgba(4,7,13,0.8); border:none; color:#fff; width:24px; height:24px; border-radius:4px; font-size:13px; z-index:2;}
.gcard .ed{position:absolute; top:8px; right:38px; background:rgba(4,7,13,0.8); border:none; color:#fff; width:24px; height:24px; border-radius:4px; font-size:13px; z-index:2;}
.gcard .ed:hover{color:var(--blue-glow);}
.gcard .rm:hover{color:var(--danger);}

/* ---- finance ---- */
.fin-row{display:flex; gap:0; margin-bottom:34px;}
.fin-cell{flex:1; padding:0 26px; border-left:1px solid var(--line);}
.fin-cell:first-child{border-left:none; padding-left:0;}
.fin-cell .l{font-size:12px; color:var(--muted); margin-bottom:6px;}
.fin-cell .v{font-family:'Newsreader',serif; font-style:italic; font-size:26px;}
.v.pos{color:var(--ok);} .v.neg{color:var(--danger);}
table{width:100%; border-collapse:collapse; font-size:13.5px;}
th{text-align:left; color:var(--muted); font-weight:500; font-size:11.5px; text-transform:uppercase; letter-spacing:0.4px; padding:10px 0; border-bottom:1px solid var(--line);}
td{padding:13px 0; border-bottom:1px solid var(--line);}
.amt-in{color:var(--ok);} .amt-out{color:var(--danger);}

/* ---- about ---- */
.about-grid{display:grid; grid-template-columns:1.3fr 1fr; gap:50px;}
.about-grid p{color:var(--muted); font-size:14.5px; margin-bottom:16px; max-width:480px;}
.fac-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:16px;}
.fac-card{background:var(--panel); border:1px solid var(--line); border-radius:8px; overflow:hidden;}
.fac-photo{width:100%; aspect-ratio:1/1; background:var(--panel-2); display:flex; align-items:center; justify-content:center; font-family:'Newsreader',serif; font-style:italic; color:var(--muted); font-size:38px;}
.fac-photo img{width:100%; height:100%; object-fit:cover;}
.fac-info{padding:12px 14px; display:flex; flex-direction:column;}
.fac-info .role{color:var(--muted); font-size:12px; margin-top:2px;}
@media(max-width:800px){ .about-grid{grid-template-columns:1fr;} }

footer{border-top:1px solid var(--line); padding:40px; font-size:12.5px; color:var(--muted); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

/* ---- modal ---- */
.overlay{position:fixed; inset:0; background:rgba(2,4,8,0.75); display:flex; align-items:center; justify-content:center; z-index:100; padding:20px;}
.modal{background:var(--panel); border:1px solid var(--line); border-radius:10px; width:100%; max-width:440px; padding:26px; max-height:88vh; overflow-y:auto;}
.modal h3{font-family:'Newsreader',serif; font-style:italic; font-size:20px; margin-bottom:18px; font-weight:500;}
.field{margin-bottom:14px;}
.field label{display:block; font-size:12px; color:var(--muted); margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%; background:var(--input-bg, var(--bg)); border:1px solid var(--line); color:var(--text); padding:10px 12px; border-radius:6px; font-size:14px; font-family:inherit;}
.field textarea{resize:vertical; min-height:70px;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--blue);}
.modal-actions{display:flex; gap:10px; margin-top:20px;}
.modal-actions button{flex:1; padding:11px; border-radius:6px; font-size:14px; font-weight:600;}
.btn-cancel{background:transparent; border:1px solid var(--line); color:var(--muted);}
.err-msg{color:var(--danger); font-size:13px; margin-top:-6px; margin-bottom:12px;}
.hint{font-size:12px; color:var(--muted); margin-top:10px;}
.add-btn{background:var(--panel-2); border:1px solid var(--blue-dim); color:var(--blue-glow); padding:9px 16px; border-radius:6px; font-size:13px; font-weight:600;}
.add-btn:hover{background:var(--blue-dim); color:#fff;}
.loading-msg{padding:40px; color:var(--muted);}

/* ---- animated background ---- */
.bg-anim{position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none;}
.blob{position:absolute; border-radius:50%; filter:blur(90px); opacity:0.16; will-change:transform;}
.blob-a{width:520px; height:520px; background:var(--blue); top:-120px; left:-100px; animation:drift1 26s ease-in-out infinite;}
.blob-b{width:460px; height:460px; background:#7a4fff; bottom:-140px; right:-80px; animation:drift2 32s ease-in-out infinite;}
.blob-c{width:360px; height:360px; background:var(--blue-glow); top:40%; left:60%; animation:drift3 22s ease-in-out infinite;}
.grid-overlay{position:absolute; inset:0; background-image:linear-gradient(rgba(47,123,255,0.035) 1px,transparent 1px),linear-gradient(90deg,rgba(47,123,255,0.035) 1px,transparent 1px); background-size:46px 46px; mask-image:radial-gradient(circle at 30% 20%,#000 0%,transparent 70%);}
@keyframes drift1{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(60px,80px) scale(1.12);} }
@keyframes drift2{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-70px,-40px) scale(1.08);} }
@keyframes drift3{ 0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(-40px,50px) scale(0.9);} }
.shell{position:relative; z-index:1;}

/* ---- entrance + hover motion ---- */
@keyframes fadeUp{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }
.hero,.sec,.stats-row{ animation:fadeUp .5s ease both; }
.sec:nth-of-type(2){ animation-delay:.06s; }
.sec:nth-of-type(3){ animation-delay:.12s; }
.stat .num{ transition:transform .25s ease, color .25s ease; }
.stat:hover .num{ transform:translateY(-2px); color:var(--blue); }
.sidenav .navlink{ transition:background .2s ease, color .2s ease, border-color .2s ease, padding-left .2s ease; }
.sidenav .navlink:hover{ padding-left:16px; }
.btn-primary,.btn-ghost,.add-btn,.admin-btn{ transition:transform .18s ease, background .2s ease, border-color .2s ease; }
.btn-primary:hover,.add-btn:hover{ transform:translateY(-2px); }
.btn-ghost:hover,.admin-btn:hover{ transform:translateY(-2px); }
.ev-row{ transition:background .2s ease, transform .2s ease; border-radius:6px; }
.ev-row:hover{ background:rgba(47,123,255,0.05); transform:translateX(2px); }
.gcard{ transition:transform .25s ease; }
.gcard:hover{ transform:translateY(-4px); }
.gcard .mw img,.gcard .mw video{ transition:transform .4s ease; }
.gcard:hover .mw img,.gcard:hover .mw video{ transform:scale(1.06); }
.fac-card{ transition:transform .2s ease, border-color .2s ease; }
.fac-card:hover{ transform:translateY(-3px); border-color:var(--blue-dim); }
.ev-thumb img{ transition:transform .35s ease; }
.ev-row:hover .ev-thumb img{ transform:scale(1.05); }
@keyframes overlayIn{ from{opacity:0;} to{opacity:1;} }
@keyframes modalIn{ from{opacity:0; transform:translateY(10px) scale(0.97);} to{opacity:1; transform:translateY(0) scale(1);} }
.overlay{ animation:overlayIn .18s ease both; }
.modal{ animation:modalIn .22s ease both; }

@media (prefers-reduced-motion: reduce){
  .blob{ animation:none; }
  .hero,.sec,.stats-row,.overlay,.modal{ animation:none; }
  .stat .num,.sidenav .navlink,.btn-primary,.btn-ghost,.add-btn,.admin-btn,.ev-row,.gcard,.gcard .mw img,.gcard .mw video,.fac-card,.ev-thumb img{ transition:none; }
}

/* ---- lightbox ---- */
.lightbox-overlay{ background:rgba(2,4,8,0.92); z-index:200; }
.lightbox-body{ max-width:90vw; max-height:88vh; display:flex; flex-direction:column; align-items:center; gap:14px; }
.lightbox-body img, .lightbox-body video{ max-width:90vw; max-height:78vh; border-radius:8px; object-fit:contain; }
.lightbox-cap{ text-align:center; color:var(--text); }
.lightbox-cap .name{ font-size:15px; font-weight:600; }
.lightbox-cap .prog{ font-size:12.5px; color:var(--muted); margin-top:2px; }
.lightbox-close{ position:fixed; top:20px; right:24px; background:transparent; border:none; color:#fff; font-size:26px; z-index:201; }

.fac-card{ position:relative; background:var(--panel); border:1px solid var(--line); border-radius:8px; overflow:hidden; }