/* Warm A theme: surfaces and hierarchy only; existing layout and interactions stay intact. */
:root {
  --red: #cb7462;
  --red-dark: #a95849;
  --brown: #805f50;
  --paper: #fff9f4;
  --ink: #332c2a;
  --ink-2: #73645e;
  --ink-3: #9b8981;
  --line: #eadcd2;
  --shadow: 0 20px 54px rgba(77, 45, 32, .16);
}

html, body { background: #f3eae3; }
.screen--chat.is-active, .side-panel, .bottom-sheet, .appearance-sheet,
.pet-builder, .video-traffic-dialog { background: var(--paper); color: var(--ink); }

.live-role-trigger, .live-role-trigger.is-open {
  color: #422d28;
  border-color: rgba(255, 247, 240, .8);
  background: rgba(255, 249, 242, .92);
  box-shadow: 0 8px 24px rgba(50, 25, 16, .16);
}
.live-role-trigger__copy small[data-kind="personal"],
.live-role-trigger__copy small[data-kind="shared"] { color: #9b513f; }
.live-role-trigger__copy small[data-kind="public"] { color: #73645e; }
.glass-button, .camera-entry, .rail-icon, .rail-avatar {
  color: #513b31;
  border-color: rgba(255, 247, 240, .8);
  background: rgba(255, 249, 242, .91);
  box-shadow: 0 5px 18px rgba(53, 28, 17, .16);
}
.side-rail button { color: #fffaf5; text-shadow: 0 1px 8px rgba(30, 18, 12, .8); }
.scene-context__chip, .latest-button {
  border-color: rgba(255, 244, 235, .42);
  background: rgba(74, 51, 40, .72);
}
.chat-entry, .invite-button {
  background: var(--red);
  color: white;
  box-shadow: 0 8px 24px rgba(109, 52, 38, .25);
}
.chat-entry:hover, .invite-button:hover { background: var(--red-dark); }
.chat-entry:active, .invite-button:active { transform: translateY(1px); }
.live-role-trigger:focus-visible, .glass-button:focus-visible,
.side-rail button:focus-visible, .chat-entry:focus-visible,
.camera-entry:focus-visible { outline: 3px solid #f6be9c; outline-offset: 3px; }

.screen--chat, .chat-messages, .page-topbar, .chat-composer,
.side-panel .panel-header { border-color: var(--line); }
.screen--chat.is-active { background: #fff9f4; }
.chat-messages { background: #fff9f4; }
.chat-composer, .page-topbar { background: #fffaf6; }
.message-bubble { border-color: #ebddd3; }
.message--user .message-bubble { background: #f9e7dd; color: #382d29; }

.side-panel[data-panel="profile"] {
  --profile-line: #eadfd7;
  --profile-ink: #342e2b;
  --profile-muted: #786b65;
  --profile-accent: #ad6656;
  background: #fffaf6;
}
.profile-user, .profile-pets-empty__icon { background: #f9e6dd; color: #a75d4b; }
.profile-login-badge, .profile-sync-wechat {
  border-color: #edc4b2;
  background: #fff1e9;
}
.profile-sync-wechat__icon { background: #f8dccb; }
.profile-quota { background: #fff0e7; border-color: #efd9ca; }
.profile-gallery-empty { background: #f8f0e9; }
.profile-home button:active { transform: translateY(1px); }

.payments-sheet {
  --pay-paper: #fffaf5;
  border-color: #eadcd1;
  background: var(--pay-paper);
}
.payments-sheet h2, .pay-balance__title, .pay-product--comparison h3,
.pay-product--comparison .pay-product__benefits, .pay-benefit-line span,
.pay-balance__grid small { color: #382d29; }
.pay-title-paw, .pay-balance__title svg { fill: #cc806a; stroke: #cc806a; }
.pay-balance--compact { background: #fff0e7; }
.pay-balance__title, .pay-balance__grid>span+span { border-color: #eacdbc; }
.pay-balance__grid b { color: #a95340; }
.pay-product.pay-product--comparison,
.pay-product.pay-product--personal { background: #fffefd; border-color: #e7ddd6; }
.pay-product--comparison:not(.is-selected):hover { border-color: #c8a797; }
.pay-product--comparison.is-selected,
.pay-product--comparison.pay-product--personal.is-selected {
  border-color: var(--wechat-pay);
  box-shadow: 0 0 0 1px var(--wechat-pay) inset;
}
.pay-product--coPhotoTrial, .pay-product--coVideoPack, .pay-product--petTrial {
  --pack-surface: #fffefd;
  --pack-rule: #e7ddd6;
}
.pay-product--coPhotoTrial { --pack-accent: #8c6751; }
.pay-product--coVideoPack { --pack-accent: #ab5d51; }
.pay-product--petTrial { --pack-accent: #88733f; }
.pay-product--comparison .pay-discount, .pay-saving,
.pay-product--coPhotoTrial .pay-discount, .pay-product--coPhotoTrial .pay-saving,
.pay-product--petTrial .pay-discount, .pay-product--petTrial .pay-saving {
  background: #fce9df;
  color: #9b4a37;
}
.pay-product__badge { background: #f7ddae; color: #704327; }
.pay-catalog-seal { color: #dbb8a4; }

@media (min-width: 700px) {
  html.pc-browser, .pc-browser body { background: #f3eae3; }
  .pc-browser .app-shell { box-shadow: 0 14px 46px rgba(67, 36, 23, .13); }
  /* The portrait scene and decoded backdrop retain their existing framing. */
  html.desktop-immersive, .desktop-immersive body,
  .desktop-immersive .app-shell, .desktop-immersive #liveScreen { background: #302923; }
  .desktop-immersive .live-role-trigger {
    color: #422d28;
    border-color: rgba(255, 247, 240, .8);
    background: rgba(255, 249, 242, .92);
  }
  .desktop-immersive .share-button { background: rgba(255, 249, 242, .91); }
  .desktop-immersive .chat-entry { background: var(--red); box-shadow: 0 7px 20px rgba(109, 52, 38, .26); }
  .desktop-immersive .desktop-a-nav,
  .desktop-immersive .desktop-a-nearby {
    border-color: rgba(255, 247, 240, .25);
    background: rgba(59, 41, 32, .68);
    box-shadow: 0 18px 48px rgba(37, 22, 15, .18);
  }
  .desktop-a-nav__links button.is-active {
    background: rgba(255, 240, 228, .2);
    box-shadow: inset 3px 0 0 #efac8b;
  }
  .desktop-a-nearby__item.is-active {
    background: rgba(255, 239, 226, .17);
    border-color: rgba(245, 182, 142, .62);
    box-shadow: inset 2px 0 0 #efac8b;
  }
  .desktop-a-nearby__copy time { color: #f0c5a5; }
  .desktop-home.desktop-chat-open #chatScreen,
  .desktop-home .chat-messages { background: #fff9f4; color: #382d29; }
  .desktop-home .message-bubble { background: #f4ece5; color: #382d29; }
  .desktop-home .message--user .message-bubble { background: #f9e7dd; color: #382d29; }
  .desktop-chat-tabs [data-desktop-action=chat] { border-color: var(--red); color: #382d29; }
  .desktop-home .composer-input { background: #fffefd; border-color: #e9dcd2; }
  .desktop-home .send-button { background: var(--red); }
  .desktop-home .desktop-co-create { border-color: #b57961; color: #925947; background: #fffaf6; }
  .pc-browser .side-panel, .pc-browser .bottom-sheet,
  .pc-browser .side-panel[data-panel="profile"] { background: rgba(255, 249, 244, .96); }
}

@media (prefers-reduced-motion: reduce) {
  .chat-entry, .invite-button, .profile-home button { transition: none; }
}
