/* VEYDRIS 17.5 — viewport composition. No gameplay component owns page geometry. */
@media (min-width: 901px) {
  html,
  body {
    height: 100%;
    overflow: hidden;
  }

  .app-shell {
    width: 100%;
    height: calc(100dvh - var(--vey-strip-height));
    min-height: 0;
    display: grid;
    grid-template-columns: var(--vey-nav-width) minmax(0, 1fr);
    overflow: hidden;
  }

  .sidebar {
    position: relative;
    inset: auto;
    width: var(--vey-nav-width);
    height: 100%;
    min-height: 0;
    padding: 8px 8px 10px;
    overflow: hidden;
  }

  .sidebar .profile {
    display: none;
  }

  .sidebar-bottom {
    margin-top: auto;
    padding: 9px 7px;
  }

  main {
    position: relative;
    min-width: 0;
    min-height: 0;
    height: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--vey-context-width);
    grid-template-rows:
      var(--vey-topbar-height) var(--vey-utility-height)
      minmax(0, 1fr);
    grid-template-areas:
      "top top"
      "utility context"
      "game context";
    overflow: hidden;
  }

  /* Screens without a context rail reclaim its reserved column. */
  body[data-shell-group="home"] main,
  body[data-view="combat"] main,
  body[data-view="profile"] main {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "top"
      "utility"
      "game";
  }

  .topbar {
    grid-area: top;
    position: relative;
    top: auto;
    height: var(--vey-topbar-height);
    min-height: var(--vey-topbar-height);
    padding: 0 10px;
    display: grid;
    grid-template-columns: minmax(250px, 1fr) auto minmax(250px, auto);
    gap: 8px;
    border-bottom: 1px solid #4d3b26;
    background: #0c0d11f5;
  }

  .menu-button,
  .topbar .crumb {
    display: none;
  }

  .global-hero {
    max-width: 620px;
    height: 52px;
    grid-template-columns: 44px minmax(0, 1fr) 104px;
    padding: 4px;
  }

  .global-hero__portrait {
    width: 42px;
    height: 42px;
  }

  .global-hero__identity b {
    font-size: 15px;
  }

  .global-hero__identity small,
  .global-hero__identity em,
  .global-hero__xptext {
    font-size: 9px;
  }

  .global-hero__power b {
    font-size: 18px;
  }

  .header-mission {
    position: relative;
    inset: auto;
    max-width: 310px;
    min-height: 42px;
    padding: 5px 10px;
  }

  .resources {
    justify-self: end;
    gap: 4px;
  }

  .section-navigation {
    grid-area: utility;
    min-width: 0;
    min-height: var(--vey-utility-height);
    display: flex;
    align-items: stretch;
    gap: 2px;
    padding: 0 10px;
    overflow-x: auto;
    border-bottom: 1px solid #2d271f;
    background: #08090d;
  }

  .context-resources {
    position: absolute;
    z-index: 3;
    top: var(--vey-topbar-height);
    right: var(--vey-context-width);
    max-width: min(60%, 720px);
    height: var(--vey-utility-height);
    overflow-x: auto;
    background: linear-gradient(90deg, transparent, #08090df4 8%);
  }

  .context-resources[hidden] {
    display: none;
  }

  .objective-bar {
    grid-area: context;
    position: relative;
    inset: auto;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px;
    overflow: auto;
    border: 0;
    border-left: 1px solid #433522;
    background:
      radial-gradient(circle at 50% 0, #6b48202b, transparent 38%),
      linear-gradient(180deg, #121116, #090a0e);
  }

  .objective-bar::before {
    content: "OBJECTIVE";
    display: block;
    padding-bottom: 7px;
    border-bottom: 1px solid #3d3122;
    color: #c9974b;
    font:
      700 8px "DM Mono",
      monospace;
    letter-spacing: 0.15em;
  }

  .objective-rune {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
  }

  .objective-copy {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
  }

  .objective-sigil {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 1px solid #735a36;
    border-radius: 50%;
  }

  .objective-copy > div {
    min-width: 0;
    display: grid;
    gap: 4px;
  }

  .objective-copy b {
    font:
      700 15px/1.2 "Playfair Display",
      serif;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .objective-copy span {
    color: var(--vey-muted);
    font-size: 11px;
    line-height: 1.5;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .objective-copy > div > span {
    display: none;
  }

  .objective-bar:hover .objective-copy > div > span,
  .objective-bar:focus-within .objective-copy > div > span {
    display: block;
  }

  .objective-progress-row {
    width: 100%;
    display: flex;
    gap: 6px;
    align-items: center;
  }

  .objective-progress-row .objective-progress {
    display: block;
    flex: 1;
    margin: 0;
  }

  .objective-progress-row em {
    min-width: 28px;
    font-size: 9px;
  }

  .objective-bar .button {
    width: 100%;
    margin-top: auto;
    min-height: 36px;
  }

  #view {
    grid-area: game;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background:
      radial-gradient(circle at 70% -20%, #3b28521f, transparent 35%), #07080c;
  }

  #view > * {
    max-width: none;
    margin: 0;
  }

  .world-feed {
    position: fixed;
    z-index: 70;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .mobile-dock {
    display: none;
  }

  .alpha-feedback-fab {
    bottom: calc(var(--vey-strip-height) + 8px);
  }

  /* Common compact scene geometry */
  .content,
  .location-screen,
  .inventory-page,
  .forge-page,
  .collection-journal,
  .public-profile,
  .character-screen,
  .combat-screen {
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 10px 12px;
    overflow: hidden;
  }

  .immersive-location {
    padding: 7px 10px 9px;
  }

  .boss-intro {
    left: var(--vey-nav-width);
    right: var(--vey-context-width);
    top: var(--vey-topbar-height);
    bottom: var(--vey-strip-height);
  }

  .location-heading,
  .view-title,
  .collection-heading {
    min-height: 70px;
    margin-bottom: 6px;
    padding: 8px 13px;
  }

  .location-heading h1,
  .view-title h1,
  .collection-heading h1 {
    font-size: clamp(25px, 2.5vw, 38px);
  }

  .location-heading p,
  .view-title p,
  .collection-heading p {
    max-width: 760px;
    font-size: 12px;
    line-height: 1.45;
  }

  .location-hero {
    min-height: 132px;
    height: clamp(132px, 18vh, 190px);
    margin-bottom: 6px;
  }

  .location-hero__heading {
    max-width: 58%;
    padding: 14px 18px;
  }

  .location-hero__heading h1 {
    font-size: clamp(28px, 3.2vw, 48px);
  }

  .location-stats {
    gap: 4px;
  }

  .location-stat {
    min-width: 84px;
    padding: 6px 8px;
  }

  .location-stat small {
    font-size: 9px;
  }

  .location-stat b {
    font-size: 17px;
  }

  /* Citadel */
  .citadel-home {
    height: 100%;
    padding: 8px 10px;
    overflow: hidden;
  }

  .citadel-scene {
    height: calc(100% - 118px);
    min-height: 390px;
  }

  .citadel-title h1 {
    font-size: clamp(42px, 5vw, 70px);
  }

  .citadel-status-grid {
    height: 108px;
    margin-top: 6px;
    overflow: auto;
  }

  .phase12-home-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* Character design master */
  .character-screen.phase7-character {
    display: grid;
    grid-template-rows: 72px minmax(0, 1fr) 102px;
    gap: 5px;
  }

  .phase7-character .character-profile-header {
    min-height: 0;
    height: 72px;
    padding: 6px 12px;
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 0.72fr) minmax(
        120px,
        0.45fr
      );
    overflow: hidden;
  }

  .phase7-character .character-profile-header h1 {
    font-size: 28px;
  }

  body .phase7-character .profile-showcase-strip {
    display: none;
  }

  .phase7-character .character-profile-power {
    grid-template-columns: auto auto;
    grid-template-rows: 18px 28px;
    justify-content: center;
    gap: 0 10px;
    padding: 0 12px;
  }

  .phase7-character .character-profile-power small,
  .phase7-character .character-profile-power span {
    align-self: end;
  }

  .phase7-character .character-profile-power b {
    grid-row: 2;
    align-self: start;
    font-size: 26px;
  }

  .phase7-character .power-details-trigger {
    grid-column: 2;
    grid-row: 2;
    min-height: 26px;
    padding: 3px 8px;
  }

  .phase7-character .character-profile-meta {
    flex-wrap: nowrap;
  }

  .phase7-character .character-profile-meta > span {
    display: none;
  }

  .phase7-character .character-core {
    min-height: 0;
    height: auto;
    margin: 0;
  }

  .phase7-character .character-paperdoll,
  .phase7-character .character-stat-panel {
    min-height: 0;
    height: 100%;
    overflow: auto;
  }

  .phase7-character .hero-figure {
    min-height: 310px;
    height: 100%;
  }

  .phase7-character .hero-gear-slot-wrap .item-slot {
    width: 50px;
    height: 50px;
  }

  .phase7-character .character-inventory-dock {
    height: 102px;
    min-height: 0;
    margin: 0;
    padding: 5px 8px;
    overflow: hidden;
  }

  .phase7-character .character-inventory-grid {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .phase7-character .character-inventory-grid > .item-slot {
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
  }

  .advanced-stats.grouped,
  .power-details-panel {
    position: fixed;
    z-index: 75;
    top: calc(var(--vey-topbar-height) + 8px);
    right: 8px;
    bottom: calc(var(--vey-strip-height) + 8px);
    width: min(430px, calc(100vw - var(--vey-nav-width) - 24px));
    overflow: auto;
    padding: 14px;
    border: 1px solid #765a82;
    background: #0b0c11f7;
    box-shadow: 0 18px 60px #000c;
  }

  /* Inventory, storage and forge */
  .inventory-page,
  .forge-page {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .inventory-grid {
    min-height: 0;
    max-height: none;
    overflow: auto;
    align-content: start;
  }

  .compact-forge.forge-workbench {
    min-height: 0;
    height: calc(100% - 126px);
    grid-template-columns: minmax(225px, 0.58fr) minmax(0, 1.42fr);
    grid-template-rows: minmax(0, 1fr) auto 70px;
    align-items: stretch;
    padding: 10px 12px;
    overflow: hidden;
  }

  .forge-workbench .forge-master {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    align-content: center;
  }

  .forge-anvil {
    grid-column: 2;
    grid-row: 1;
    min-height: 0;
    overflow: auto;
    min-width: 0;
  }

  .phase14-forge .anvil-item {
    grid-template-columns: minmax(170px, 0.62fr) minmax(260px, 1.38fr);
  }

  .forge-workbench .forge-filters {
    grid-column: 1 / -1;
    grid-row: 2;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .forge-workbench .forge-picker {
    grid-column: 1 / -1;
    grid-row: 3;
    min-height: 0;
    overflow-x: auto;
    overflow-y: hidden;
  }

  .forge-picker {
    max-height: 106px;
    overflow: auto;
  }

  /* World map */
  .world-map-screen {
    display: grid;
    grid-template-rows: 44px minmax(0, 1fr);
    padding: 7px 10px;
  }

  .world-map-screen > .world-map-heading {
    display: none;
  }

  .world-map-screen > .vey-focus-nav {
    position: relative;
    z-index: 6;
    grid-row: 1;
    margin: 0 0 5px;
  }

  .world-map-screen > .contextual-hint,
  .world-map-screen > .region-heading,
  .world-map-canvas {
    display: none;
  }

  .world-map-screen.map-overview .world-map-canvas {
    position: absolute;
    z-index: 20;
    inset: 52px 10px 10px;
    display: block;
    overflow: auto;
    background: #080a0f;
  }

  .vey-map-close {
    position: sticky;
    z-index: 4;
    top: 8px;
    left: calc(100% - 48px);
    width: 40px;
    height: 40px;
    border: 1px solid #8b6b46;
    color: #ead8bc;
    background: #121016;
    font-size: 22px;
  }

  .world-map-screen .chapter-list {
    grid-row: 2;
    min-height: 0;
    overflow: hidden;
  }

  .world-map-screen .region-expedition {
    height: 100%;
    display: grid;
    grid-template-rows: 110px 30px minmax(0, 1fr) auto 94px;
    overflow: hidden;
  }

  .region-expedition .region-hero {
    min-height: 0;
    padding: 10px 13px;
  }

  .region-expedition .region-hero h2 {
    margin: 2px 0;
    font-size: 26px;
  }

  .region-expedition .region-hero p,
  .region-expedition .region-keywords span:nth-child(n + 4) {
    display: none;
  }

  .region-expedition .encounter-list {
    min-height: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
    align-content: start;
    overflow: auto;
    padding: 5px;
  }

  .region-expedition .encounter-row {
    min-height: 92px;
    padding: 5px;
    grid-template-columns: 50px 1fr auto;
  }

  .region-expedition .encounter-copy p,
  .region-expedition .encounter-copy em,
  .region-expedition .combat-preview span:not(.combat-preview-role),
  .region-expedition .combat-preview-trait {
    display: none;
  }

  .region-expedition .region-hunt-divider {
    grid-column: 1 / -1;
    min-height: 24px;
  }

  .region-expedition .boss-gate {
    min-height: 0;
    height: 94px;
    display: grid;
    grid-template-columns: 1fr auto;
    margin: 0;
    padding: 5px;
    overflow: hidden;
  }

  .region-expedition .boss-gate__art {
    min-height: 0;
    height: 82px;
    padding: 7px 10px;
    overflow: hidden;
  }

  .region-expedition .boss-gate h3 {
    margin: 2px 0;
    font-size: 22px;
  }

  .region-expedition .boss-gate p,
  .region-expedition .boss-notable-drops,
  .region-expedition .boss-gate .combat-preview {
    display: none;
  }

  .region-expedition .boss-gate__art {
    min-height: 90px;
  }

  /* Rifts */
  .rift-screen {
    display: grid;
    grid-template-rows: 118px minmax(0, 1fr);
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 7px 10px;
    overflow: hidden;
  }

  .rift-hero {
    grid-column: 1;
    grid-row: 1;
    min-height: 0;
    height: 118px;
    padding: 12px 18px;
  }

  .rift-hero h1 {
    font-size: clamp(32px, 3.5vw, 52px);
  }

  .rift-select-stage {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
    height: 100%;
    grid-template-columns: minmax(250px, 30%) minmax(0, 1fr);
    grid-template-rows: 42px minmax(0, 1fr);
    gap: 6px;
    overflow: hidden;
    margin-top: 0;
  }

  .rift-select-stage > .vey-focus-nav {
    grid-column: 1 / -1;
    grid-row: 1;
    margin: 0;
  }

  .rift-screen > :is(.rift-run, .rift-cache-reveal) {
    grid-column: 1;
    grid-row: 2;
  }

  .rift-shard-grid {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
    max-height: none;
    overflow: hidden;
  }

  .rift-select-stage > .rift-inspect {
    grid-column: 2;
    grid-row: 2;
    min-height: 0;
    height: 100%;
    overflow: auto;
  }

  .rift-run {
    min-height: 0;
    height: 100%;
    overflow: auto;
  }

  /* Combat */
  .combat-screen {
    display: grid;
    grid-template-rows: 78px minmax(300px, 1fr) 42px;
    gap: 6px;
  }

  .combat-toolbar {
    min-height: 0;
    padding: 7px 10px;
  }

  .combat-stage {
    min-height: 0;
    height: auto;
  }

  .combat-result-grid {
    min-height: 0;
    height: 42px;
    max-height: 42px;
    overflow: hidden;
  }

  .combat-log.open {
    position: absolute;
    z-index: 30;
    inset: 58px 10px 10px;
    overflow: auto;
    background: #090a0ff5;
  }

  /* Arena, raid and collections */
  .arena-location,
  .companions-location,
  .mounts-location,
  .abyssal-gate-location,
  .public-profile,
  .collection-journal,
  .bestiary-screen,
  .bestiary-location,
  .class-arsenal {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .arena-roster,
  .abyssal-wings {
    min-height: 0;
    overflow: hidden;
  }

  .arena-champions {
    height: clamp(300px, calc(100vh - 410px), 460px);
    min-height: 0;
    max-height: min(460px, calc(100vh - 410px));
    overflow: auto;
  }

  .arena-champions.vey-focus-track:not(.vey-view-all)
    > .arena-champion.vey-focus-current {
    height: 100%;
    min-height: 300px;
    display: grid;
    grid-template-columns: minmax(280px, 46%) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto 1fr auto;
    column-gap: 22px;
    align-content: center;
    padding: 0 20px 0 0;
    text-align: left;
  }

  .arena-champion.vey-focus-current > .champion-portrait {
    grid-column: 1;
    grid-row: 1 / -1;
    width: 100%;
    height: 100%;
    min-height: 300px;
    margin: 0;
  }

  .arena-champion.vey-focus-current > :not(.champion-portrait) {
    grid-column: 2;
  }

  .arena-champion.vey-focus-current h2 {
    min-height: 2.1em;
    margin: 5px 0;
    font-size: clamp(24px, 2.2vw, 30px);
    line-height: 1.05;
    overflow-wrap: anywhere;
  }

  .arena-champion.vey-focus-current .champion-stats {
    margin-block: 10px;
  }

  .arena-champion.vey-focus-current .champion-stats small {
    font-size: 9px;
  }

  .arena-champion.vey-focus-current .champion-stats b {
    font-size: 18px;
  }

  .arena-champion.vey-focus-current .champion-actions {
    display: flex;
    gap: 7px;
  }

  .arena-champion.vey-focus-current .champion-actions .button {
    width: auto;
    min-width: 150px;
  }

  .arena-leaderboard {
    position: relative;
    z-index: 25;
    right: auto;
    bottom: auto;
    width: min(240px, 28vw);
    max-height: 42vh;
    margin: 0 0 0 auto;
    overflow: auto;
    background: #0b0c11;
    box-shadow: 0 10px 35px #000d;
  }

  .arena-roster > .location-section-heading {
    min-height: 58px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
  }

  .arena-roster > .location-section-heading h2 {
    margin: 2px 0;
  }

  .arena-roster .arena-leaderboard summary {
    padding: 10px 12px;
    font-size: 10px;
  }

  .abyssal-wings {
    height: calc(100% - 140px);
    margin-top: 5px;
    padding: 0 6px;
  }

  .raid-wing-location {
    height: 100%;
    margin: 0;
    overflow: auto;
  }

  .raid-wing-location .raid-boss-stage {
    min-height: 220px;
    padding: 12px;
  }

  .raid-wing-location.vey-focus-current .raid-boss-stage {
    height: 230px;
    min-height: 230px;
    padding: 16px 14px;
  }

  .raid-wing-location.vey-focus-current .raid-wing-number {
    top: 11px;
    left: 14px;
  }

  .raid-wing-location.vey-focus-current .raid-boss-copy {
    max-width: 54%;
  }

  .raid-wing-location.vey-focus-current .raid-boss-copy h2 {
    font-size: clamp(25px, 2.8vw, 38px);
    line-height: 1.05;
  }

  .raid-wing-location.vey-focus-current .raid-boss-copy p {
    margin-block: 4px;
    font-size: 11px;
  }

  .raid-wing-location.vey-focus-current .raid-loot-preview {
    right: 12px;
    bottom: 12px;
    width: 42%;
    max-width: 290px;
    padding: 10px;
  }

  .companions-location,
  .mounts-location {
    display: grid;
    grid-template-rows: 132px 92px minmax(0, 1fr);
    gap: 6px;
  }

  .arena-location .location-stats {
    right: 8px;
    bottom: 8px;
    left: 8px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
  }

  .arena-location .location-stat {
    min-width: 0;
    padding: 7px;
  }

  .guild-founder-overlay {
    margin-top: 7px;
    padding: 12px;
  }

  .guild-founder-overlay > .empty-state {
    padding: 10px;
  }

  .companions-location > .location-hero,
  .mounts-location > .location-hero {
    height: 132px;
    min-height: 132px;
    margin: 0;
  }

  .companions-location > .active-collection-showcase,
  .mounts-location > .active-collection-showcase {
    height: 92px;
  }

  .companions-location > .shared-collection-screen,
  .mounts-location > .shared-collection-screen {
    height: 100%;
    margin: 0;
    padding: 0;
  }

  .collection-journal {
    display: grid;
    grid-template-rows: 72px auto 36px minmax(0, 1fr);
    gap: 5px;
  }

  .collection-summary {
    margin: 0;
    padding: 4px;
  }

  .collection-summary > div {
    padding: 4px;
  }

  .collection-journal.vey-tabbed > .vey-tab-active {
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .collection-journal .boss-hunt-grid,
  .collection-journal .unique-journal-grid,
  .collection-journal .raid-piece-journal,
  .collection-journal .class-challenge-grid {
    height: 100%;
    max-height: 100%;
    overflow: auto;
  }

  .boss-hunt-grid.vey-focus-track:not(.vey-view-all) {
    overflow: hidden;
  }

  .bestiary-grid,
  .bestiary-list {
    max-height: calc(100vh - 225px);
    overflow: auto;
  }

  .bestiary-location .archive-book {
    margin-top: 6px;
  }

  /* Guild, Chronicle, Profile, Ascension */
  .guild-hall-location,
  .chronicle-table.vey-liveops,
  .public-profile-grid,
  .sanctum-location,
  .world-boss-location {
    min-height: 0;
  }

  .chronicle-table.vey-liveops {
    height: calc(100% - 120px);
    margin-top: 5px;
    overflow: hidden;
  }

  .chronicle-table.vey-liveops > .vey-liveops-active {
    max-height: calc(100% - 42px);
    overflow: auto;
  }

  .public-profile {
    display: grid;
    grid-template-rows: minmax(142px, auto) minmax(0, 1fr);
  }

  .public-profile-header {
    min-height: 142px;
    height: auto;
    overflow: visible;
  }

  .public-profile-grid {
    height: 100%;
    overflow: auto;
  }

  .profile-panel {
    padding: 9px;
  }

  .guild-founder-overlay {
    width: min(780px, calc(100% - 24px));
    min-height: 0;
    max-height: calc(100% - 152px);
    margin: 8px auto 0;
    padding: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 0.7fr);
    overflow: auto;
  }

  .guild-founder-overlay > .empty-state {
    grid-column: auto;
    align-self: center;
    padding: 18px;
  }

  body[data-view="guild"] #view > *,
  body[data-view="ascension"] #view > * {
    height: 100%;
    overflow: auto;
  }

  .sanctum-location .location-hero {
    height: 170px;
    min-height: 170px;
  }

  .sanctum-location .location-hero__actions {
    right: auto;
    bottom: 10px;
    left: 18px;
  }

  .sanctum-location .sanctum-preview {
    margin: 6px 10px 0;
  }

  .sanctum-location .sanctum-clarity {
    margin: 8px 10px;
  }

  /* Class library */
  .class-arsenal .arsenal-layout,
  .class-arsenal .class-arsenal-layout {
    min-height: 0;
    height: calc(100% - 86px);
    overflow: hidden;
  }

  .class-arsenal [class*="skill-grid"],
  .class-arsenal [class*="library"] {
    max-height: calc(100vh - 290px);
    overflow: auto;
  }
}

@media (min-width: 901px) and (max-width: 1500px) {
  :root {
    --vey-nav-width: 164px;
    --vey-context-width: 158px;
  }

  .objective-bar {
    gap: 7px;
    padding: 10px 8px;
  }

  .objective-copy > div > span {
    display: none;
  }

  .companions-location .location-stats,
  .mounts-location .location-stats {
    display: none;
  }

  .nav-item {
    padding-inline: 9px;
  }

  .nav-item > small {
    display: none;
  }

  .topbar {
    grid-template-columns: minmax(230px, 1fr) minmax(180px, 280px) auto;
  }

  .header-mission {
    max-width: 280px;
  }

  .resource {
    min-width: 48px;
    padding-inline: 7px;
  }

  .objective-copy b {
    font-size: 16px;
  }

  body .phase7-character .profile-showcase-strip {
    display: none;
  }

  .phase7-character .profile-showcase-strip > :nth-child(n + 8):not(.button) {
    display: none;
  }

  .world-map-screen .region-expedition {
    grid-template-rows: 110px 30px minmax(0, 1fr) 94px;
  }

  .world-map-screen .region-mastery {
    display: none;
  }

  /* The available game column is substantially narrower than the viewport
     once navigation and the context rail are reserved. Keep the forge's
     informational panel from competing with its working surface. */
  .compact-forge.forge-workbench {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 52px minmax(0, 1fr) auto 62px;
    height: calc(100% - 88px);
  }

  body[data-shell-group="gear"] .view-title {
    min-height: 82px;
    height: 82px;
    padding: 7px 12px;
    overflow: hidden;
  }

  body[data-shell-group="gear"] .view-title h1 {
    margin: 1px 0;
    font-size: 26px;
  }

  body[data-shell-group="gear"] .view-title p {
    margin: 0;
    line-height: 1.3;
  }

  .forge-workbench .forge-master {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    grid-template-columns: minmax(210px, 0.7fr) minmax(320px, 1.3fr);
    gap: 8px 18px;
    align-content: center;
    padding: 8px 14px;
  }

  .forge-workbench .forge-master > :is(.eyebrow, h1, p) {
    grid-column: 1;
  }

  .forge-workbench .forge-master h1 {
    margin: 0;
    font-size: 21px;
  }

  .forge-workbench .forge-master p {
    display: none;
  }

  .forge-workbench .forge-materials {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    margin: 0;
  }

  .forge-workbench .forge-anvil {
    grid-column: 1;
    grid-row: 2;
  }

  .forge-workbench .forge-filters {
    grid-column: 1;
    grid-row: 3;
  }

  .forge-workbench .forge-picker {
    grid-column: 1;
    grid-row: 4;
  }

  .phase14-forge .anvil-item {
    grid-template-columns: minmax(245px, 0.7fr) minmax(360px, 1.3fr);
    gap: 6px;
    padding: 6px;
  }

  .phase14-forge .forge-item-focus .item-slot {
    flex-basis: 64px;
    width: 64px;
    height: 64px;
  }

  .phase14-forge .forge-item-focus {
    min-height: 82px;
    height: auto;
    overflow: visible;
  }

  .phase14-forge .forge-item-focus h2 {
    margin-block: 1px;
  }

  .phase14-forge .forge-change-preview {
    grid-template-columns: minmax(0, 1fr);
  }

  .phase14-forge .forge-change-preview > div {
    display: none;
  }

  .phase14-forge .forge-action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .phase14-forge .hammer-upgrade {
    position: sticky;
    z-index: 4;
    bottom: 0;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  :root {
    --vey-nav-width: 148px;
    --vey-context-width: 184px;
  }

  main {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "top" "utility" "game";
  }

  .objective-bar {
    display: none;
  }

  .context-resources {
    right: 0;
  }

  .sidebar {
    padding-inline: 6px;
  }

  .nav-item {
    padding-inline: 7px;
  }

  .topbar {
    grid-template-columns: minmax(210px, 1fr) minmax(150px, 220px) auto;
  }

  .header-mission {
    min-width: 150px;
    max-width: 220px;
  }

  .resources .resource:nth-of-type(n + 4) {
    display: none;
  }

  .forge-workbench {
    grid-template-columns: minmax(0, 1fr);
    padding-inline: 7px;
  }

  .forge-workbench .forge-master p,
  .forge-workbench .forge-master .forge-copy {
    display: none;
  }

  .phase14-forge .anvil-item {
    grid-template-columns: minmax(190px, 0.62fr) minmax(280px, 1.38fr);
    padding: 7px;
  }

  .forge-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 901px) and (max-height: 850px) {
  :root {
    --vey-topbar-height: 58px;
    --vey-utility-height: 36px;
  }

  .global-hero {
    height: 48px;
  }

  .global-hero__portrait {
    width: 38px;
    height: 38px;
  }

  .location-heading,
  .view-title,
  .collection-heading {
    min-height: 64px;
  }

  .location-hero {
    height: 128px;
  }

  .phase7-character .character-profile-header {
    height: 74px;
  }

  .character-screen.phase7-character {
    grid-template-rows: 74px minmax(0, 1fr) 96px;
  }

  .world-map-screen > .world-map-canvas,
  .world-map-screen > .region-heading {
    display: none;
  }

  .world-map-screen.map-overview > .world-map-canvas {
    display: block;
    overflow-x: auto;
  }
}

@media (max-width: 900px) {
  :root {
    --vey-strip-height: 0px;
  }

  html,
  body {
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body.vey-sheet-open {
    overflow: hidden;
    touch-action: none;
  }

  .app-shell {
    display: block;
    min-height: 100dvh;
  }

  .sidebar,
  .world-feed,
  .context-resources {
    display: none;
  }

  main {
    min-height: 100dvh;
    padding-bottom: calc(70px + env(safe-area-inset-bottom));
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    height: 58px;
    min-height: 58px;
    padding: 5px 8px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px;
    background: #0b0c10f6;
  }

  .menu-button,
  .crumb,
  .header-mission,
  .global-hero__identity small,
  .global-hero__identity em,
  .global-hero__xptext,
  .global-hero__power small,
  .resource.energy,
  .settings {
    display: none;
  }

  .global-hero {
    height: 48px;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    padding: 3px;
  }

  .global-hero__portrait {
    width: 40px;
    height: 40px;
  }

  .global-hero__identity b {
    font-size: 13px;
  }

  .global-hero__power {
    min-width: 58px;
  }

  .global-hero__power b {
    font-size: 16px;
  }

  .resources {
    gap: 3px;
  }

  .resource {
    min-width: 42px;
    min-height: 32px;
    padding: 5px;
    font-size: 11px;
  }

  .objective-bar {
    min-height: 48px;
    margin: 0;
    padding: 6px 9px;
  }

  .objective-rune {
    width: 34px;
    height: 34px;
  }

  .objective-copy b {
    font-size: 12px;
  }

  .objective-copy span {
    display: none;
  }

  .objective-bar .button {
    min-height: 36px;
    padding: 6px 9px;
  }

  .section-navigation {
    position: sticky;
    top: 58px;
    z-index: 45;
    min-height: 36px;
    display: flex;
    gap: 2px;
    padding: 0 6px;
    overflow-x: auto;
    border-bottom: 1px solid #32291f;
    background: #08090df5;
  }

  #view {
    min-height: calc(100dvh - 142px);
    overflow: visible;
  }

  .content,
  .location-screen,
  .inventory-page,
  .forge-page,
  .collection-journal,
  .public-profile,
  .character-screen,
  .combat-screen {
    width: 100%;
    min-width: 0;
    padding: 7px;
  }

  .mobile-dock {
    position: fixed;
    z-index: var(--layer-mobile-nav);
    left: 0;
    right: 0;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding-bottom: env(safe-area-inset-bottom);
  }

  .mobile-dock button {
    min-height: 62px;
  }

  .vey-more-panel {
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-height: 84vh;
    padding-bottom: calc(74px + env(safe-area-inset-bottom));
    border-width: 1px 0 0;
    border-radius: 14px 14px 0 0;
  }

  .companions-location,
  .mounts-location {
    display: grid;
    gap: 7px;
    overflow: visible;
  }

  .companions-location > .location-hero,
  .mounts-location > .location-hero {
    min-height: 148px;
    height: 148px;
    margin: 0;
  }

  .arena-location > .location-hero,
  .guild-hall-location > .location-hero,
  .abyssal-gate-location > .location-hero,
  .sanctum-location > .location-hero {
    min-height: 250px;
    height: 250px;
  }

  .arena-roster > .location-section-heading {
    display: grid;
    gap: 6px;
  }

  .arena-roster .arena-leaderboard {
    width: 100%;
    margin: 0;
  }

  .arena-roster .arena-leaderboard summary {
    padding: 9px 11px;
    font-size: 10px;
  }

  .companions-location .location-hero__heading,
  .mounts-location .location-hero__heading {
    max-width: 82%;
    padding: 12px;
  }

  .companions-location .location-stats,
  .mounts-location .location-stats,
  .companions-location .location-hero__actions:has(.button:disabled),
  .mounts-location .location-hero__actions:has(.button:disabled) {
    display: none;
  }

  .companions-location .location-hero__actions,
  .mounts-location .location-hero__actions {
    top: 8px;
    right: 8px;
    bottom: auto;
  }

  .companions-location .location-hero__actions .button,
  .mounts-location .location-hero__actions .button {
    min-height: 32px;
    padding: 5px 8px;
    font-size: 8px;
  }

  .companions-location > .active-collection-showcase,
  .mounts-location > .active-collection-showcase {
    margin: 0;
  }

  .shared-collection-screen {
    display: grid;
    grid-template-rows: 34px 44px 210px 25px auto;
    gap: 6px;
    overflow: visible;
    margin: 0;
    padding: 0;
  }

  .collection-focus-grid .collection-entity-card {
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
  }

  .collection-focus-grid .collection-art {
    grid-row: 1 / -1;
  }

  .collection-focus-grid .collection-card-footer {
    grid-column: 2;
  }

  .collection-focus-grid .collection-comparison {
    display: none;
  }

  .collection-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 118px;
    overflow: visible;
  }

  .vey-focus-nav {
    grid-template-columns: 50px minmax(0, 1fr) 50px;
    margin: 6px 0;
  }

  .vey-focus-nav .previous,
  .vey-focus-nav .next {
    min-width: 50px;
    padding: 0;
    font-size: 0;
  }

  .vey-focus-nav .previous::before {
    left: 16px;
  }
  .vey-focus-nav .next::before {
    right: 16px;
  }

  .vey-focus-nav .focus-view-all {
    grid-column: 1 / -1;
    min-height: 38px;
  }

  .vey-focus-track:not(.vey-view-all) {
    display: block;
    overflow: hidden;
  }

  .vey-focus-track:not(.vey-view-all) > .vey-focus-previous,
  .vey-focus-track:not(.vey-view-all) > .vey-focus-next {
    display: none;
  }

  .vey-focus-track:not(.vey-view-all) > .vey-focus-current {
    display: block;
    opacity: 1;
    transform: none;
  }

  .collection-focus-grid.vey-focus-track:not(.vey-view-all)
    > .collection-entity-card.vey-focus-current {
    display: grid;
  }

  .vey-tabs {
    position: sticky;
    top: 94px;
    z-index: 35;
  }

  .collection-journal.vey-tabbed > .vey-tab-active {
    height: auto;
    max-height: none;
  }

  .boss-hunt-grid.vey-focus-track:not(.vey-view-all) > .vey-focus-current {
    min-height: 480px;
  }

  .rift-advanced-toggle {
    display: block;
  }

  .character-screen.phase7-character {
    display: flex;
    flex-direction: column;
  }

  .phase7-character .character-profile-header {
    order: 1;
  }
  .phase7-character .character-core {
    order: 2;
  }
  .phase7-character .profile-showcase-strip {
    order: 3;
  }
  .phase7-character .character-inventory-dock {
    order: 4;
  }

  .phase7-character .hero-figure {
    min-height: 360px;
  }

  .phase7-character .character-inventory-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
  }

  .phase7-character .character-inventory-grid > .item-slot {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
  }

  .rift-select-stage,
  .forge-workbench,
  .public-profile-grid {
    display: flex;
    flex-direction: column;
  }

  .rift-inspect {
    order: 1;
  }
  .rift-shard-grid {
    order: 2;
  }

  .combat-screen {
    display: flex;
    flex-direction: column;
  }

  .combat-toolbar {
    order: 3;
  }
  .combat-stage {
    order: 1;
    min-height: 430px;
  }
  .combat-result-grid {
    order: 2;
  }

  .game-tooltip.is-bottom-sheet,
  .advanced-stats.grouped,
  .power-details-panel {
    position: fixed;
    z-index: 100;
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 100vw;
    margin: 0;
    box-sizing: border-box;
    transform: none !important;
    max-height: 82vh;
    overflow: auto;
    border-radius: 14px 14px 0 0;
  }

  .motion-reduced .vey-focus-track > .vey-focus-previous,
  .motion-reduced .vey-focus-track > .vey-focus-current,
  .motion-reduced .vey-focus-track > .vey-focus-next,
  .motion-reduced #view {
    transition-duration: 0s !important;
    animation: none !important;
  }
}

/* Reborn shell keeps the two requested utility actions reachable on mobile. */
@media (max-width: 900px) {
  body .topbar .notification-button {
    width: 36px;
    height: 36px;
    display: grid !important;
  }

  body .topbar .settings {
    display: none !important;
  }

  body .topbar .resources {
    gap: 4px;
  }

  body .topbar .resources .resource,
  body .topbar .player-vital {
    display: none !important;
  }
}

@media (max-width: 430px) {
  .resource.gold {
    display: none;
  }

  .location-heading h1,
  .view-title h1,
  .collection-heading h1 {
    font-size: 26px;
  }

  .vey-more-panel section > div {
    grid-template-columns: 1fr 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  #view,
  #view.view-enter,
  .vey-focus-track > *,
  .vey-more-panel,
  .mobile-dock,
  .game-tooltip {
    animation: none !important;
    transition-duration: 0s !important;
  }
}

@media (max-width: 900px) {
  .toast {
    left: 12px;
    right: 12px;
    bottom: calc(96px + env(safe-area-inset-bottom));
    z-index: 120;
    max-width: none;
  }

  .game-tooltip.is-bottom-sheet {
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    transform: none !important;
  }
}

@media (max-width: 900px) {
  body .toast {
    top: 70px;
    bottom: auto;
    left: 8px;
    right: 8px;
    max-width: none;
    transform: translateY(-130%);
  }

  body .toast.show {
    transform: translateY(0);
  }
}
@media (max-width: 900px) {
  .expedition-screen {
    width: 100%;
    height: auto;
    min-height: calc(100dvh - 142px);
    padding: 7px 7px calc(82px + env(safe-area-inset-bottom));
    overflow: visible;
  }
  .adventure-screen {
    display: block;
  }
  .adventure-tabs {
    position: sticky;
    top: 94px;
    z-index: 12;
    height: 38px;
    margin-bottom: 7px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    background: #080d13f2;
  }
  .adventure-screen.active > .adventure-tabs,
  .adventure-screen.report > .adventure-tabs {
    position: static;
  }
  .adventure-explore,
  .adventure-bosses,
  .adventure-quests {
    display: block;
    height: auto;
  }
  .adventure-focus-nav,
  .adventure-bosses .adventure-focus-nav {
    grid-template-columns: 52px minmax(0, 1fr) 52px;
    min-height: 45px;
    margin-bottom: 7px;
  }
  .adventure-rune {
    justify-content: center;
    padding: 5px;
  }
  .adventure-rune.next {
    justify-content: center;
  }
  .adventure-rune span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }
  .adventure-all-regions {
    grid-column: 1 / -1;
    min-height: 31px;
    margin: 0 5px 5px;
  }
  .adventure-region-focus,
  .adventure-boss-focus,
  .adventure-active-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  .adventure-region-focus {
    position: relative;
    display: block;
    min-height: 510px;
  }
  .adventure-region-artwork {
    position: absolute;
    inset: 0;
    min-height: 100%;
    background:
      linear-gradient(
        0deg,
        #090e15 4%,
        rgba(9, 14, 21, 0.84) 44%,
        transparent 78%
      ),
      var(--region-art) center/cover no-repeat;
  }
  .adventure-region-info {
    position: absolute;
    inset: auto 9px 9px;
    width: auto;
    padding: 10px;
    display: grid;
    grid-template-rows: auto auto auto auto;
    background: linear-gradient(
      145deg,
      rgba(8, 14, 21, 0.78),
      rgba(5, 10, 16, 0.93)
    );
  }
  .adventure-region-info h1 {
    font-size: 25px;
  }
  .adventure-expedition-dock {
    margin-top: 7px;
    padding: 9px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  .adventure-expedition-dock > header > b {
    display: block;
    color: #75c8bc;
    font:
      700 9px "DM Mono",
      monospace;
  }
  .expedition-duration-grid {
    grid-template-columns: 1fr 1fr;
  }
  .expedition-duration {
    min-height: 69px;
  }
  .adventure-expedition-dock dl {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .adventure-region-layer {
    position: fixed;
    z-index: 110;
    inset: 0;
    padding: 8px;
  }
  .adventure-region-dialog {
    max-height: calc(100dvh - 16px);
  }
  .adventure-region-dialog > div {
    grid-template-columns: minmax(0, 1fr);
  }
  .adventure-region-option {
    grid-template-columns: 72px minmax(0, 1fr) 24px;
  }
  .adventure-quests > header {
    margin-bottom: 7px;
  }
  .adventure-questgivers {
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
    margin-bottom: 7px;
  }
  .adventure-questgiver {
    min-height: 48px;
  }
  .adventure-quest-filters {
    height: 36px;
    margin-bottom: 7px;
  }
  .adventure-quest-scroll {
    overflow: visible;
  }
  .adventure-quest-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .adventure-quest-card {
    min-height: 185px;
  }
  .adventure-boss-focus {
    overflow: visible;
  }
  .adventure-boss-art {
    min-height: 280px;
    background:
      linear-gradient(0deg, #090d13 0, transparent 42%),
      var(--boss-art) center/cover;
  }
  .adventure-boss-copy {
    padding: 16px 12px;
  }
  .adventure-boss-copy h1 {
    font-size: 34px;
  }
  .adventure-boss-copy dl {
    grid-template-columns: minmax(0, 1fr);
  }
  .adventure-boss-copy dl div {
    grid-column: auto;
  }
  .expedition-active-header {
    min-height: 150px;
    padding: 14px;
    grid-template-columns: minmax(0, 1fr);
    background:
      linear-gradient(0deg, rgba(5, 9, 15, 0.97), rgba(5, 9, 15, 0.55)),
      var(--region-art) center/cover;
  }
  .expedition-clock {
    text-align: left;
  }
  .adventure-active-grid {
    margin-top: 7px;
    gap: 7px;
  }
  .expedition-region-art {
    height: 145px;
  }
  .expedition-feed {
    min-height: 330px;
  }
  .expedition-loot-bag {
    max-height: none;
    margin-top: 7px;
  }
  .expedition-loot-bag .expedition-loot-grid {
    max-height: none;
  }
  .expedition-loot-grid {
    grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
  }
  .expedition-report-header,
  .expedition-report-stats,
  .expedition-report-quests,
  .expedition-total-loot,
  .expedition-report-actions {
    margin-top: 7px;
  }
  .expedition-report-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .expedition-report-actions {
    display: grid;
  }
}