/* Hallmark · component: collectible coupon wallet · genre: playful
 * theme: existing QO light/dark tokens · pre-emit critique: P5 H5 E4 S5 R5 V5
 * states: default · hover · focus · active · disabled · loading · error · success
 */
.sst-qcw-active .sst-qct-message { display: none !important; }
.sst-qcw {
  --sst-qcw-ink: var(--sst-qct-ink);
  --sst-qcw-muted: var(--sst-qct-muted);
  --sst-qcw-paper: var(--sst-qct-paper);
  --sst-qcw-rule: var(--sst-qct-rule);
  --sst-qcw-accent: var(--sst-qct-accent);
  --sst-qcw-accent-hover: var(--sst-qct-accent-hover);
  --sst-qcw-label: var(--sst-qct-button-label);
  --sst-qcw-focus: var(--sst-qct-focus);
  --sst-qcw-action-text: var(--sst-qct-accent);
  --sst-qcw-soft: #f7f7f7;
  --sst-qcw-success: #246142;
  --sst-qcw-error: #972740;
  --sst-qcw-clear: transparent;
  --sst-qcw-pink-paper: #fff4f9;
  --sst-qcw-pink-line: #e7bad0;
  --sst-qcw-pink-mark: #9e2c5f;
  --sst-qcw-copper-paper: #fff1e7;
  --sst-qcw-copper-line: #d7a079;
  --sst-qcw-copper-mark: #955022;
  --sst-qcw-silver-paper: #f2f5f9;
  --sst-qcw-silver-line: #afbccc;
  --sst-qcw-silver-mark: #52657a;
  --sst-qcw-gold-paper: #fff8e6;
  --sst-qcw-gold-line: #d6b458;
  --sst-qcw-gold-mark: #805a00;
  --sst-qcw-platinum-paper: #f3f5ff;
  --sst-qcw-platinum-line: #aebcdf;
  --sst-qcw-platinum-mark: #52658f;
  --sst-qcw-emerald-paper: #eff9f2;
  --sst-qcw-emerald-line: #86b99b;
  --sst-qcw-emerald-mark: #176542;
  --sst-qcw-diamond-paper: #f3f9f7;
  --sst-qcw-diamond-line: #99c5bd;
  --sst-qcw-diamond-mark: #286b65;
  --sst-qcw-pearl: #fff;
  --sst-qcw-rose-reflection: #fbe9f1;
  --sst-qcw-sage-reflection: #e6f2e9;
  --sst-qcw-shadow: #1a1a1a0d;
  --sst-qcw-tier-paper: var(--sst-qcw-pink-paper);
  --sst-qcw-tier-line: var(--sst-qcw-pink-line);
  --sst-qcw-tier-mark: var(--sst-qcw-pink-mark);
  --sst-qcw-tier-foil: var(--sst-qcw-tier-paper);
  box-sizing: border-box;
  min-width: 0;
  margin: 0 0 16px;
  color: var(--sst-qcw-ink);
  font-family: var(--sst-qct-font);
  font-size: 14px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
html[data-sst-theme="dark"] .sst-qcw {
  --sst-qcw-action-text: var(--sst-accent-text);
  --sst-qcw-soft: var(--sst-gray);
  --sst-qcw-success: var(--sst-ok-text);
  --sst-qcw-error: var(--sst-err-text);
  --sst-qcw-pink-paper: #281a23;
  --sst-qcw-pink-line: #82415f;
  --sst-qcw-pink-mark: #e58bb5;
  --sst-qcw-copper-paper: #2b201b;
  --sst-qcw-copper-line: #9d6543;
  --sst-qcw-copper-mark: #f3bc91;
  --sst-qcw-silver-paper: #1d2229;
  --sst-qcw-silver-line: #697b90;
  --sst-qcw-silver-mark: #c6d5e8;
  --sst-qcw-gold-paper: #2a2315;
  --sst-qcw-gold-line: #9d7e35;
  --sst-qcw-gold-mark: #f0d28c;
  --sst-qcw-platinum-paper: #1e2330;
  --sst-qcw-platinum-line: #7b8cae;
  --sst-qcw-platinum-mark: #cddcfc;
  --sst-qcw-emerald-paper: #16271e;
  --sst-qcw-emerald-line: #418668;
  --sst-qcw-emerald-mark: #a2e8bf;
  --sst-qcw-diamond-paper: #19292a;
  --sst-qcw-diamond-line: #73aca4;
  --sst-qcw-diamond-mark: #c0f1e8;
  --sst-qcw-pearl: #29343b;
  --sst-qcw-rose-reflection: #352531;
  --sst-qcw-sage-reflection: #1f3b32;
  --sst-qcw-shadow: #00000033;
}
.sst-qcw[data-qcw-tier="member"], .sst-qcw [data-qcw-tier="member"] { --sst-qcw-tier-paper: var(--sst-qcw-pink-paper); --sst-qcw-tier-line: var(--sst-qcw-pink-line); --sst-qcw-tier-mark: var(--sst-qcw-pink-mark); --sst-qcw-tier-foil: var(--sst-qcw-tier-paper); }
.sst-qcw[data-qcw-tier="regular"], .sst-qcw [data-qcw-tier="regular"] { --sst-qcw-tier-paper: var(--sst-qcw-pink-paper); --sst-qcw-tier-line: var(--sst-qcw-pink-line); --sst-qcw-tier-mark: var(--sst-qcw-pink-mark); --sst-qcw-tier-foil: linear-gradient(135deg, var(--sst-qcw-tier-paper), var(--sst-qcw-rose-reflection)); }
.sst-qcw[data-qcw-tier="copper"], .sst-qcw [data-qcw-tier="copper"] { --sst-qcw-tier-paper: var(--sst-qcw-copper-paper); --sst-qcw-tier-line: var(--sst-qcw-copper-line); --sst-qcw-tier-mark: var(--sst-qcw-copper-mark); --sst-qcw-tier-foil: linear-gradient(125deg, var(--sst-qcw-tier-paper) 20%, var(--sst-qcw-pearl) 52%, var(--sst-qcw-tier-paper) 82%); }
.sst-qcw[data-qcw-tier="silver"], .sst-qcw [data-qcw-tier="silver"] { --sst-qcw-tier-paper: var(--sst-qcw-silver-paper); --sst-qcw-tier-line: var(--sst-qcw-silver-line); --sst-qcw-tier-mark: var(--sst-qcw-silver-mark); --sst-qcw-tier-foil: linear-gradient(135deg, var(--sst-qcw-tier-paper), var(--sst-qcw-pearl) 43%, var(--sst-qcw-tier-paper) 62%); }
.sst-qcw[data-qcw-tier="gold"], .sst-qcw [data-qcw-tier="gold"] { --sst-qcw-tier-paper: var(--sst-qcw-gold-paper); --sst-qcw-tier-line: var(--sst-qcw-gold-line); --sst-qcw-tier-mark: var(--sst-qcw-gold-mark); --sst-qcw-tier-foil: linear-gradient(125deg, var(--sst-qcw-tier-paper), var(--sst-qcw-pearl) 45%, var(--sst-qcw-tier-paper) 70%); }
.sst-qcw[data-qcw-tier="platinum"], .sst-qcw [data-qcw-tier="platinum"] { --sst-qcw-tier-paper: var(--sst-qcw-platinum-paper); --sst-qcw-tier-line: var(--sst-qcw-platinum-line); --sst-qcw-tier-mark: var(--sst-qcw-platinum-mark); --sst-qcw-tier-foil: linear-gradient(125deg, var(--sst-qcw-tier-paper), var(--sst-qcw-pearl) 38%, var(--sst-qcw-rose-reflection) 52%, var(--sst-qcw-tier-paper) 77%); }
.sst-qcw[data-qcw-tier="emerald"], .sst-qcw [data-qcw-tier="emerald"] { --sst-qcw-tier-paper: var(--sst-qcw-emerald-paper); --sst-qcw-tier-line: var(--sst-qcw-emerald-line); --sst-qcw-tier-mark: var(--sst-qcw-emerald-mark); --sst-qcw-tier-foil: linear-gradient(135deg, var(--sst-qcw-tier-paper), var(--sst-qcw-sage-reflection) 40%, var(--sst-qcw-pearl) 52%, var(--sst-qcw-tier-paper) 75%); }
.sst-qcw[data-qcw-tier="diamond"], .sst-qcw [data-qcw-tier="diamond"] { --sst-qcw-tier-paper: var(--sst-qcw-diamond-paper); --sst-qcw-tier-line: var(--sst-qcw-diamond-line); --sst-qcw-tier-mark: var(--sst-qcw-diamond-mark); --sst-qcw-tier-foil: linear-gradient(125deg, var(--sst-qcw-tier-paper), var(--sst-qcw-pearl) 30%, var(--sst-qcw-rose-reflection) 50%, var(--sst-qcw-sage-reflection) 70%, var(--sst-qcw-tier-paper)); }
.sst-qcw *, .sst-qcw *::before, .sst-qcw *::after { box-sizing: border-box; }
.sst-qcw [hidden] { display: none !important; }
.sst-qcw-current-rank { margin: 0 0 8px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: var(--sst-qcw-muted); font-size: 13px; }
.sst-qcw-current-rank strong { color: var(--sst-qcw-ink); font-size: 14px; font-weight: 750; line-height: 1.4; }
.sst-qcw-rank-scope { margin: 0 0 20px; color: var(--sst-qcw-muted); font-size: 13px; line-height: 1.6; }
.sst-qcw-rank-mark { width: 26px; height: 26px; flex: 0 0 auto; color: var(--sst-qcw-tier-mark); fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.sst-qcw-folders { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 20px; border-bottom: 1px solid var(--sst-qcw-rule); }
.sst-qcw button.sst-qcw-folder {
  appearance: none; min-height: 44px; padding: 10px 12px;
  border: 0 !important; border-bottom: 2px solid var(--sst-qcw-clear) !important;
  border-radius: 0 !important; background: var(--sst-qcw-clear) !important;
  color: var(--sst-qcw-muted) !important; font-family: var(--sst-qct-font);
  font-size: 13px; font-weight: 600; line-height: 1.2; white-space: nowrap; cursor: pointer;
}
.sst-qcw button.sst-qcw-folder[aria-selected="true"] { color: var(--sst-qcw-ink) !important; border-bottom-color: var(--sst-qcw-accent) !important; }
.sst-qcw-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sst-qcw-card { min-width: 0; position: relative; overflow: clip; border: 2px solid var(--sst-qcw-tier-line); border-radius: 18px; background: var(--sst-qcw-paper); color: var(--sst-qcw-ink); display: flex; flex-direction: column; box-shadow: 0 3px 0 var(--sst-qcw-shadow); }
.sst-qcw-card:not([data-qcw-tier]) { --sst-qcw-tier-paper: var(--sst-qcw-paper); --sst-qcw-tier-line: var(--sst-qcw-rule); --sst-qcw-tier-mark: var(--sst-qcw-muted); --sst-qcw-tier-foil: var(--sst-qcw-soft); }
.sst-qcw-card-body { min-width: 0; padding: 20px; flex: 1 1 auto; }
.sst-qcw-card-head { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; }
.sst-qcw-card-title { min-width: 0; flex: 1 1 auto; margin: 0; font-size: 14px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.sst-qcw-rank-tag { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 5px; padding: 4px 8px; border: 1px solid var(--sst-qcw-tier-line); border-radius: 999px; background: var(--sst-qcw-tier-paper); color: var(--sst-qcw-tier-mark); font-size: 12px; font-weight: 750; line-height: 1.2; white-space: nowrap; }
.sst-qcw-rank-tag .sst-qcw-rank-mark { width: 16px; height: 16px; }
.sst-qcw-card-value { margin: 0 0 12px; font-size: 24px; font-weight: 650; line-height: 1.25; letter-spacing: -.02em; overflow-wrap: anywhere; }
.sst-qcw-card-terms { margin: 0; color: var(--sst-qcw-muted); font-size: 13px; white-space: pre-line; }
.sst-qcw-card-expiry { margin: 12px 0 0; color: var(--sst-qcw-muted); font-size: 11px; }
.sst-qcw-rank-label { margin: 0 0 8px; font-size: 11px; color: var(--sst-qcw-muted); }
.sst-qcw-card-foot { position: relative; border-top: 1px dashed var(--sst-qcw-tier-line); padding: 18px 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: var(--sst-qcw-tier-foil); color: var(--sst-qcw-ink); }
.sst-qcw-card-foot::before, .sst-qcw-card-foot::after { content: ""; position: absolute; top: -9px; width: 18px; height: 18px; border: 1px solid var(--sst-qcw-tier-line); border-radius: 50%; background: var(--sst-qcw-paper); pointer-events: none; }
.sst-qcw-card-foot::before { left: -10px; }
.sst-qcw-card-foot::after { right: -10px; }
.sst-qcw button.sst-qcw-button,
.sst-qcw a.sst-qcw-button {
  appearance: none; min-height: 44px; max-width: 100%; padding: 10px 16px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--sst-qcw-accent) !important; border-radius: 4px;
  background: var(--sst-qcw-accent) !important; color: var(--sst-qcw-label) !important;
  font-family: var(--sst-qct-font); font-size: 13px; font-weight: 600; line-height: 1.2;
  text-decoration: none; white-space: nowrap; cursor: pointer;
}
.sst-qcw button.sst-qcw-button--secondary { background: var(--sst-qcw-paper) !important; color: var(--sst-qcw-action-text) !important; }
.sst-qcw button.sst-qcw-button:disabled,
.sst-qcw button.sst-qcw-button[aria-disabled="true"] { opacity: .6; cursor: not-allowed; transform: none; }
.sst-qcw button.sst-qcw-button[data-state="loading"] { cursor: progress; }
.sst-qcw button.sst-qcw-button[data-state="error"] { border-color: var(--sst-qcw-error) !important; color: var(--sst-qcw-error) !important; background: var(--sst-qcw-paper) !important; }
.sst-qcw button.sst-qcw-button[data-state="success"] { border-color: var(--sst-qcw-success) !important; color: var(--sst-qcw-success) !important; background: var(--sst-qcw-paper) !important; }
.sst-qcw button.sst-qcw-button[data-state="success"]:disabled { opacity: 1; }
.sst-qcw :is(button,a):focus-visible, .sst-qcw :is(button,a).is-focus { outline: 2px solid var(--sst-qcw-focus); outline-offset: 3px; box-shadow: 0 0 0 2px var(--sst-qcw-paper); }
.sst-qcw :is(button,a):active, .sst-qcw :is(button,a).is-active { transform: translateY(1px); }
.sst-qcw-code { width: 100%; font-weight: 600; font-size: 13px; overflow-wrap: anywhere; user-select: all; }
.sst-qcw-acquired { color: var(--sst-qcw-success); font-size: 12px; }
.sst-qcw-unused { padding: 4px 9px; border-radius: 999px; background: var(--sst-qcw-accent); color: var(--sst-qcw-label); font-size: 11px; line-height: 1.2; font-weight: 750; white-space: nowrap; }
.sst-qcw-card[data-qcw-unused="1"] .sst-qcw-card-foot { border-top-color: var(--sst-qcw-accent); }
.sst-qcw-legacy { display: inline-flex; align-items: center; min-height: 44px; margin-top: 12px; color: var(--sst-qcw-action-text); font-size: 13px; text-underline-offset: 2px; }
.sst-qcw-card--acquired, .sst-qcw-card--locked { background: var(--sst-qcw-soft); color: var(--sst-qcw-ink); }
.sst-qcw-next { margin-top: 32px; }
.sst-qcw-section-title { margin: 0 0 12px; font-size: 17px; font-weight: 650; line-height: 1.3; overflow-wrap: anywhere; }
.sst-qcw-progress-text { margin: 0 0 8px; font-size: 13px; }
.sst-qcw-progress { display: block; height: 6px; margin: 0 0 8px; border-radius: 4px; overflow: clip; background: var(--sst-qcw-rule); }
.sst-qcw-progress-fill { display: block; width: 100%; height: 100%; background: var(--sst-qcw-accent); transform-origin: left center; }
.sst-qcw-window { margin: 0 0 16px; color: var(--sst-qcw-muted); font-size: 11px; }
.sst-qcw-locked-label { display: inline-flex; gap: 8px; align-items: center; color: var(--sst-qcw-muted); font-size: 13px; }
.sst-qcw-lock { width: 18px; height: 18px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.sst-qcw-empty { grid-column: 1 / -1; margin: 0; padding: 24px 0; color: var(--sst-qcw-muted); }
.sst-qcw-muted { margin: 0; color: var(--sst-qcw-muted); font-size: 13px; }
.sst-qcw-message { padding: 8px 0 20px; }
.sst-qcw-message h3 { margin: 0 0 8px; font-size: 17px; font-weight: 600; line-height: 1.3; }
.sst-qcw-message p { margin: 0 0 16px; color: var(--sst-qcw-muted); }
.sst-qcw-message--error h3 { color: var(--sst-qcw-error); }
.sst-qcw-feedback { min-height: 1.55em; margin: 12px 0 0; color: var(--sst-qcw-success); font-size: 13px; }
.sst-qcw-feedback[data-state="error"] { color: var(--sst-qcw-error); }
.sst-qcw-loading-label { margin: 0 0 16px; color: var(--sst-qcw-muted); }
.sst-qcw-skeleton { padding: 0 0 20px; }
.sst-qcw-skeleton-line { height: 14px; width: 64%; margin: 0 0 16px; border-radius: 4px; background: var(--sst-qcw-rule); }
.sst-qcw-skeleton-line:nth-child(2) { width: 40%; }
.sst-qcw-skeleton-card { height: 180px; width: 100%; border-radius: 4px; background: var(--sst-qcw-soft); }
.sst-qcw-guest { min-width: 0; }
.sst-qcw-guest-intro { margin: 0 0 16px; color: var(--sst-qcw-muted); }
.sst-qcw-guest-points { margin: 0 0 16px; padding: 20px; border: 1px solid var(--sst-qcw-tier-line); border-radius: 12px; background: var(--sst-qcw-tier-foil); }
.sst-qcw-guest-points .sst-qcw-card-title { margin: 0 0 8px; color: var(--sst-qcw-tier-mark); }
.sst-qcw-guest-points .sst-qcw-card-value { margin-bottom: 8px; }
.sst-qcw-guest-points .sst-qcw-guest-note { margin: 0; }
.sst-qcw-guest-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 0 0 24px; }
.sst-qcw-guest-actions a.sst-qcw-button { white-space: normal; text-align: center; }
.sst-qcw-guest-actions a.sst-qcw-button--secondary { background: var(--sst-qcw-paper) !important; color: var(--sst-qcw-action-text) !important; }
.sst-qcw-guest-tickets { margin-bottom: 28px; }
.sst-qcw-guest-overview { margin: 0 0 24px; }
.sst-qcw-guest-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 13px; line-height: 1.5; color: var(--sst-qcw-ink); }
.sst-qcw-guest-table th, .sst-qcw-guest-table td { padding: 14px 12px; border: 0; border-bottom: 1px solid var(--sst-qcw-rule); text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.sst-qcw-guest-table thead th { color: var(--sst-qcw-muted); font-size: 12px; font-weight: 650; }
.sst-qcw-guest-table th:first-child { width: 20%; padding-left: 0; }
.sst-qcw-guest-table th:nth-child(2) { width: 30%; }
.sst-qcw-guest-table th:nth-child(3) { width: 32%; }
.sst-qcw-guest-table th:nth-child(4) { width: 18%; padding-right: 0; }
.sst-qcw-guest-table td:last-child { padding-right: 0; }
.sst-qcw-guest-cell-label { display: none; }
.sst-qcw-guest-cell-value { white-space: pre-line; }
.sst-qcw-guest-note { margin: 12px 0 16px; font-size: 13px; line-height: 1.6; color: var(--sst-qcw-muted); white-space: pre-line; }
.sst-qcw-guest-secret { display: flex; align-items: flex-start; gap: 12px; padding: 20px; border: 1px dashed var(--sst-qcw-rule); border-radius: 12px; background: var(--sst-qcw-soft); }
.sst-qcw-guest-secret .sst-qcw-lock { color: var(--sst-qcw-muted); margin-top: 2px; }
.sst-qcw-guest-secret .sst-qcw-card-title { margin-bottom: 6px; }
@media (hover: hover) {
  .sst-qcw button.sst-qcw-folder:hover { color: var(--sst-qcw-ink) !important; }
  .sst-qcw :is(button,a).sst-qcw-button:not(:disabled):hover, .sst-qcw :is(button,a).sst-qcw-button.is-hover { background: var(--sst-qcw-accent-hover) !important; color: var(--sst-qcw-label) !important; }
  .sst-qcw button.sst-qcw-button--secondary:not(:disabled):hover, .sst-qcw button.sst-qcw-button--secondary.is-hover { background: var(--sst-qcw-soft) !important; color: var(--sst-qcw-action-text) !important; }
  .sst-qcw-guest-actions a.sst-qcw-button--secondary:hover { background: var(--sst-qcw-soft) !important; color: var(--sst-qcw-action-text) !important; }
}
@media (max-width: 760px) {
  .sst-qcw-list { grid-template-columns: minmax(0, 1fr); }
  .sst-qcw-card-body { padding: 16px; }
  .sst-qcw-card-foot { padding: 12px 16px; }
  .sst-qcw-card-value { font-size: 22px; }
  .sst-qcw button.sst-qcw-folder { padding: 10px 8px; }
}
@media (max-width: 600px) {
  .sst-qcw-guest-points, .sst-qcw-guest-secret { padding: 16px; }
  .sst-qcw-guest-actions a.sst-qcw-button { flex: 1 1 120px; }
  .sst-qcw-guest-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
  .sst-qcw-guest-table tbody { display: block; }
  .sst-qcw-guest-table tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 16px; padding: 16px 0; border-bottom: 1px solid var(--sst-qcw-rule); }
  .sst-qcw-guest-table th, .sst-qcw-guest-table td { display: block; width: auto !important; padding: 0; border: 0; }
  .sst-qcw-guest-table tbody th { grid-column: 1 / -1; }
  .sst-qcw-guest-table td:last-child { grid-column: 1 / -1; }
  .sst-qcw-guest-cell-label { display: block; margin-bottom: 4px; color: var(--sst-qcw-muted); font-size: 11px; font-weight: 650; }
}
.sst-qct-tab .sst-qcw-notification { --sst-qcw-notice-fill: var(--sst-qct-accent); --sst-qcw-notice-label: var(--sst-qct-button-label); display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; padding: 4px 7px; border-radius: 999px; background: var(--sst-qcw-notice-fill); color: var(--sst-qcw-notice-label); font-size: 10px; line-height: 1.2; font-weight: 750; white-space: nowrap; }
.sst-qct-tab .sst-qcw-notification-number { font-size: 11px; font-weight: 850; }
.sst-qct-tab .sst-qcw-notification[hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) { .sst-qcw :is(button,a):active, .sst-qcw :is(button,a).is-active { transform: none; } }

/* Approved B comparison: public guest island only. Native QO owns its shell,
 * theme and navigation; private wallet styles above remain unchanged. */
.sst-qcw-b {
  --sst-qcw-b-surface: var(--sst-qcw-soft);
  --sst-qcw-b-selected: var(--sst-qcw-soft);
  container: sst-qcw-b / inline-size;
  min-width: 0;
  font-size: 15px;
  line-height: 1.65;
}
.sst-qcw-b-intro { padding: 8px 0 24px; }
.sst-qcw-b-title { margin: 0; color: var(--sst-qcw-ink); font-size: clamp(26px, 4cqw, 42px); line-height: 1.24; letter-spacing: -.035em; font-weight: 750; white-space: pre-line; }
.sst-qcw-b-copy { margin: 8px 0 0; color: var(--sst-qcw-muted); max-width: 65ch; font-size: 13px; line-height: 1.65; }
.sst-qcw-b-welcome { display: grid; gap: 24px; padding: 24px 16px; border-block: 1px solid var(--sst-qcw-rule); background: var(--sst-qcw-b-surface); color: var(--sst-qcw-ink); }
.sst-qcw-b-facts { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; }
.sst-qcw-b-fact { min-width: 0; }
.sst-qcw-b-fact + .sst-qcw-b-fact { padding-left: 16px; border-left: 1px solid var(--sst-qcw-rule); }
.sst-qcw-b-fact-label { display: block; font-size: 12px; font-weight: 600; color: var(--sst-qcw-muted); }
.sst-qcw-b-fact-value { display: block; margin-top: 8px; font-size: clamp(26px, 5cqw, 54px); font-weight: 750; line-height: 1.2; letter-spacing: -.055em; overflow-wrap: normal; font-variant-numeric: tabular-nums; }
.sst-qcw-b-welcome-copy { margin: 16px 0 0; color: var(--sst-qcw-muted); font-size: 13px; line-height: 1.7; white-space: pre-line; }
.sst-qcw-b-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 24px 0; }
.sst-qcw-b a.sst-qcw-button { min-height: 44px; max-width: 100%; padding: 11px 20px; border-radius: 0; font-size: 14px; font-weight: 650; line-height: 1.4; white-space: normal; text-align: center; }
.sst-qcw-b a.sst-qcw-button--secondary { background: var(--sst-qcw-paper) !important; color: var(--sst-qcw-action-text) !important; }
.sst-qcw-b-welcome-actions { flex-direction: column; align-items: stretch; justify-content: center; gap: 8px; margin: 0; }
.sst-qcw-b-welcome-actions a.sst-qcw-button--secondary { border-color: transparent !important; background: transparent !important; color: var(--sst-qcw-ink) !important; text-decoration: underline; text-underline-offset: 3px; font-size: 13px; }
.sst-qcw-b-compare { margin-top: 40px; }
.sst-qcw-b-section-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; margin-bottom: 16px; }
.sst-qcw-b-section-title { margin: 0; color: var(--sst-qcw-ink); font-size: 24px; font-weight: 750; line-height: 1.3; letter-spacing: -.025em; }
.sst-qcw-b-section-head .sst-qcw-b-copy { margin: 0; }
.sst-qcw-b-controls { display: grid; grid-template-columns: repeat(6,minmax(max-content,1fr)); overflow-x: auto; border-bottom: 1px solid var(--sst-qcw-rule); }
.sst-qcw-b .sst-qcw-b-rank-button { appearance: none; min-height: 44px; min-width: 44px; padding: 8px 0; border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--sst-qcw-muted) !important; font-family: var(--sst-qct-font); font-size: 12px; font-weight: 400; line-height: 1.3; letter-spacing: -.025em; white-space: nowrap; cursor: pointer; }
.sst-qcw-b .sst-qcw-b-rank-button[aria-pressed="true"] { border-bottom-color: var(--sst-qcw-accent) !important; color: var(--sst-qcw-ink) !important; font-weight: 750; }
.sst-qcw-b .sst-qcw-b-rank-button:active { transform: translateY(1px); }
.sst-qcw-b-table { width: 100%; margin-top: 16px; border-collapse: collapse; table-layout: fixed; color: var(--sst-qcw-ink); }
.sst-qcw-b-table th, .sst-qcw-b-table td { padding: 18px 8px; border: 0; border-bottom: 1px solid var(--sst-qcw-rule); text-align: left; vertical-align: top; background: transparent; overflow-wrap: anywhere; font-weight: 400; }
.sst-qcw-b-table thead th { border-bottom: 2px solid var(--sst-qcw-ink); }
.sst-qcw-b-table .sst-qcw-b-table-label { width: 42%; font-size: 12px; color: var(--sst-qcw-muted); vertical-align: bottom; }
.sst-qcw-b-table .sst-qcw-b-rank-heading { font-size: 28px; font-weight: 700; line-height: 1.2; letter-spacing: -.045em; }
.sst-qcw-b-rank-heading .sst-qcw-lock { width: 16px; height: 16px; margin-right: 5px; }
.sst-qcw-b-table tbody th { color: var(--sst-qcw-muted); font-size: 13px; font-weight: 650; }
.sst-qcw-b-table-value { display: block; font-size: 22px; font-weight: 750; line-height: 1.4; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.sst-qcw-b-table-small { display: block; margin-top: 4px; color: var(--sst-qcw-muted); font-size: 13px; line-height: 1.6; }
.sst-qcw-b-table [data-active="true"] { background: var(--sst-qcw-b-selected); }
.sst-qcw-b-table [data-active="false"] { display: none; }
.sst-qcw-b-rank-notes { display: flex; flex-direction: column; gap: 8px; padding: 16px 0; color: var(--sst-qcw-muted); font-size: 13px; line-height: 1.65; }
.sst-qcw-b-rank-notes p { margin: 0; }
.sst-qcw-b-rule { display: grid; gap: 16px; margin-top: 24px; padding: 24px 0; border-block: 1px solid var(--sst-qcw-rule); }
.sst-qcw-b-rule-title { margin: 0; color: var(--sst-qcw-ink); font-size: 16px; font-weight: 750; line-height: 1.4; }
.sst-qcw-b-coupon-value { margin: 8px 0 0; font-size: clamp(20px, 2.8cqw, 26px); font-weight: 750; line-height: 1.55; letter-spacing: -.025em; overflow-wrap: anywhere; }
.sst-qcw-b-terms { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; color: var(--sst-qcw-muted); font-size: 13px; line-height: 1.65; }
.sst-qcw-b-terms li { position: relative; padding-left: 16px; }
.sst-qcw-b-terms li::before { content: "—"; position: absolute; left: 0; }
.sst-qcw-b-secret { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 24px; padding: 24px 0; border-bottom: 2px solid var(--sst-qcw-ink); }
.sst-qcw-b-secret-label { display: block; margin-bottom: 8px; color: var(--sst-qcw-muted); font-size: 11px; letter-spacing: .09em; }
.sst-qcw-b-secret-title { margin: 0; color: var(--sst-qcw-ink); font-size: clamp(22px, 3cqw, 28px); font-weight: 750; line-height: 1.4; letter-spacing: -.025em; }
.sst-qcw-b-secret-mark { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--sst-qcw-rule); color: var(--sst-qcw-ink); }
@container sst-qcw-b (min-width: 600px) {
  .sst-qcw-b-welcome { grid-template-columns: minmax(0,1fr) minmax(180px,.45fr); padding: 24px; gap: 32px; }
  .sst-qcw-b .sst-qcw-b-rank-button { font-size: 15px; }
  .sst-qcw-b-rule { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 32px; }
}
@container sst-qcw-b (min-width: 1020px) {
  .sst-qcw-b-intro { padding-block: 32px; }
  .sst-qcw-b-welcome { padding: 32px; }
  .sst-qcw-b-compare { margin-top: 64px; }
  .sst-qcw-b-controls { width: calc(100% - 148px); margin-left: 148px; }
  .sst-qcw-b-table .sst-qcw-b-table-label { width: 148px; }
  .sst-qcw-b-table [data-active="false"] { display: table-cell; }
  .sst-qcw-b-table th, .sst-qcw-b-table td { padding: 22px 12px; }
  .sst-qcw-b-table .sst-qcw-b-rank-heading { font-size: 22px; }
  .sst-qcw-b-table-value { font-size: 17px; }
  .sst-qcw-b-rule { margin-top: 40px; }
}
@container sst-qcw-b (max-width: 599px) {
  .sst-qcw-b-secret { position: relative; display: block; }
  .sst-qcw-b-secret-mark { position: absolute; right: 0; bottom: 24px; }
  .sst-qcw-b-secret .sst-qcw-b-copy { padding-right: 56px; min-height: 44px; }
  .sst-qcw-b-fact-label { font-size: 11px; }
  .sst-qcw-b-welcome-copy { font-size: 12px; }
}
@media (hover: hover) {
  .sst-qcw-b .sst-qcw-b-rank-button:hover { background: var(--sst-qcw-b-selected) !important; color: var(--sst-qcw-ink) !important; }
  .sst-qcw-b a.sst-qcw-button--secondary:hover { background: var(--sst-qcw-soft) !important; color: var(--sst-qcw-action-text) !important; }
  .sst-qcw-b-welcome-actions a.sst-qcw-button--secondary:hover { color: var(--sst-qcw-ink) !important; }
}
@media (prefers-reduced-motion: reduce) { .sst-qcw-b .sst-qcw-b-rank-button:active { transform: none; } }
