/* palette now aliases the single source in theme.css (loaded first) */
:root{ --g1:var(--mm-g1); --g2:var(--mm-g2); --g3:var(--mm-g3); --ink:var(--mm-ink); --plum:var(--mm-plum); }
*{ box-sizing:border-box; } html,body{ margin:0; }
body{ font-family:var(--mm-font); color:var(--ink);
  background:linear-gradient(135deg,var(--g1),var(--g2) 60%,var(--g3)); min-height:100vh;
  display:flex; flex-direction:column; }
.mm-wrap{ max-width:1040px; margin:0 auto; padding:0 22px; width:100%; }
.mm-top{ background:rgba(35,32,77,.92); color:#fff; }
.mm-top .mm-wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 22px; }
.mm-brand{ color:#fff; text-decoration:none; font-weight:700; font-size:1.15rem; }
.mm-nav a{ color:#fff; text-decoration:none; margin-left:18px; font-size:.9rem; opacity:.92; }
.mm-nav a:hover{ opacity:1; text-decoration:underline; }
.mm-main{ flex:1; display:flex; align-items:center; padding:48px 0; }
.mm-hero{ background:rgba(255,255,255,.9); border-radius:22px; padding:46px 40px;
  box-shadow:0 24px 60px rgba(0,0,0,.2); text-align:center; max-width:640px; margin:0 auto; }
.mm-eyebrow{ text-transform:uppercase; letter-spacing:3px; font-size:.72rem; font-weight:700; color:var(--plum); margin:0 0 .3em; }
.mm-hero h1{ font-size:2.7rem; margin:.05em 0 .25em; letter-spacing:-.5px; }
.lede{ font-size:1.1rem; color:#5a5167; line-height:1.5; }
.mm-btn{ display:inline-block; margin-top:16px; background:var(--plum); color:#fff; text-decoration:none;
  padding:11px 24px; border-radius:24px; font-weight:600; transition:transform .1s, background .15s; }
.mm-btn:hover{ background:#7a3fa0; transform:translateY(-1px); }
.mm-soon{ font-size:.82rem; color:#9a90a0; margin-top:18px; }
.mm-foot{ background:rgba(35,32,77,.92); color:#fff; font-size:.8rem; }
.mm-foot .mm-wrap{ padding:14px 22px; text-align:center; }
.mm-foot a{ color:#fff; opacity:.85; }

/* cards + forms (auth) */
.mm-card{ background:rgba(255,255,255,.93); border-radius:22px; padding:38px 36px; box-shadow:0 24px 60px rgba(0,0,0,.2); max-width:760px; margin:0 auto; }
.mm-narrow{ max-width:430px; }
.mm-card h1{ font-size:1.85rem; margin:0 0 .4em; }
.mm-form{ display:flex; flex-direction:column; gap:14px; margin-top:10px; text-align:left; }
.mm-form label{ display:flex; flex-direction:column; gap:6px; font-size:.82rem; font-weight:700; color:#5a5167; }
.mm-form input{ padding:.72em .85em; border:1.5px solid #e0d6ec; border-radius:10px; font-size:1rem; }
.mm-form input:focus{ outline:none; border-color:var(--plum); box-shadow:0 0 0 3px rgba(138,79,176,.15); }
.mm-form button{ margin-top:6px; background:var(--plum); color:#fff; border:0; border-radius:22px; padding:12px; font-size:1rem; font-weight:700; cursor:pointer; }
.mm-form button:hover{ background:#7a3fa0; }
.mm-err{ background:#fdecea; color:#b3261e; padding:10px 14px; border-radius:10px; font-size:.9rem; }
.mm-ok{ background:#e7f6ec; color:#1e7a3e; padding:10px 14px; border-radius:10px; font-size:.9rem; }
.mm-muted{ color:#8a8092; font-size:.9rem; }

/* account: saved-books grid (responsive — fills wide, single-column on phones) */
.mm-btn--ghost{ background:transparent; color:var(--plum); border:1.5px solid #d8c2ec; }
.mm-btn--ghost:hover{ background:rgba(138,79,176,.08); }
.mm-book-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin:10px 0 4px; text-align:left; }
.mm-book-card{ display:flex; flex-direction:column; gap:7px; padding:12px; background:#fff; border:1px solid #ece4f4; border-radius:14px;
  text-decoration:none; color:var(--ink); box-shadow:0 4px 14px rgba(0,0,0,.05); transition:transform .1s, box-shadow .15s; }
.mm-book-card:hover{ transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.1); }
.mm-book-thumb{ width:100%; aspect-ratio:9/7; object-fit:cover; border-radius:9px; background:#f1ebf8;
  display:flex; align-items:center; justify-content:center; font-size:2rem; }
.mm-book-thumb--empty{ color:#b9a9d0; }
.mm-book-title{ font-weight:700; font-size:.98rem; line-height:1.2; }
.mm-book-meta{ font-size:.76rem; color:#8a8092; }
.mm-book-status{ font-weight:700; color:var(--plum); }

/* ----- mobile polish (≤640px) ----- */
@media (max-width:640px){
  .mm-wrap{ padding:0 16px; }
  .mm-top .mm-wrap{ flex-wrap:wrap; gap:4px 0; padding:12px 16px; }
  .mm-nav a{ margin-left:0; margin-right:16px; }
  .mm-main{ padding:28px 0; }
  .mm-hero{ padding:30px 20px; border-radius:18px; }
  .mm-hero h1{ font-size:2.05rem; }
  .lede{ font-size:1rem; }
  .mm-card{ padding:26px 20px; border-radius:18px; }
  .mm-card h1{ font-size:1.5rem; }
}