﻿/* Currency product name: Embers (internal helpers remain hw_hearthcoin_*). */

/* Warm ivory editorial — matches --hw-fe-* / Arena / Profile */
body.hw-quest-board-page,
body.hw-job-board-page {
  overflow-x: clip;
  background: var(--hw-fe-canvas, var(--hw-fe-bg, #f7f3ed));
  background-color: var(--hw-fe-bg, #f7f3ed);
  background-attachment: fixed;
  color: var(--hw-fe-text, #211b16);
}

body.hw-quest-board-page.hw-global-nav-active .hw-site-header,
body.hw-quest-board-page.hw-global-nav-active .hw-global-nav,
body.hw-job-board-page.hw-global-nav-active .hw-site-header,
body.hw-job-board-page.hw-global-nav-active .hw-global-nav {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
}

body.hw-quest-board-page .site,
body.hw-quest-board-page #wrapper,
body.hw-quest-board-page .site-content,
body.hw-quest-board-page #content,
body.hw-quest-board-page .content-bg,
body.hw-quest-board-page .entry-content,
body.hw-quest-board-page .entry-content-wrap,
body.hw-quest-board-page article.page,
body.hw-job-board-page .site,
body.hw-job-board-page #wrapper,
body.hw-job-board-page .site-content,
body.hw-job-board-page #content,
body.hw-job-board-page .content-bg,
body.hw-job-board-page .entry-content,
body.hw-job-board-page .entry-content-wrap,
body.hw-job-board-page article.page {
  background: transparent !important;
  box-shadow: none !important;
}

body.hw-quest-board-page .entry-content-wrap,
body.hw-quest-board-page .entry-content,
body.hw-job-board-page .entry-content-wrap,
body.hw-job-board-page .entry-content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.hw-qb {
  --hw-qb-cream: var(--hw-fe-text, #211b16);
  --hw-qb-muted: var(--hw-fe-text-soft, #5c564e);
  --hw-qb-line: var(--hw-fe-border, #e4ded4);
  --hw-qb-panel: var(--hw-fe-elevated, #fcfaf7);
  --hw-qb-panel-2: var(--hw-fe-surface, #efe8dc);
  --hw-qb-flame: var(--hw-fe-accent, #b85c3a);
  --hw-qb-flame-soft: rgba(var(--hw-fe-accent-rgb, 184, 92, 58), 0.12);
  --hw-qb-gold: var(--hw-fe-accent-strong, #8f4027);
  --hw-qb-display: var(--hw-fe-font-display, "Playfair Display", Georgia, serif);
  --hw-qb-ui: var(--hw-fe-font-ui, "DM Sans", system-ui, sans-serif);
  /* Taxonomy palette — keep distinct hues, softened for ivory canvas */
  --hw-qb-reader: #2f7a3c;
  --hw-qb-reader-soft: rgba(47, 122, 60, 0.16);
  --hw-qb-reader-line: rgba(47, 122, 60, 0.55);
  --hw-qb-author: #b85c3a;
  --hw-qb-author-soft: rgba(184, 92, 58, 0.16);
  --hw-qb-author-line: rgba(184, 92, 58, 0.55);
  --hw-qb-community: #2f6f96;
  --hw-qb-community-soft: rgba(47, 111, 150, 0.16);
  --hw-qb-community-line: rgba(47, 111, 150, 0.55);
  --hw-qb-feedback: #8a6230;
  --hw-qb-feedback-soft: rgba(138, 98, 48, 0.16);
  --hw-qb-feedback-line: rgba(138, 98, 48, 0.55);
  --hw-qb-discovery: #1f7a74;
  --hw-qb-discovery-soft: rgba(31, 122, 116, 0.16);
  --hw-qb-discovery-line: rgba(31, 122, 116, 0.55);
  --hw-qb-competition: #c45a22;
  --hw-qb-competition-soft: rgba(196, 90, 34, 0.16);
  --hw-qb-competition-line: rgba(196, 90, 34, 0.55);
  --hw-qb-ink: var(--hw-fe-text, #211b16);
  --hw-qb-shadow-sm: var(--hw-fe-shadow-sm, 0 4px 14px rgba(36, 33, 29, 0.06));
  --hw-qb-shadow-md: var(--hw-fe-shadow-md, 0 12px 32px rgba(36, 33, 29, 0.08));
  --hw-qb-shadow-fire: var(--hw-fe-shadow-fire, 0 8px 24px rgba(184, 92, 58, 0.18));
  max-width: min(var(--hw-stage-content, 1600px), 100%);
  margin: 0 auto;
  padding: 0.45rem var(--hw-stage-pad-sm, 1.25rem) 3.5rem;
  color: var(--hw-qb-cream);
  font-family: var(--hw-qb-ui);
  position: relative;
}

body.hw-quest-board-page .entry-hero,
body.hw-quest-board-page .entry-header,
body.hw-job-board-page .entry-hero,
body.hw-job-board-page .entry-header {
  display: none;
}

body.hw-quest-board-page .content-area,
body.hw-job-board-page .content-area {
  margin-top: 0 !important;
}

body.hw-quest-board-page .inside-article,
body.hw-job-board-page .inside-article,
body.hw-quest-board-page .content-wrap,
body.hw-job-board-page .content-wrap {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Kill theme link/input bleed on this page */
body.hw-quest-board-page .entry-content .hw-qb a,
body.hw-job-board-page .entry-content .hw-qb a,
.hw-qb a {
  color: var(--hw-qb-cream);
  text-decoration: none;
}

body.hw-quest-board-page .entry-content .hw-qb a:hover,
body.hw-job-board-page .entry-content .hw-qb a:hover,
.hw-qb a:hover {
  color: var(--hw-qb-flame);
}

body.hw-quest-board-page .entry-content .hw-qb input,
body.hw-quest-board-page .entry-content .hw-qb textarea,
body.hw-quest-board-page .entry-content .hw-qb select,
body.hw-job-board-page .entry-content .hw-qb input,
body.hw-job-board-page .entry-content .hw-qb textarea,
body.hw-job-board-page .entry-content .hw-qb select,
.hw-qb input,
.hw-qb textarea,
.hw-qb select {
  background: var(--hw-fe-elevated, #fcfaf7) !important;
  color: var(--hw-qb-cream) !important;
  border-color: var(--hw-qb-line) !important;
  box-shadow: none !important;
  -webkit-appearance: none;
  appearance: none;
}

.hw-qb input::placeholder,
.hw-qb textarea::placeholder {
  color: var(--hw-fe-muted, #8a8379) !important;
  opacity: 1;
}

.hw-qb h1,
.hw-qb h2,
.hw-qb h3,
.hw-qb h4,
.hw-qb p,
.hw-qb li,
.hw-qb span,
.hw-qb strong,
.hw-qb label {
  color: inherit;
}

/* Icons */
.hw-qb__icon {
  display: inline-flex;
  width: 1.15em;
  height: 1.15em;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.hw-qb__icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hw-qb__icon--row {
  width: 1.35rem;
  height: 1.35rem;
  color: var(--hw-qb-gold);
}

.hw-qb__icon--chip {
  width: 0.9rem;
  height: 0.9rem;
}

.hw-qb__icon--search {
  width: 1.05rem;
  height: 1.05rem;
  color: var(--hw-qb-muted);
}

.hw-qb__icon--flame,
.hw-qb__icon--tonight {
  width: 1.2rem;
  height: 1.2rem;
  color: var(--hw-qb-flame);
}

/* Shared type */
.hw-qb__kicker {
  margin: 0 0 0.35rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--hw-qb-flame);
}

.hw-qb__title {
  margin: 0 0 0.45rem;
  font-family: var(--hw-qb-display);
  font-size: clamp(2.1rem, 4.2vw, 3rem);
  font-weight: 600;
  line-height: 1.08;
  color: var(--hw-qb-cream);
  letter-spacing: -0.02em;
}

.hw-qb__lede {
  margin: 0;
  max-width: 38rem;
  color: var(--hw-qb-muted);
  font-size: 1rem;
  line-height: 1.5;
}

.hw-qb__mast-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.25rem;
  flex-wrap: wrap;
}

.hw-qb__mast-copy { flex: 1 1 18rem; }

.hw-qb__mast-actions {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  flex-wrap: wrap;
}

.hw-qb__section-title {
  margin: 0 0 0.85rem;
  font-family: var(--hw-qb-display);
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--hw-qb-cream);
}

.hw-qb__signin,
.hw-qb__empty {
  margin: 0 0 1rem;
  color: var(--hw-qb-muted);
  font-size: 0.92rem;
}

.hw-qb__signin a { color: var(--hw-qb-gold) !important; }

/* Buttons */
.hw-qb__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  border-radius: 999px;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 650;
  padding: 0.58rem 1.15rem;
  text-decoration: none !important;
  cursor: pointer;
  border: 1px solid transparent;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.hw-qb__btn--primary {
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f) 0%, var(--hw-qb-flame) 55%, var(--hw-qb-gold) 100%);
  color: #fffaf5 !important;
  border-color: var(--hw-qb-flame);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    var(--hw-qb-shadow-fire);
  min-width: 7.5rem;
  font-weight: 750;
  letter-spacing: 0.01em;
}

.hw-qb__btn--primary:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
  color: #fffaf5 !important;
}

.hw-qb__btn--ghost {
  background: var(--hw-qb-panel);
  border-color: var(--hw-qb-line);
  color: var(--hw-qb-gold) !important;
}

.hw-qb__btn--ghost:hover {
  border-color: var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
  color: var(--hw-qb-gold) !important;
}

.hw-qb__btn--soft {
  background: var(--hw-qb-author-soft);
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-author) !important;
}

.hw-qb__btn--solid {
  background: var(--hw-qb-panel-2);
  border: 1px solid var(--hw-qb-line);
  color: var(--hw-qb-muted) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  min-width: 7.5rem;
}

.hw-qb__btn--solid:hover {
  border-color: var(--hw-qb-line);
  background: var(--hw-qb-panel);
  color: var(--hw-qb-cream) !important;
  transform: none;
}

.hw-qb__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.hw-qb__claim {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 6.25rem;
  border-radius: 999px;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 750;
  padding: 0.62rem 1.25rem;
  cursor: pointer;
  text-decoration: none !important;
  white-space: nowrap;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease, background 0.15s ease;
}

.hw-qb__claim--primary {
  border: 1px solid var(--hw-qb-flame);
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f), var(--hw-qb-flame) 58%, var(--hw-qb-gold));
  color: #fffaf5 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    var(--hw-qb-shadow-fire);
}

.hw-qb__claim--primary:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
  color: #fffaf5 !important;
}

.hw-qb__claim--go {
  border: 1.5px solid var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
  color: var(--hw-qb-author) !important;
}

.hw-qb__claim--go:hover {
  background: color-mix(in srgb, var(--hw-qb-author) 22%, var(--hw-qb-panel));
  color: var(--hw-qb-gold) !important;
}

.hw-qb__claim--wide { width: 100%; }
.hw-qb__claim:disabled { opacity: 0.55; cursor: wait; transform: none; }

.hw-qb__claim-done {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1.5px solid var(--hw-qb-author-line);
  padding: 0.18rem 0.62rem;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__pill--reader {
  border-color: var(--hw-qb-reader-line);
  color: var(--hw-qb-reader);
  background: var(--hw-qb-reader-soft);
}
.hw-qb__pill--author {
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
}
.hw-qb__pill--community {
  border-color: var(--hw-qb-community-line);
  color: var(--hw-qb-community);
  background: var(--hw-qb-community-soft);
}
.hw-qb__pill--feedback {
  border-color: var(--hw-qb-feedback-line);
  color: var(--hw-qb-feedback);
  background: var(--hw-qb-feedback-soft);
}
.hw-qb__pill--discovery {
  border-color: var(--hw-qb-discovery-line);
  color: var(--hw-qb-discovery);
  background: var(--hw-qb-discovery-soft);
}
.hw-qb__pill--competition {
  border-color: var(--hw-qb-competition-line);
  color: var(--hw-qb-competition);
  background: var(--hw-qb-competition-soft);
}

.hw-qb__official {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.18rem 0.62rem;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fffaf5;
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f), var(--hw-qb-flame));
  border: 1px solid var(--hw-qb-flame);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.hw-qb__xp {
  font-size: 0.82rem;
  font-weight: 750;
  color: var(--hw-qb-flame);
}

.hw-qb__xp-badge {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  padding: 0.34rem 0.7rem 0.34rem 0.5rem;
  border-radius: 999px;
  overflow: hidden;
  isolation: isolate;
  font-weight: 800;
  letter-spacing: 0.01em;
  border: 1.5px solid var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 2px 8px rgba(36, 33, 29, 0.06);
  color: var(--hw-qb-author);
}

.hw-qb__xp-badge--wisp {
  border-color: var(--hw-qb-community-line);
  background: var(--hw-qb-community-soft);
  color: var(--hw-qb-community);
}

.hw-qb__xp-badge--reader {
  border-color: var(--hw-qb-reader-line);
  background: var(--hw-qb-reader-soft);
  color: var(--hw-qb-reader);
}

.hw-qb__xp-badge--author {
  border-color: var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
  color: var(--hw-qb-author);
}

.hw-qb__xp-badge-glow {
  position: absolute;
  inset: -40% -20%;
  background: radial-gradient(circle at 20% 40%, rgba(var(--hw-fe-accent-rgb, 184, 92, 58), 0.22), transparent 45%);
  pointer-events: none;
  z-index: 0;
  animation: hw-qb-xp-pulse 2.8s ease-in-out infinite;
}

.hw-qb__xp-badge--reader .hw-qb__xp-badge-glow {
  background: radial-gradient(circle at 20% 40%, rgba(47, 122, 60, 0.28), transparent 45%);
}

.hw-qb__xp-badge-icon,
.hw-qb__xp-badge-val,
.hw-qb__xp-badge-unit {
  position: relative;
  z-index: 1;
}

.hw-qb__icon--xp {
  width: 0.95rem;
  height: 0.95rem;
  color: currentColor;
}

.hw-qb__xp-badge--reader .hw-qb__icon--xp {
  color: currentColor;
}

.hw-qb__xp-badge-val {
  font-family: var(--hw-qb-display);
  font-size: 0.98rem;
  line-height: 1;
  color: inherit;
}

.hw-qb__xp-badge-unit {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: inherit;
  opacity: 0.9;
}

@keyframes hw-qb-xp-pulse {
  0%, 100% { opacity: 0.45; transform: translateX(0); }
  50% { opacity: 0.85; transform: translateX(8%); }
}

.hw-qb__coins {
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--hw-qb-gold);
  padding: 0.22rem 0.55rem;
  border-radius: 999px;
  border: 1.5px solid var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
}

.hw-qb__meta-chip {
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--hw-qb-cream);
  padding: 0.26rem 0.6rem;
  border-radius: 999px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__meta-track {
  font-size: 0.82rem;
  font-weight: 650;
  color: var(--hw-qb-muted);
}

/* Toolbar: search + wallet */
.hw-qb__toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(240px, 0.9fr);
  gap: 0.85rem;
  margin-top: 1.25rem;
  align-items: stretch;
}

.hw-qb__search {
  position: relative;
  display: flex;
  align-items: center;
}

.hw-qb__search-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 1;
}

.hw-qb__search-input,
body.hw-quest-board-page .entry-content .hw-qb__search-input,
body.hw-job-board-page .entry-content .hw-qb__search-input {
  width: 100%;
  border: 1px solid rgba(232, 196, 138, 0.28) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc)) !important;
  color: var(--hw-qb-cream) !important;
  font: inherit !important;
  font-size: 0.95rem !important;
  padding: 0.85rem 1.15rem 0.85rem 2.7rem !important;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), var(--hw-qb-shadow-sm) !important;
}

