/* ===== myfedi.link – app.css – v0.2 design system ===== */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,300&family=JetBrains+Mono:wght@400;500&display=swap');

/* ── TOKENS ── */
:root {
  --bg:          oklch(0.985 0.002 80);
  --fg:          oklch(0.16  0.01  260);
  --card:        oklch(0.995 0.001 80);
  --primary:     oklch(0.55  0.18  200);
  --primary-h:   oklch(0.50  0.18  200);
  --primary-fg:  oklch(0.99  0.002 200);
  --secondary:   oklch(0.955 0.015 200);
  --secondary-fg:oklch(0.25  0.04  200);
  --muted:       oklch(0.96  0.008 260);
  --muted-fg:    oklch(0.50  0.02  260);
  --border:      oklch(0.91  0.008 260);
  --ring:        oklch(0.55  0.18  200);
  --danger:      oklch(0.577 0.245 27.325);
  --success:     oklch(0.48  0.15  150);
  --radius:      0.75rem;
  --r-sm:        calc(var(--radius) - 4px);
  --r-md:        calc(var(--radius) - 2px);
  --shadow-xs:   0 1px 2px oklch(0 0 0/.05);
  --shadow-sm:   0 1px 3px oklch(0 0 0/.07),0 1px 2px oklch(0 0 0/.04);
  --shadow-md:   0 4px 16px oklch(0 0 0/.09),0 1px 3px oklch(0 0 0/.05);
  --font:        'DM Sans',  system-ui, sans-serif;
  --mono:        'JetBrains Mono', monospace;
}

/* ── RESET ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html  { scroll-behavior:smooth; }
body  { font-family:var(--font); background:var(--bg); color:var(--fg); line-height:1.6; min-height:100vh; display:flex; flex-direction:column; -webkit-font-smoothing:antialiased; }
img   { max-width:100%; display:block; }
main  { flex:1; }
code  { font-family:var(--mono); font-size:0.85em; background:var(--muted); border-radius:var(--r-sm); padding:0.1em 0.4em; }

/* ── LAYOUT ── */
.container    { max-width:1100px; margin:0 auto; padding:0 1.5rem; }
.container-sm { max-width:600px;  margin:0 auto; padding:0 1.5rem; }
.centered     { text-align:center; }

/* ── TYPOGRAPHY ── */
h1 { font-size:2.25rem; font-weight:600; letter-spacing:-0.028em; line-height:1.2; }
h2 { font-size:1.6rem; font-weight:600; letter-spacing:-0.02em; margin-bottom:0.875rem; }
h3 { font-size:1.15rem; font-weight:600; margin-bottom:0.5rem; }
p  { font-size:1rem; }
a  { color:var(--primary); }

/* ── BUTTONS ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:0.4rem;
  height:2.25rem; padding:0 1rem;
  border:none; border-radius:var(--r-md);
  font-family:var(--font); font-size:0.875rem; font-weight:500;
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:background .15s, box-shadow .15s;
  outline:none;
}
.btn:focus-visible { box-shadow:0 0 0 3px oklch(0.55 0.18 200/.45); }
.btn:disabled      { opacity:.5; pointer-events:none; }

.btn-primary   { background:var(--primary);   color:var(--primary-fg); box-shadow:var(--shadow-xs); }
.btn-primary:hover   { background:var(--primary-h); }
.btn-secondary { background:var(--secondary); color:var(--secondary-fg); border:1px solid var(--border); }
.btn-secondary:hover { background:oklch(0.94 0.015 200); }
.btn-danger    { background:var(--danger); color:#fff; }
.btn-danger:hover    { background:oklch(0.52 0.22 27); }
.btn-outline   { background:var(--card); color:var(--fg); border:1px solid var(--border); box-shadow:var(--shadow-xs); }
.btn-outline:hover   { background:var(--muted); }
.btn-ghost     { background:transparent; color:var(--fg); }
.btn-ghost:hover     { background:var(--muted); }

.btn-sm  { height:2rem; padding:0 0.75rem; font-size:0.8rem; border-radius:var(--r-sm); }
.btn-lg  { height:2.75rem; padding:0 1.5rem; font-size:1rem; }

/* ── FORM ELEMENTS ── */
label { display:block; font-size:0.875rem; font-weight:500; margin-bottom:0.375rem; }

