/* Desktop presentation layer; the existing mobile app keeps its own layout. */
@font-face { font-family: RajdhaniPreview; src: url('/assets/fonts/rajdhani-600.ttf') format('truetype'); font-display: swap; }
@font-face { font-family: TekoPreview; src: url('/assets/fonts/teko-700.ttf') format('truetype'); font-display: swap; }
@media (min-width: 1200px) {
  html.desktop-platform body:has(.app.auth) { background: #080b13; }
  html.desktop-platform body .app.auth {
    display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(440px, .85fr); align-items: center;
    width: 100%; max-width: none; min-height: 100dvh; padding: 0; gap: 0;
    background: #0c0e19; border: 0; font-family: RajdhaniPreview, Inter, sans-serif;
  }
  html.desktop-platform body .app.auth > .auth-brand {
    display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
    width: 100%; max-width: none; height: 100%; margin: 0; padding: clamp(45px, 8vw, 140px);
    text-align: left; background: linear-gradient(90deg, #0b0c16c2, #0b0c1666), url('/assets/desktop-login-lounge.png') center / cover;
  }
  html.desktop-platform body .app.auth .auth-app-logo { width: clamp(110px, 11vw, 190px); height: auto; }
  html.desktop-platform body .app.auth .auth-wordmark { width: min(480px, 100%); }
  html.desktop-platform body .app.auth .auth-brand p { max-width: 480px; color: #e3e6f4; font-size: clamp(20px, 2vw, 28px); line-height: 1.2; }
  html.desktop-platform body .app.auth > .panel {
    width: min(560px, calc(100% - 70px)); max-width: none; max-height: calc(100dvh - 45px);
    margin: auto; padding: clamp(28px, 3vw, 48px); overflow-y: auto;
    border: 1px solid #464363; border-radius: 17px; background: #151927f2;
    box-shadow: 0 28px 75px #0008, 0 0 32px #c3306530;
  }
  html.desktop-platform body .app.auth .tab { min-height: 53px; font: 800 20px RajdhaniPreview, sans-serif; }
  html.desktop-platform body .app.auth .field label { font-size: 15px; }
  html.desktop-platform body .app.auth .field input { min-height: 53px; font-size: 18px; }
  html.desktop-platform body .app.auth .auth-submit { min-height: 54px; font: 800 20px RajdhaniPreview, sans-serif; }
  html.desktop-platform body .app.auth .auth-provider-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  html.desktop-platform body .app.auth .auth-provider-options .apple-auth-button { grid-column: 1 / -1; }
  html.desktop-platform body .app.auth .auth-provider-options > .apple-auth-button,
  html.desktop-platform body .app.auth .auth-provider-options > .blaze-auth-button { width: 100% !important; max-width: none; margin: 0 !important; }
  html.desktop-platform body .app.auth .auth-provider-options > .blaze-auth-button { min-height: 55px; font-size: 16px; }
  html.desktop-platform body .app.auth .auth-legal { font-size: 14px; line-height: 1.5; }
  body:has(.desktop-preview) { background: #080a12; overflow: hidden; }
  body .app.shell.desktop-preview {
    display: grid; grid-template-columns: 250px minmax(0, 1fr); grid-template-rows: 70px minmax(0, 1fr);
    grid-template-areas: "sidebar utility" "sidebar content";
    width: 100%; max-width: none; height: 100dvh; min-height: 0; margin: 0; border: 0;
    background: #080a12; color: #f7f8ff; font-family: RajdhaniPreview, Inter, sans-serif;
  }
  .desktop-preview button, .desktop-preview a { transition: border-color .16s, color .16s, background-color .16s, transform .16s; }
  .desktop-preview button:focus-visible, .desktop-preview a:focus-visible, .desktop-preview select:focus-visible, .desktop-preview #view:focus-visible {
    outline: 3px solid #8e79ff; outline-offset: 3px;
  }
  .desktop-preview .dp-skip { position: absolute; z-index: 50; top: -80px; left: 270px; padding: 10px 18px; background: #fff; color: #060713; }
  .desktop-preview .dp-skip:focus { top: 12px; }
  .desktop-preview .dp-sidebar {
    grid-area: sidebar; z-index: 6; min-width: 0; display: flex; flex-direction: column;
    padding: 25px 15px 15px; background: #0d0f19; border-right: 1px solid #25283a; overflow-y: auto;
  }
  .desktop-preview .dp-brand { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 11px; min-height: 52px; height: 52px; padding: 0 6px; margin-bottom: 42px; border: 0; background: transparent; text-decoration: none; }
  .desktop-preview .dp-brand img:first-child { width: 38px; height: 38px; object-fit: contain; }
  .desktop-preview .dp-brand img:last-child { width: 153px; height: auto; object-fit: contain; }
  .desktop-preview .dp-nav-label { padding: 0 15px; margin-bottom: 11px; color: #7d849e; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
  .desktop-preview .dp-nav-divider { margin-top: 28px; }
  .desktop-preview .dp-sidebar nav { display: grid; gap: 4px; }
  .desktop-preview .dp-sidebar .dp-nav-secondary { gap: 1px; }
  .desktop-preview .dp-sidebar .dp-nav-secondary .dp-link { height: 37px; font-size: 15px; }
  .desktop-preview .dp-sidebar .dp-nav-secondary .dp-link svg { width: 17px; height: 17px; flex-basis: 17px; }
  .desktop-preview .dp-link {
    position: relative; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 14px; width: 100%; height: 48px; padding: 0 16px;
    color: #a8afc4; border: 1px solid transparent; border-radius: 9px; background: transparent;
    text-decoration: none; text-align: left; font: 700 17px RajdhaniPreview, sans-serif; line-height: 1; letter-spacing: .01em;
  }
  .desktop-preview .dp-link svg { flex: 0 0 20px; width: 20px; height: 20px; }
  .desktop-preview .dp-link:hover, .desktop-preview .dp-link:focus-visible { color: #fff; background: #1b2030; }
  .desktop-preview .dp-link.active { color: #fff; border-color: #6f294d; background: linear-gradient(90deg, #48213b, #22182e 85%); }
  .desktop-preview .dp-link.active::before { content: ''; position: absolute; top: 9px; bottom: 9px; left: -1px; width: 3px; background: #ff3967; border-radius: 4px; }
  .desktop-preview .dp-sidebar-bottom { margin-top: auto; }
  .desktop-preview .dp-preview-label { padding: 0 10px; color: #ae738f; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
  .desktop-preview .dp-return { display: block; padding: 7px 10px 17px; color: #b2bfd6; font-size: 13px; text-decoration: none; }
  .desktop-preview .dp-return:hover { color: #fff; }
  .desktop-preview .dp-user { display: flex; align-items: center; gap: 10px; padding: 14px 7px 3px; border-top: 1px solid #2a2d3b; }
  .desktop-preview .dp-user img { width: 39px; height: 39px; border: 1px solid #e54370; border-radius: 7px; object-fit: cover; }
  .desktop-preview .dp-user b { display: block; font-size: 16px; }
  .desktop-preview .dp-user small { display: block; color: #9fa8c3; font-size: 12px; }
  .desktop-preview .dp-utility {
    grid-area: utility; z-index: 5; display: grid; grid-template-columns: minmax(135px, 1fr) minmax(220px, 450px) auto; align-items: center; gap: 20px; min-width: 0;
    padding: 0 38px; background: #0b0e18; border-bottom: 1px solid #25283a;
  }
  .desktop-preview .dp-utility-context { color: #8d95b1; font-size: 12px; letter-spacing: .14em; font-weight: 800; }
  .desktop-preview .dp-utility-search { display: flex; align-items: center; gap: 9px; height: 39px; min-width: 0; padding: 0 12px; border: 1px solid #343b50; border-radius: 8px; background: #151b29; color: #adb9d4; }
  .desktop-preview .dp-utility-search:focus-within { border-color: #a659bd; box-shadow: 0 0 0 2px #923b912f; }
  .desktop-preview .dp-utility-search > span { font-size: 24px; line-height: 1; }
  .desktop-preview .dp-utility-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; color: #f7f8ff; font: 600 15px RajdhaniPreview, sans-serif; }
  .desktop-preview .dp-utility-search input::placeholder { color: #a6afc3; }
  .desktop-preview .dp-utility-search kbd { flex: 0 0 auto; padding: 2px 5px; border: 1px solid #42485a; border-radius: 4px; color: #a8b3c9; font: 700 11px RajdhaniPreview, sans-serif; }
  .desktop-preview .dp-utility-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
  .desktop-preview .dp-presence { display: flex; align-items: center; gap: 8px; padding: 0 9px; border-right: 1px solid #2b2f40; }
  .desktop-preview .dp-presence i, .desktop-preview .dp-presence-dot { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #27ecaa; box-shadow: 0 0 8px #27ecaa80; }
  .desktop-preview .dp-presence select { width: 154px; color: #e8eaf4; background: #0b0e18; border: 0; font-size: 15px; cursor: pointer; }
  .desktop-preview .dp-presence-dot.offline { background: #74788c; box-shadow: none; }
  .desktop-preview .dp-presence-dot.away { background: #ffc769; box-shadow: none; }
  .desktop-preview .dp-icon, .desktop-preview .dp-utility-avatar {
    position: relative; display: grid; place-items: center; width: 38px; height: 38px;
    background: #151a27; border: 1px solid #30354a; border-radius: 9px; color: #d5dcf3;
  }
  .desktop-preview .dp-icon:hover, .desktop-preview .dp-utility-avatar:hover { border-color: #ed4977; color: #fff; }
  .desktop-preview .dp-icon svg { width: 19px; height: 19px; }
  .desktop-preview .dp-utility-avatar { overflow: hidden; padding: 0; border-radius: 50%; }
  .desktop-preview .dp-utility-avatar img { width: 100%; height: 100%; object-fit: cover; }
  body .desktop-preview #view {
    grid-area: content; min-width: 0; min-height: 0; height: 100%; overflow-x: hidden; overflow-y: auto;
    padding: 34px clamp(24px, 3.4vw, 62px) 70px; background:
      radial-gradient(circle at 70% -10%, #25123548, transparent 38%),
      radial-gradient(circle at 5% 80%, #12254345, transparent 36%), #090b15;
  }
  .desktop-preview #view > * { max-width: 1680px; margin-inline: auto; }
  .desktop-preview #view h1, .desktop-preview #view h2, .desktop-preview #view h3, .desktop-preview #view p { margin-top: 0; }
  .desktop-preview #view h1, .desktop-preview #view h2, .desktop-preview #view h3 { font-family: RajdhaniPreview, sans-serif; }
  .desktop-preview #view .dp-eyebrow { display: inline-block; color: #ff5478; font-size: 12px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
  .desktop-preview #view .dp-heading { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin: 0 auto 23px; }
  .desktop-preview #view .dp-heading h1 { margin: 2px 0 0; font-size: clamp(30px, 3vw, 45px); line-height: 1.03; font-weight: 800; letter-spacing: -.03em; }
  .desktop-preview #view .dp-region { color: #b1b9ce; font-size: 14px; letter-spacing: .08em; white-space: nowrap; }
  .desktop-preview #view .dp-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 13px; }
  .desktop-preview #view .dp-section-head h2 { margin: 0; font-size: 23px; line-height: 1; font-weight: 800; }
  .desktop-preview #view .dp-section-head .dp-button { min-height: 33px; background: transparent; border-color: transparent; color: #c9d2ea; }
  .desktop-preview #view .dp-button { display: inline-flex; align-items: center; justify-content: center; gap: 17px; min-height: 42px; padding: 9px 16px; border: 1px solid #485168; border-radius: 8px; background: #181f30; color: #fff; text-decoration: none; font: 800 15px RajdhaniPreview, sans-serif; letter-spacing: .035em; }
  .desktop-preview #view .dp-button:hover:not(:disabled), .desktop-preview #view .dp-text-button:hover { border-color: #ff4c78; background: #302238; transform: translateY(-2px); }
  .desktop-preview #view .dp-button.dp-primary { border-color: #ff3b70; background: linear-gradient(125deg, #ee345f, #a336c2); box-shadow: 0 8px 24px #ee345f2e; }
  .desktop-preview #view .dp-button.dp-primary:hover:not(:disabled) { background: linear-gradient(125deg, #ff436b, #bb48d3); }
  .desktop-preview #view .dp-button:disabled { opacity: .45; cursor: not-allowed; }
  .desktop-preview #view .dp-button svg { width: 19px; height: 19px; }
  .desktop-preview #view .dp-count { color: #e6e8ff; font-size: 12px; padding: 2px 7px; border: 1px solid #55546e; border-radius: 5px; }
  .desktop-preview #view .dp-count-looking { color: #ffd7e3; background: #ed3d7029; border-color: #e74678; }
  .desktop-preview #view .dp-count-online { color: #bdfbe3; background: #1fbb8030; border-color: #32c790; }
  .desktop-preview #view .dp-empty { color: #a8b2c9; line-height: 1.4; font-size: 15px; }
  .desktop-preview #view .dp-loading { display: flex; align-items: center; gap: 12px; height: 50%; color: #b2bad0; }
  .desktop-preview #view .dp-loading span { display: block; width: 18px; height: 18px; border: 2px solid #d34a80; border-top-color: transparent; border-radius: 50%; animation: dp-spin .8s linear infinite; }
  @keyframes dp-spin { to { transform: rotate(360deg); } }
  .desktop-preview #view .dp-home-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 295px); gap: 27px; align-items: start; }
  .desktop-preview #view .dp-home-main { display: grid; gap: 24px; min-width: 0; }
  .desktop-preview #view .dp-home-main > section { min-width: 0; }
  .desktop-preview #view .dp-home-main > .dp-heading { width: 100%; margin-bottom: -5px; }
  .desktop-preview #view .dp-home-feature-row { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .95fr); gap: 20px; align-items: stretch; }
  .desktop-preview #view .dp-home-feature-row > section { display: flex; flex-direction: column; min-width: 0; }
  .desktop-preview #view .dp-home-feature-row .dp-section-head { flex-wrap: wrap; }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active { flex: 1; min-height: 280px; }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active > img { flex: 0 0 32%; width: 32%; min-height: 0; object-fit: cover; }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active .dp-squad-copy { padding: 17px; }
  .desktop-preview #view .dp-featured-section .home-promotions { flex: 1; grid-template-columns: 1fr; grid-auto-rows: minmax(280px, 1fr); }
  .desktop-preview #view .dp-featured-section .home-promotion-card { min-height: 280px; }
  .desktop-preview #view .dp-featured-section .home-promotion-open { min-height: 280px; height: 100%; grid-template-columns: minmax(100px, 39%) minmax(0, 1fr); }
  .desktop-preview #view .dp-featured-section .home-promotion-open > img,
  .desktop-preview #view .dp-featured-section .home-promotion-open > video { min-height: 260px; }
  .desktop-preview #view .dp-featured-section .home-promotion-copy { min-width: 0; padding: 18px 15px; }
  .desktop-preview #view .dp-featured-section .home-promotion-copy b { font-size: 23px; line-height: 1.1; overflow-wrap: anywhere; }
  .desktop-preview #view .dp-featured-section .home-promotion-copy em { font-size: 15px; }
  .desktop-preview #view .dp-featured-section .dp-banner { flex-wrap: wrap; margin-top: 12px; }
  .desktop-preview #view .dp-hero { position: relative; isolation: isolate; min-height: 338px; overflow: hidden; border: 1px solid #803452; border-radius: 12px; background: #0d1221; }
  .desktop-preview #view .dp-hero-art { position: absolute; right: 0; top: 0; height: 100%; width: 61%; object-fit: cover; object-position: 50% 22%; filter: saturate(1.18) contrast(1.04); }
  .desktop-preview #view .dp-hero-shade { position: absolute; inset: 0; background: linear-gradient(93deg, #09101e 0%, #09101ef2 35%, #15102685 67%, #19091944), linear-gradient(0deg, #090b16e0, transparent 36%); }
  .desktop-preview #view .dp-hero-content { position: relative; z-index: 2; width: min(62%, 575px); padding: 34px 38px; }
  .desktop-preview #view .dp-hero h2 { margin: 12px 0 4px; font: 700 clamp(56px, 5.1vw, 87px)/.78 TekoPreview, sans-serif; letter-spacing: .025em; }
  .desktop-preview #view .dp-hero h2 em { color: #ff4475; font-style: normal; }
  .desktop-preview #view .dp-hero p { color: #ced5e8; font-size: 17px; line-height: 1.18; }
  .desktop-preview #view .dp-hero .dp-button { margin-top: 13px; padding-inline: 24px; }
  .desktop-preview #view .dp-hero-games { display: flex; gap: 8px; margin-top: 21px; }
  .desktop-preview #view .dp-hero-games span { display: flex; align-items: center; gap: 6px; max-width: 170px; padding: 4px 9px 4px 4px; background: #131a2ec9; border: 1px solid #455370; border-radius: 6px; color: #dce1ee; font-size: 12px; white-space: nowrap; overflow: hidden; }
  .desktop-preview #view .dp-hero-games img { width: 23px; height: 23px; object-fit: cover; border-radius: 3px; }
  .desktop-preview #view .dp-hero-index { position: absolute; right: 18px; bottom: 13px; z-index: 2; color: #b2b8d2a6; font-size: 10px; letter-spacing: .15em; }
  .desktop-preview #view .dp-squad { display: flex; min-width: 0; overflow: hidden; background: #141827; border: 1px solid #30374c; border-radius: 10px; }
  .desktop-preview #view .dp-squad > img { flex: 0 0 28%; width: 28%; min-height: 165px; object-fit: cover; }
  .desktop-preview #view .dp-squad-copy { min-width: 0; width: 100%; padding: 19px 20px; }
  .desktop-preview #view .dp-squad-copy > small { color: #f1799c; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
  .desktop-preview #view .dp-squad h3 { font-size: 24px; margin: 1px 0 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .desktop-preview #view .dp-squad p { margin: 2px 0 12px; color: #b4bdd0; line-height: 1.15; font-size: 15px; }
  .desktop-preview #view .dp-squad-meta { display: flex; flex-wrap: wrap; gap: 10px; color: #aeb8cb; font-size: 13px; }
  .desktop-preview #view .dp-squad footer { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin-top: 14px; }
  .desktop-preview #view .dp-status { color: #73e8ae; font-size: 12px; font-weight: 800; text-transform: uppercase; }
  .desktop-preview #view .dp-text-button { border: 0; background: none; color: #e3c5e2; font-weight: 800; font-size: 14px; }
  .desktop-preview #view .dp-squad-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
  .desktop-preview #view .dp-squad-grid .dp-squad { display: block; }
  .desktop-preview #view .dp-squad-grid .dp-squad > img { width: 100%; height: 113px; min-height: 0; }
  .desktop-preview #view .dp-squad-grid .dp-squad-copy { padding: 13px; }
  .desktop-preview #view .dp-squad-grid .dp-squad h3 { font-size: 20px; }
  .desktop-preview #view .dp-squad-grid .dp-squad p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 32px; }
  .desktop-preview #view .dp-squad-grid .dp-squad footer { margin-top: 8px; }
  .desktop-preview #view .dp-empty-action, .desktop-preview #view .dp-banner { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 90px; padding: 21px; border: 1px solid #33384d; border-radius: 9px; background: #141827; }
  .desktop-preview #view .dp-empty-action h3 { margin: 0; font-size: 23px; }
  .desktop-preview #view .dp-empty-action p, .desktop-preview #view .dp-banner p { margin: 2px 0 0; color: #b8c0d3; }
  .desktop-preview #view .home-promotions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
  .desktop-preview #view .home-promotion-card { min-width: 0; }
  .desktop-preview #view .home-promotion-card .home-promotion-open { min-height: 230px; }
  .desktop-preview #view #dpSocialRail { position: sticky; top: 16px; display: grid; align-content: start; gap: 16px; max-height: calc(100dvh - 32px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #47516c transparent; }
  .desktop-preview #view .dp-social { display: grid; gap: 25px; padding: 23px 19px; background: #101421; border: 1px solid #252c42; border-radius: 11px; }
  .desktop-preview #view .dp-social-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 16px; border-bottom: 1px solid #2c3244; }
  .desktop-preview #view .dp-social-title h2 { margin: 0; font: 700 33px/1 TekoPreview, sans-serif; letter-spacing: .05em; white-space: nowrap; }
  .desktop-preview #view .dp-social-title span { color: #aeb6c8; font-size: 13px; }
  .desktop-preview #view .dp-social-refresh { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; padding: 0; color: #cbd4e7; border: 1px solid #485168; border-radius: 6px; background: #1a2030; font: 700 20px RajdhaniPreview, sans-serif; cursor: pointer; }
  .desktop-preview #view .dp-social-refresh span { display: none; }
  .desktop-preview #view .dp-social-refresh:hover:not(:disabled), .desktop-preview #view .dp-social-refresh:focus-visible { color: #fff; border-color: #f45481; background: #302238; }
  .desktop-preview #view .dp-social-refresh:disabled { opacity: .5; cursor: wait; }
  .desktop-preview #view .dp-social section { display: grid; gap: 9px; }
  .desktop-preview #view .dp-social .dp-section-head h2 { font-size: 18px; }
  .desktop-preview #view .dp-social-section-looking .dp-section-head h2 { color: #ffd3df; }
  .desktop-preview #view .dp-social-section-online .dp-section-head h2 { color: #c9f9e6; }
  .desktop-preview #view .dp-person { display: flex; width: 100%; align-items: center; gap: 9px; padding: 8px; text-align: left; color: #f7f8ff; border: 1px solid transparent; border-radius: 7px; background: #1b2030; }
  .desktop-preview #view .dp-person:hover { border-color: #6a5276; background: #252037; }
  .desktop-preview #view .dp-person-looking_now { border-color: #e7467870; background: linear-gradient(100deg, #3b1d31, #1b2030 75%); }
  .desktop-preview #view .dp-person-online { border-color: #32c79052; background: linear-gradient(100deg, #17372f, #1b2030 75%); }
  .desktop-preview #view .dp-person img { flex: 0 0 35px; width: 35px; height: 35px; object-fit: cover; border-radius: 6px; }
  .desktop-preview #view .dp-person-copy { flex: 1; min-width: 0; overflow: hidden; }
  .desktop-preview #view .dp-person-meta { display: flex; align-items: center; gap: 4px; min-width: 0; }
  .desktop-preview #view .dp-person b, .desktop-preview #view .dp-person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .desktop-preview #view .dp-person b { font-size: 15px; }
  .desktop-preview #view .dp-person small { flex: 1; min-width: 0; color: #a7b1c8; font-size: 12px; }
  .desktop-preview #view .dp-person-badge { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 4px; padding: 2px 4px; border-radius: 5px; font: normal 800 10px RajdhaniPreview, sans-serif; white-space: nowrap; }
  .desktop-preview #view .dp-person-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
  .desktop-preview #view .dp-person-badge-looking_now { color: #ffc0d4; background: #ed3d7030; }
  .desktop-preview #view .dp-person-badge-online { color: #b5f5db; background: #1fbb8030; }
  .desktop-preview #view .dp-activity { display: flex; gap: 9px; padding: 9px 0; border-bottom: 1px solid #2a3145; }
  .desktop-preview #view .dp-activity i { flex: 0 0 5px; width: 5px; height: 5px; margin-top: 8px; border-radius: 50%; background: #5e6278; }
  .desktop-preview #view .dp-activity i.unread { background: #fb4f7c; }
  .desktop-preview #view .dp-activity b { font-size: 15px; }
  .desktop-preview #view .dp-activity p { color: #b6bed2; font-size: 13px; line-height: 1.3; margin: 3px 0; }
  .desktop-preview #view .dp-activity time { color: #8290ac; font-size: 11px; }
  .desktop-preview #view .dp-x-feed { min-width: 0; padding: 19px; border: 1px solid #343e57; border-radius: 11px; background: #101421; }
  .desktop-preview #view .dp-x-feed > header { display: flex; justify-content: space-between; align-items: end; flex-wrap: wrap; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid #303a50; }
  .desktop-preview #view .dp-x-feed h2 { margin: 4px 0 0; font: 700 21px/1 TekoPreview, sans-serif; }
  .desktop-preview #view .dp-x-feed header a { flex: none; color: #a9caff; font-size: 12px; font-weight: 800; text-decoration: none; }
  .desktop-preview #view .dp-x-feed header a:hover { color: #fff; text-decoration: underline; }
  .desktop-preview #view .dp-x-list { min-height: 180px; margin-top: 12px; }
  .desktop-preview #view .dp-x-frame { display: block; width: 100%; height: 450px; border: 0; border-radius: 7px; background: #101421; }
  .desktop-preview #view .dp-x-feed > footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; color: #9eacc6; font-size: 11px; }
  .desktop-preview #view .dp-quota { text-align: right; }
  .desktop-preview #view .dp-quota b { display: block; color: #f6eaff; font-size: 19px; }
  .desktop-preview #view .dp-quota small { display: block; color: #9ba5bd; font-size: 12px; }
  .desktop-preview #view .dp-discovery { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(330px, .7fr); gap: 18px; align-items: start; }
  .desktop-preview #view .dp-candidate, .desktop-preview #view .dp-match-details { min-width: 0; border: 1px solid #33394c; border-radius: 11px; background: #121827; }
  .desktop-preview #view .dp-candidate { padding: 11px 11px 17px; }
  .desktop-preview #view .dp-swipe-stage { position: relative; height: clamp(520px, 62vh, 695px); overflow: hidden; border-radius: 7px; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-card, body .desktop-preview #view .dp-swipe-stage .discover-empty-card { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(245px, .46fr) !important; grid-template-rows: minmax(0, 1fr) !important; width: 100% !important; max-width: none !important; height: 100% !important; min-height: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 6px !important; overflow: hidden !important; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-card .player-art { grid-area: 1 / 1 !important; height: 100% !important; min-height: 0 !important; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-card .player-art img.discover-player-photo { width: 100%; height: 100%; object-fit: cover; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-card .player-info { grid-area: 1 / 2 !important; align-self: stretch !important; height: 100% !important; min-height: 0 !important; overflow-y: auto !important; padding: 28px 20px !important; background: linear-gradient(145deg, #1a1830, #0e111c) !important; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-heading { display: grid !important; grid-template-columns: 1fr !important; gap: 7px !important; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-heading h2 { max-width: none !important; font-size: 29px !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
  body .desktop-preview #view .dp-swipe-stage .discover-player-heading .trust-badge { justify-self: start; }
  .desktop-preview #view .dp-swipe-stage .discover-player-card .discover-player-bio { color: #bdc5d7; }
  .desktop-preview #view .dp-swipe-stage .discover-player-card .discover-player-facts { display: grid; grid-template-columns: 1fr; }
  .desktop-preview #view .dp-swipe-stage .discover-player-card .discover-card-tools { display: flex; flex-wrap: wrap; gap: 8px; }
  .desktop-preview #view .dp-decisions { display: flex; justify-content: center; gap: 12px; padding: 16px 0 0; }
  .desktop-preview #view .dp-decisions button { min-width: 138px; height: 51px; }
  .desktop-preview #view .dp-decisions kbd { font: 700 12px RajdhaniPreview, sans-serif; color: #b7bbd1; padding: 1px 6px; border: 1px solid #5f6172; border-radius: 4px; }
  .desktop-preview #view .dp-keyboard-note { text-align: center; color: #9faac0; font-size: 13px; margin: 6px 0 0; }
  .desktop-preview #view .dp-match-details { padding: 24px; }
  .desktop-preview #view .dp-match-details > h2 { font: 700 33px/1 TekoPreview, sans-serif; margin: 10px 0 16px; }
  .desktop-preview #view .dp-match-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid #343a4f; }
  .desktop-preview #view .dp-metric { padding: 11px 6px 11px 0; border-bottom: 1px solid #2d3348; }
  .desktop-preview #view .dp-metric small { display: block; color: #929eb8; font-size: 11px; letter-spacing: .11em; }
  .desktop-preview #view .dp-metric strong { display: block; font-size: 17px; line-height: 1.2; overflow-wrap: anywhere; }
  .desktop-preview #view .dp-compatible, .desktop-preview #view .dp-endorsements { margin-top: 21px; }
  .desktop-preview #view .dp-compatible h3, .desktop-preview #view .dp-endorsements h3 { margin: 0 0 9px; font-size: 19px; }
  .desktop-preview #view .dp-compatible ul { margin: 0; padding-left: 19px; color: #c0d5ec; font-size: 15px; }
  .desktop-preview #view .dp-endorsements span { display: flex; justify-content: space-between; padding: 7px 8px; margin-bottom: 5px; background: #22283a; border-radius: 5px; }
  .desktop-preview #view .dp-profile-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 315px; border: 1px solid #724565; border-radius: 10px; background: radial-gradient(circle at 35% 90%, #3b224f, transparent 38%), linear-gradient(110deg, #161c2e, #21182e); }
  .desktop-preview #view .dp-identity-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .53; }
  .desktop-preview #view .dp-identity-front { position: relative; z-index: 2; display: flex; align-items: center; gap: 37px; min-height: 315px; padding: 32px 44px; background: linear-gradient(90deg, #13131b8c, #12142370 66%, #0c0d1c80); }
  .desktop-preview #view .dp-avatar-frame { flex: 0 0 235px; width: 235px; height: 235px; max-width: none; border-radius: 18px; }
  .desktop-preview #view .dp-avatar-frame .profile-avatar-mask { display: block; width: 100%; height: 100%; overflow: hidden; border-radius: 14px; }
  .desktop-preview #view .dp-avatar-frame.has-frame-asset .profile-avatar-mask { position: absolute; inset: var(--avatar-safe-top, 10%) var(--avatar-safe-right, 10%) var(--avatar-safe-bottom, 10%) var(--avatar-safe-left, 10%); width: auto; height: auto; }
  .desktop-preview #view .dp-avatar-frame .profile-avatar-xl { width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: 10px; }
  .desktop-preview #view .dp-identity-copy { flex: 1; min-width: 0; }
  .desktop-preview #view .dp-identity-copy h2 { font: 700 clamp(42px, 4vw, 67px)/.93 TekoPreview, sans-serif; margin: 7px 0 4px; letter-spacing: .02em; }
  .desktop-preview #view .dp-identity-copy > p { color: #c5c9de; font-size: 18px; }
  .desktop-preview #view .dp-identity-copy > p span { padding: 0 9px; color: #ff668a; }
  .desktop-preview #view .dp-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 22px; }
  .desktop-preview #view .dp-tags span { padding: 5px 9px; color: #e3e1f5; background: #131526ce; border: 1px solid #514d6d; border-radius: 4px; font-size: 12px; font-weight: 800; }
  .desktop-preview #view .dp-xp { max-width: 390px; }
  .desktop-preview #view .dp-xp > div { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 13px; }
  .desktop-preview #view .dp-xp span { color: #d4d6e7; }
  .desktop-preview #view .dp-xp progress { display: block; width: 100%; height: 8px; accent-color: #ff4776; }
  .desktop-preview #view .dp-identity-trust { display: grid; place-items: center; gap: 9px; align-self: center; }
  .desktop-preview #view .dp-identity-trust > span:last-child { font-size: 10px; letter-spacing: .12em; color: #cac9e3; }
  .desktop-preview #view .dp-profile-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, .8fr); gap: 18px; margin-top: 20px; align-items: start; }
  .desktop-preview #view .dp-profile-main, .desktop-preview #view .dp-profile-side { display: grid; gap: 17px; min-width: 0; }
  .desktop-preview #view .dp-surface { min-width: 0; padding: 21px 23px; border: 1px solid #30364a; border-radius: 8px; background: #151a29; }
  .desktop-preview #view .dp-surface .dp-section-head { padding-bottom: 10px; border-bottom: 1px solid #34394e; }
  .desktop-preview #view .dp-about { color: #c6cedf; font-size: 17px; line-height: 1.5; }
  .desktop-preview #view .dp-profile-facts { display: flex; flex-wrap: wrap; gap: 0 29px; }
  .desktop-preview #view .dp-profile-facts .dp-metric { min-width: 100px; border: 0; }
  .desktop-preview #view .dp-main-game { display: flex; gap: 20px; min-width: 0; }
  .desktop-preview #view .dp-main-game > img { width: 125px; height: 145px; flex: 0 0 125px; object-fit: cover; border-radius: 5px; }
  .desktop-preview #view .dp-main-game h3 { font: 700 32px/1 TekoPreview, sans-serif; margin: 5px 0; }
  .desktop-preview #view .dp-game-library { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
  .desktop-preview #view .dp-game-library article { min-width: 0; background: #1e2537; border: 1px solid #343c52; border-radius: 6px; overflow: hidden; }
  .desktop-preview #view .dp-game-library img { width: 100%; height: 110px; object-fit: cover; }
  .desktop-preview #view .dp-game-library b, .desktop-preview #view .dp-game-library small { display: block; padding: 3px 9px; }
  .desktop-preview #view .dp-game-library b { font-size: 15px; }
  .desktop-preview #view .dp-game-library small { color: #e889a9; font-size: 11px; }
  .desktop-preview #view .dp-clips { display: flex; gap: 10px; }
  .desktop-preview #view .dp-clips a { width: 33%; color: #fff; text-decoration: none; }
  .desktop-preview #view .dp-clips img { height: 115px; width: 100%; object-fit: cover; border-radius: 5px; }
  .desktop-preview #view .dp-loadout { display: grid; gap: 8px; margin: 12px 0 20px; }
  .desktop-preview #view .dp-loadout > div { display: flex; justify-content: space-between; gap: 9px; border-bottom: 1px solid #31394f; padding-bottom: 7px; }
  .desktop-preview #view .dp-loadout small { color: #9ca9be; letter-spacing: .09em; }
  .desktop-preview #view .dp-loadout b { font-size: 15px; text-align: right; }
  .desktop-preview #view .dp-profile-squads { display: grid; gap: 8px; }
  .desktop-preview #view .dp-profile-squads a { display: flex; align-items: center; gap: 11px; color: #f5f6ff; text-decoration: none; background: #1e2637; padding: 8px; border-radius: 5px; }
  .desktop-preview #view .dp-profile-squads a:hover { background: #2a3145; }
  .desktop-preview #view .dp-profile-squads img { width: 48px; height: 48px; object-fit: cover; border-radius: 4px; }
  .desktop-preview #view .dp-profile-squads b, .desktop-preview #view .dp-profile-squads small { display: block; }
  .desktop-preview #view .dp-profile-squads small { color: #adb8cc; }
  .desktop-preview #view .squad-command { display: grid; gap: 18px; width: 100%; padding: 0; background: transparent; }
  .desktop-preview #view .squad-command > .squad-command-head,
  .desktop-preview #view .squad-command > .squad-tabs { padding: 20px 24px; border: 1px solid #30364a; border-radius: 11px; background: #151a29; box-shadow: none; }
  .desktop-preview #view .squad-command-head { align-items: center; }
  .desktop-preview #view .squad-command-head > div:first-child { display: block; }
  .desktop-preview #view .squad-command-head > div:first-child > span { display: none; }
  .desktop-preview #view .squad-command-head h1 { font: 800 37px/1 RajdhaniPreview, sans-serif; letter-spacing: -.02em; }
  .desktop-preview #view .squad-command-head p { margin-top: 7px; color: #b5bed4; font-size: 16px; }
  .desktop-preview #view .squad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(355px, 1fr)); gap: 16px; padding: 0; border: 0; background: transparent; box-shadow: none; }
  .desktop-preview #view .squad-command-card { min-width: 0; min-height: 288px; padding: 23px; border: 1px solid #3b4357; border-radius: 11px; background: #151a29; box-shadow: none; }
  .desktop-preview #view .squad-command-card.active-squad { border-color: #725174; box-shadow: inset 0 0 0 1px #7a426f38; }
  .desktop-preview #view .squad-card-main { grid-template-columns: 90px minmax(0, 1fr) auto; gap: 17px; }
  .desktop-preview #view .squad-card-photo { width: 90px; height: 90px; border-radius: 8px; }
  .desktop-preview #view .squad-command-card .squad-card-copy h3 { font-size: 24px; }
  .desktop-preview #view .squad-card-meta { color: #acb8d0; font-size: 15px; }
  .desktop-preview #view .squad-card-brief { color: #c1c8d9; font-size: 16px; }
  .desktop-preview #view .squad-card-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .desktop-preview #view .squad-card-actions button { font: 800 14px RajdhaniPreview, sans-serif; }
  body .desktop-preview #view .faction-hub { width: 100% !important; max-width: none !important; gap: 18px !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero { margin: 0 !important; min-height: 140px; padding: 24px 30px !important; border-color: #43364f !important; border-radius: 11px !important; background: linear-gradient(100deg, #201829, #141b2e) !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero h1 { font: 800 42px/1 RajdhaniPreview, sans-serif !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero p { max-width: 90ch !important; color: #bcc5d9; font-size: 16px; }
  body .desktop-preview #view .faction-war-room { display: grid !important; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr) !important; gap: 18px !important; width: 100%; padding: 23px !important; border: 1px solid #304155 !important; border-radius: 11px; background: #121827 !important; }
  body .desktop-preview #view .faction-war-room > * { min-width: 0; order: 0 !important; }
  body .desktop-preview #view .faction-war-room .faction-season-banner { grid-column: 1 / -1; }
  body .desktop-preview #view .faction-war-room .faction-room-card { grid-column: 1; grid-row: 2; }
  body .desktop-preview #view .faction-war-room .faction-ai-panel { grid-column: 2; grid-row: 2; width: 100%; margin: 0 !important; }
  body .desktop-preview #view .faction-war-room .faction-count-grid,
  body .desktop-preview #view .faction-war-room .sector-board { grid-column: 1 / -1; }
  body .desktop-preview #view .faction-war-room .faction-count-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  body .desktop-preview #view .sector-board .sector-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  body .desktop-preview #view.comms { display: grid !important; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) !important; grid-template-rows: minmax(0, 1fr) !important; gap: 18px !important; padding: 24px clamp(24px, 3.4vw, 62px) !important; }
  body .desktop-preview #view.comms .comms-panel,
  body .desktop-preview #view.comms .comms-panel.single-chat { display: grid !important; grid-template-rows: auto auto auto minmax(0, 1fr) !important; width: 100% !important; min-width: 0 !important; min-height: 0 !important; max-height: none !important; height: 100% !important; padding: 19px !important; gap: 14px !important; border: 1px solid #333d52 !important; border-radius: 11px !important; background: #151a29 !important; box-shadow: none !important; }
  body .desktop-preview #view.comms .comms-head { display: grid !important; grid-template-columns: 1fr !important; gap: 13px; width: 100%; }
  body .desktop-preview #view.comms .comms-title h1 { font: 800 31px/1 RajdhaniPreview, sans-serif !important; }
  body .desktop-preview #view.comms .comms-title > span { height: 29px !important; background: #fa416f; }
  body .desktop-preview #view.comms .comms-tabs { min-height: 43px !important; height: 43px !important; }
  body .desktop-preview #view.comms .comms-tabs button { height: 39px !important; font: 700 15px RajdhaniPreview, sans-serif !important; }
  body .desktop-preview #view.comms .comms-search { display: block !important; }
  body .desktop-preview #view.comms .comms-panel .comms-chat-list { display: grid !important; align-content: start; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; }
  body .desktop-preview #view.comms .comms-panel .comms-chat-item { flex-basis: auto !important; grid-template-columns: 42px minmax(0, 1fr) !important; min-height: 64px !important; max-height: none !important; padding: 8px !important; }
  body .desktop-preview #view.comms .comms-thread-card { display: flex !important; flex-direction: column; height: 100% !important; min-height: 0; margin: 0 !important; padding: 20px !important; border: 1px solid #333d52 !important; border-radius: 11px !important; background: #111624 !important; box-shadow: none !important; }
  body .desktop-preview #view.comms .thread-head { min-height: 70px; }
  body .desktop-preview #view.comms .messages { flex: 1; min-height: 0; overflow-y: auto; }
  body .desktop-preview #view.comms .composer { min-height: 58px; }
  body .desktop-preview #view.comms .composer input { height: 44px !important; font-size: 16px !important; }
  body .desktop-preview #view.comms .composer button { width: auto !important; min-width: 85px !important; height: 44px !important; font-size: 15px !important; }
  body .desktop-preview #view .social-page { width: 100% !important; max-width: none !important; min-height: 0 !important; padding: 0 !important; gap: 17px !important; background: transparent !important; }
  body .desktop-preview #view .social-page > section { border: 1px solid #343a50 !important; border-radius: 11px !important; background: #151a29 !important; box-shadow: none !important; }
  body .desktop-preview #view .social-page > .social-page-head { display: flex !important; align-items: center; gap: 22px; min-height: 112px; padding: 22px 27px !important; background: linear-gradient(105deg, #1d192b, #151a29) !important; }
  body .desktop-preview #view .social-page-head h1 { font: 800 38px/1 RajdhaniPreview, sans-serif !important; }
  body .desktop-preview #view .social-page-head p { max-width: none !important; color: #bac4d8; font-size: 16px; }
  body .desktop-preview #view .friends-page {
    display: grid !important;
    grid-template-columns: minmax(0, 1.65fr) minmax(310px, .8fr);
    grid-template-areas: "head head" "friends add" "friends incoming" "suggestions referral" "suggestions outgoing";
    gap: 18px !important;
    align-items: start;
  }
  body .desktop-preview #view .friends-page > .social-page-head { grid-area: head; }
  body .desktop-preview #view .friends-page > .social-page-head > .ghost { display: none !important; }
  body .desktop-preview #view .friends-page > .friends-add-card:not(.referral-card) { grid-area: add; }
  body .desktop-preview #view .friends-page > .referral-card { grid-area: referral; }
  body .desktop-preview #view .friends-page > .friends-panel--incoming { grid-area: incoming; }
  body .desktop-preview #view .friends-page > .friends-panel--friends { grid-area: friends; min-height: 260px; }
  body .desktop-preview #view .friends-page > .friends-panel--outgoing { grid-area: outgoing; }
  body .desktop-preview #view .friends-page > .friends-panel--suggestions { grid-area: suggestions; }
  body .desktop-preview #view .friends-page > :is(.friends-add-card, .friends-panel) { min-width: 0; padding: 23px !important; }
  body .desktop-preview #view .friends-page .home-panel-head { min-height: 46px; margin-bottom: 13px; }
  body .desktop-preview #view .friends-page .home-panel-head b { font-size: 23px !important; line-height: 1 !important; }
  body .desktop-preview #view .friends-page .home-panel-head span,
  body .desktop-preview #view .friends-page .home-panel-head strong { color: #b9c4dc; font-size: 15px !important; }
  body .desktop-preview #view .friends-page .friend-add-form { gap: 10px; }
  body .desktop-preview #view .friends-page .friend-add-form input { min-height: 48px; font-size: 16px; background: #0e1422; }
  body .desktop-preview #view .friends-page .friend-add-form button { min-height: 48px; padding-inline: 19px; font-size: 15px; }
  body .desktop-preview #view .friends-page .friend-list { gap: 11px; }
  body .desktop-preview #view .friends-page .friend-row { grid-template-columns: 62px minmax(0, 1fr) auto; min-height: 89px; padding: 12px 15px; background: #1b2233 !important; border-color: #38435a !important; }
  body .desktop-preview #view .friends-page .friend-row img { width: 58px; height: 58px; border-radius: 10px; }
  body .desktop-preview #view .friends-page .friend-row b { font-size: 18px; }
  body .desktop-preview #view .friends-page .friend-row span { display: flex; align-items: center; gap: 9px; }
  body .desktop-preview #view .friends-page .friend-row em { color: #b6c1d8; font-size: 14px; }
  body .desktop-preview #view .friends-page .friend-actions { display: flex; flex-wrap: wrap; justify-content: end; max-width: 260px; }
  body .desktop-preview #view .friends-page .friend-actions button { min-height: 38px; padding-inline: 14px; font-size: 14px; }
  body .desktop-preview #view .friends-page .friends-panel--suggestions .friend-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body .desktop-preview #view .friends-page .referral-code-row code { font-size: 16px; }
  body .desktop-preview #view .friends-page .referral-rewards span { color: #d2d9e9; font-size: 13px; }
  body .desktop-preview #view .social-page :is(.challenge-card, .tournament-card, .leaderboard-card, .friend-card, .lfg-card) { background: #1a2132 !important; border-color: #3a4358 !important; }
  body .desktop-preview #view .challenge-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 16px !important; }
  body .desktop-preview #view .challenge-grid .challenge-card { min-width: 0; min-height: 205px; }
  body .desktop-preview #view .tournament-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; background: transparent !important; border: 0 !important; }
  body .desktop-preview #view .tournament-summary > div { min-height: 112px; padding: 20px; background: #1a2132; border: 1px solid #3a4358; border-radius: 10px; }
  body .desktop-preview #view .tournament-list-section { padding: 24px !important; }
  body .desktop-preview #view .live-players-page { width: 100%; max-width: none; }
  body .desktop-preview #view .live-players-page .route-hero { min-height: 120px; padding: 23px; background: linear-gradient(105deg, #1d192b, #151a29); }
  .desktop-preview .squad-info-modal { backdrop-filter: none !important; }
  .desktop-preview .modal:not(.squad-info-modal) { position: fixed; align-items: center; padding: 24px; }
  .desktop-preview .modal:not(.squad-info-modal) .modal-card { width: min(720px, 100%); max-width: min(720px, 100%); max-height: calc(100dvh - 48px); margin: auto; border: 1px solid #554263; border-radius: 16px; padding: 26px; }
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-hub,
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-detail { width: min(960px, calc(100vw - 340px)) !important; max-width: min(960px, calc(100vw - 340px)) !important; max-height: calc(100dvh - 48px) !important; padding: 26px 30px !important; }
  body .desktop-preview .profile-edit-hub .profile-edit-topbar:has([data-profile-section="menu"]) { grid-template-columns: auto minmax(0, 1fr) auto !important; }
  body .desktop-preview .profile-edit-topbar h2 { font-size: 42px !important; line-height: 1 !important; }
  body .desktop-preview .profile-edit-topbar span { font-size: 12px !important; }
  body .desktop-preview .profile-editor-modal .ghost { min-width: 75px !important; min-height: 42px !important; padding: 0 14px !important; font-size: 14px !important; }
  body .desktop-preview .profile-group-description { font-size: 16px !important; }
  body .desktop-preview .profile-edit-hub .profile-edit-tile-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 13px !important; }
  body .desktop-preview .profile-edit-hub .profile-edit-tile { min-height: 130px !important; padding: 16px !important; }
  body .desktop-preview .profile-edit-hub .profile-edit-tile b { font-size: 18px !important; }
  body .desktop-preview .profile-edit-hub .profile-edit-tile em,
  body .desktop-preview .profile-edit-hub .profile-edit-tile small { font-size: 13px !important; line-height: 1.3 !important; }
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-pick-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; }
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-pick b { font-size: 15px !important; line-height: 1.15 !important; }
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-pick span { font-size: 12px !important; line-height: 1.25 !important; }
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-picker > label { font-size: 15px !important; }
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-editor p,
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .cosmetic-editor input { font-size: 15px !important; }
  body .desktop-preview .profile-editor-modal { align-items: center !important; padding: 24px !important; }
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-hub,
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-detail {
    width: min(1120px, calc(100vw - 320px)) !important;
    max-width: min(1120px, calc(100vw - 320px)) !important;
    max-height: calc(100dvh - 48px) !important;
    margin: auto !important;
    padding: 30px !important;
    overflow-y: auto !important;
    background: linear-gradient(145deg, #192033, #101523 70%) !important;
    border-color: #424c63 !important;
  }
  body .desktop-preview .profile-edit-hub:not(:has(.profile-desktop-nav)) {
    display: grid !important;
    grid-template-columns: minmax(275px, .8fr) minmax(0, 1.35fr) !important;
    grid-template-rows: auto auto 1fr !important;
    column-gap: 26px !important;
    align-items: start;
  }
  body .desktop-preview .profile-edit-hub:not(:has(.profile-desktop-nav)) > .profile-edit-topbar { grid-column: 1 / -1; margin-bottom: 20px !important; }
  body .desktop-preview .profile-edit-hub:not(:has(.profile-desktop-nav)) > .profile-editor-preview { grid-column: 1; grid-row: 2; min-height: 210px !important; }
  body .desktop-preview .profile-edit-hub:not(:has(.profile-desktop-nav)) > .profile-edit-loadout-strip { grid-column: 1; grid-row: 3; }
  body .desktop-preview .profile-edit-hub:not(:has(.profile-desktop-nav)) > .profile-edit-tile-grid { grid-column: 2; grid-row: 2 / 4; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav),
  body .desktop-preview .profile-edit-detail:has(.profile-desktop-nav) {
    display: grid !important;
    grid-template-columns: 230px minmax(0, 1fr) !important;
    column-gap: 29px !important;
    align-content: start !important;
  }
  body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) > .profile-edit-topbar,
  body .desktop-preview .profile-edit-detail:has(.profile-desktop-nav) > .profile-edit-topbar { grid-column: 1 / -1; margin-bottom: 20px !important; padding-bottom: 17px; border-bottom: 1px solid #394257; }
  body .desktop-preview .profile-desktop-nav { grid-column: 1; grid-row: 2 / span 20; position: sticky; top: 0; display: grid; align-content: start; gap: 5px; padding: 17px 12px; border: 1px solid #353f54; border-radius: 12px; background: #111725; }
  body .desktop-preview .profile-desktop-nav > span { margin: 0 8px 11px; color: #a9b5cd; font-size: 12px; font-weight: 800; letter-spacing: .13em; }
  body .desktop-preview .profile-desktop-nav button { display: block; width: 100%; min-height: 42px; padding: 10px 12px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #c6cee1; text-align: left; font: 700 16px RajdhaniPreview, sans-serif; cursor: pointer; }
  body .desktop-preview .profile-desktop-nav button:hover { color: #fff; background: #222b3d; }
  body .desktop-preview .profile-desktop-nav button.active { border-color: #a94570; background: #42243b; color: #fff; }
  body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) > :not(.profile-edit-topbar):not(.profile-desktop-nav),
  body .desktop-preview .profile-edit-detail:has(.profile-desktop-nav) > :not(.profile-edit-topbar):not(.profile-desktop-nav) { grid-column: 2; min-width: 0; }
  body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; }
  body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile { min-height: 120px !important; }
  body .desktop-preview .profile-edit-detail .field label,
  body .desktop-preview .profile-edit-detail label { font-size: 15px !important; letter-spacing: .02em !important; }
  body .desktop-preview .profile-edit-detail input,
  body .desktop-preview .profile-edit-detail textarea,
  body .desktop-preview .profile-edit-detail select { font-size: 16px !important; min-height: 48px !important; }
  body .desktop-preview .profile-edit-detail .profile-save-action { min-height: 46px !important; font-size: 15px !important; }
  body .desktop-preview .profile-edit-detail .push-settings-panel,
  body .desktop-preview .profile-edit-detail .login-security-panel,
  body .desktop-preview .profile-edit-detail .connected-editor { width: 100%; max-width: none; }
  body .desktop-preview .profile-edit-detail .login-security-head { padding: 19px 21px; border-color: #3d4960; background: #1d2638; color: #f7f9ff; }
  body .desktop-preview .profile-edit-detail .login-security-head h3 { font-size: 22px; }
  body .desktop-preview .profile-edit-detail .login-security-head p { color: #bac5db; font-size: 15px; }
  body .desktop-preview .profile-edit-detail[data-section="identity"] .profile-photo-upload { grid-template-columns: 132px minmax(0, 1fr) !important; gap: 20px !important; align-items: center !important; }
  body .desktop-preview .profile-edit-detail[data-section="identity"] .profile-photo-upload img { width: 132px !important; height: 146px !important; }
  body .desktop-preview .profile-edit-detail[data-section="identity"] .profile-save-action { order: 20; margin-top: 18px !important; }
  .desktop-preview .notif-panel { left: auto; right: 29px; top: 68px; width: min(430px, calc(100vw - 300px)); z-index: 20; }
}

/* Keep the hologram above the existing faction operations without changing the shell. */
@media (min-width: 1200px) {
  body .desktop-preview #view .faction-war-room .faction-hologram { grid-column: 1 / -1; grid-row: 2 !important; }
  body .desktop-preview #view .faction-war-room .faction-room-card { grid-row: 3 / span 2 !important; }
  body .desktop-preview #view .faction-war-room .faction-ai-panel { grid-row: 3 !important; }
  body .desktop-preview #view .faction-war-room .faction-count-grid { grid-row: 4 !important; }
  body .desktop-preview #view .faction-war-room .sector-board { grid-row: 5 !important; }
  body .desktop-preview #view .faction-war-room:has(.faction-sector-admin) .faction-sector-admin { grid-row: 5 !important; }
  body .desktop-preview #view .faction-war-room:has(.faction-sector-admin) .sector-board { grid-row: 6 !important; }
  body .desktop-preview #view .faction-hologram-head h2 { font: 700 31px/1 RajdhaniPreview, sans-serif; }
  body .desktop-preview #view .faction-hologram-info h3 { font: 700 27px/1 RajdhaniPreview, sans-serif; }
  body .desktop-preview #view .faction-hologram-view { font-family: RajdhaniPreview, sans-serif; }
}
@media (min-width: 1200px) and (max-width: 1450px) {
  .desktop-preview .dp-utility { grid-template-columns: minmax(170px, 1fr) auto; padding-inline: 24px; }
  .desktop-preview .dp-utility-context { display: none; }
  .desktop-preview #view .dp-home-layout { grid-template-columns: minmax(0, 1fr) 240px; gap: 17px; }
  .desktop-preview #view .dp-home-feature-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .desktop-preview #view .dp-home-feature-row .dp-section-head { flex-wrap: nowrap; gap: 7px; }
  .desktop-preview #view .dp-home-feature-row .dp-section-head h2 { font-size: 20px; }
  .desktop-preview #view .dp-home-feature-row .dp-section-head .dp-button { padding: 6px 7px; font-size: 13px; white-space: nowrap; }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active,
  .desktop-preview #view .dp-featured-section .home-promotion-open,
  .desktop-preview #view .dp-featured-section .home-promotion-card { min-height: 240px; }
  .desktop-preview #view .dp-featured-section .home-promotions { grid-auto-rows: minmax(240px, 1fr); }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active > img { flex-basis: 29%; width: 29%; }
  .desktop-preview #view .dp-home-feature-row .dp-squad-active h3 { font-size: 19px; white-space: normal; }
  .desktop-preview #view .dp-featured-section .home-promotion-open > img,
  .desktop-preview #view .dp-featured-section .home-promotion-open > video { min-height: 240px; }
  .desktop-preview #view .dp-featured-section .home-promotion-copy b { font-size: 19px; }
  .desktop-preview #view .dp-hero-content { width: 69%; padding: 27px; }
  .desktop-preview #view .dp-squad-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .desktop-preview #view .dp-identity-front { gap: 20px; padding-inline: 25px; }
  .desktop-preview #view .dp-avatar-frame { flex-basis: 190px; width: 190px; height: 190px; }
  .desktop-preview #view .dp-discovery { grid-template-columns: minmax(0, 1fr) 310px; }
  body .desktop-preview #view .friends-page .friends-panel--suggestions .friend-list { grid-template-columns: 1fr; }
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-hub,
  body .desktop-preview .profile-editor-modal .modal-card.profile-edit-detail { width: min(1020px, calc(100vw - 300px)) !important; max-width: min(1020px, calc(100vw - 300px)) !important; }
}
@media (prefers-reduced-motion: reduce) {
  .desktop-preview *, .desktop-preview *::before, .desktop-preview *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Desktop workspaces: profile editing, conversations, and faction operations. */
@media (min-width: 1200px) {
  html.desktop-platform body .desktop-preview .profile-editor-modal {
    position: fixed !important; inset: 70px 0 0 250px !important; z-index: 30;
    display: block !important; width: auto; height: auto; padding: 0 !important;
    background: #0b101c !important; backdrop-filter: none !important;
  }
  html.desktop-platform body .desktop-preview .profile-editor-modal .modal-card.profile-edit-hub,
  html.desktop-platform body .desktop-preview .profile-editor-modal .modal-card.profile-edit-detail {
    width: 100% !important; max-width: none !important; height: 100% !important;
    max-height: none !important; margin: 0 !important;
    padding: 34px clamp(30px, 3.3vw, 62px) 70px !important;
    border: 0 !important; border-radius: 0 !important;
    overflow: auto !important; background: #0b101c !important; box-shadow: none !important;
  }
  html.desktop-platform body .desktop-preview .profile-edit-topbar {
    align-items: center !important; min-height: 82px; margin-bottom: 24px !important;
    padding-bottom: 20px !important; border-bottom: 1px solid #333c50 !important;
  }
  html.desktop-platform body .desktop-preview .profile-edit-topbar h2 { font-size: 47px !important; }
  html.desktop-platform body .desktop-preview .profile-edit-topbar p { margin: 4px 0 0; color: #b9c5d9; font-size: 17px; }
  html.desktop-platform body .desktop-preview .profile-edit-topbar > .ghost:last-child { min-width: 132px !important; }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav),
  html.desktop-platform body .desktop-preview .profile-edit-detail:has(.profile-desktop-nav) {
    grid-template-columns: 232px minmax(0, 1fr) !important; column-gap: 28px !important;
    align-content: start !important; max-width: 1720px !important; margin-inline: auto !important;
  }
  html.desktop-platform body .desktop-preview .profile-desktop-nav {
    top: 12px; padding: 16px 10px; border-radius: 9px; background: #151c2b;
  }
  html.desktop-platform body .desktop-preview .profile-desktop-nav button { min-height: 48px; font-size: 17px; }
  html.desktop-platform body .desktop-preview .dp-profile-overview {
    grid-column: 2; display: grid; grid-template-columns: minmax(290px, .85fr) minmax(410px, 1.15fr);
    gap: 24px; min-width: 0; align-items: start;
  }
  html.desktop-platform body .desktop-preview .dp-profile-overview-preview,
  html.desktop-platform body .desktop-preview .dp-profile-overview-sections { min-width: 0; }
  html.desktop-platform body .desktop-preview .dp-profile-overview-preview { display: grid; gap: 14px; }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-editor-preview {
    min-height: 330px !important; margin: 0 !important; border: 1px solid #495169 !important;
    border-radius: 12px !important; background: #151a28 !important;
  }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-loadout-strip { margin: 0 !important; }
  html.desktop-platform body .desktop-preview .dp-overview-intro { margin-bottom: 17px; }
  html.desktop-platform body .desktop-preview .dp-overview-intro span { color: #ff5b83; font-size: 12px; font-weight: 900; letter-spacing: .15em; }
  html.desktop-platform body .desktop-preview .dp-overview-intro h3 { margin: 5px 0 3px; color: #fff; font: 800 28px/1.1 RajdhaniPreview, sans-serif; }
  html.desktop-platform body .desktop-preview .dp-overview-intro p { margin: 0; color: #b9c5d9; font-size: 16px; }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 13px !important; }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile {
    min-height: 150px !important; padding: 19px !important; border: 1px solid #3b465c !important;
    border-radius: 10px !important; background: #192132 !important; text-align: left;
  }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile:hover { border-color: #e45485 !important; background: #24263b !important; }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile b { font-size: 20px !important; }
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile em,
  html.desktop-platform body .desktop-preview .dp-profile-overview .profile-edit-tile small { font-size: 15px !important; }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid .profile-edit-tile {
    min-height: 132px !important; padding: 18px !important; border: 1px solid #3b465c !important;
    border-radius: 9px !important; background: #192132 !important;
  }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid .profile-edit-tile:hover { border-color: #e45485 !important; background: #24263b !important; }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid .profile-edit-tile b { font-size: 18px !important; }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid .profile-edit-tile em,
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav) .profile-edit-tile-grid .profile-edit-tile small { font-size: 14px !important; }
  html.desktop-platform body .desktop-preview .profile-edit-detail > .profile-editor-preview,
  html.desktop-platform body .desktop-preview .profile-edit-detail > .profile-section-content { min-width: 0; }

  body .desktop-preview #view.comms {
    grid-template-columns: minmax(320px, 360px) minmax(0, 1fr) !important;
    gap: 20px !important; padding: 24px clamp(24px, 3.4vw, 62px) !important;
    background: #0b101c !important;
  }
  body .desktop-preview #view.comms .comms-panel,
  body .desktop-preview #view.comms .comms-panel.single-chat {
    display: flex !important; flex-direction: column; gap: 15px !important;
    padding: 24px !important; border: 1px solid #333e53 !important;
    background: #151b2a !important;
  }
  body .desktop-preview #view.comms .comms-head { display: block !important; }
  body .desktop-preview #view.comms .comms-title { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 19px; }
  body .desktop-preview #view.comms .comms-title > span { flex: 0 0 4px; width: 4px !important; height: 43px !important; border-radius: 3px; }
  body .desktop-preview #view.comms .comms-title h1 { margin: 0; font-size: 36px !important; line-height: .9 !important; text-shadow: none !important; }
  body .desktop-preview #view.comms .comms-title p { margin: 7px 0 0; color: #b3c0d4; font-size: 15px; }
  body .desktop-preview #view.comms .comms-tabs { display: grid; grid-template-columns: repeat(var(--comms-tab-count), minmax(0, 1fr)); gap: 5px; padding: 4px; background: #0d1320 !important; border: 1px solid #364158; border-radius: 9px; }
  body .desktop-preview #view.comms .comms-tabs button { min-width: 0; border-radius: 6px; font-size: 16px !important; }
  body .desktop-preview #view.comms .comms-search { min-height: 45px; margin: 0; background: #0d1320 !important; border-color: #364158 !important; border-radius: 8px !important; }
  body .desktop-preview #view.comms .comms-search input { font-size: 16px; }
  body .desktop-preview #view.comms .dp-conversation-count { display: flex; justify-content: space-between; align-items: center; padding: 2px 1px 0; color: #aab8cd; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
  body .desktop-preview #view.comms .dp-conversation-count b { padding: 3px 8px; border: 1px solid #42506a; border-radius: 5px; color: #e7edfa; }
  body .desktop-preview #view.comms .comms-panel .comms-chat-list { flex: 1; display: block !important; min-height: 80px !important; padding: 0 !important; overflow: auto !important; }
  body .desktop-preview #view.comms .comms-panel .comms-chat-item { width: 100% !important; max-width: none !important; min-height: 83px !important; max-height: none !important; margin-bottom: 7px; padding: 12px !important; grid-template-columns: 50px minmax(0, 1fr) !important; border-radius: 8px !important; background: #1c2536 !important; box-shadow: none !important; }
  body .desktop-preview #view.comms .comms-panel .comms-chat-item.active { border-color: #e34f7c !important; background: #302338 !important; }
  body .desktop-preview #view.comms .comms-chat-item img { width: 48px !important; height: 48px !important; border-radius: 8px !important; }
  body .desktop-preview #view.comms .comms-chat-item b { font-size: 17px !important; }
  body .desktop-preview #view.comms .comms-chat-item em { display: block !important; color: #aebcd3; font-size: 13px !important; }
  body .desktop-preview #view.comms .comms-chat-item small { display: none !important; }
  body .desktop-preview #view.comms .comms-thread-card {
    padding: 0 !important; border: 1px solid #333e53 !important;
    background: #111827 !important; overflow: hidden;
  }
  body .desktop-preview #view.comms .thread-head {
    display: grid !important; grid-template-columns: 56px minmax(0, 1fr) auto !important;
    align-items: center; gap: 15px !important; min-height: 90px; padding: 17px 22px !important;
    margin: 0; border-bottom: 1px solid #333e53 !important;
  }
  body .desktop-preview #view.comms .thread-head > img { width: 52px !important; height: 52px !important; border-radius: 10px !important; object-fit: cover; }
  body .desktop-preview #view.comms .thread-head b { font-size: 22px !important; }
  body .desktop-preview #view.comms .thread-head p { display: block !important; margin: 3px 0 0 !important; color: #aebcd3; font-size: 14px !important; }
  body .desktop-preview #view.comms .thread-actions { grid-column: auto !important; display: flex !important; width: auto !important; gap: 7px !important; margin-top: 0 !important; }
  body .desktop-preview #view.comms .thread-actions .ghost { display: inline-flex !important; place-items: normal !important; justify-content: center; align-items: center; width: auto !important; min-width: 82px !important; min-height: 38px !important; height: 38px !important; padding: 7px 12px !important; font: 800 14px RajdhaniPreview, sans-serif !important; }
  body .desktop-preview #view.comms .messages { padding: 20px 24px !important; background: #0e1421 !important; }
  body .desktop-preview #view.comms .messages .bubble { max-width: min(70%, 610px) !important; padding: 13px 16px !important; border-radius: 12px !important; }
  body .desktop-preview #view.comms .messages .bubble p { font-size: 16px !important; line-height: 1.45 !important; }
  body .desktop-preview #view.comms .messages .bubble small { display: block; margin-top: 5px; color: #aebbd2; font-size: 12px !important; }
  body .desktop-preview #view.comms .date-divider { color: #a5b1c8; font-size: 13px; }
  body .desktop-preview #view.comms .dp-thread-empty,
  body .desktop-preview #view.comms .comms-empty { display: grid; place-content: center; justify-items: center; height: 100%; min-height: 200px; text-align: center; }
  body .desktop-preview #view.comms .dp-empty-chat-icon { display: grid; place-items: center; width: 68px; height: 68px; margin-bottom: 17px; border: 1px solid #54435e; border-radius: 17px; background: #2b233c; color: #ff6390; }
  body .desktop-preview #view.comms .dp-empty-chat-icon svg { width: 31px; height: 31px; }
  body .desktop-preview #view.comms .dp-thread-empty h2,
  body .desktop-preview #view.comms .comms-empty h2 { margin: 0 0 7px; font-size: 29px; }
  body .desktop-preview #view.comms .dp-thread-empty p,
  body .desktop-preview #view.comms .comms-empty p { max-width: 340px; color: #adbad1; font-size: 16px; line-height: 1.4; }
  body .desktop-preview #view.comms .composer { display: flex !important; align-items: center; gap: 11px !important; min-height: 82px !important; margin: 0 !important; padding: 15px 20px !important; border: 0 !important; border-top: 1px solid #333e53 !important; border-radius: 0 !important; background: #151b2a !important; }
  body .desktop-preview #view.comms .composer input { flex: 1; min-width: 0; height: 48px !important; padding: 0 15px; background: #0c1220; border: 1px solid #3a465c; border-radius: 8px; }
  body .desktop-preview #view.comms .composer button { flex: 0 0 100px; width: 100px !important; min-width: 100px !important; height: 48px !important; min-height: 48px !important; border-radius: 8px; font-size: 15px !important; }

  body .desktop-preview #view .faction-hub { display: grid !important; gap: 18px !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero {
    position: relative; display: flex !important; align-items: center;
    min-height: 134px !important; padding: 22px 30px !important;
    border: 1px solid #42495e !important; border-radius: 10px !important;
    background: radial-gradient(circle at 90% 20%, #5a2a483d, transparent 31%), linear-gradient(100deg, #1b2131, #131b2a) !important;
  }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero > .back-btn { display: none !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero > div { grid-column: auto !important; padding: 0 !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero h1 { margin: 3px 0 5px !important; font-size: 43px !important; line-height: .95 !important; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero p { max-width: 78ch !important; margin: 0 !important; color: #c2cce0; font-size: 16px; }
  body .desktop-preview #view .faction-war-room {
    display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
    gap: 16px !important; padding: 0 !important; border: 0 !important; background: transparent !important;
  }
  body .desktop-preview #view .faction-war-room > * { min-width: 0; }
  body .desktop-preview #view .faction-war-room .faction-season-banner { grid-column: 1 / -1; min-height: 104px !important; padding: 15px 22px !important; border-radius: 10px !important; background: #182131 !important; }
  body .desktop-preview #view .faction-war-room .faction-season-banner img { max-width: 95px; max-height: 74px; object-fit: contain; }
  body .desktop-preview #view .faction-war-room .faction-season-copy h2 { font-size: 30px !important; }
  body .desktop-preview #view .faction-war-room .faction-season-copy p { font-size: 15px !important; }
  body .desktop-preview #view .faction-war-room .faction-room-card { grid-column: 1; grid-row: 2 / span 2; align-self: stretch; padding: 24px !important; border: 1px solid #41455d !important; border-radius: 10px !important; background: #171b2a !important; }
  body .desktop-preview #view .faction-war-room .faction-room-identity h2 { font-size: 31px !important; }
  body .desktop-preview #view .faction-war-room .faction-room-identity p,
  body .desktop-preview #view .faction-war-room .faction-room-chat p { font-size: 16px !important; line-height: 1.35; }
  body .desktop-preview #view .faction-war-room .faction-ai-panel {
    grid-column: 2; grid-row: 2; align-self: start; display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important; align-items: center !important;
    gap: 12px !important; min-height: 0 !important; padding: 18px !important;
    border: 1px solid #3b465a !important; border-radius: 10px !important; background: #171e2c !important;
  }
  body .desktop-preview #view .faction-war-room .faction-ai-panel img { width: 70px !important; height: 70px !important; border-radius: 9px !important; object-fit: cover; }
  body .desktop-preview #view .faction-war-room .faction-ai-panel h2 { font-size: 24px !important; margin: 2px 0 4px !important; }
  body .desktop-preview #view .faction-war-room .faction-ai-panel p { font-size: 14px !important; line-height: 1.35 !important; }
  body .desktop-preview #view .faction-war-room .faction-count-grid { grid-column: 2; grid-row: 3; align-self: start; grid-template-columns: 1fr !important; gap: 6px !important; padding: 12px !important; border: 1px solid #39465b !important; border-radius: 10px; background: #151d2b !important; }
  body .desktop-preview #view .dp-faction-standings-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 2px 3px 9px; color: #f5f7ff; border-bottom: 1px solid #39465b; text-transform: uppercase; }
  body .desktop-preview #view .dp-faction-standings-head b { font-size: 16px; }
  body .desktop-preview #view .dp-faction-standings-head span { color: #aebbd0; font-size: 11px; letter-spacing: .08em; }
  body .desktop-preview #view .faction-war-room .faction-count-tile {
    display: grid !important; grid-template-columns: 38px minmax(0, 1fr) !important;
    grid-template-rows: auto auto 3px !important; align-items: center; justify-items: start !important;
    gap: 1px 9px !important; min-height: 60px !important; padding: 7px 10px !important;
    border-radius: 7px !important; background: #1d2636 !important; text-align: left !important;
  }
  body .desktop-preview #view .faction-war-room .faction-count-tile img { grid-column: 1; grid-row: 1 / 3; width: 34px !important; height: 34px !important; object-fit: contain; }
  body .desktop-preview #view .faction-war-room .faction-count-tile > div { grid-column: 2; grid-row: 1; justify-items: start; }
  body .desktop-preview #view .faction-war-room .faction-count-tile b { font-size: 14px !important; line-height: 1.1 !important; }
  body .desktop-preview #view .faction-war-room .faction-count-tile span,
  body .desktop-preview #view .faction-war-room .faction-count-tile em { font-size: 11px !important; line-height: 1.15 !important; }
  body .desktop-preview #view .faction-war-room .faction-count-tile em { grid-column: 2; grid-row: 2; }
  body .desktop-preview #view .faction-war-room .faction-count-tile > i { grid-column: 1 / -1; grid-row: 3; width: 100%; }
  body .desktop-preview #view .faction-war-room .sector-board { grid-column: 1 / -1; grid-row: 4; padding: 23px !important; border: 1px solid #3b465c !important; border-radius: 10px !important; background: #151d2b !important; }
  body .desktop-preview #view .sector-board .sector-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 11px !important; }
  body .desktop-preview #view .faction-roster { padding: 24px !important; border: 1px solid #3b465c; border-radius: 10px; background: #151d2b; }
}

@media (min-width: 1200px) and (max-width: 1450px) {
  html.desktop-platform body .desktop-preview .dp-profile-overview { grid-template-columns: minmax(260px, .85fr) minmax(330px, 1.15fr); gap: 16px; }
  html.desktop-platform body .desktop-preview .profile-edit-hub:has(.profile-desktop-nav),
  html.desktop-platform body .desktop-preview .profile-edit-detail:has(.profile-desktop-nav) { grid-template-columns: 190px minmax(0, 1fr) !important; column-gap: 18px !important; }
  body .desktop-preview #view .faction-war-room { grid-template-columns: minmax(0, 1fr) minmax(260px, 310px) !important; }
}

/* Desktop faction identity, accurate avatar framing, and owner workspaces. */
@media (min-width: 1200px) {
  body .desktop-preview #view .faction-hub .route-hero.faction-hero {
    isolation: isolate; overflow: hidden; padding-right: min(39%, 510px) !important;
  }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero > div { position: relative; z-index: 2; }
  body .desktop-preview #view .faction-hub .route-hero.faction-hero:has(.dp-faction-hero-art) {
    border-color: #655076 !important;
    background: linear-gradient(100deg, #1d2030, #1d172d) !important;
  }
  body .desktop-preview #view .dp-faction-hero-art {
    position: absolute; z-index: 1; inset: 0 0 0 auto; width: min(42%, 570px);
    margin: 0; overflow: hidden; background: #211b31;
  }
  body .desktop-preview #view .dp-faction-hero-art::before {
    content: ""; position: absolute; z-index: 1; inset: 0;
    background: linear-gradient(90deg, #1d2030 0%, #1d2030c4 17%, #1d203020 50%, #11142180 100%);
  }
  body .desktop-preview #view .dp-faction-hero-background {
    display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 42%;
  }
  body .desktop-preview #view .dp-faction-hero-art figcaption {
    position: absolute; z-index: 2; right: 17px; bottom: 11px;
    display: flex; align-items: center; gap: 8px; max-width: 75%; padding: 5px 9px 5px 5px;
    border: 1px solid #dad7ed61; border-radius: 7px; background: #0c101dcc;
    color: #f4f1ff; text-align: left; font-size: 11px; line-height: 1;
    text-transform: uppercase; letter-spacing: .09em;
  }
  body .desktop-preview #view .dp-faction-hero-art figcaption img { width: 32px; height: 32px; object-fit: contain; }
  body .desktop-preview #view .dp-faction-hero-art figcaption b { display: block; margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; letter-spacing: 0; }

  body .desktop-preview #view .dp-avatar-frame.has-frame-asset {
    flex: 0 0 auto; width: auto !important; height: 235px !important;
    aspect-ratio: var(--frame-aspect, .86 / 1) !important;
  }
  body .desktop-preview #view .dp-avatar-frame.has-frame-asset .profile-avatar-mask {
    inset: var(--avatar-safe-top, 10%) var(--avatar-safe-right, 10%) var(--avatar-safe-bottom, 10%) var(--avatar-safe-left, 10%) !important;
    width: auto !important; height: auto !important; border-radius: var(--avatar-mask-radius, 18px) !important;
  }
  body .desktop-preview #view .dp-avatar-frame.has-frame-asset .profile-avatar-xl { border-radius: 0 !important; }
  body .desktop-preview .profile-edit-hub .profile-editor-avatar:not(.has-frame-asset) .profile-editor-avatar-mask,
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .profile-editor-avatar:not(.has-frame-asset) .profile-editor-avatar-mask {
    inset: 0 !important;
  }
  body .desktop-preview .profile-edit-hub .profile-editor-avatar.has-frame-asset .profile-editor-avatar-mask,
  body .desktop-preview .profile-edit-detail[data-section="cosmetics"] .profile-editor-avatar.has-frame-asset .profile-editor-avatar-mask {
    inset: var(--avatar-safe-top, 10%) var(--avatar-safe-right, 10%) var(--avatar-safe-bottom, 10%) var(--avatar-safe-left, 10%) !important;
    width: auto !important; height: auto !important; border-radius: var(--avatar-mask-radius, 18px) !important;
  }

  body .desktop-preview #view .faction-war-room .faction-sector-admin {
    grid-column: 1 / -1; grid-row: 4; gap: 18px; padding: 23px !important;
    border: 1px solid #705b44 !important; border-radius: 10px !important;
    background: #1c202d !important; box-shadow: none !important;
  }
  body .desktop-preview #view .faction-war-room:has(.faction-sector-admin) .sector-board { grid-row: 5; }
  body .desktop-preview #view .faction-sector-admin .profile-section-head span { font-size: 22px; }
  body .desktop-preview #view .faction-sector-admin .profile-section-head em { color: #b9c3d7; font-size: 14px; }
  body .desktop-preview #view .faction-sector-admin-grid { gap: 15px; }
  body .desktop-preview #view .faction-sector-admin label span { color: #b8c4d7; font-size: 13px; }
  body .desktop-preview #view .faction-sector-admin select,
  body .desktop-preview #view .faction-sector-admin input { min-height: 48px; border-color: #536078; border-radius: 7px; background: #101625; font-size: 16px; }
  body .desktop-preview #view .faction-sector-admin button { width: auto; min-width: 190px; min-height: 47px; padding-inline: 20px; font-size: 15px; }

  body .desktop-preview #view .promotions-admin-page { gap: 22px; padding: 0 0 45px; }
  body .desktop-preview #view .promotions-admin-hero,
  body .desktop-preview #view .promotion-editor-form,
  body .desktop-preview #view .promotions-library { border: 1px solid #39465b; border-radius: 10px; background: #161d2b; box-shadow: none; }
  body .desktop-preview #view .promotions-admin-hero { align-items: center; min-height: 136px; padding: 24px 30px; }
  body .desktop-preview #view .promotions-admin-hero > .ghost { order: 2; margin-left: auto; min-width: 100px; min-height: 42px; }
  body .desktop-preview #view .promotions-admin-hero h1 { font-size: 42px; line-height: 1; }
  body .desktop-preview #view .promotions-admin-hero p { color: #bfcade; font-size: 16px; }
  body .desktop-preview #view .promotions-admin-layout { grid-template-columns: minmax(0, 1fr) minmax(330px, 390px); gap: 20px; }
  body .desktop-preview #view .promotion-editor-form,
  body .desktop-preview #view .promotions-library { min-width: 0; padding: 24px; }
  body .desktop-preview #view .promotion-editor-head h2 { font-size: 28px; }
  body .desktop-preview #view .promotion-form-grid { gap: 16px; }
  body .desktop-preview #view .promotion-form-grid label:not(.promotion-enabled-toggle) { min-width: 0; grid-template-columns: minmax(0, 1fr); justify-items: stretch; }
  body .desktop-preview #view .promotion-form-grid label > span { color: #d1d9e7; font-size: 15px; }
  body .desktop-preview #view .promotion-form-grid input,
  body .desktop-preview #view .promotion-form-grid textarea,
  body .desktop-preview #view .promotion-form-grid select { width: 100% !important; min-width: 0; min-height: 46px; padding: 10px 12px; border-color: #4a5970; border-radius: 7px; background: #0d1421; font-size: 16px; }
  body .desktop-preview #view .promotion-form-grid textarea { min-height: 110px; }
  body .desktop-preview #view .promotion-preview-panel { margin-top: 23px; }
  body .desktop-preview #view .promotion-preview-panel > span { font-size: 14px; }
  body .desktop-preview #view .promotion-editor-actions button { min-width: 135px; min-height: 45px; }
  body .desktop-preview #view .promotion-admin-row { gap: 11px; border-color: #39465b; background: #1c2636; }
  body .desktop-preview #view .promotion-admin-row b { font-size: 18px; }
  body .desktop-preview #view .promotion-admin-row small { color: #b5c0d3; font-size: 13px; }
  body .desktop-preview #view .promotion-row-actions button { min-height: 36px; }

  body .desktop-preview .moderation-modal { inset: 70px 0 0 250px; z-index: 40; display: block; padding: 0; background: #0b101c; backdrop-filter: none; }
  body .desktop-preview .moderation-modal .modal-card.moderation-card { width: 100% !important; max-width: none !important; height: 100% !important; max-height: none !important; margin: 0 !important; padding: 32px clamp(30px, 3.3vw, 62px) !important; border: 0 !important; border-radius: 0 !important; background: #0b101c !important; }
  body .desktop-preview .moderation-head { max-width: 1600px; margin: 0 auto; padding-bottom: 18px; border-bottom: 1px solid #3b465c; }
  body .desktop-preview .moderation-head h2 { font-size: 40px; }
  body .desktop-preview .moderation-head p { color: #bac5da; font-size: 16px; }
  body .desktop-preview .moderation-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 17px; max-width: 1600px; margin: 25px auto; }
  body .desktop-preview .moderation-report { gap: 14px; padding: 22px; border-color: #3e4b61; border-radius: 9px; background: #171f2e; }
  body .desktop-preview .moderation-report > div:first-child b { font-size: 20px; }
  body .desktop-preview .moderation-report p { color: #d5ddeb; font-size: 15px; }
  body .desktop-preview .moderation-report label { gap: 7px; font-size: 14px; }
  body .desktop-preview .moderation-report select,
  body .desktop-preview .moderation-report textarea { min-height: 46px; border-color: #4a5970; background: #0d1421; font-size: 16px; }
  body .desktop-preview .moderation-report textarea { min-height: 105px; }
  body .desktop-preview .moderation-report button { justify-self: end; min-height: 44px; }
  body .desktop-preview .tournament-modal-backdrop { align-items: center; }
  body .desktop-preview .tournament-modal { width: min(880px, calc(100vw - 300px)); border-color: #47536c; border-radius: 11px; background: #171e2d; }
  body .desktop-preview .tournament-modal > header,
  body .desktop-preview #tournamentForm { padding: 23px 28px; }
  body .desktop-preview .tournament-modal header h2 { font-size: 30px; }
  body .desktop-preview #tournamentForm label { font-size: 14px; }
  body .desktop-preview #tournamentForm input,
  body .desktop-preview #tournamentForm select,
  body .desktop-preview #tournamentForm textarea { min-height: 46px; font-size: 16px; }
  body .desktop-preview #view .playtest-code-admin { padding: 22px; border-color: #39465b; border-radius: 10px; background: #161d2b; }
}

@media (min-width: 1200px) and (max-width: 1450px) {
  body .desktop-preview #view .dp-avatar-frame.has-frame-asset { height: 190px !important; }
  body .desktop-preview #view .promotions-admin-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 15px; }
  body .desktop-preview #view .promotion-editor-form,
  body .desktop-preview #view .promotions-library { padding: 18px; }
  body .desktop-preview .moderation-list { grid-template-columns: 1fr; }
}

/* Public player profiles occupy the desktop workspace, not the mobile sheet. */
@media (min-width: 1200px) {
  body .desktop-preview #view .dp-public-profile { display: grid; gap: 18px; width: 100%; }
  body .desktop-preview #view .dp-public-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  body .desktop-preview #view .dp-public-back { min-height: 39px; padding: 0 15px; color: #e7eafa; border-color: #46516a; background: #192233; text-transform: capitalize; }
  body .desktop-preview #view .dp-public-back:hover { border-color: #ed567e; background: #272238; }
  body .desktop-preview #view .dp-public-profile .dp-identity-copy h1 { font: 700 clamp(42px, 4vw, 67px)/.93 TekoPreview, sans-serif; margin: 7px 0 4px; letter-spacing: .02em; }
  body .desktop-preview #view .dp-public-profile .dp-profile-grid { margin-top: 0; }
  body .desktop-preview #view .dp-public-action-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 20px; padding: 18px 22px; border: 1px solid #3a435a; border-radius: 9px; background: #171e2d; }
  body .desktop-preview #view .dp-public-action-bar > div:first-child { display: grid; gap: 2px; }
  body .desktop-preview #view .dp-public-action-bar > div:first-child b { font-size: 20px; }
  body .desktop-preview #view .dp-public-action-bar > div:first-child span { color: #b9c6da; font-size: 15px; }
  body .desktop-preview #view .dp-public-action-bar .public-profile-actions { margin-left: 0; gap: 9px; }
  body .desktop-preview #view .dp-public-action-bar .public-profile-actions button { min-height: 42px; padding: 0 16px; font: 800 15px RajdhaniPreview, sans-serif; border-radius: 7px; }
  body .desktop-preview #view .dp-public-action-bar .public-profile-actions button:disabled { opacity: .56; cursor: not-allowed; }
  body .desktop-preview #view .dp-live-link { display: inline-flex; width: fit-content; margin-top: 2px; padding: 7px 11px; border: 1px solid #ff6470; border-radius: 6px; background: #aa243a; color: #fff; font-size: 13px; font-weight: 900; letter-spacing: .06em; text-decoration: none; }
  body .desktop-preview #view .dp-live-link:hover { background: #d8324d; }
  body .desktop-preview #view .dp-public-accounts { display: grid; gap: 8px; }
  body .desktop-preview #view .dp-public-accounts a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid #343e54; border-radius: 6px; background: #1e2637; color: #f5f7ff; text-decoration: none; }
  body .desktop-preview #view .dp-public-accounts a:hover { border-color: #e45485; background: #273047; }
  body .desktop-preview #view .dp-public-accounts b { font-size: 16px; text-transform: capitalize; }
  body .desktop-preview #view .dp-public-accounts span { color: #bdc8df; font-size: 14px; overflow-wrap: anywhere; }
}