/* BURNt's shared clubhouse skin. Loaded after each page's functional styles. */
:root {
  color-scheme: light;
  --paper: #f8f3e7;
  --white: #fffdf7;
  --ink: #252333;
  --muted: #595663;
  --blue: #3138ae;
  --blue-dark: #222988;
  --yellow: #ffdd55;
  --orange: #f36a41;
  --mint: #bce9c9;
  --lilac: #d9c8f4;
  --line: #d6cfbf;
  --hot: #3138ae;
  --bg: var(--paper);
  --panel: var(--white);
  --panel2: #efeadf;
  --surface: var(--white);
  --surface-2: #efeadf;
  --coral: var(--orange);
  --coral-light: #b83222;
  --lime: #375e32;
  --violet: #694da3;
  --shadow: 0 13px 0 -7px #d8d0bf, 0 18px 35px #25233313;
  background: var(--paper);
  color: var(--ink);
}

html { background: var(--paper); }
body {
  color: var(--ink);
  background: radial-gradient(circle at 12% 10%, #ffe8a9 0, transparent 23rem),
    radial-gradient(circle at 95% 25%, #dfd3fa 0, transparent 25rem), var(--paper);
}
a { color: var(--blue-dark); }
:focus-visible { outline: 3px solid var(--blue) !important; outline-offset: 3px; }
button:not(:disabled), a, label[for], summary { -webkit-tap-highlight-color: transparent; }

/* A tiny wonky B is the club's common mark. */
.burnt-home .brand-mark, .burnt-profile .mark {
  border: 2px solid var(--ink);
  border-radius: .6rem;
  background: var(--yellow);
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
  transform: rotate(-9deg);
}
.burnt-home .brand-mark span { transform: rotate(9deg); }
.burnt-home .brand-word span, .burnt-profile .brand-t { color: var(--orange); }
.burnt-profile .mark { font-weight: 950; }
.burnt-discover .brand, .burnt-moderation .brand, .burnt-account .brand {
  color: var(--ink); font-weight: 950; letter-spacing: -.07em;
}
.burnt-discover .brand::first-letter, .burnt-moderation .brand::first-letter, .burnt-account .brand::first-letter { color: var(--blue); }
.burnt-discover .brand span, .burnt-moderation .brand span { color: var(--orange); }

.burnt-home .topbar, .burnt-profile .topbar,
.burnt-discover header, .burnt-account header, .burnt-moderation header {
  border-bottom: 2px solid var(--ink);
  background: #fffdf7f2;
  color: var(--ink);
  box-shadow: 0 3px 0 #ffdd55;
}
.burnt-home .icon-button, .burnt-home .avatar-button {
  border: 1px solid var(--ink);
  background: var(--white);
  color: var(--ink);
}
.burnt-home .avatar-button { background: var(--mint); }
.burnt-home .icon-button:hover, .burnt-home .avatar-button:hover { background: var(--yellow); }

/* Home: more community noticeboard, less romantic gradient billboard. */
.burnt-home .welcome-card {
  isolation: isolate;
  border: 2px solid var(--ink);
  border-radius: 1.4rem;
  background: #bce9c9;
  color: var(--ink);
  box-shadow: 7px 7px 0 var(--ink);
}
.burnt-home .welcome-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .37;
  background-image: radial-gradient(#326a62 1.2px, transparent 1.2px);
  background-size: 17px 17px;
  mask-image: linear-gradient(90deg, transparent 36%, #000);
  pointer-events: none;
}
.burnt-home .welcome-card::after {
  content: "✳";
  right: .04em;
  top: -.18em;
  bottom: auto;
  font-size: clamp(10rem, 25vw, 16rem);
  color: var(--blue);
  opacity: .22;
  transform: rotate(-15deg);
}
.burnt-home .welcome-card h1 { max-width: 10ch; line-height: .94; }
.burnt-home .welcome-card h1 span { color: var(--blue); }
.burnt-home .welcome-card .kicker,
.burnt-home .kicker { color: var(--blue-dark); }
.burnt-home .welcome-card .kicker {
  display: inline-block;
  padding: .3rem .55rem;
  border: 1px solid var(--ink);
  border-radius: .3rem;
  background: var(--yellow);
  transform: rotate(-2deg);
  letter-spacing: .045em;
}
.burnt-home .welcome-card p:not(.kicker) { max-width: 31rem; }
.burnt-home .button--ink, .burnt-home .button--primary,
.burnt-profile .button--primary, .burnt-discover button:not(.secondary),
.burnt-account .button { background: var(--blue); color: #fff; border-color: var(--blue); }
.burnt-home .button--ink:hover, .burnt-home .button--primary:hover,
.burnt-profile .button--primary:hover, .burnt-discover button:not(.secondary):hover,
.burnt-account .button:hover { background: var(--blue-dark); color: #fff; }
.burnt-home .button--primary { box-shadow: 4px 4px 0 var(--yellow); }

.burnt-home .feed-tabs {
  border: 1px solid var(--ink);
  border-radius: .85rem;
  background: #eae3d7;
  box-shadow: 3px 3px 0 #d2c5aa;
}
.burnt-home .feed-tabs button { color: #4a4657; }
.burnt-home .feed-tabs button[aria-selected="true"] {
  background: var(--yellow);
  color: var(--ink);
  box-shadow: 2px 2px 0 var(--ink);
}
.burnt-home .feed-meta p, .burnt-home .post-card__header p,
.burnt-home .post-actions button, .burnt-home .side-card p:not(.kicker),
.burnt-home .status-list, .burnt-home .bottom-nav__item,
.burnt-home .composer__footer p, .burnt-home .empty-state p,
.burnt-home .mine-search p { color: var(--muted); }
.burnt-home .preview-pill {
  border: 1px solid var(--blue);
  background: var(--lilac);
  color: var(--blue-dark);
}
.burnt-home .post-card, .burnt-home .side-card,
.burnt-home .mine-search, .burnt-home .empty-state {
  border: 1px solid var(--ink);
  border-radius: 1rem;
  background: var(--white);
  box-shadow: 4px 4px 0 #d8d0bf;
}
.burnt-home .post-card::before { width: 6px; }
.burnt-home .post-avatar {
  border: 1px solid var(--ink);
  background: var(--yellow);
  color: var(--ink);
  transform: rotate(-6deg);
}
.burnt-home .post-card:nth-child(2n) .post-avatar { background: var(--lilac); transform: rotate(5deg); }
.burnt-home .post-actions button:hover, .burnt-home .post-actions button[aria-pressed="true"] { background: #f0edff; color: var(--blue); }
.burnt-home .post-actions button[aria-pressed="true"] { color: var(--blue-dark); }
.burnt-home .side-card:first-child { background: #fff2c9; }
.burnt-home .side-card--soft { background: var(--lilac); }
.burnt-home .status-list span { background: var(--mint); color: #183e38; }
.burnt-home .profile-setup-link {
  border: 1px solid var(--ink);
  background: var(--white);
  color: var(--blue-dark);
  box-shadow: 2px 2px 0 var(--ink);
}
.burnt-home .profile-setup-link:hover { background: var(--yellow); border-color: var(--ink); }
.burnt-home .mine-search input, .burnt-home .composer textarea {
  border: 1px solid #898273;
  background: var(--white);
  color: var(--ink);
}
.burnt-home .mine-search button, .burnt-home .private-post__actions button,
.burnt-home .load-more-posts { background: var(--paper); color: var(--ink); border-color: var(--ink); }
.burnt-home .private-post__meta, .burnt-home #composerStatus { color: #34533a; }
.burnt-home .bottom-nav {
  border-color: var(--ink);
  background: #fffdf7f7;
  box-shadow: 0 -3px 0 var(--yellow);
}
.burnt-home .bottom-nav__item.is-active { color: var(--blue-dark); }
.burnt-home .bottom-nav__compose {
  border: 2px solid var(--ink);
  background: var(--yellow) !important;
  color: var(--ink);
  box-shadow: 3px 3px 0 var(--ink);
}
.burnt-home .composer {
  border: 2px solid var(--ink);
  background: var(--white);
  color: var(--ink);
}
.burnt-home .composer::backdrop { background: #252333ae; }
.burnt-home .toast { background: var(--yellow); color: var(--ink); border-color: var(--ink); }

/* The inner rooms use the same paper and sticker vocabulary. */
.burnt-profile .eyebrow, .burnt-discover .eyebrow,
.burnt-moderation .eyebrow, .burnt-account .eyebrow { color: var(--blue-dark); font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }
.burnt-profile .intro h1 em, .burnt-account h1 em { color: var(--blue); }
.burnt-profile .brand, .burnt-profile .mark,
.burnt-profile .section-heading h2, .burnt-profile .step,
.burnt-profile .photo-preview, .burnt-profile .preview-avatar,
.burnt-profile .profile-card h2, .burnt-profile .button {
  font-family: ui-sans-serif, system-ui, sans-serif;
}
.burnt-profile .intro > p:not(.eyebrow) { color: #504d59; }
.burnt-profile .privacy-note {
  background: #fff2c9; border-color: #b9a368; color: var(--ink);
}
.burnt-profile .privacy-note > span { color: var(--blue); }
.burnt-profile .form-card, .burnt-profile .profile-card,
.burnt-discover .person, .burnt-moderation .person,
.burnt-discover #reportPanel, .burnt-account section {
  border: 1px solid var(--ink);
  background: var(--white);
  color: var(--ink);
  box-shadow: 5px 5px 0 #d8d0bf;
}
.burnt-profile .profile-card { background: var(--lilac); }
.burnt-profile .step { background: var(--yellow); color: var(--ink); border: 1px solid var(--ink); transform: rotate(-6deg); }
.burnt-profile .section-heading p, .burnt-profile .private-card summary small,
.burnt-profile .photo-controls p, .burnt-profile .hint,
.burnt-profile .optional, .burnt-profile .counter,
.burnt-profile .check-row small, .burnt-profile .preview-person span,
.burnt-profile .preview-visibility, .burnt-profile footer,
.burnt-profile .eligibility { color: var(--muted); }
.burnt-profile .photo-preview, .burnt-profile .preview-avatar { background: var(--yellow); color: var(--ink); border: 1px dashed var(--ink); }
.burnt-profile .button--quiet, .burnt-discover .secondary,
.burnt-moderation .secondary { background: var(--paper); color: var(--ink); border: 1px solid var(--ink); }
.burnt-profile .field input, .burnt-profile .field textarea,
.burnt-profile .field select, .burnt-profile .input-prefix,
.burnt-discover select, .burnt-discover #reportPanel textarea,
.burnt-discover #reportPanel select, .burnt-account input:not([type=checkbox]) {
  background: var(--white); color: var(--ink); border: 1px solid #827b72;
}
.burnt-profile .input-prefix input { border: 0; }
.burnt-profile .input-prefix { color: var(--blue); }
.burnt-profile .required, .burnt-profile .submit-message { color: var(--blue-dark); }
.burnt-profile .field-error { color: #a72332; }
.burnt-profile .chip span, .burnt-profile .preview-interests span,
.burnt-profile .preview-meta span { border-color: #7b708e; color: var(--ink); background: var(--white); }
.burnt-profile .chip input:checked + span { border-color: var(--blue); background: var(--yellow); color: var(--ink); }
.burnt-profile .check-row { background: #f0ede5; }
.burnt-profile .hint-block { background: #fff2c9; color: var(--ink) !important; }
.burnt-profile .preview-bio { color: var(--ink); }
.burnt-profile .preview-label { color: var(--blue-dark); border-color: var(--blue); }
.burnt-profile .private-card summary::after { color: var(--blue); }
.burnt-profile input[type=checkbox] { accent-color: var(--blue); }

.burnt-discover main > h1 { max-width: 13ch; }
.burnt-discover .person:nth-child(3n + 1) { background: #fff2c9; }
.burnt-discover .person:nth-child(3n + 2) { background: #e4f3e8; }
.burnt-discover .person:nth-child(3n) { background: #ebe2fa; }
.burnt-discover .person p, .burnt-moderation .person p,
.burnt-discover .footnote { color: var(--muted); }
.burnt-discover .person .tag, .burnt-moderation .person .tag {
  border: 1px solid #a49a89;
  background: var(--white);
  color: var(--ink);
}
.burnt-discover #connections { border-color: var(--ink); }
.burnt-discover .connection { border-color: var(--line); }
.burnt-discover .secondary:hover, .burnt-profile .button--quiet:hover { background: var(--yellow); }
.burnt-moderation .person button:not(.secondary) {
  background: #a82b33; color: #fff; border-color: #7f1c25;
}
.burnt-moderation #refresh { background: var(--blue); color: #fff; border-color: var(--blue); }
.burnt-moderation .review-tabs { display: flex; flex-wrap: wrap; gap: .55rem; margin: 1.5rem 0; }
.burnt-moderation .review-tabs button { background: var(--white); color: var(--ink); border: 1px solid var(--ink); }
.burnt-moderation .review-tabs button[aria-pressed="true"] { background: var(--yellow); box-shadow: 2px 2px 0 var(--ink); }
.burnt-moderation #olderHistory { margin-top: 1.25rem; }

.burnt-account section { border-radius: 1.1rem; }
.burnt-account .steps { color: var(--muted); }
.burnt-account nav button, .burnt-account button:not(.button) {
  border: 1px solid var(--ink); background: var(--paper); color: var(--ink);
}
.burnt-account nav button[aria-pressed="true"] { background: var(--yellow); color: var(--ink); box-shadow: 2px 2px 0 var(--ink); }
.burnt-account input[type=checkbox] { accent-color: var(--blue); }
.burnt-account .password-change { background: #e9e2f5; border-color: #7b689b; }
.burnt-account .danger-zone { background: #fff0e7; border-color: #a3483f; }
.burnt-account .danger-zone button { background: #a82b33; color: #fff; border-color: #7f1c25; }
.burnt-account .danger-zone button:disabled { opacity: .6; }
.burnt-account .danger-zone button:not(:disabled):hover { background: #7f1c25; }

/* Age confirmation stays explicit and readable on every route. */
.burnt-age-dialog {
  border: 2px solid var(--ink);
  border-radius: 1.35rem;
  background: var(--white);
  color: var(--ink);
  box-shadow: 8px 8px 0 var(--yellow);
}
.burnt-age-dialog::backdrop { background: #252333e8; }
.burnt-age-brand { color: var(--blue-dark); }
.burnt-age-dialog button { background: var(--blue); color: #fff; }
.burnt-age-dialog a { color: var(--blue-dark); border-color: var(--ink); }
.burnt-age-dialog :focus-visible { outline-color: var(--blue); }
.burnt-storage-notice { background: var(--yellow); color: var(--ink); }

@media (max-width: 47.99rem) {
  .burnt-home .welcome-card::after { opacity: .13; right: -.17em; }
  .burnt-home .feed-tabs { grid-template-columns: repeat(5, minmax(4.8rem, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}