:root{
  --bg:#f6f7fb;
  --card:#fff;
  --text:#2c2630;
  --muted:#666;
  --brand:#7B1E1E;
  --accent:#F49E0B;
  --radius:12px;

  /* Extension vars */
  --brand-dark:#621616;
  --focus:#2563eb22; /* soft focus ring */
}

/* Reset & base */
*{ box-sizing:border-box; }
body{
  margin:0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
}
.wrap{ max-width:1100px; margin:24px auto; padding:0 16px; }

/* Components */
.card{
  background:var(--card);
  border-radius:var(--radius);
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  padding:16px;
  margin-bottom:14px;
}
h1,h2,h3{ margin:.2em 0 .5em; }
label{ font-weight:600; }

input,select,textarea{
  width:100%;
  padding:10px;
  border:1px solid #ccd3e1;
  border-radius:10px;
  background:#fff;
}

/* Layout helpers */
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.grid{ display:grid; gap:12px; }
.results{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; }

/* Buttons */
.btn{
  background:var(--brand);
  color:#fff;
  border:0;
  padding:10px 14px;
  border-radius:10px;
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
  display:inline-block;
}
.btn.alt{ background:var(--accent); color:#fff; }

/* Badges */
.badge{ background:#eee; border-radius:999px; padding:2px 10px; font-size:.85rem; }

/* Profile bits */
.profile-card img{ width:100%; max-height:180px; object-fit:cover; border-radius:10px; }
.gallery{ display:flex; gap:8px; flex-wrap:wrap; }
.gallery img{ height:96px; border-radius:10px; }

/* Notices */
.notice{ background:#fff7dd; border:1px solid #ffeda3; border-radius:10px; padding:8px; }

/* Responsive */
@media (max-width:768px){
  .row2{ grid-template-columns:1fr; }
}

/* ------------------ Enhancements / Drop-in Extension ------------------ */

/* Links */
a{ color: var(--brand); text-decoration: none; }
a:hover{ text-decoration: underline; }

/* Buttons: hover/focus/disabled */
.btn:hover{ filter: brightness(0.95); }
.btn:focus-visible{ outline: 3px solid var(--focus); outline-offset: 2px; }
.btn[disabled], .btn.disabled{ opacity: .6; cursor: not-allowed; }

/* Inputs: focus + invalid */
input:focus, select:focus, textarea:focus{
  outline: none;
  border-color:#9bb3ff;
  box-shadow: 0 0 0 3px #e7edff;
  background:#fff;
}
input:invalid{ border-color:#e08; }

/* Notice variants */
.notice.success{ background:#ecfdf5; border-color:#a7f3d0; }
.notice.error{ background:#fef2f2; border-color:#fecaca; }

/* Tables (for admin screens) */
.table{
  width:100%;
  border-collapse: collapse;
  font-size: .95rem;
  background:var(--card);
  border-radius: var(--radius);
  overflow: hidden;
}
.table th, .table td{
  padding:10px 12px;
  border-bottom:1px solid #eef1f6;
  text-align:left;
}
.table th{ background:#f8fafc; font-weight:700; color:#334155; }
.table tr:hover td{ background:#fafafa; }

/* Utilities */
.text-muted{ color: var(--muted); }
.small{ font-size:.9rem; color: var(--muted); }
.sr-only{ position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }

/* Chips / tags */
.tag{ display:inline-block; padding:2px 8px; background:#f3f4f6; border-radius: 999px; font-size:.85rem; }
.tag.brand{ background: #fde68a; }

/* 3-column responsive grid */
.row3{ display:grid; grid-template-columns: repeat(3,1fr); gap:12px; }
@media (max-width:1024px){ .row3{ grid-template-columns: 1fr 1fr; } }
@media (max-width:640px){ .row3{ grid-template-columns: 1fr; } }

/* Print helpers */
@media print{
  a.btn, .btn { display:none !important; }
  .card{ box-shadow:none; border:1px solid #ddd; border-radius: 0; }
  body{ background:#fff; color:#000; }
  .wrap{ max-width:100%; margin:0; padding:0; }
  .gallery img{ height:70px; }
}
