/* Account surfaces share VoidRoom's original warm charcoal and orange palette. */
.account-product {
  --orange: #ff813b;
  --muted: #bcb2a8;
  --line: #443b34;
  color: #fff5eb;
  background: radial-gradient(ellipse at 85% 0, #55351e45, transparent 38%), #1b1917;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.65;
}
.account-product a { text-underline-offset: 4px; }
.account-product .product-header {
  max-width: 1560px;
  padding: 22px 36px;
  border-color: var(--line);
}
.account-product .brand { color: #fff6ec; font-size: 1.35rem; letter-spacing: .025em; }
.account-product .brand small { display: block; color: #bcb1a6; font-size: .55rem; letter-spacing: .14em; margin-top: 5px; }
.account-product .product-header nav { display: flex; gap: 23px; align-items: center; flex-wrap: wrap; font-size: .86rem; font-weight: 650; }
.account-product .product-header nav a { color: #ded2c6; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; padding: 10px 0; }
.account-product .product-header nav a:hover { color: #ffb57d; }
.account-product .product-header .account-link { padding: 9px 15px; border: 1px solid #5f4c3e; border-radius: 9px; background: #322820; }
.account-product .eyebrow, .account-product .badge, .account-product .nav-label { color: #ffb37b; }
.account-product h1 { font-weight: 850; line-height: 1.05; }
.account-product h1 span { color: #ffaf73; }
.account-product h2, .account-product h3 { color: #fff5e9; }
.account-product .intro, .account-product .intro p:not(.eyebrow), .account-product .guide p,
.account-product .guide li span, .account-product .small, .account-product .connection-top p,
.account-product .section-heading p:not(.eyebrow), .account-product .section-note,
.account-product .steps p, .account-product .card p, .account-product .account p,
.account-product .notice p, .account-product .staff-context > p, .account-product .welcome p,
.account-product .status, .account-product .results, .account-product .resource-link {
  color: #c6b9ad;
}
.account-product .breadcrumbs { color: #b5a393; }
.account-product .breadcrumbs a { color: #ebc3a2; }
.account-product .breadcrumbs span[aria-current] { color: #f4e8da; }
.account-product .connection, .account-product .guide,
.account-product .account, .account-product .welcome, .account-product .card,
.account-product .notice, .account-product .staff-section {
  border-color: #4a3e33;
  background: #28231e;
  border-radius: 14px;
}
.account-product .connection { border-top: 3px solid #ff813b; }
.account-product .headset { color: #ffac70; }
.account-product button, .account-product .button {
  min-height: 46px;
  border-radius: 9px;
  background: #3a3027;
  border-color: #6b5442;
  color: #fff0e2;
  transition: background .16s, border-color .16s, transform .16s;
}
.account-product button:hover, .account-product .button:hover {
  background: #4c3b2d;
  border-color: #ffa266;
}
.account-product .primary { background: #ff813b; border-color: #ff813b; color: #241408; }
.account-product .primary:hover { background: #ffa05c; border-color: #ffa05c; color: #241408; }
.account-product .danger { color: #ffd9d0; background: #4a2924; border-color: #98584a; }
.account-product .danger:hover { background: #63352c; border-color: #f3a087; }
.account-product :focus-visible { outline: 3px solid #ffb579; outline-offset: 4px; }
.account-product .search-field:focus-within { outline: 2px solid #ffb579; outline-offset: 3px; }
.account-product input, .account-product select, .account-product textarea {
  background: #1d1915;
  color: #fff1e4;
  border-color: #6b5645;
}
.account-product input::placeholder, .account-product textarea::placeholder { color: #b09d8c; }
.account-product .account-symbol, .account-product .notice-symbol,
.account-product .dialog-symbol, .account-product .user-icon {
  background: #493324;
  color: #ffba86;
}
.account-product .side-link { color: #d2c1b3; }
.account-product .side-link:hover, .account-product .lookup-option { background: #332a23; }
.account-product .side-link.current { background: #ff813b16; border-color: #b76c3c66; color: #ffc394; }
.account-product .sidebar-bottom, .account-product .workspace-section, .account-product .card details,
.account-product .card .room-owner, .account-product .help-links, .account-product .account .actions,
.account-product .steps li { border-color: #4d4034; }
.account-product .account .actions button { background: #3a3027; }
.account-product .count { background: #4a382a; color: #ffd0aa; }
.account-product .search-field, .account-product .empty { background: #211c18; border-color: #5d4a3a; color: #cbb7a6; }
.account-product .empty .icon, .account-product .card-heading > .icon { color: #d69b6d; }
.account-product .text-link, .account-product .resource-link .icon { color: #ffb47e; }
.account-product .lookup-option small, .account-product .chosen-account small { color: #c5af9c; }
.account-product .chosen-account { background: #2d3828; border-color: #617250; }
.account-product .lookup-hint { color: #bba38f !important; }
.account-product .hero-emblem { background: linear-gradient(140deg, #ff813b20, #ff813b05); border-color: #ad643e70; }
.account-product .hero-emblem svg { stroke: #ffb27b; }
.account-product .hero-emblem span { color: #d3b294; }
.account-product .welcome img { filter: brightness(.88) saturate(.94); }
.account-product .welcome figcaption { background: linear-gradient(transparent, #21170fed); color: #fff1e4; }
.account-product dialog { background: #2b241e; border-color: #8d694d; color: #fff0e2; }
.account-product dialog::backdrop { background: #100c09d9; backdrop-filter: blur(5px); }
.account-product dialog #reviewText { color: #e1ccba; }
.account-product footer { color: #c0a992; border-color: #44382d; }
.account-product footer a:hover { color: #ffb47e; }
.account-product .skip { background: #3f3024; color: #fff6ec; }
.account-product .account-intro { display: flex; gap: 48px; justify-content: space-between; align-items: center; }
.account-product .account-intro > div:first-child { max-width: 730px; }
.account-product .account-intro .eyebrow { margin-top: 12px; }
.account-product .connection-emblem {
  flex: 0 0 190px; width: 190px; height: 180px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  gap: 20px; border: 1px solid #81512f; border-radius: 24px;
  background: linear-gradient(145deg, #ff813b22, #ff813b05);
}
.account-product .connection-emblem svg { width: 95px; height: 74px; color: #ffb07a; }
.account-product .connection-emblem span { font-size: .57rem; letter-spacing: .12em; color: #d7b79b; font-weight: 750; }
.account-product .meta-upgrade {
  padding: 28px; border: 1px solid #885331; background: linear-gradient(120deg, #3c291d, #29221c);
  border-radius: 16px; margin: 28px 0 36px;
}
.account-product .meta-upgrade h2 { margin: 12px 0; font-size: 1.7rem; letter-spacing: -.035em; }
.account-product .meta-upgrade p { color: #dac5b1; margin: 0; }
.account-product .account-kind-badge {
  display: inline-flex; align-items: center; gap: 7px; border: 1px solid #ae7245;
  padding: 4px 10px; background: #4e3321; color: #ffce9f;
  font-size: .72rem; font-weight: 800; border-radius: 6px; letter-spacing: .03em;
}
.account-product .account-kind-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #ff9c55; }
.account-product .upgrade-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); list-style: none; gap: 24px; padding: 0; margin: 24px 0; }
.account-product .upgrade-steps li { padding: 16px 0 0; border-top: 1px solid #7d5337; }
.account-product .upgrade-steps li > span { font-size: .72rem; color: #ffae71; font-weight: 850; margin: 0 0 8px; }
.account-product .upgrade-steps strong { font-size: .9rem; color: #fff0df; }
.account-product .upgrade-steps p { margin: 7px 0 0; font-size: .82rem; line-height: 1.7; }
.account-product .upgrade-note { padding-top: 18px; border-top: 1px solid #735039; font-size: .8rem; }
.account-product .upgrade-note strong { color: #fff1e3; }
.meta-product main { max-width: 1240px; padding-top: 30px; }
.meta-product .connection { margin-top: 0; }
.meta-product .connection .eyebrow { margin-top: 0; }
.meta-product .guide-grid { grid-template-columns: 1.15fr 1fr; }
.meta-product .guide li { padding-bottom: 20px; }
.meta-product .guide li::marker { color: #ffa268; font-weight: 800; }
.meta-product .guide li span { font-size: .9rem; }
.meta-product .guide p { font-size: .9rem; }
.meta-product .guide h3 { font-size: 1.1rem; margin-top: 26px; }
.meta-product .account-type { display: inline-block; margin-left: 10px; font-size: .7rem; }
@media (min-width: 1800px) {
  .account-product { font-size: 18px; }
  .account-product .product-header { max-width: 1760px; }
  .account-product .workspace { max-width: 1760px; grid-template-columns: 255px minmax(0, 1fr); }
  .meta-product main { max-width: 1380px; }
}
@media (max-width: 980px) {
  .account-product .product-header { flex-wrap: wrap; gap: 14px; }
  .account-product .product-header nav { flex: 1; justify-content: flex-end; gap: 18px; }
  .account-product .connection-emblem { display: none; }
}
@media (max-width: 760px) {
  .account-product .product-header { padding: 18px 20px 12px; display: block; }
  .account-product .product-header .brand { display: inline-flex; font-size: 1.2rem; }
  .account-product .product-header .brand small { display: block; }
  .account-product .product-header nav { margin-top: 14px; gap: 16px; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; padding-bottom: 3px; font-size: .78rem; }
  .account-product .product-header nav a, .account-product .product-header nav > a:not(.account-link) { display: inline-flex; white-space: nowrap; min-height: 44px; }
  .account-product .product-header .account-link { font-size: .78rem; padding: 8px 12px; gap: 7px; }
  .account-product .product-header .account-link .icon:first-child { display: none; }
  .account-product .product-header .account-link .icon:last-child { display: inline-block; }
  .account-product .meta-upgrade { padding: 22px; }
  .account-product .meta-upgrade h2 { font-size: 1.45rem; }
  .account-product .upgrade-steps { grid-template-columns: 1fr; gap: 14px; }
  .account-product .upgrade-steps li { display: flex; gap: 14px; }
  .account-product .upgrade-steps li > span { flex: 0 0 24px; padding-top: 3px; }
  .account-product .upgrade-steps p { font-size: .85rem; }
  .meta-product main { padding: 25px 20px 45px; }
  .meta-product .guide-grid { grid-template-columns: 1fr; }
  .account-product .sidebar .side-link { background: #2b231c; border-color: #66503b; }
}
@media (max-width: 580px) {
  .account-product .product-header nav { gap: 8px; justify-content: space-between; overflow: visible; }
  .account-product .product-header nav a, .account-product .product-header .account-link { font-size: 11px; }
  .account-product .product-header .account-link { padding: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .account-product *, .account-product *::before, .account-product *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