input[type="text"], input[type="email"], input[type="password"], input[type="url"],
textarea, select, .input {
  width:100%; height:2.25rem;
  padding:0 0.75rem;
  border:1px solid var(--border); border-radius:var(--r-md);
  background:var(--card); color:var(--fg);
  font-family:var(--font); font-size:0.875rem;
  box-shadow:var(--shadow-xs);
  transition:border-color .15s, box-shadow .15s;
  outline:none;
}
textarea { height:auto; min-height:5rem; padding:0.5rem 0.75rem; resize:vertical; }
select   {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 0.625rem center;
  padding-right:2rem; cursor:pointer;
}
input::placeholder, textarea::placeholder { color:var(--muted-fg); }
input:focus-visible, textarea:focus-visible, select:focus-visible {
  border-color:var(--ring); box-shadow:0 0 0 3px oklch(0.55 0.18 200/.45);
}
input:disabled, textarea:disabled, select:disabled { opacity:.5; cursor:not-allowed; }

/* field wrapper */
.field { margin-bottom:1.25rem; }
.field-checkbox label { display:flex; align-items:center; gap:0.5rem; font-weight:400; cursor:pointer; }
.field-checkbox input[type="checkbox"] { width:auto; height:auto; }

/* ── USERNAME PREFIX INPUT ── */
.username-input-wrap {
  display:flex; align-items:stretch;
  border:1px solid var(--border); border-radius:var(--r-md);
  overflow:hidden; box-shadow:var(--shadow-xs);
  transition:border-color .15s, box-shadow .15s;
}
.username-input-wrap:focus-within {
  border-color:var(--ring); box-shadow:0 0 0 3px oklch(0.55 0.18 200/.45);
}
.prefix {
  display:flex; align-items:center; padding:0 0.75rem;
  font-family:var(--mono); font-size:0.78rem; color:var(--muted-fg);
  background:var(--muted); border-right:1px solid var(--border);
  white-space:nowrap; user-select:none;
}
.username-input-wrap input {
  flex:1; border:none; border-radius:0; box-shadow:none; background:var(--card); height:2.5rem;
}
.username-input-wrap input:focus-visible { box-shadow:none; border:none; }

.username-status { display:block; font-family:var(--mono); font-size:0.75rem; margin-top:0.3rem; min-height:1rem; color:var(--muted-fg); }
.username-status.available   { color:var(--success); }
.username-status.unavailable { color:var(--danger); }
.username-status.checking    { color:var(--muted-fg); }

/* ── PROFILE ROWS (register & dashboard) ── */
.profile-row { display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap; }
.profile-row select { flex:0 0 145px; }
.profile-row input  { flex:1; min-width:90px; }
.at { color:var(--muted-fg); font-family:var(--mono); font-size:0.85rem; flex-shrink:0; }
.profiles-fieldset { border:1px solid var(--border); border-radius:var(--radius); padding:1.25rem; margin-bottom:1.25rem; }
.profiles-fieldset legend { font-size:0.875rem; font-weight:600; padding:0 0.375rem; }
#profiles-list { display:flex; flex-direction:column; gap:0.625rem; margin:0.875rem 0; }

/* ── ALERTS ── */
.alert {
  border:1px solid var(--border); border-radius:var(--r-md);
  padding:0.875rem 1rem; font-size:0.875rem; margin-bottom:1.25rem;
}
.alert p + p { margin-top:0.25rem; }
.alert-error   { border-color:oklch(0.82 0.1 27);  background:oklch(0.97 0.02 27);  color:var(--danger); }
.alert-success { border-color:oklch(0.82 0.1 150); background:oklch(0.97 0.03 150); color:oklch(0.35 0.12 150); }

