/* The public account surface shares v2's pastel direction without changing artwork or editor themes. */
:root { --hub-ink: #34264d; --hub-muted: #756b87; --hub-paper: #fff9f4; --hub-panel: #fffdf9; --hub-lilac: #e6daf5; --hub-blue: #b8e2ed; --hub-peach: #ffc9ad; --hub-line: #c8b8d8; }
body { margin: 0; background: var(--hub-paper); color: var(--hub-ink); font-family: ui-rounded, "Avenir Next", system-ui, sans-serif; }
.hub-page { min-height: 100vh; box-sizing: border-box; padding: 2rem clamp(1.5rem, 6vw, 7rem); background: radial-gradient(circle at 88% 18%, var(--hub-blue), transparent 28rem), radial-gradient(circle at 10% 90%, var(--hub-lilac), transparent 32rem), var(--hub-paper); }
.hub-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }.hub-nav > div { display: flex; align-items: center; gap: 1rem; }.hub-wordmark { color: var(--hub-ink); font-weight: 900; text-decoration: none; letter-spacing: .16em; }.hub-nav a, .hub-link { color: var(--hub-ink); font-weight: 700; }
.hub-hero { max-width: 48rem; padding: clamp(5rem, 14vh, 10rem) 0 5rem; }.hub-kicker { margin: 0 0 1rem; color: #8e5f83; font-weight: 800; font-size: .78rem; letter-spacing: .15em; }.hub-hero h1, .hub-card h1 { margin: 0; font-family: Georgia, serif; font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: .96; letter-spacing: -.06em; }.hub-lede, .hub-card > p { max-width: 42rem; color: var(--hub-muted); font-size: 1.15rem; line-height: 1.6; }.hub-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 1.25rem; margin-top: 2rem; }
.hub-button { display: inline-block; border: 0; border-radius: .55rem; padding: .75rem 1rem; background: var(--hub-ink); color: white !important; text-decoration: none; font: inherit; font-weight: 800; cursor: pointer; box-shadow: 3px 3px 0 var(--hub-peach); }.hub-button-small { margin-left: .75rem; font-size: .9rem; }.hub-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 65rem; }.hub-notes article { display: grid; gap: .3rem; padding: 1.1rem; border: 1px solid var(--hub-line); border-radius: .75rem; background: color-mix(in srgb, var(--hub-panel) 84%, transparent); }.hub-notes span, .hub-muted { color: var(--hub-muted); line-height: 1.45; }
.hub-card { width: min(100%, 34rem); margin: clamp(4rem, 12vh, 9rem) auto; padding: clamp(1.5rem, 5vw, 3rem); border: 1px solid var(--hub-line); border-radius: 1rem; background: var(--hub-panel); box-shadow: 10px 10px 0 var(--hub-lilac); }.hub-card h1 { font-size: clamp(2.4rem, 6vw, 4rem); }.hub-form { display: grid; gap: 1rem; margin-top: 2rem; }.hub-form label { display: grid; gap: .4rem; font-weight: 750; }.hub-form input { border: 1px solid var(--hub-line); border-radius: .45rem; padding: .7rem; background: #fff; color: var(--hub-ink); font: inherit; }.hub-form button { justify-self: start; }.hub-form-status { min-height: 1.4em; margin: 0; color: #8e5f83; }.hub-muted { margin-top: 1.5rem; }
@media (max-width: 42rem) { .hub-nav { align-items: flex-start; }.hub-nav > div { display: grid; justify-items: end; }.hub-button-small { margin-left: 0; }.hub-notes { grid-template-columns: 1fr; } }