/* Simple, clean, "dark academia-ish" */
:root{
  --bg:#0f0e0c; --panel:#1a1916; --ink:#e7dec8; --muted:#bfb59b; --ring:#c3a96e;
  --line:#2a261d;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;}
body{
  font-family: Georgia, serif;
  background: radial-gradient(1000px 600px at 30% 10%, #15130f, var(--bg));
  color:var(--ink);
}
.wrap{max-width:1000px;margin:0 auto;padding:2rem 1rem;}
.muted{color:var(--muted)}
.row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:1rem}

.btn{
  border:1px solid #5e5038;background:#1d1b16;color:var(--ink);
  padding:.6rem .9rem;border-radius:.6rem;cursor:pointer;
}
.btn:hover{filter:brightness(1.05)}
.btn.ghost{background:transparent;border-style:dashed;color:var(--muted)}
h1{margin:.2rem 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:1.5rem}
.card{border:1px solid rgba(195,169,110,.25);background:var(--panel);padding:1rem;border-radius:.8rem}

/* Popup */
.overlay{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.6);padding:1rem;z-index:100;
}
.overlay.show{display:flex}
.modal{
  width:min(640px,95vw);background:var(--panel);border:1px solid rgba(195,169,110,.35);
  border-radius:.9rem;box-shadow:0 20px 60px rgba(0,0,0,.55);animation:lift .18s ease;
}
@keyframes lift{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.modal-head{
  display:flex;justify-content:space-between;align-items:center;
  padding:.9rem 1rem;border-bottom:1px solid var(--line);
}
.modal-body{padding:1rem}
.close{
  background:transparent;border:0;color:var(--muted);font-size:1.1rem;cursor:pointer;
}
.close:hover{color:var(--ink)}
input,textarea{
  width:100%;background:#13120f;color:var(--ink);border:1px solid var(--line);
  border-radius:.6rem;padding:.55rem .7rem;font-family:inherit;
}
label{display:block;margin:.6rem 0 .25rem;color:var(--muted)}
.form-row{margin-bottom:.6rem}
.actions-end{
  display:flex;
  gap:.5rem;
  justify-content:flex-end;
  margin-top:.75rem;
}