/* ── MODALS ── */
.modal {
  position:fixed; inset:0; z-index:1000;
  background:oklch(0 0 0/.5);
  display:flex; align-items:center; justify-content:center; padding:1rem;
  animation:fadeIn .15s ease;
}
.modal[hidden]  { display:none; }
.modal-content  {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); box-shadow:var(--shadow-md);
  padding:1.75rem; width:100%; max-width:480px;
  animation:slideUp .2s ease;
}
.modal-content h2 { font-size:1.1rem; margin-bottom:1rem; }
.modal-actions    { display:flex; gap:0.625rem; margin-top:1.25rem; }
@keyframes fadeIn  { from{opacity:0} to{opacity:1} }
@keyframes slideUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* ── STAT CARDS ── */
.stat-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:1.25rem 1.5rem; box-shadow:var(--shadow-sm);
}
.stat-number { font-size:2rem; font-weight:700; letter-spacing:-0.03em; line-height:1; color:var(--primary); }
.stat-label  { font-size:0.75rem; color:var(--muted-fg); margin-top:0.25rem; font-family:var(--mono); text-transform:uppercase; letter-spacing:0.05em; }

/* ── TABLE ── */
.admin-table {
  width:100%; border-collapse:collapse;
  font-size:0.875rem;
}
.admin-table th {
  height:2.5rem; padding:0 0.75rem;
  text-align:left; font-size:0.78rem; font-weight:500;
  color:var(--muted-fg); white-space:nowrap;
  background:var(--muted); border-bottom:1px solid var(--border);
}
.admin-table td { padding:0.625rem 0.75rem; border-bottom:1px solid var(--border); }
.admin-table tbody tr:last-child td { border-bottom:none; }
.admin-table tbody tr:hover { background:oklch(0.96 0.008 260/.6); }
.admin-table tr.inactive { opacity:.55; }
.table-wrap { border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; overflow-x:auto; }
.table-actions { display:flex; gap:0.375rem; flex-wrap:wrap; }

/* ── PAGINATION ── */
.pagination { display:flex; gap:0.25rem; flex-wrap:wrap; margin-top:1.5rem; }
.pagination a {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2.25rem; height:2.25rem; padding:0 0.5rem;
  border:1px solid var(--border); border-radius:var(--r-md);
  font-size:0.875rem; text-decoration:none; color:var(--fg);
  background:var(--card); transition:background .15s;
}
.pagination a:hover  { background:var(--muted); }
.pagination a.active { background:var(--primary); color:var(--primary-fg); border-color:var(--primary); }

/* ── SITE HEADER ── */
.site-header {
  position:sticky; top:0; z-index:100;
  border-bottom:1px solid var(--border);
  background:oklch(0.985 0.002 80/.92);
  backdrop-filter:blur(12px);
}
.site-header .container {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:0.875rem; padding-bottom:0.875rem;
}
.logo {
  display:flex; align-items:center; gap:0.5rem;
  text-decoration:none; color:var(--fg);
}
.logo svg { flex-shrink:0; }
.logo-text {
  font-size:1.1rem; font-weight:600; letter-spacing:-0.02em;
  color:var(--fg);
}
.logo-text em { font-style:normal; color:var(--primary); }
.site-header nav { display:flex; align-items:center; gap:1rem; }
.site-header nav a:not(.btn) {
  font-size:0.875rem; color:var(--muted-fg); text-decoration:none; transition:color .15s;
}
.site-header nav a:not(.btn):hover { color:var(--fg); }

/* ── SITE FOOTER ── */
.site-footer {
  border-top:1px solid var(--border); padding:1.5rem;
  background:var(--muted);
}
.site-footer .container {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
}
.site-footer p { font-size:0.78rem; color:var(--muted-fg); font-family:var(--mono); }
.site-footer a { color:var(--muted-fg); text-decoration:none; }
.site-footer a:hover { color:var(--primary); }