.hw-qb__search-input:focus,
body.hw-quest-board-page .entry-content .hw-qb__search-input:focus,
body.hw-job-board-page .entry-content .hw-qb__search-input:focus {
  border-color: rgba(var(--hw-flame-rgb),  0.65) !important;
  box-shadow: 0 0 0 3px rgba(var(--hw-flame-rgb),  0.18), inset 0 1px 0 rgba(var(--hw-text-rgb),  0.05) !important;
}

.hw-qb__wallet {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1.15rem;
  padding: 0.7rem 1rem;
  border: 1px solid rgba(var(--hw-flame-rgb),  0.28);
  border-radius: 16px;
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(var(--hw-flame-rgb),  0.18), transparent 55%),
    linear-gradient(165deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  box-shadow: var(--hw-qb-shadow-sm);
}

.hw-qb__wallet-balance {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.hw-qb__wallet-num {
  font-family: var(--hw-qb-display);
  font-size: 1.55rem;
  color: var(--hw-qb-gold);
  line-height: 1;
  font-weight: 600;
}

.hw-qb__wallet-unit {
  font-size: 0.82rem;
  font-weight: 650;
  color: var(--hw-qb-muted);
  letter-spacing: 0.02em;
}

.hw-qb__wallet-budgets {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.85rem;
}

.hw-qb__budget {
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  font-size: 0.8rem;
  color: var(--hw-qb-cream);
  font-weight: 700;
  padding: 0.32rem 0.65rem;
  border-radius: 999px;
  background: var(--hw-qb-panel);
  border: 1.5px solid var(--hw-qb-line);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__budget span {
  color: var(--hw-qb-muted);
  font-weight: 600;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.hw-qb__post-soon {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.2rem;
}

.hw-qb__soon-note {
  font-size: 0.72rem;
  color: var(--hw-qb-muted);
}

/* Full-width compose panel (replaces cramped masthead dropdown) */
.hw-qb__compose {
  margin: 1.15rem 0 0;
  border: 1px solid rgba(232, 196, 138, 0.22);
  border-radius: 18px;
  background:
    linear-gradient(165deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  box-shadow: 0 16px 40px rgba(36, 33, 29, 0.04);
  overflow: hidden;
}

.hw-qb__compose-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 1rem;
  padding: 0.85rem 1.15rem;
  cursor: pointer;
  list-style: none;
  font-family: var(--hw-qb-ui);
}

.hw-qb__compose-summary::-webkit-details-marker { display: none; }

.hw-qb__compose-summary-title {
  font-family: var(--hw-qb-display);
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--hw-qb-cream);
}

.hw-qb__compose-summary-hint {
  font-size: 0.78rem;
  color: var(--hw-qb-muted);
  letter-spacing: 0.02em;
}

.hw-qb__compose[open] .hw-qb__compose-summary {
  border-bottom: 1px solid rgba(232, 196, 138, 0.14);
}

.hw-qb__compose-body {
  padding: 1.1rem 1.15rem 1.25rem;
}

.hw-qb__standing-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0 0 1rem;
  padding: 0;
  list-style: none;
}

.hw-qb__standing-pill {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 7.5rem;
  padding: 0.55rem 0.75rem;
  border-radius: 12px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__standing-pill-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__standing-pill strong {
  font-family: var(--hw-qb-display);
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--hw-qb-gold);
  line-height: 1.15;
}

.hw-qb__post-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.9rem 1rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  max-width: none;
  width: 100%;
  box-sizing: border-box;
}

