/* Dashboard placeholder pages (frontend/dashboard/*.html), rendered inside the
 * SHARED_DASHBOARD workspace iframe. External on purpose: those routes send
 * style-src 'self', so an inline <style> would be blocked. Sizing in rem only
 * (tests/test_frontend_px_gate.py). */

/* Light theme = the house ink tokens re-valued. The shell passes ?theme= (the
 * route renders it as html[data-theme]) and rewrites the attribute on toggle. */
html[data-theme="light"] body {
  --ink-0: #f4f6fb; --ink-1: #ffffff; --ink-2: #ffffff;
  --line: #d8dfee; --text-hi: #101828; --text-mid: #41506e; --text-low: #64708c;
}

.dp-page { padding: clamp(1.5rem, 4vw, 3rem) 0 3rem; max-width: 52rem; }
.dp-title {
  font-family: var(--font-display); color: var(--text-hi); font-weight: 600;
  font-size: clamp(1.7rem, 3.4vw, 2.5rem); letter-spacing: -0.02em;
  line-height: 1.15; margin: 0 0 1rem;
}
.dp-title code { font-size: 0.85em; }
.dp-lede { font-size: 1.05rem; max-width: 62ch; margin: 0 0 1.5rem; }
.dp-actions { display: flex; flex-wrap: wrap; gap: 0.75rem; margin: 0 0 0.5rem; }
.dp-note { color: var(--text-low); font-size: 0.88rem; margin: 0 0 2rem; }
.dp-page .section-title { margin-top: 2rem; }
.dp-steps { margin: 0 0 1.5rem; padding-left: 1.25rem; max-width: 68ch; }
.dp-steps li { margin: 0 0 0.85rem; }
.dp-steps b { color: var(--text-hi); font-weight: 600; }
.dp-page code {
  font-family: var(--font-mono); font-size: 0.86em; color: var(--text-hi);
  background: color-mix(in srgb, var(--color-accent) 10%, transparent);
  border: 0.0625rem solid var(--line); border-radius: 0.375rem;
  padding: 0.05rem 0.35rem; overflow-wrap: anywhere;
}