/* ══════════════════════════════════════════
   PAGE: HOME
══════════════════════════════════════════ */
.full-screen {
  min-height:calc(100vh - 57px);
  display:flex; align-items:center;
  padding:5rem 1.5rem;
}
.hero {
  position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 55% 55% at 70% 38%, oklch(0.55 0.18 200/.08) 0%, transparent 70%),
    radial-gradient(ellipse 35% 40% at 15% 75%, oklch(0.72 0.14 50/.06)  0%, transparent 60%);
}
.hero::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(var(--border) 1px, transparent 1px),
    linear-gradient(90deg, var(--border) 1px, transparent 1px);
  background-size:48px 48px; opacity:0.35;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%, black 0%, transparent 100%);
}
.hero-content { position:relative; z-index:1; max-width:560px; }
.hero-content-centered {
  max-width:600px; margin:0 auto; text-align:center;
}
.hero-eyebrow {
  font-family:var(--mono); font-size:0.75rem; font-weight:500;
  text-transform:uppercase; letter-spacing:0.1em; color:var(--primary);
  margin-bottom:1rem; display:flex; align-items:center; justify-content:center; gap:0.5rem;
}
.hero-eyebrow::before,
.hero-eyebrow::after { content:''; display:inline-block; width:20px; height:1.5px; background:var(--primary); }
.hero-content h1 { font-size:clamp(2.2rem,4.5vw,3.5rem); margin-bottom:1.125rem; line-height:1.12; }
.lead { font-size:1.1rem; color:var(--muted-fg); line-height:1.8; margin-bottom:2rem; }
.username-check-form { display:flex; flex-direction:column; gap:0.5rem; max-width:440px; margin:0 auto; }

.section-alt  { background:var(--muted); border-top:1px solid var(--border); }
.section-fedi { border-top:1px solid var(--border); }

/* HERO-3 stærk radial + farvet grid */
.hero-radial-strong::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(ellipse 65% 60% at 72% 35%, oklch(0.55 0.18 200/.14) 0%, transparent 68%),
    radial-gradient(ellipse 40% 45% at 10% 80%, oklch(0.72 0.14 50/.10) 0%, transparent 60%),
    radial-gradient(ellipse 30% 35% at 88% 82%, oklch(0.55 0.18 200/.07) 0%, transparent 55%);
}
.hero-radial-strong::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(oklch(0.55 0.18 200/.1) 1px, transparent 1px),
    linear-gradient(90deg, oklch(0.55 0.18 200/.1) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%, black 0%, transparent 100%);
}

.features { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:2rem; }
.feature {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:1.5rem;
  transition:border-color .2s, box-shadow .2s, transform .2s;
}
.feature:hover { border-color:oklch(0.75 0.12 200); box-shadow:var(--shadow-md); transform:translateY(-2px); }
.feature-icon {
  width:48px; height:48px;
  background:var(--secondary); border:1px solid oklch(0.88 0.03 200);
  border-radius:var(--r-md);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.125rem;
  color:var(--primary);
}
.feature-icon svg {
  width:22px; height:22px;
}
.feature h3   { font-size:1rem; margin-bottom:0.375rem; }
.feature p    { font-size:0.875rem; color:var(--muted-fg); line-height:1.6; }

.fedi-description { font-size:1rem; color:var(--muted-fg); line-height:1.8; max-width:680px; margin:0 auto 1rem; }

/* ══════════════════════════════════════════
   PAGE: LOGIN & REGISTER
══════════════════════════════════════════ */
.page-login, .page-register {
  padding:3.5rem 1.5rem 5rem;
}
.page-login h1, .page-register h1 {
  font-size:1.75rem; margin-bottom:1.75rem;
}
.login-link, .register-link {
  margin-top:1.5rem; font-size:0.875rem; color:var(--muted-fg); text-align:center;
}
.login-link a, .register-link a {
  color:var(--primary); font-weight:500; text-decoration:none;
}
.login-link a:hover, .register-link a:hover { text-decoration:underline; }