.hw-qb__post-form-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}

.hw-qb__field {
  display: grid;
  gap: 0.35rem;
  font-size: 0.82rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  color: var(--hw-qb-gold);
  min-width: 0;
}

.hw-qb__field small {
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--hw-qb-muted);
}

.hw-qb__field input,
.hw-qb__field select,
.hw-qb__field textarea,
.hw-qb__select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-radius: 10px !important;
  padding: 0.65rem 0.85rem !important;
  font-family: var(--hw-qb-ui) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  color: var(--hw-qb-cream) !important;
  background: var(--hw-qb-panel) !important;
  border: 1px solid var(--hw-qb-line) !important;
}

.hw-qb__field select,
.hw-qb__select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--hw-qb-gold) 50%),
    linear-gradient(135deg, var(--hw-qb-gold) 50%, transparent 50%) !important;
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px) !important;
  background-size: 6px 6px, 6px 6px !important;
  background-repeat: no-repeat !important;
  padding-right: 2.1rem !important;
  cursor: pointer;
}

.hw-qb__field select option,
.hw-qb__select option {
  background: var(--hw-qb-panel, #fcfaf7);
  color: var(--hw-qb-cream, #211b16);
  font-family: var(--hw-qb-ui), "DM Sans", system-ui, sans-serif;
  font-size: 0.95rem;
}

.hw-qb__post-form-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  margin-top: 0.25rem;
}

.hw-qb__post-submit {
  justify-self: start;
  border: 1px solid rgba(255, 200, 140, 0.35);
  border-radius: 999px;
  background: linear-gradient(180deg, var(--hw-flame-light, #fb923c), var(--hw-flame-deep, #ea580c));
  color: var(--hw-qb-ink);
  font: inherit;
  font-weight: 700;
  padding: 0.65rem 1.35rem;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(var(--hw-flame-deep-rgb), 0.28);
}

.hw-qb__post-submit:hover {
  filter: brightness(1.05);
}

@media (max-width: 820px) {
  .hw-qb__post-form-row {
    grid-template-columns: 1fr;
  }
}

/* Board layout */
.hw-qb__masthead--board { margin-bottom: 0.7rem; }

.hw-qb__board-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 1.15rem;
  align-items: start;
  margin-top: 0.95rem;
}

.hw-qb__board-main {
  border: 1px solid rgba(232, 196, 138, 0.16);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(var(--hw-text-rgb),  0.03), transparent 28%),
    linear-gradient(165deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  padding: 0.9rem 1rem 1.05rem;
  box-shadow: var(--hw-qb-shadow-sm);
}

.hw-qb__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid rgba(232, 196, 138, 0.12);
}

.hw-qb__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border: 1.5px solid var(--hw-qb-line);
  border-radius: 999px;
  background: var(--hw-qb-panel);
  color: var(--hw-qb-cream);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 700;
  padding: 0.45rem 0.9rem 0.45rem 0.75rem;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.hw-qb__chip-icon { color: currentColor; opacity: 1; }

.hw-qb__chip--all {
  color: var(--hw-qb-cream);
  border-color: var(--hw-qb-line);
}

.hw-qb__chip--reader {
  color: var(--hw-qb-reader);
  border-color: var(--hw-qb-reader-line);
  background: var(--hw-qb-reader-soft);
}
.hw-qb__chip--author {
  color: var(--hw-qb-author);
  border-color: var(--hw-qb-author-line);
  background: var(--hw-qb-author-soft);
}
.hw-qb__chip--community {
  color: var(--hw-qb-community);
  border-color: var(--hw-qb-community-line);
  background: var(--hw-qb-community-soft);
}
.hw-qb__chip--feedback {
  color: var(--hw-qb-feedback);
  border-color: var(--hw-qb-feedback-line);
  background: var(--hw-qb-feedback-soft);
}
.hw-qb__chip--discovery {
  color: var(--hw-qb-discovery);
  border-color: var(--hw-qb-discovery-line);
  background: var(--hw-qb-discovery-soft);
}
.hw-qb__chip--competition {
  color: var(--hw-qb-competition);
  border-color: var(--hw-qb-competition-line);
  background: var(--hw-qb-competition-soft);
}

.hw-qb__chip:hover {
  filter: brightness(0.97);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    0 4px 12px rgba(36, 33, 29, 0.08);
}

.hw-qb__chip.is-active {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.7),
    0 0 0 2px color-mix(in srgb, currentColor 28%, transparent);
  font-weight: 800;
}

