:root{
  --bg:#ffffff;
  --bg-alt:#eef2f9;
  --panel:#e6ebf3;
  --ink:#0f1b33;
  --muted:#5b6478;
  --navy:#12244a;
  --navy-bright:#1b3566;
  --gold:#a9812e;
  --hair: rgba(15,27,51,0.14);
  --error:#9b2c2c;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--bg); color:var(--ink); font-family:'Inter', sans-serif;
  min-height:100vh; display:flex; flex-direction:column;
}
h1,h2,h3{font-family:'Fraunces', serif; font-weight:500;}
a{color:inherit;}

header{
  padding:22px 32px; border-bottom:1px solid var(--hair);
  display:flex; align-items:center; justify-content:space-between;
}
.brand{font-family:'Fraunces', serif; font-size:1.05rem;}
.brand a{text-decoration:none;}
header nav a{font-size:0.85rem; color:var(--muted); text-decoration:none; margin-left:22px;}
header nav a:hover{color:var(--ink);}

main{flex:1; display:flex; align-items:center; justify-content:center; padding:40px 20px;}
.portal-main{flex:1; padding:50px 24px; max-width:900px; margin:0 auto; width:100%;}

.card{
  width:100%; max-width:380px; border:1px solid var(--hair); padding:40px 34px;
  background:var(--bg);
}
.card h1{font-size:1.6rem; margin-bottom:8px;}
.card p.sub{color:var(--muted); font-size:0.88rem; margin-bottom:30px;}

.field{display:flex; flex-direction:column; gap:6px; margin-bottom:18px;}
.field label{font-size:0.78rem; color:var(--muted);}
.field input{
  border:1px solid var(--hair); background:transparent; padding:12px 12px;
  font-family:'Inter'; font-size:0.95rem; color:var(--ink);
}
.field input:focus{outline:none; border-color:var(--gold);}

.btn{
  width:100%; padding:14px; border:1px solid var(--navy); background:var(--navy);
  color:#fff; font-size:0.9rem; font-weight:500; cursor:pointer; margin-top:6px;
}
.btn:hover{background:var(--navy-bright);}
.btn.secondary{background:transparent; color:var(--ink); border-color:var(--hair);}
.btn.secondary:hover{border-color:var(--navy);}
.btn.google{
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:#fff; color:var(--ink); border:1px solid var(--hair);
}
.btn.google:hover{border-color:var(--navy);}
.btn:disabled{opacity:0.55; cursor:not-allowed;}

.divider{display:flex; align-items:center; gap:12px; margin:22px 0; color:var(--muted); font-size:0.78rem;}
.divider::before,.divider::after{content:''; flex:1; height:1px; background:var(--hair);}

.toggle-row{text-align:center; margin-top:22px; font-size:0.85rem; color:var(--muted);}
.toggle-row button{background:none; border:none; color:var(--gold); cursor:pointer; font-size:0.85rem; text-decoration:underline; padding:0;}

.tab-row{display:flex; gap:0; margin-bottom:26px; border:1px solid var(--hair);}
.tab-row button{
  flex:1; padding:10px; background:var(--bg); border:none; font-size:0.82rem;
  color:var(--muted); cursor:pointer; border-right:1px solid var(--hair);
}
.tab-row button:last-child{border-right:none;}
.tab-row button.active{background:var(--navy); color:#fff;}

.msg{font-size:0.82rem; padding:10px 12px; margin-bottom:16px; display:none;}
.msg.show{display:block;}
.msg.error{background:#fbeaea; color:var(--error);}
.msg.info{background:var(--bg-alt); color:var(--ink);}

.hidden{display:none !important;}

#recaptcha-container{margin-bottom:16px;}

/* Portal (account/admin) shared layout */
.status-banner{
  border:1px solid var(--hair); padding:24px; margin-bottom:40px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
}
.status-banner .label{font-size:0.78rem; color:var(--muted); margin-bottom:6px;}
.status-pill{
  display:inline-block; padding:6px 14px; font-size:0.82rem; border:1px solid var(--gold); color:var(--gold);
}
.gallery-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(180px,1fr)); gap:14px; margin-top:20px;}
.gallery-grid figure{border:1px solid var(--hair); overflow:hidden; aspect-ratio:1; position:relative;}
.gallery-grid img,.gallery-grid video{width:100%; height:100%; object-fit:cover; display:block;}
.gallery-grid a.dl{
  position:absolute; bottom:8px; right:8px; background:var(--navy); color:#fff;
  font-size:0.7rem; padding:5px 9px; text-decoration:none;
}
.empty-note{color:var(--muted); font-size:0.9rem; border:1px solid var(--hair); padding:30px; text-align:center;}

.admin-section{margin-bottom:50px;}
.client-row{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  border-bottom:1px solid var(--hair); padding:16px 0; flex-wrap:wrap;
}
.client-row .who{font-size:0.92rem;}
.client-row .who .email{color:var(--muted); font-size:0.8rem; display:block;}
.client-row select{border:1px solid var(--hair); padding:8px; font-family:'Inter'; font-size:0.85rem;}
.client-row .save-btn{padding:8px 16px; font-size:0.8rem; background:var(--navy); color:#fff; border:none; cursor:pointer;}
.upload-row{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:10px;}
.upload-row input[type=file]{font-size:0.82rem;}
.upload-row select{border:1px solid var(--hair); padding:10px; font-family:'Inter'; font-size:0.85rem; flex:1; min-width:200px;}

footer.mini{padding:24px 32px; border-top:1px solid var(--hair); font-size:0.78rem; color:var(--muted); text-align:center;}
