/* REGISTER — shareware nag dialog for /register.html.
   Loads after styles.css and only uses its palette tokens. */

.wordmark-page { font-size: clamp(28px, 9.5vw, 56px); }

/* ----------------- the dialog ----------------- */
.nag {
  background: var(--base-2);
  border: 1px solid var(--oxblood);
  box-shadow: 0 0 0 1px var(--base), 0 0 24px rgba(90,31,31,0.35);
}

.nag-bar {
  display: flex; align-items: center; gap: 10px;
  background: var(--oxblood);
  border-bottom: 1px solid var(--oxblood-2);
  padding: 8px 10px 8px 12px;
}
.nag-sys { color: var(--sepia); font-weight: 700; }
.nag-title {
  flex: 1;
  font-size: 11px; font-weight: 700; letter-spacing: 0.22em;
  color: var(--blown);
}
.nag-x {
  background: var(--base-2);
  border: 1px solid var(--oxblood-2);
  color: var(--blown);
  font-family: var(--font); font-size: 14px; line-height: 1;
  width: 24px; height: 24px;
  cursor: pointer;
  transition: background 0.15s, transform 0.05s;
}
.nag-x:hover { background: var(--oxblood-2); }
.nag-x:active { transform: translateY(1px); }

.nag-body { padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.nag-line { font-size: 14px; color: var(--sepia); }
.nag-line strong { color: var(--blown); }
.nag-dim { color: var(--sepia-dim); font-size: 12px; }

/* ----------------- feature table ----------------- */
.nag-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.nag-table th, .nag-table td {
  border: 1px solid var(--oxblood);
  padding: 6px 10px; text-align: left;
}
.nag-table th {
  background: var(--base);
  color: var(--sepia-dim); font-weight: 700;
  font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
}
.nag-table td.y, .nag-table td.n { text-align: center; width: 56px; font-weight: 700; }
.nag-table td.y { color: var(--wired); }
.nag-table td.n { color: var(--r); }

/* ----------------- buttons ----------------- */
.nag-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.nag-btn {
  flex: 1 1 180px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--base);
  border: 1px solid var(--sepia-dim);
  color: var(--sepia);
  font-family: var(--font); font-size: 12px; font-weight: 700;
  letter-spacing: 0.14em;
  padding: 12px 14px;
  text-decoration: none; cursor: pointer;
  transition: background 0.15s, border-color 0.15s, transform 0.05s;
}
.nag-btn:hover { background: var(--oxblood); border-color: var(--oxblood-2); color: var(--blown); }
.nag-btn:active { transform: translateY(1px); }
.nag-btn:focus-visible { outline: 2px solid var(--wired); outline-offset: 2px; }
.nag-primary { background: var(--base-2); border-color: var(--oxblood); color: var(--blown); }

/* ----------------- status + fine print ----------------- */
.nag-status {
  min-height: 1.2em;
  font-size: 12px; color: var(--r); letter-spacing: 0.04em;
}
.nag-fine {
  font-size: 10px; color: var(--sepia-dim); letter-spacing: 0.08em;
  border-top: 1px dashed var(--sepia-dim);
  padding-top: 10px;
}