.hw-qb__chip--reader.is-active {
  color: var(--hw-qb-reader);
  border-color: var(--hw-qb-reader-line);
  background: color-mix(in srgb, var(--hw-qb-reader) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--author.is-active {
  color: var(--hw-qb-author);
  border-color: var(--hw-qb-author-line);
  background: color-mix(in srgb, var(--hw-qb-author) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--community.is-active {
  color: var(--hw-qb-community);
  border-color: var(--hw-qb-community-line);
  background: color-mix(in srgb, var(--hw-qb-community) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--feedback.is-active {
  color: var(--hw-qb-feedback);
  border-color: var(--hw-qb-feedback-line);
  background: color-mix(in srgb, var(--hw-qb-feedback) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--discovery.is-active {
  color: var(--hw-qb-discovery);
  border-color: var(--hw-qb-discovery-line);
  background: color-mix(in srgb, var(--hw-qb-discovery) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--competition.is-active {
  color: var(--hw-qb-competition);
  border-color: var(--hw-qb-competition-line);
  background: color-mix(in srgb, var(--hw-qb-competition) 24%, var(--hw-qb-panel));
}
.hw-qb__chip--all.is-active {
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
}

.hw-qb__chip.is-active { transform: translateY(-1px); }

.hw-qb__list {
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
}

.hw-qb__row {
  position: relative;
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  border: 1px solid rgba(232, 196, 138, 0.18);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(var(--hw-text-rgb),  0.035), transparent 42%),
    linear-gradient(165deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  padding: 1.15rem 1.2rem 1.15rem 1.1rem;
  overflow: hidden;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    var(--hw-qb-shadow-sm);
  transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.hw-qb__row-accent {
  position: absolute;
  left: 0;
  top: 12%;
  bottom: 12%;
  width: 3px;
  border-radius: 999px;
  background: rgba(232, 196, 138, 0.45);
  box-shadow: 0 0 10px rgba(232, 196, 138, 0.12);
}

.hw-qb__row.is-hidden { display: none; }

.hw-qb__row:hover {
  border-color: rgba(232, 196, 138, 0.36);
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    var(--hw-qb-shadow-md);
}

.hw-qb__row--official {
  border-color: var(--hw-qb-author-line);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    var(--hw-qb-shadow-sm);
}

.hw-qb__row--official:hover {
  border-color: var(--hw-qb-flame);
}

.hw-qb__row--reader .hw-qb__row-accent { background: var(--hw-qb-reader); box-shadow: 0 0 10px rgba(47, 122, 60, 0.28); }
.hw-qb__row--author .hw-qb__row-accent { background: var(--hw-qb-author); box-shadow: 0 0 10px rgba(184, 92, 58, 0.28); }
.hw-qb__row--community .hw-qb__row-accent { background: var(--hw-qb-community); box-shadow: 0 0 10px rgba(47, 111, 150, 0.28); }
.hw-qb__row--feedback .hw-qb__row-accent { background: var(--hw-qb-feedback); box-shadow: 0 0 10px rgba(138, 98, 48, 0.25); }
.hw-qb__row--discovery .hw-qb__row-accent { background: var(--hw-qb-discovery); box-shadow: 0 0 10px rgba(31, 122, 116, 0.28); }
.hw-qb__row--competition .hw-qb__row-accent { background: var(--hw-qb-competition); box-shadow: 0 0 10px rgba(196, 90, 34, 0.28); }

.hw-qb__row-rail {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 15px;
  background: var(--hw-qb-panel);
  border: 1.5px solid var(--hw-qb-line);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 4px 12px rgba(36, 33, 29, 0.06);
}

.hw-qb__icon--row {
  width: 1.45rem;
  height: 1.45rem;
  color: var(--hw-qb-gold);
}

/* Taxonomy owns icon + rail — Official must not override these */
.hw-qb__row--reader .hw-qb__icon--row { color: var(--hw-qb-reader); }
.hw-qb__row--author .hw-qb__icon--row { color: var(--hw-qb-author); }
.hw-qb__row--community .hw-qb__icon--row { color: var(--hw-qb-community); }
.hw-qb__row--discovery .hw-qb__icon--row { color: var(--hw-qb-discovery); }
.hw-qb__row--competition .hw-qb__icon--row { color: var(--hw-qb-competition); }
.hw-qb__row--feedback .hw-qb__icon--row { color: var(--hw-qb-feedback); }

.hw-qb__row--reader .hw-qb__row-rail {
  border-color: var(--hw-qb-reader-line);
  background: color-mix(in srgb, var(--hw-qb-reader) 20%, var(--hw-qb-panel));
}
.hw-qb__row--author .hw-qb__row-rail {
  border-color: var(--hw-qb-author-line);
  background: color-mix(in srgb, var(--hw-qb-author) 20%, var(--hw-qb-panel));
}
.hw-qb__row--community .hw-qb__row-rail {
  border-color: var(--hw-qb-community-line);
  background: color-mix(in srgb, var(--hw-qb-community) 20%, var(--hw-qb-panel));
}
.hw-qb__row--feedback .hw-qb__row-rail {
  border-color: var(--hw-qb-feedback-line);
  background: color-mix(in srgb, var(--hw-qb-feedback) 20%, var(--hw-qb-panel));
}
.hw-qb__row--discovery .hw-qb__row-rail {
  border-color: var(--hw-qb-discovery-line);
  background: color-mix(in srgb, var(--hw-qb-discovery) 20%, var(--hw-qb-panel));
}
.hw-qb__row--competition .hw-qb__row-rail {
  border-color: var(--hw-qb-competition-line);
  background: color-mix(in srgb, var(--hw-qb-competition) 20%, var(--hw-qb-panel));
}

.hw-qb__row-top {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}

.hw-qb__row-title {
  margin: 0 0 0.35rem;
  font-family: var(--hw-qb-display);
  font-size: 1.26rem;
  font-weight: 600;
  line-height: 1.2;
  color: var(--hw-qb-cream);
}

.hw-qb__row-title a {
  color: var(--hw-qb-cream) !important;
  text-decoration: none !important;
}

.hw-qb__row-title a:hover {
  color: var(--hw-qb-gold) !important;
}

.hw-qb__row-brief {
  margin: 0 0 0.65rem;
  font-size: 0.9rem;
  color: var(--hw-qb-muted);
  line-height: 1.45;
}

.hw-qb__row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.65rem;
  align-items: center;
}

.hw-qb__row-action { justify-self: end; }

.hw-qb__tonight {
  border: 1px solid rgba(var(--hw-flame-rgb),  0.28);
  border-radius: 18px;
  background:
    radial-gradient(90% 70% at 100% 0%, rgba(var(--hw-flame-rgb),  0.16), transparent 55%),
    linear-gradient(180deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  padding: 1.1rem 1.15rem 1.2rem;
  position: sticky;
  top: 1rem;
  box-shadow: 0 16px 36px rgba(36, 33, 29, 0.08);
}

.hw-qb__tonight-head {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  margin-bottom: 1rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(232, 196, 138, 0.12);
}

.hw-qb__tonight-title {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--hw-qb-gold);
}

.hw-qb__tonight-sub {
  margin: 0.25rem 0 0;
  font-size: 0.82rem;
  color: var(--hw-qb-muted);
}

.hw-qb__tonight-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.7rem;
}

.hw-qb__tonight-item {
  display: grid;
  grid-template-columns: 1rem 1fr;
  gap: 0.6rem;
  align-items: start;
  font-size: 0.88rem;
}

.hw-qb__tonight-item strong {
  display: block;
  font-weight: 650;
  color: var(--hw-qb-cream);
}

.hw-qb__tonight-item span:last-child {
  color: var(--hw-qb-muted);
  font-size: 0.78rem;
}

.hw-qb__tonight-check {
  width: 0.9rem;
  height: 0.9rem;
  margin-top: 0.2rem;
  border-radius: 50%;
  border: 1.5px solid rgba(232, 196, 138, 0.45);
  box-shadow: inset 0 0 0 2px rgba(10, 8, 6, 0.35);
}

.hw-qb__tonight-item.is-done .hw-qb__tonight-check {
  background: var(--hw-qb-flame);
  border-color: var(--hw-qb-flame);
}

.hw-qb__tonight-item.is-done strong {
  color: var(--hw-qb-muted);
  text-decoration: line-through;
}

.hw-qb__tonight-link {
  display: inline-block;
  margin-top: 1.05rem;
  font-size: 0.86rem;
  font-weight: 700;
  color: var(--hw-qb-gold) !important;
}

.hw-qb__tonight-link:hover { color: var(--hw-qb-gold) !important; }

/* My Jobs */
.hw-qb__masthead--mine { margin-bottom: 1.5rem; }

.hw-qb__ember-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1.5px solid var(--hw-qb-author-line);
  border-radius: 999px;
  padding: 0.45rem 0.9rem;
  font-weight: 750;
  color: var(--hw-qb-gold);
  background: var(--hw-qb-author-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__ember-chip small {
  font-size: 0.72rem;
  font-weight: 650;
  color: var(--hw-qb-muted);
  letter-spacing: 0.03em;
}

.hw-qb__mine-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 1.5rem;
  align-items: start;
}

.hw-qb__mine-active { margin-bottom: 2rem; }

.hw-qb__mine-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 0.95rem;
}

.hw-qb__mine-card {
  border: 1px solid rgba(232, 196, 138, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(160deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  padding: 1.05rem 1.1rem;
  position: relative;
  overflow: hidden;
  box-shadow: var(--hw-qb-shadow-sm);
  transition: transform 0.15s ease, border-color 0.15s ease;
}

.hw-qb__mine-card:hover {
  transform: translateY(-2px);
  border-color: rgba(232, 196, 138, 0.34);
}

.hw-qb__mine-card::after {
  content: "";
  position: absolute;
  right: -18px;
  bottom: -24px;
  width: 110px;
  height: 110px;
  opacity: 0.12;
  background: radial-gradient(circle, var(--hw-qb-flame), transparent 70%);
  pointer-events: none;
}

.hw-qb__mine-card-top {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.55rem;
}

.hw-qb__status-badge {
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fffaf5;
  border: 1px solid var(--hw-qb-flame);
  border-radius: 999px;
  padding: 0.18rem 0.55rem;
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f), var(--hw-qb-flame));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.hw-qb__mine-card-title {
  margin: 0 0 0.35rem;
  font-family: var(--hw-qb-display);
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--hw-qb-cream);
}

.hw-qb__mine-card-brief {
  margin: 0 0 0.75rem;
  font-size: 0.86rem;
  color: var(--hw-qb-muted);
  line-height: 1.4;
}

.hw-qb__progress {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.75rem;
}

.hw-qb__progress-bar {
  flex: 1;
  height: 7px;
  border-radius: 999px;
  background: rgba(var(--hw-text-rgb),  0.08);
  overflow: hidden;
}

.hw-qb__progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--hw-flame-light, #fb923c), var(--hw-flame-deep, #ea580c));
  box-shadow: 0 0 12px rgba(var(--hw-flame-rgb),  0.45);
}

.hw-qb__progress-pct {
  font-size: 0.78rem;
  font-weight: 750;
  color: var(--hw-qb-gold);
  min-width: 2.4rem;
  text-align: right;
}

.hw-qb__mine-card-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.75rem;
}

.hw-qb__mine-link {
  margin-left: auto;
  font-size: 0.84rem;
  font-weight: 700;
  color: var(--hw-qb-gold) !important;
}

.hw-qb__mine-link:hover { color: var(--hw-qb-gold) !important; }

.hw-qb__table-wrap {
  overflow-x: auto;
  border: 1.5px solid var(--hw-qb-line);
  border-radius: 16px;
  background: var(--hw-qb-panel);
}

.hw-qb__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.hw-qb__table th,
.hw-qb__table td {
  padding: 0.85rem 1rem;
  text-align: left;
  border-bottom: 1px solid rgba(212, 163, 90, 0.12);
  color: var(--hw-qb-cream);
}

.hw-qb__table th {
  font-size: 0.72rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
  font-weight: 750;
}

.hw-qb__table tr:last-child td { border-bottom: 0; }

.hw-qb__table a {
  color: var(--hw-qb-cream) !important;
  font-weight: 650;
}

.hw-qb__table a:hover { color: var(--hw-qb-gold) !important; }

.hw-qb__table-earn {
  color: var(--hw-qb-flame);
  font-weight: 750;
  white-space: nowrap;
}

.hw-qb__mine-aside {
  display: grid;
  gap: 1rem;
  position: sticky;
  top: 1rem;
}

.hw-qb__promo {
  border-radius: 18px;
  border: 1px solid rgba(232, 196, 138, 0.2);
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(8, 6, 4, 0.15), rgba(8, 6, 4, 0.88)),
    var(--hw-qb-promo-img, none) center / cover no-repeat,
    var(--hw-fe-elevated, #fcfaf7);
  min-height: 210px;
  padding: 1.2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  box-shadow: var(--hw-qb-shadow-md);
}

.hw-qb__promo h3 {
  margin: 0 0 0.35rem;
  font-family: var(--hw-qb-display);
  font-size: 1.4rem;
  color: var(--hw-qb-cream);
}

.hw-qb__promo p {
  margin: 0 0 0.9rem;
  color: rgba(var(--hw-text-rgb),  0.88);
  font-size: 0.92rem;
  line-height: 1.4;
}

.hw-qb__promo--mine p { margin: 0; }

.hw-qb__quick {
  display: grid;
  gap: 0.3rem;
  border: 1px solid rgba(232, 196, 138, 0.16);
  border-radius: 16px;
  background: var(--hw-qb-panel);
  padding: 0.5rem;
}

.hw-qb__quick a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.7rem 0.8rem;
  border-radius: 12px;
  color: var(--hw-qb-cream) !important;
  font-size: 0.9rem;
  font-weight: 650;
}

.hw-qb__quick a:hover {
  background: rgba(var(--hw-text-rgb),  0.06);
  color: var(--hw-qb-cream) !important;
}

.hw-qb__creed {
  margin: 0;
  border: 1.5px solid var(--hw-qb-line);
  border-radius: 16px;
  background:
    linear-gradient(165deg, var(--hw-qb-panel), var(--hw-qb-panel-2));
  padding: 1.05rem 1.15rem;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 8px 22px rgba(36, 33, 29, 0.06);
}

.hw-qb__creed p {
  margin: 0 0 0.5rem;
  font-family: var(--hw-qb-display);
  font-style: italic;
  font-size: 1.08rem;
  line-height: 1.4;
  color: var(--hw-qb-cream);
}

.hw-qb__creed cite {
  font-style: normal;
  font-size: 0.78rem;
  color: var(--hw-qb-muted);
}

/* Detail */
.hw-qb__crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0 0 1.15rem;
  font-size: 0.84rem;
  color: var(--hw-qb-muted);
}

.hw-qb__crumbs a {
  color: var(--hw-qb-flame) !important;
  font-weight: 700;
}

.hw-qb__crumbs .is-here { color: var(--hw-qb-cream); }

.hw-qb__detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 1.5rem;
  align-items: start;
}

.hw-qb__tagline {
  margin: 0 0 0.9rem;
  font-size: 1.08rem;
  color: var(--hw-qb-muted);
}

.hw-qb__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1.15rem;
}

.hw-qb__badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  border: 1.5px solid var(--hw-qb-author-line);
  padding: 0.34rem 0.8rem;
  font-size: 0.8rem;
  font-weight: 800;
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.hw-qb__badge--tax {
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
}

.hw-qb__badge--reader {
  border-color: var(--hw-qb-reader-line);
  color: var(--hw-qb-reader);
  background: var(--hw-qb-reader-soft);
}

.hw-qb__badge--author {
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-author);
  background: var(--hw-qb-author-soft);
}

.hw-qb__badge--community {
  border-color: var(--hw-qb-community-line);
  color: var(--hw-qb-community);
  background: var(--hw-qb-community-soft);
}

.hw-qb__badge--feedback {
  border-color: var(--hw-qb-feedback-line);
  color: var(--hw-qb-feedback);
  background: var(--hw-qb-feedback-soft);
}

.hw-qb__badge--discovery {
  border-color: var(--hw-qb-discovery-line);
  color: var(--hw-qb-discovery);
  background: var(--hw-qb-discovery-soft);
}

.hw-qb__badge--competition {
  border-color: var(--hw-qb-competition-line);
  color: var(--hw-qb-competition);
  background: var(--hw-qb-competition-soft);
}

.hw-qb__badge--official {
  color: #fffaf5;
  border-color: var(--hw-qb-flame);
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f), var(--hw-qb-flame));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.hw-qb__badge--claimed {
  border-color: var(--hw-qb-author-line);
  color: var(--hw-qb-gold);
  background: color-mix(in srgb, var(--hw-qb-author) 20%, var(--hw-qb-panel));
}