/* ══════════════════════════════════════════
   PAGE: DASHBOARD
══════════════════════════════════════════ */
.page-dashboard { padding:2.5rem 1.5rem 5rem; }
.page-dashboard h1 { margin-bottom:0.5rem; }

.profile-link-preview {
  display:inline-flex; align-items:center;
  font-family:var(--mono); font-size:0.82rem;
  color:var(--primary); text-decoration:none;
  background:var(--secondary); border:1px solid var(--border);
  border-radius:999px; padding:0.3rem 0.875rem; margin-bottom:1.75rem;
  transition:background .15s;
}
.profile-link-preview:hover { background:oklch(0.94 0.015 200); }

.dashboard-stats { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:2.5rem; }
.dashboard-profiles h2, .dashboard-danger h2 { margin-top:2rem; }
.dashboard-profiles h3 { font-size:0.95rem; color:var(--muted-fg); margin-top:1.75rem; margin-bottom:0.75rem; }

.profile-list {
  list-style:none;
  border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;
}
.profile-list-item {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0.75rem;
  padding:0.875rem 1rem; border-bottom:1px solid var(--border);
  background:var(--card); transition:background .1s;
}
.profile-list-item:last-child { border-bottom:0; }
.profile-list-item:hover { background:var(--muted); }

.profile-list-info    { display:flex; align-items:center; gap:0.625rem; flex-wrap:wrap; }
.profile-list-actions { display:flex; gap:0.375rem; }

.service-badge {
  font-family:var(--mono); font-size:0.7rem; font-weight:500;
  background:var(--secondary); color:var(--secondary-fg);
  border:1px solid var(--border); border-radius:var(--r-sm);
  padding:0.15rem 0.5rem;
}
.fedi-handle  { font-family:var(--mono); font-size:0.82rem; }
.click-count  { font-family:var(--mono); font-size:0.75rem; color:var(--muted-fg); }

.add-profile-form {
  background:var(--muted); border:1px solid var(--border);
  border-radius:var(--radius); padding:1rem;
}

.dashboard-danger {
  border-top:1px solid var(--border); padding-top:1.5rem; margin-top:3rem;
}
.dashboard-danger p { font-size:0.875rem; color:var(--muted-fg); margin-bottom:0.875rem; }

/* ══════════════════════════════════════════
   PAGE: PUBLIC PROFILE
══════════════════════════════════════════ */
.page-profile { padding-bottom:5rem; }
.profile-banner { height:180px; background:var(--muted) center/cover no-repeat; }
.page-profile .container-sm { padding-top:2.5rem; }

.profile-header { text-align:center; margin-bottom:2rem; }
.profile-avatar {
  width:88px; height:88px; border-radius:50%;
  margin:0 auto 1rem; object-fit:cover;
  border:3px solid var(--bg); box-shadow:var(--shadow-sm);
}
.profile-username { font-size:1.5rem; margin-bottom:0.5rem; }
.profile-bio      { font-size:0.9rem; color:var(--muted-fg); line-height:1.65; max-width:380px; margin:0 auto; }

.profile-links { display:flex; flex-direction:column; gap:0.625rem; }
.profile-link-btn {
  display:flex; align-items:center; justify-content:space-between;
  padding:0.875rem 1.125rem;
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--r-md); text-decoration:none; color:var(--fg);
  box-shadow:var(--shadow-xs);
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
.profile-link-btn:hover {
  border-color:var(--primary);
  box-shadow:0 2px 10px oklch(0.55 0.18 200/.15);
  transform:translateY(-1px);
}
.profile-link-btn .service-name {
  font-family:var(--mono); font-size:0.7rem; color:var(--muted-fg);
  text-transform:uppercase; letter-spacing:0.06em;
}
.profile-link-btn .fedi-handle {
  font-family:var(--mono); font-size:0.875rem; font-weight:500;
}
.no-profiles { text-align:center; color:var(--muted-fg); font-size:0.9rem; padding:2rem 0; }

