/* Standalone Friends, Accessibility and Feedback match the account page.
   Embedded Friends retains its existing in-game popup styling. */
body.wd-support-page {
  --panel:#251d30;--panel-soft:#342741;--line:#4b385c;
  --muted:#c9b9d2;--accent:#f3a64a;--accent-text:#281b25;
  --friends-panel:var(--panel);--friends-line:var(--line);
  --friends-muted:var(--muted);--friends-accent:var(--accent);
  --f-line:var(--line);--f-muted:var(--muted);--f-accent:var(--accent);
  background:linear-gradient(180deg,#130f19,#21172b);
  color:#fffaf5;
  font:16px/1.45 Inter,system-ui,sans-serif;
}
.wd-support-page :is(.friends-shell,.a11y-shell,.feedback-shell) {
  width:min(100%,760px);
  padding-top:max(20px,env(safe-area-inset-top));
}
.wd-support-page .wd-page-nav {display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wd-support-page .wd-page-nav a {
  display:flex;align-items:center;justify-content:center;min-width:0;
  min-height:64px;padding:10px 12px;background:var(--panel);
  border:1px solid #79d4c8;border-radius:12px;
}
.wd-support-page .wd-page-nav a:hover {background:var(--panel-soft)}
.wd-support-page .wd-page-nav img {display:block;width:100%;max-width:260px;height:auto;object-fit:contain}
.wd-support-page .wd-account-back {
  display:inline-flex;align-items:center;min-height:44px;
  margin:12px 0 16px;padding:8px 14px;
  border:1px solid var(--accent);border-radius:12px;
  color:var(--accent);text-decoration:none;font-weight:800;
}
.wd-support-page :is(.friends-hero,.a11y-hero,.feedback-hero,.friends-panel,.a11y-panel,.feedback-panel) {
  padding:24px;border:2px solid transparent;border-radius:16px;
  background:linear-gradient(var(--panel),var(--panel)) padding-box,linear-gradient(110deg,#79d4c8,#9560c4,#f3a64a) border-box;
  box-shadow:0 20px 60px #0006;
}
.wd-support-page :is(.friends-hero,.a11y-hero,.feedback-hero) {text-align:center;margin-bottom:20px}
.wd-support-page :is(.friends-hero,.a11y-hero,.feedback-hero) h1 {
  font-size:clamp(24px,6vw,34px);line-height:1.15;letter-spacing:-.025em;
}
.wd-support-page :is(.friends-hero,.a11y-hero,.feedback-hero)>p:last-child {margin:12px auto 0;color:var(--muted);font-size:1rem}
.wd-support-page .eyebrow {color:var(--accent)}
.wd-support-page :is(.friends-panel,.a11y-panel,.feedback-panel) h2,
.wd-support-page .theme-options legend {font-size:22px;line-height:1.25;letter-spacing:-.025em}
.wd-support-page :is(.section-kicker,.theme-option small,.motion-option small,.privacy-panel p:last-child,.history-message) {color:var(--muted)}
.wd-support-page :is(.theme-option,.motion-option,.contact-choice,.searchable-setting) {background:var(--panel-soft);border-color:var(--line)}
.wd-support-page :is(.theme-option,.motion-option,.contact-choice,.searchable-setting) input {accent-color:var(--accent)}
.wd-support-page :is(.friend-search-form input,.feedback-form input,.feedback-form select,.feedback-form textarea) {
  background:var(--panel-soft);border-color:var(--line);color:inherit;
}
.wd-support-page :is(.friend-search-form input,.feedback-form input,.feedback-form select,.feedback-form textarea):focus {
  border-color:var(--accent);box-shadow:0 0 0 3px #f3a64a33;
}
.wd-support-page :is(.primary-button,.primary-link,.person-action.primary) {background:var(--accent);color:var(--accent-text)}
.wd-support-page :is(.secondary-button,.small-button,.person-action) {background:var(--panel-soft);border-color:var(--line);color:inherit}
.wd-support-page .person-action.primary {background:var(--accent);color:var(--accent-text)}
.wd-support-page .person-action.danger {color:var(--wd-danger,#ffd3d3)}
.wd-support-page :is(button,a,input,select,textarea):focus-visible {outline:3px solid var(--accent);outline-offset:3px}
html[data-wd-theme="light"] body.wd-support-page {
  --panel:#fffaf2;--panel-soft:#f1e4d4;--line:#cbb6ce;--muted:#625068;--accent:#ad5b00;--accent-text:#fff;
}
html[data-wd-theme="high_contrast"] body.wd-support-page {
  --panel:#000;--panel-soft:#000;--line:#fff;--muted:#fff;--accent:#ffff00;--accent-text:#000;
}
html[data-wd-theme="light"] .wd-support-page .wd-page-nav a,
html[data-wd-theme="high_contrast"] .wd-support-page .wd-page-nav a {border-color:var(--line)}
@media(max-width:480px) {
  .wd-support-page :is(.friends-shell,.a11y-shell,.feedback-shell) {padding-inline:12px}
  .wd-support-page .wd-page-nav {gap:8px}
  .wd-support-page .wd-page-nav a {padding:8px;min-height:56px}
  .wd-support-page :is(.friends-hero,.a11y-hero,.feedback-hero,.friends-panel,.a11y-panel,.feedback-panel) {padding:20px 16px}
  .wd-support-page .message-meta {flex-wrap:wrap}
}