.hw-qb__badge--done {
  color: var(--hw-qb-reader);
  border-color: var(--hw-qb-reader-line);
  background: var(--hw-qb-reader-soft);
}

.hw-qb__meta-bar {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.7rem;
  margin-bottom: 1.5rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(232, 196, 138, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(180deg, var(--hw-fe-elevated, #fcfaf7), var(--hw-fe-surface, #efe8dc));
  box-shadow: 0 12px 28px rgba(36, 33, 29, 0.08);
}

.hw-qb__meta-item {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
}

.hw-qb__meta-label {
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__meta-value {
  font-size: 0.92rem;
  font-weight: 750;
  color: var(--hw-qb-cream);
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.hw-qb__meta-value--flame { color: var(--hw-qb-flame); }

.hw-qb__diff {
  display: inline-flex;
  gap: 2px;
  align-items: flex-end;
  height: 0.9rem;
}

.hw-qb__diff-pip {
  display: block;
  width: 4px;
  border-radius: 1px;
  background: rgba(var(--hw-text-rgb),  0.18);
}

.hw-qb__diff-pip:nth-child(1) { height: 35%; }
.hw-qb__diff-pip:nth-child(2) { height: 50%; }
.hw-qb__diff-pip:nth-child(3) { height: 65%; }
.hw-qb__diff-pip:nth-child(4) { height: 80%; }
.hw-qb__diff-pip:nth-child(5) { height: 100%; }
.hw-qb__diff-pip.is-on { background: var(--hw-qb-flame); }

.hw-qb__how { margin-bottom: 1.5rem; }

.hw-qb__steps {
  list-style: none;
  margin: 0;
  padding: 1.1rem 1.15rem;
  border: 1.5px solid var(--hw-qb-line);
  border-radius: 16px;
  background:
    linear-gradient(165deg, var(--hw-qb-panel), var(--hw-qb-panel-2));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 8px 22px rgba(36, 33, 29, 0.06);
  display: grid;
  gap: 1.05rem;
}

.hw-qb__step {
  display: grid;
  grid-template-columns: 1.85rem 1fr;
  gap: 0.8rem;
  position: relative;
}

.hw-qb__step-num {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  border: 1.5px solid rgba(var(--hw-flame-rgb),  0.6);
  color: var(--hw-qb-flame);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 800;
  background: var(--hw-fe-elevated, #fcfaf7);
  z-index: 1;
}

.hw-qb__step:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 0.88rem;
  top: 1.85rem;
  bottom: -1.05rem;
  width: 1.5px;
  background: linear-gradient(180deg, rgba(var(--hw-flame-rgb),  0.55), rgba(var(--hw-flame-rgb),  0.08));
}

.hw-qb__step strong {
  display: block;
  margin-bottom: 0.15rem;
  color: var(--hw-qb-cream);
}

.hw-qb__step p {
  margin: 0;
  color: var(--hw-qb-muted);
  font-size: 0.92rem;
  line-height: 1.45;
}

.hw-qb__guide-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.95rem 1.1rem;
  border: 1.5px solid var(--hw-qb-line);
  border-radius: 14px;
  background:
    linear-gradient(165deg, var(--hw-qb-panel), var(--hw-qb-panel-2));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.6),
    0 8px 22px rgba(36, 33, 29, 0.06);
}

.hw-qb__guide-bar p {
  margin: 0;
  font-size: 0.92rem;
  color: var(--hw-qb-muted);
  flex: 1 1 14rem;
}

.hw-qb__detail-aside {
  display: grid;
  gap: 1rem;
  position: sticky;
  top: 1rem;
}

.hw-qb__promo--explore { min-height: 250px; }

.hw-qb__summary {
  border: 1px solid rgba(232, 196, 138, 0.18);
  border-radius: 16px;
  background: var(--hw-qb-panel);
  padding: 1.15rem;
  display: grid;
  gap: 1rem;
  box-shadow: 0 14px 30px rgba(36, 33, 29, 0.04);
}

.hw-qb__summary-label {
  display: block;
  margin-bottom: 0.3rem;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__summary-row p {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.45;
  color: var(--hw-qb-cream);
}

.hw-qb__summary-earn {
  color: var(--hw-qb-flame) !important;
  font-weight: 750;
}

.hw-qb__summary-actions {
  display: grid;
  gap: 0.55rem;
}

@media (max-width: 980px) {
  .hw-qb__toolbar,
  .hw-qb__board-layout,
  .hw-qb__mine-layout,
  .hw-qb__detail-layout {
    grid-template-columns: 1fr;
  }

  .hw-qb__tonight,
  .hw-qb__mine-aside,
  .hw-qb__detail-aside {
    position: static;
  }

  .hw-qb__meta-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .hw-qb { padding: 1.1rem 0.9rem 2.5rem; }

  .hw-qb__row {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .hw-qb__row-action {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .hw-qb__row-action .hw-qb__claim {
    width: 100%;
  }

  .hw-qb__meta-bar {
    grid-template-columns: 1fr;
  }
}

/* Phase B peer review */
.hw-qb__standing-note,
.hw-qb__post-blocked {
  margin: 0.5rem 0 0.75rem;
  font-size: 0.82rem;
  line-height: 1.4;
  color: rgba(232, 220, 200, 0.78);
}

.hw-qb__masthead--mine .hw-qb__standing-pills {
  margin-top: 0.85rem;
}

.hw-qb__post-blocked {
  color: rgba(252, 165, 165, 0.95);
}

.hw-qb__evidence {
  margin: 0.5rem 0;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  white-space: pre-wrap;
  font-size: 0.84rem;
  max-height: 160px;
  overflow: auto;
}

.hw-qb__submit-form textarea {
  width: 100%;
  margin: 0.5rem 0;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  color: inherit;
  font: inherit;
}

.hw-qb__review-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.hw-qb__field--inline {
  margin: 0;
}

/* =============================================================================
   Ivory mockup architecture — browse / detail / mine / post
   Replaces nested charcoal chrome with flat elevated cream cards.
============================================================================= */

.hw-qb__text-link {
  color: var(--hw-qb-gold) !important;
  font-weight: 650;
  font-size: 0.92rem;
  text-decoration: none !important;
  align-self: center;
}
.hw-qb__text-link:hover { text-decoration: underline !important; }

.hw-qb__tos-note {
  margin: 0.85rem 0 0;
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--hw-qb-muted);
  max-width: 40rem;
}

.hw-qb__icon--meta {
  width: 0.85rem;
  height: 0.85rem;
  color: var(--hw-qb-flame);
  vertical-align: -0.1em;
}

/* —— Browse masthead (mockup 01) —— */
.hw-qb__masthead--board {
  margin-bottom: 1.35rem;
  display: grid;
  gap: 1rem;
}

.hw-qb__masthead--board .hw-qb__title {
  font-size: clamp(2.4rem, 5vw, 3.35rem);
  margin-bottom: 0.35rem;
}

.hw-qb__masthead--board .hw-qb__lede {
  max-width: 36rem;
  font-size: 1.05rem;
}

.hw-qb__search-post {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: stretch;
  max-width: 52rem;
}

.hw-qb__search-post .hw-qb__search {
  flex: 1;
  min-width: 0;
}

.hw-qb__search-post .hw-qb__search-input {
  min-height: 3rem;
  border-radius: 12px;
  font-size: 0.95rem;
}

.hw-qb__btn--post,
.hw-qb__search-post .hw-qb__btn--primary {
  min-width: 9.5rem;
  border-radius: 12px;
  padding-inline: 1.35rem;
  white-space: nowrap;
}

.hw-qb__mast-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  align-items: center;
}

.hw-qb__ember-chip--quiet {
  background: transparent;
  border-color: var(--hw-qb-line);
  box-shadow: none;
  padding: 0.3rem 0.7rem;
  font-weight: 650;
}

.hw-qb__active-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 1rem;
  margin: 0 0 1.25rem;
  padding: 0.55rem 0.85rem;
  border-radius: 12px;
  border: 1px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  box-shadow: 0 4px 14px rgba(33, 27, 22, 0.04);
}

.hw-qb__active-strip-label {
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--hw-qb-flame);
}

.hw-qb__active-strip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.9rem;
  margin: 0;
  padding: 0;
  list-style: none;
  flex: 1;
}

.hw-qb__active-strip-list a {
  color: var(--hw-qb-ink) !important;
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 600;
}

.hw-qb__active-strip-more {
  font-size: 0.84rem;
  font-weight: 650;
  color: var(--hw-qb-gold) !important;
  text-decoration: none;
}

/* —— Board layout —— */
.hw-qb__board-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: 1.5rem;
  align-items: start;
  margin-top: 0.35rem;
}