/* ══════════════════════════════════════════
   PAGE: ADMIN
══════════════════════════════════════════ */
.page-admin { padding:2.5rem 1.5rem 5rem; }
.page-admin h1 { margin-bottom:1.25rem; }

.admin-nav {
  display:flex; gap:0.25rem; margin-bottom:2rem;
  background:var(--muted); border:1px solid var(--border);
  border-radius:var(--radius); padding:3px; width:fit-content;
}
.admin-nav a {
  display:inline-flex; align-items:center;
  padding:0.35rem 0.875rem;
  border:1px solid transparent; border-radius:var(--r-md);
  font-size:0.875rem; font-weight:500; text-decoration:none; color:var(--muted-fg);
  transition:all .15s;
}
.admin-nav a:hover  { color:var(--fg); background:var(--bg); }
.admin-nav a.active { color:var(--fg); background:var(--bg); border-color:var(--border); box-shadow:var(--shadow-xs); }

.admin-stats   { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.admin-section { margin-top:2rem; }
.admin-section h2 { margin-bottom:1rem; }

.admin-filters {
  display:flex; gap:0.875rem; align-items:center; flex-wrap:wrap;
  margin-bottom:1.25rem; font-size:0.875rem;
}
.admin-filters label  { display:flex; align-items:center; gap:0.5rem; font-weight:400; margin:0; }
.admin-filters select { width:auto; height:2rem; font-size:0.8rem; }
.admin-count { font-family:var(--mono); font-size:0.78rem; color:var(--muted-fg); margin-bottom:0.75rem; }

.chart-container {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:1.5rem; margin-bottom:2rem;
}
.chart-container h2 { font-size:1rem; color:var(--muted-fg); margin-bottom:1rem; }
.chart-container canvas { max-height:200px; }

.admin-chart { margin-bottom:2rem; }

/* Services grid */
.services-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; margin-top:1.25rem; }
.service-card {
  background:var(--card); border:1px solid var(--border);
  border-radius:var(--radius); padding:1rem;
  display:flex; align-items:center; justify-content:space-between; gap:0.75rem;
  box-shadow:var(--shadow-xs);
}
.service-card.inactive { opacity:.55; }
.service-card-name { font-weight:500; font-size:0.9rem; }
.service-card-slug { font-family:var(--mono); font-size:0.72rem; color:var(--muted-fg); }
.service-card-actions { display:flex; gap:0.375rem; }

.form-inline { display:flex; flex-direction:column; gap:1rem; max-width:480px; }

/* ══════════════════════════════════════════
   PAGE: ERROR / 404
══════════════════════════════════════════ */
.page-error {
  display:flex; align-items:center; justify-content:center;
  min-height:calc(100vh - 57px - 65px);
  padding:3rem 1.5rem; text-align:center;
}
.page-error h1 { font-size:5rem; color:var(--muted-fg); line-height:1; margin-bottom:0.5rem; }
.page-error p  { color:var(--muted-fg); margin-bottom:1.5rem; }

/* ══════════════════════════════════════════
   PAGE: PRIVACY
══════════════════════════════════════════ */
.page-privacy { padding:3.5rem 1.5rem 5rem; }
.page-privacy h1 { margin-bottom:0.375rem; }
.page-privacy h2 { font-size:1.1rem; margin-top:1.75rem; margin-bottom:0.5rem; }
.page-privacy p  { font-size:0.9rem; color:var(--muted-fg); line-height:1.75; margin-bottom:0.5rem; }
.page-privacy em { color:var(--muted-fg); font-size:0.8rem; }

/* ── RESPONSIVE ── */
@media (max-width:780px) {
  .features { grid-template-columns:1fr 1fr; }
}
@media (max-width:540px) {
  .features { grid-template-columns:1fr; }
  .profile-row { flex-direction:column; align-items:stretch; }
  .profile-row select, .profile-row input { flex:none; width:100%; }
  .admin-stats, .dashboard-stats { flex-direction:column; }
  .profile-list-item { flex-direction:column; align-items:flex-start; }
}