.hw-qb__board-main {
  border: none;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.hw-qb__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.hw-qb__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 1rem;
}

.hw-qb__sort {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-left: auto;
}

.hw-qb__sort-label {
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__sort select {
  min-width: 12.5rem;
  max-width: 100%;
  padding: 0.45rem 0.7rem;
  border-radius: 10px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  color: var(--hw-qb-ink);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 600;
  cursor: pointer;
}

.hw-qb__chip {
  border-radius: 999px;
  background: var(--hw-qb-panel);
  border: 1.5px solid var(--hw-qb-line);
  color: var(--hw-qb-ink);
  box-shadow: none;
  padding: 0.48rem 0.95rem;
}

.hw-qb__chip.is-active,
.hw-qb__chip--all.is-active {
  border-color: var(--hw-qb-flame);
  color: var(--hw-qb-flame);
  background: var(--hw-qb-flame-soft);
  box-shadow: none;
  transform: none;
}

.hw-qb__list {
  gap: 0.75rem;
}

/* Job rows — circular type orb (mockup 01) */
.hw-qb__row {
  grid-template-columns: 4.5rem minmax(0, 1fr) auto;
  gap: 0.85rem 1rem;
  align-items: center;
  border: 1px solid var(--hw-qb-line);
  border-radius: 14px;
  background: var(--hw-qb-panel);
  padding: 0.95rem 1.05rem;
  box-shadow: 0 6px 18px rgba(33, 27, 22, 0.045);
}

.hw-qb__row:hover {
  border-color: color-mix(in srgb, var(--hw-qb-flame) 35%, var(--hw-qb-line));
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(33, 27, 22, 0.07);
}

.hw-qb__row-accent,
.hw-qb__row-rail { display: none !important; }

.hw-qb__row-type {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  text-align: center;
}

.hw-qb__type-orb {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-qb-panel-2);
}

.hw-qb__type-label {
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__row--reader .hw-qb__type-orb { background: var(--hw-qb-reader-soft); border-color: var(--hw-qb-reader-line); }
.hw-qb__row--author .hw-qb__type-orb { background: var(--hw-qb-author-soft); border-color: var(--hw-qb-author-line); }
.hw-qb__row--community .hw-qb__type-orb { background: var(--hw-qb-community-soft); border-color: var(--hw-qb-community-line); }
.hw-qb__row--feedback .hw-qb__type-orb { background: var(--hw-qb-feedback-soft); border-color: var(--hw-qb-feedback-line); }
.hw-qb__row--discovery .hw-qb__type-orb { background: var(--hw-qb-discovery-soft); border-color: var(--hw-qb-discovery-line); }
.hw-qb__row--competition .hw-qb__type-orb { background: var(--hw-qb-competition-soft); border-color: var(--hw-qb-competition-line); }

.hw-qb__row--reader .hw-qb__type-label,
.hw-qb__row--reader .hw-qb__icon--row { color: var(--hw-qb-reader); }
.hw-qb__row--author .hw-qb__type-label,
.hw-qb__row--author .hw-qb__icon--row { color: var(--hw-qb-author); }
.hw-qb__row--community .hw-qb__type-label,
.hw-qb__row--community .hw-qb__icon--row { color: var(--hw-qb-community); }
.hw-qb__row--feedback .hw-qb__type-label,
.hw-qb__row--feedback .hw-qb__icon--row { color: var(--hw-qb-feedback); }
.hw-qb__row--discovery .hw-qb__type-label,
.hw-qb__row--discovery .hw-qb__icon--row { color: var(--hw-qb-discovery); }
.hw-qb__row--competition .hw-qb__type-label,
.hw-qb__row--competition .hw-qb__icon--row { color: var(--hw-qb-competition); }

.hw-qb__row-title {
  font-size: 1.15rem;
  margin: 0 0 0.2rem;
}

.hw-qb__row-brief {
  margin: 0 0 0.45rem;
  font-size: 0.88rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.hw-qb__official {
  display: inline-block;
  margin-bottom: 0.25rem;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--hw-qb-flame);
}

.hw-qb__claim--outline,
.hw-qb__claim.hw-qb__claim--outline {
  border: 1.5px solid var(--hw-qb-flame);
  background: transparent;
  color: var(--hw-qb-flame) !important;
  box-shadow: none;
  border-radius: 999px;
  min-width: 5.75rem;
}

.hw-qb__claim--outline:hover {
  background: var(--hw-qb-flame-soft);
  color: var(--hw-qb-gold) !important;
  transform: none;
  filter: none;
}

/* Tonight’s Official rail */
.hw-qb__tonight {
  border: 1px solid var(--hw-qb-line);
  border-radius: 16px;
  background: var(--hw-qb-panel);
  padding: 1.1rem 1.1rem 1.2rem;
  box-shadow: var(--hw-qb-shadow-sm);
  position: sticky;
  top: calc(var(--hw-global-nav-h, 68px) + 0.75rem);
}

.hw-qb__tonight-title {
  font-family: var(--hw-qb-display);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--hw-qb-ink);
}

.hw-qb__tonight-sub {
  font-size: 0.8rem;
  color: var(--hw-qb-muted);
}

.hw-qb__tonight-item {
  display: block;
  padding: 0.75rem 0.8rem;
  border-radius: 12px;
  border: 1px solid var(--hw-qb-line);
  background: color-mix(in srgb, var(--hw-qb-panel-2) 65%, var(--hw-qb-panel));
  grid-template-columns: unset;
}

.hw-qb__tonight-item-body {
  display: grid;
  gap: 0.2rem;
}

.hw-qb__tonight-item strong {
  font-size: 0.9rem;
  color: var(--hw-qb-ink);
}

.hw-qb__tonight-xp {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--hw-qb-flame);
}

.hw-qb__tonight-dots {
  display: flex;
  gap: 0.28rem;
  margin-top: 0.35rem;
}

.hw-qb__tonight-dots i {
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: var(--hw-qb-line);
  display: inline-block;
}

.hw-qb__tonight-dots i.is-on {
  background: var(--hw-qb-flame);
}

.hw-qb__tonight-item.is-done strong {
  text-decoration: line-through;
  color: var(--hw-qb-muted);
}

.hw-qb__tonight-link {
  color: var(--hw-qb-flame) !important;
}

/* —— Ticket bench (browse) —— */
.hw-qb--board {
  position: relative;
}

.hw-qb--board::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 22rem;
  pointer-events: none;
  z-index: 0;
  background-image:
    radial-gradient(ellipse 55% 40% at 8% 0%, rgba(var(--hw-fe-accent-rgb, 184, 92, 58), 0.1), transparent 58%),
    linear-gradient(135deg, rgba(184, 92, 58, 0.055) 1px, transparent 1px),
    linear-gradient(45deg, rgba(184, 92, 58, 0.04) 1px, transparent 1px);
  background-size: auto, 26px 26px, 26px 26px;
  mask-image: linear-gradient(180deg, #000 40%, transparent);
}

.hw-qb--board > * {
  position: relative;
  z-index: 1;
}

.hw-qb__kicker {
  margin: 0 0 0.4rem;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--hw-qb-gold);
}

.hw-qb--board .hw-qb__masthead--board {
  gap: 0.45rem;
  margin-bottom: 0.55rem;
}

.hw-qb--board .hw-qb__title {
  font-size: clamp(2.15rem, 4.5vw, 3.1rem);
}

.hw-qb__command {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: stretch;
  margin: 0 0 0.85rem;
}

.hw-qb__command .hw-qb__search {
  min-width: 0;
}

.hw-qb__command .hw-qb__search-input {
  min-height: 3.35rem;
  font-size: 1rem;
}

.hw-qb__post-cta {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0.12rem;
  min-width: 13.5rem;
  padding: 0.7rem 1.25rem;
  border: 0;
  border-radius: 14px;
  text-decoration: none !important;
  cursor: pointer;
  background: linear-gradient(180deg, var(--hw-fe-accent-light, #c9724f) 0%, var(--hw-qb-flame) 55%, var(--hw-qb-gold) 100%);
  color: #fffaf5 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    var(--hw-qb-shadow-fire);
}

.hw-qb__post-cta:hover {
  filter: brightness(1.04);
  transform: translateY(-1px);
  color: #fffaf5 !important;
}

.hw-qb__post-cta:focus-visible {
  outline: 2px solid var(--hw-qb-gold);
  outline-offset: 3px;
}

.hw-qb__post-cta[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
  filter: none;
}

.hw-qb__post-cta-label {
  font-weight: 800;
  font-size: 1.02rem;
  letter-spacing: 0.01em;
}

.hw-qb__post-cta-sub {
  font-size: 0.75rem;
  font-weight: 600;
  opacity: 0.9;
}

.hw-qb__desk {
  position: relative;
  margin: 0 0 0.95rem;
  padding: 0.75rem 0.8rem 0.85rem;
  border-radius: 20px;
  background:
    repeating-linear-gradient(
      90deg,
      color-mix(in srgb, var(--hw-qb-panel-2) 82%, #c9b79a) 0 11px,
      color-mix(in srgb, var(--hw-qb-panel) 78%, #d8c8ae) 11px 22px
    );
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.4),
    var(--hw-qb-shadow-sm);
}

.hw-qb__hero-ticket {
  display: grid;
  grid-template-columns: 7rem minmax(0, 1fr) minmax(11rem, 13rem);
  min-height: 10.5rem;
  overflow: hidden;
  border-radius: 8px;
  background: var(--hw-qb-panel);
  box-shadow: var(--hw-qb-shadow-sm);
}

.hw-qb__hero-stub {
  position: relative;
  display: grid;
  place-content: center;
  text-align: center;
  gap: 0.15rem;
  padding: 1rem 0.55rem;
  background:
    radial-gradient(circle at 50% 28%, rgba(var(--hw-fe-accent-rgb, 184, 92, 58), 0.28), transparent 62%),
    linear-gradient(180deg, #2c221c, #171310);
  color: #f7efe4;
}

.hw-qb__hero-stub::after {
  content: "";
  position: absolute;
  top: 0;
  right: -7px;
  bottom: 0;
  width: 14px;
  background: radial-gradient(circle at 100% 12px, transparent 7px, #1b1511 8px) 0 0 / 14px 24px;
}

.hw-qb__hero-stub-kicker {
  font-size: 0.68rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #e8c48a;
  font-weight: 700;
}

.hw-qb__hero-stub strong {
  font-family: var(--hw-qb-display);
  font-size: 1.85rem;
  line-height: 1;
  color: #fcfaf7;
}

.hw-qb__hero-stub-unit {
  font-size: 0.72rem;
  color: #cbbba8;
}

.hw-qb__hero-body {
  padding: 1.1rem 1.2rem;
}

.hw-qb__hero-title {
  margin: 0.15rem 0 0.4rem;
  font-family: var(--hw-qb-display);
  font-size: clamp(1.45rem, 2.4vw, 2.05rem);
  line-height: 1.1;
  color: var(--hw-qb-ink);
}

.hw-qb__hero-brief {
  margin: 0 0 0.75rem;
  color: var(--hw-qb-muted);
  font-size: 0.95rem;
  line-height: 1.45;
}

.hw-qb__ticket-progress {
  height: 0.42rem;
  border-radius: 99px;
  background: var(--hw-qb-panel-2);
  overflow: hidden;
}

.hw-qb__ticket-progress i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--hw-qb-flame), #d4784a);
}

.hw-qb__hero-act {
  display: grid;
  align-content: center;
  gap: 0.5rem;
  padding: 1.05rem 1.1rem;
  background: color-mix(in srgb, var(--hw-qb-panel-2) 70%, var(--hw-qb-panel));
}

.hw-qb__hero-poster {
  font-size: 0.8rem;
  font-weight: 650;
  color: var(--hw-qb-muted);
}

.hw-qb__desk-more {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.75rem 0 0;
  padding: 0;
  list-style: none;
}

.hw-qb__desk-more a {
  display: inline-block;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: var(--hw-qb-panel);
  font-size: 0.82rem;
  font-weight: 650;
}

.hw-qb__vessel {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 0.45rem;
  padding: 1.5rem 1.2rem;
  border-radius: 14px;
  border: 1px dashed color-mix(in srgb, var(--hw-qb-flame) 35%, var(--hw-qb-line));
  background:
    radial-gradient(ellipse 70% 50% at 18% 12%, rgba(var(--hw-fe-accent-rgb, 184, 92, 58), 0.08), transparent 55%),
    linear-gradient(165deg, var(--hw-qb-panel), var(--hw-qb-panel-2));
  color: var(--hw-qb-muted);
}

.hw-qb__vessel p { margin: 0; }

.hw-qb__vessel--desk {
  min-height: 0;
  padding: 0.95rem 1.1rem;
}

.hw-qb__vessel-mark {
  width: 2.4rem;
  height: 1.7rem;
  border: 1.5px solid color-mix(in srgb, var(--hw-qb-flame) 45%, var(--hw-qb-line));
  border-radius: 3px;
  background:
    linear-gradient(180deg, transparent 38%, color-mix(in srgb, var(--hw-qb-flame) 22%, transparent) 38% 42%, transparent 42%);
}

.hw-qb__bench-head {
  display: grid;
  gap: 0.85rem;
  margin-bottom: 1rem;
}

.hw-qb__bench-note {
  margin: 0.25rem 0 0;
  font-size: 0.88rem;
  color: var(--hw-qb-muted);
}

.hw-qb--board .hw-qb__toolbar {
  margin: 0;
}

.hw-qb__list.hw-qb__tickets {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14.75rem, 1fr));
  gap: 0.85rem;
}

.hw-qb__ticket {
  position: relative;
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  grid-template-rows: auto 1fr auto auto;
  column-gap: 0.7rem;
  min-height: 13rem;
  padding: 1.05rem 1.05rem 0.95rem 1.25rem;
  border-radius: 4px 14px 14px 4px;
  background: var(--hw-qb-panel);
  box-shadow: var(--hw-qb-shadow-sm);
}

.hw-qb__ticket.is-hidden { display: none; }

.hw-qb__ticket::before {
  content: "";
  position: absolute;
  top: 0;
  left: -7px;
  bottom: 0;
  width: 14px;
  background: radial-gradient(circle at 0 10px, transparent 6px, var(--hw-qb-panel) 7px) 0 0 / 14px 20px;
}

.hw-qb__ticket-seal {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  color: var(--hw-qb-flame);
  flex-shrink: 0;
}

.hw-qb__ticket-seal i {
  position: absolute;
  inset: 18%;
  transform: rotate(45deg);
  border: 1px solid color-mix(in srgb, var(--hw-qb-flame) 40%, var(--hw-qb-line));
  background: var(--hw-qb-flame-soft);
}

.hw-qb__ticket--reader .hw-qb__ticket-seal { color: var(--hw-qb-reader); }
.hw-qb__ticket--reader .hw-qb__ticket-seal i {
  border-color: var(--hw-qb-reader-line);
  background: var(--hw-qb-reader-soft);
}
.hw-qb__ticket--author .hw-qb__ticket-seal { color: var(--hw-qb-author); }
.hw-qb__ticket--community .hw-qb__ticket-seal { color: var(--hw-qb-community); }
.hw-qb__ticket--community .hw-qb__ticket-seal i {
  border-color: var(--hw-qb-community-line);
  background: var(--hw-qb-community-soft);
}
.hw-qb__ticket--feedback .hw-qb__ticket-seal { color: var(--hw-qb-feedback); }
.hw-qb__ticket--feedback .hw-qb__ticket-seal i {
  border-color: var(--hw-qb-feedback-line);
  background: var(--hw-qb-feedback-soft);
}

.hw-qb__ticket-seal .hw-qb__icon { position: relative; z-index: 1; }

.hw-qb__ticket-body {
  grid-column: 2;
  grid-row: 1 / 3;
  min-width: 0;
}

.hw-qb__ticket-kicker {
  margin: 0.2rem 0 0.2rem;
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--hw-qb-gold);
}

.hw-qb__ticket-title {
  margin: 0 0 0.35rem;
  font-family: var(--hw-qb-display);
  font-size: 1.18rem;
  line-height: 1.2;
}

.hw-qb__ticket-title a:hover { color: var(--hw-qb-flame); }

.hw-qb__ticket-brief {
  margin: 0;
  font-size: 0.88rem;
  color: var(--hw-qb-muted);
  line-height: 1.4;
}

.hw-qb__ticket-rule {
  grid-column: 1 / -1;
  height: 1px;
  margin: 0.75rem 0 0.7rem;
  background: repeating-linear-gradient(90deg, var(--hw-qb-line) 0 8px, transparent 8px 12px);
}

.hw-qb__ticket-foot {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.55rem;
}

.hw-qb__ticket-pay {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  align-items: center;
}

.hw-qb__vessel--filter {
  margin-top: 0.85rem;
}

.hw-qb--board .hw-qb__tonight {
  border-radius: 16px;
}

@media (max-width: 900px) {
  .hw-qb__command,
  .hw-qb__hero-ticket {
    grid-template-columns: 1fr;
  }

  .hw-qb__hero-stub {
    min-height: 5.2rem;
  }

  .hw-qb__hero-stub::after { display: none; }

  .hw-qb__post-cta {
    min-width: 0;
    width: 100%;
    min-height: 3.35rem;
    border-radius: 14px;
    align-items: stretch;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hw-qb__post-cta:hover,
  .hw-qb__btn--primary:hover {
    transform: none;
  }
}

/* —— Detail —— */
.hw-qb__detail-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  gap: 1.5rem;
  align-items: start;
}

.hw-qb__meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.25rem;
  padding: 0.85rem 0;
  margin: 0.75rem 0 1.25rem;
  border: none;
  border-top: 1px solid var(--hw-qb-line);
  border-bottom: 1px solid var(--hw-qb-line);
  background: transparent;
  border-radius: 0;
}

.hw-qb__meta-item {
  min-width: auto;
  padding: 0;
  background: transparent;
  border: none;
}

.hw-qb__meta-label {
  display: block;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--hw-qb-muted);
  margin-bottom: 0.15rem;
}

.hw-qb__step-num {
  background: var(--hw-qb-flame);
  color: #fffaf5;
  border: none;
}

.hw-qb__summary {
  border: 1px solid var(--hw-qb-line);
  border-radius: 16px;
  background: var(--hw-qb-panel);
  box-shadow: 0 10px 28px rgba(33, 27, 22, 0.06);
  position: sticky;
  top: calc(var(--hw-global-nav-h, 68px) + 0.75rem);
}

.hw-qb__claim--wide.hw-qb__claim--outline,
.hw-qb__summary .hw-qb__claim--primary {
  width: 100%;
  border-radius: 12px;
}

/* —— My Jobs tabs (mockup 03) —— */
.hw-qb__mine-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.25rem;
  margin-top: 1.15rem;
  border-bottom: 1px solid var(--hw-qb-line);
}

.hw-qb__mine-tab {
  appearance: none;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  padding: 0.55rem 0.1rem 0.7rem;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 650;
  color: var(--hw-qb-muted);
  cursor: pointer;
}

.hw-qb__mine-tab.is-active {
  color: var(--hw-qb-ink);
  border-bottom-color: var(--hw-qb-ink);
}

.hw-qb__mine-panel[hidden] { display: none !important; }

.hw-qb__mine-layout {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 260px);
  gap: 1.5rem;
}

.hw-qb__mine-card {
  border: 1px solid var(--hw-qb-line);
  border-radius: 14px;
  background: var(--hw-qb-panel);
  box-shadow: 0 6px 18px rgba(33, 27, 22, 0.045);
}

.hw-qb__mine-card::after { display: none; }

.hw-qb__mine-card:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--hw-qb-flame) 30%, var(--hw-qb-line));
}

.hw-qb__progress {
  display: grid;
  gap: 0.35rem;
  margin: 0.65rem 0;
}

.hw-qb__progress-label {
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--hw-qb-muted);
}

.hw-qb__progress-bar {
  height: 0.45rem;
  border-radius: 999px;
  background: var(--hw-qb-panel-2);
  overflow: hidden;
}

.hw-qb__progress-bar > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--hw-fe-accent-light, #c9724f), var(--hw-qb-flame));
}

.hw-qb__table-wrap {
  border: 1px solid var(--hw-qb-line);
  border-radius: 14px;
  background: var(--hw-qb-panel);
  overflow: hidden;
}

/* —— Post composer (mockup 04) —— */
.hw-qb--post .hw-qb__crumbs {
  margin-bottom: 1rem;
}

.hw-qb__post-stage {
  max-width: 920px;
  margin: 0 auto;
}

.hw-qb__post-card {
  display: grid;
  gap: 1.25rem;
  padding: 1.5rem 1.5rem 0;
  border-radius: 18px;
  border: 1px solid var(--hw-qb-line);
  background: var(--hw-qb-panel);
  box-shadow: 0 16px 40px rgba(33, 27, 22, 0.07);
}

.hw-qb__post-card-head .hw-qb__title {
  font-size: clamp(1.85rem, 3vw, 2.35rem);
}

.hw-qb__post-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.15rem;
}

.hw-qb__field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.hw-qb__field--wide { grid-column: 1 / -1; }

.hw-qb__field-label {
  font-size: 0.78rem;
  font-weight: 750;
  letter-spacing: 0.03em;
  color: var(--hw-qb-ink);
  text-transform: none;
}

.hw-qb__field-hint {
  font-size: 0.78rem;
  color: var(--hw-qb-muted);
  order: 2;
}

.hw-qb__field > input,
.hw-qb__field > select,
.hw-qb__field > textarea,
.hw-qb__field > .hw-qb__ember-input {
  order: 3;
}

.hw-qb__field-error {
  margin: 0.25rem 0 0;
  font-size: 0.84rem;
  color: #9b3b2e;
}

.hw-qb__field-error.is-hidden { display: none; }

.hw-qb__ember-input {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0 0.75rem 0 0.65rem;
  border-radius: 10px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-fe-bg, #f7f3ed);
  color: var(--hw-qb-ink);
}

.hw-qb__ember-input-icon {
  display: inline-flex;
  color: var(--hw-qb-flame, #c45c26);
  flex: 0 0 auto;
}

.hw-qb__ember-input input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0.65rem 0;
  box-shadow: none;
  color: inherit;
  font: inherit;
}

.hw-qb__ember-input:focus-within {
  border-color: var(--hw-qb-flame, #c45c26);
}

.hw-qb__ember-amt {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-weight: 700;
  color: inherit;
}

.hw-qb__ember-amt-icon {
  display: inline-flex;
  color: var(--hw-qb-flame, #c45c26);
  line-height: 0;
}

.hw-qb__ember-amt-icon .hw-qb__icon {
  width: 1em;
  height: 1em;
}

.hw-qb__ember-amt-num {
  font-weight: 800;
}

.hw-qb__ember-amt-unit {
  font-weight: 600;
  color: var(--hw-qb-muted);
}

.hw-qb__post-card input,
.hw-qb__post-card select,
.hw-qb__post-card textarea {
  width: 100%;
  padding: 0.65rem 0.75rem;
  border-radius: 10px;
  border: 1.5px solid var(--hw-qb-line);
  background: var(--hw-fe-bg, #f7f3ed);
  color: var(--hw-qb-ink);
  font: inherit;
}

.hw-qb__post-card .hw-qb__ember-input {
  width: 100%;
  box-sizing: border-box;
}

.hw-qb__post-card .hw-qb__ember-input input {
  width: auto;
  padding: 0.65rem 0;
  border: 0;
  background: transparent;
}

.hw-qb__post-card textarea { min-height: 8rem; resize: none; }

.hw-qb__escrow-preview {
  padding: 1rem 1.1rem;
  border-radius: 12px;
  border: 1px solid var(--hw-qb-author-line);
  background: var(--hw-qb-flame-soft);
}

.hw-qb__escrow-dl {
  display: grid;
  gap: 0.4rem;
  margin: 0.55rem 0 0;
}

.hw-qb__escrow-dl > div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.9rem;
}

.hw-qb__escrow-dl dt { margin: 0; color: var(--hw-qb-muted); }
.hw-qb__escrow-dl dd { margin: 0; font-weight: 700; }
.hw-qb__escrow-dl .hw-qb__ember-amt { justify-content: flex-end; }

.hw-qb__post-budget .hw-qb__ember-amt {
  margin-top: 0.15rem;
}

.hw-qb__escrow-total {
  padding-top: 0.45rem;
  border-top: 1px solid var(--hw-qb-line);
}

.hw-qb__post-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
  margin: 0 -1.5rem;
  padding: 1rem 1.5rem 1.2rem;
  border-top: 1px solid var(--hw-qb-line);
  background: color-mix(in srgb, var(--hw-qb-panel-2) 55%, var(--hw-qb-panel));
  border-radius: 0 0 18px 18px;
}

.hw-qb__post-budget {
  display: grid;
  gap: 0.1rem;
  font-size: 0.82rem;
  color: var(--hw-qb-muted);
}

.hw-qb__post-budget strong {
  font-size: 1rem;
  color: var(--hw-qb-ink);
}

.hw-qb__post-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
}

@media (max-width: 980px) {
  .hw-qb__board-layout,
  .hw-qb__detail-layout,
  .hw-qb__mine-layout {
    grid-template-columns: 1fr;
  }

  .hw-qb__tonight,
  .hw-qb__summary {
    position: static;
  }
}

@media (max-width: 720px) {
  .hw-qb {
    padding-inline: max(0.75rem, env(safe-area-inset-left));
    max-width: 100%;
    box-sizing: border-box;
  }

  .hw-qb__lede,
  .hw-qb__intro,
  .hw-qb__paid-note {
    max-width: none;
    overflow-wrap: anywhere;
  }

  .hw-qb__command {
    grid-template-columns: 1fr;
  }

  .hw-qb__post-cta {
    width: 100%;
    min-width: 0;
    min-height: 3.25rem;
  }

  .hw-qb__search-post {
    grid-template-columns: 1fr;
  }

  .hw-qb__toolbar {
    flex-direction: column;
    align-items: stretch;
  }

  .hw-qb__filters {
    width: 100%;
  }

  .hw-qb__chip {
    min-height: 2.75rem;
    padding: 0.45rem 0.85rem;
  }

  .hw-qb__sort {
    width: 100%;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
  }

  .hw-qb__sort select {
    min-width: 0;
    width: 100%;
    min-height: 2.75rem;
  }

  /* Stack type badge above copy — stop the squished 2-col card */
  .hw-qb__row {
    grid-template-columns: 1fr;
    gap: 0.75rem;
    padding: 1rem 0.95rem;
  }

  .hw-qb__row-type {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 0.55rem;
    text-align: left;
  }

  .hw-qb__type-orb {
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
  }

  .hw-qb__type-label {
    white-space: nowrap;
    letter-spacing: 0.06em;
  }

  .hw-qb__row-main {
    min-width: 0;
  }

  .hw-qb__row-title {
    font-size: 1.05rem;
    overflow-wrap: anywhere;
  }

  .hw-qb__row-desc,
  .hw-qb__row-blurb {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
    overflow: hidden;
    white-space: normal;
  }

  .hw-qb__row-action {
    grid-column: 1 / -1;
    justify-self: stretch;
  }

  .hw-qb__row-action .hw-qb__claim {
    width: 100%;
    min-height: 2.75rem;
  }

  .hw-qb__post-grid {
    grid-template-columns: 1fr;
  }

  .hw-qb__post-foot {
    flex-direction: column;
    align-items: stretch;
  }
}


