.native-content { min-width:0; overflow-wrap:normal; word-break:normal; font-size:14px; line-height:1.5; }
.native-content img { max-width:100%; height:auto; }
.native-content table { border-collapse:collapse; table-layout:auto; }
.native-content td,.native-content th { padding:8px; border-bottom:1px solid #b9a47d; }
.native-content input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.native-content select,.native-content textarea { max-width:100%; box-sizing:border-box; padding:9px; border:1px solid #938369; border-radius:4px; background:#fffaf0; color:#102638; }
.native-content button,.native-content input[type=submit] { cursor:pointer; }
.native-content a { color:#124c84; }
.native-content .error { color:#892318; }
.native-content .success { color:#236129; }
.world-online .is-offline { background:#ad403f; box-shadow:none; }
.ranking-list a.rank-name { color:inherit; text-decoration:none; }
.ranking-list li:only-child:not(:has(.rank-position)) { display:block; white-space:normal; }
.home-news-copy a { color:inherit; }
.not-migrated { display:none!important; }
.native-content { overflow-x:auto; }
.native-content th,.native-content td { word-break:normal; overflow-wrap:normal; }
.native-content th,.native-content tr:first-child b,.native-content label { white-space:nowrap; }
.native-content h2 { font-size:22px; line-height:1.3; }
.native-content .native-table-scroll { max-width:100%; overflow-x:auto; margin:12px 0; }
.native-content .native-table-scroll>table { min-width:560px; width:100%; }
/* The legacy MyAAC shadow GIF tiles red stripes through the account form. */
.native-content #createaccount .TableContentAndRightShadow { background:#efe3c5!important; }
.native-content .ranking-layout,.native-content .ranking-layout>tbody,.native-content .ranking-layout>tbody>tr { display:block; width:100%; }
.native-content .ranking-layout>tbody>tr>td { display:block; width:auto!important; padding:0; border:0; }
.native-content .ranking-layout>tbody>tr>td:first-child:empty { display:none; }
.native-content .ranking-layout>tbody>tr>td:last-child { display:flex; flex-wrap:wrap; gap:12px; margin-top:16px; }
.native-content .ranking-layout>tbody>tr>td:last-child>table { flex:1 1 180px; width:auto!important; }
.native-content .ranking-filters td { padding:8px 5px; }
.native-content .ranking-filters td:first-child { display:none; }
.native-content .ranking-filters label { display:block; white-space:normal; }
.native-content .ranking-filters select { width:100%; min-width:120px; }
.native-content img[src*="outfit.php"] { position:static!important; margin:0!important; width:48px; height:48px; object-fit:contain; }
.native-content img[src*="flags/"] { width:16px; height:11px; }
.world-stats a { color:inherit; text-decoration:none; }
.world-stats a:hover,.ranking-list a:hover { text-decoration:underline; }
@media(min-width:1001px) { .internal-shell .home-grid { grid-template-columns:23% minmax(0,1fr) 21%; } }
@media(min-width:761px) and (max-width:1000px) { .internal-shell .home-grid { grid-template-columns:25% minmax(0,1fr); } .internal-shell .right-rail { grid-column:2; display:grid; grid-template-columns:1fr 1fr; } .internal-shell .rail-cta { grid-column:1/-1; } }
@media(max-width:760px) { .native-content { font-size:14px; } .native-content .ranking-filters tr,.native-content .ranking-filters tbody { display:block; } .native-content .ranking-filters td:not(:first-child) { display:inline-block; width:48%; vertical-align:top; } .page-title h1 { font-size:28px; } }

/* r07: give account management more room and keep its navigation usable on phones. */
@media (min-width:1001px) {
  .internal-shell:has(#account-manage) .home-grid { grid-template-columns:20% minmax(0,1fr) 18%; }
}
#account-manage { display:grid; grid-template-columns:170px minmax(0,1fr); gap:16px; align-items:start; }
#account-manage #one { float:none; width:auto; min-width:0; }
#account-manage #two { margin:0; padding:0; min-width:0; }
#account-manage #two table { max-width:100%; }
#account-manage #two td { overflow-wrap:anywhere; }
@media (max-width:760px) {
  #account-manage { display:flex; flex-direction:column; gap:12px; }
  #account-manage #one { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; }
  #account-manage #one a { margin:0; padding:9px 8px; background:#e5dfcc; border:1px solid #c6ae80; }
  #account-manage #two { width:100%; }
  #account-manage #two table { width:100%; table-layout:auto; }
}
/* r08: replace the legacy red striped news texture with the portal parchment. */
.native-content .NewsHeadlineBackground {
  background-color:#f3e5c4 !important;
  background-image:none !important;
  border:1px solid #c6a66c;
  border-radius:4px 4px 0 0;
  box-sizing:border-box;
  min-height:64px;
  padding:8px 10px;
}
.native-content .NewsHeadlineDate { color:#76572b; font-size:12px; }
.native-content .NewsHeadlineText { color:#102a40; font:700 18px/1.35 Georgia,serif; }
/* r09: place account details beneath the vertical account menu and use the full content width. */
@media (min-width:1001px) {
  .internal-shell:has(#account-manage) .home-grid { grid-template-columns:20% minmax(0,1fr) 18%; }
}
#account-manage {
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:16px;
  min-width:0;
}
#account-manage #one {
  float:none!important;
  width:170px!important;
  max-width:100%;
  min-width:0;
  margin:0!important;
}
#account-manage #one a { display:block; }
#account-manage #two {
  float:none!important;
  clear:both;
  width:100%!important;
  max-width:100%;
  min-width:0;
  margin:0!important;
  padding:0!important;
}
#account-manage #two table { width:100%; max-width:100%; }
#account-manage #two td { overflow-wrap:anywhere; }
@media (max-width:1000px) {
  #account-manage #one { width:100%!important; }
  #account-manage #two { width:100%!important; }
  #account-manage #two table { width:100%; table-layout:auto; }
}

/* r10: keep the account introduction beside its menu and give character actions room. */
@media (min-width:761px) {
  #account-manage {
    display:grid!important;
    grid-template-columns:170px minmax(0,1fr);
    grid-auto-flow:row;
    align-items:start!important;
    gap:0 16px;
  }
  #account-manage #one {
    grid-column:1;
    grid-row:1 / span 4;
    align-self:start;
    width:170px!important;
    max-width:100%;
  }
  #account-manage #two { display:contents!important; }
  #account-manage #two > :nth-child(-n+5) {
    grid-column:2;
    min-width:0;
    max-width:100%;
  }
  #account-manage #two > h1:first-child { margin:0 0 8px; }
  #account-manage #two > p:nth-child(2),
  #account-manage #two > div:nth-child(3) { margin:0 0 8px; }
  #account-manage #two > br { display:none!important; }
  #account-manage #two > a:nth-child(5) {
    justify-self:start;
    margin:4px 0 14px;
  }
  #account-manage #two > :nth-child(n+6) {
    grid-column:1 / -1;
    min-width:0;
    max-width:100%;
  }
  #account-manage #two > h2 { margin-top:18px; }
  #account-manage #two table { width:100%; max-width:100%; }
  #account-manage .native-table-scroll > table { min-width:760px; table-layout:auto; }
  #account-manage .native-table-scroll th:nth-last-child(-n+2),
  #account-manage .native-table-scroll td:nth-last-child(-n+2) {
    min-width:72px;
    white-space:nowrap;
    text-align:center;
  }
  #account-manage .native-table-scroll img[src*="outfit.php"] {
    width:48px;
    height:48px;
    min-width:48px;
    object-fit:contain;
  }
}
@media (max-width:760px) {
  #account-manage { display:flex!important; flex-direction:column!important; gap:12px; }
  #account-manage #one {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    width:100%!important;
  }
  #account-manage #one a { min-width:0; margin:0; padding:9px 8px; }
  #account-manage #two { display:block!important; width:100%!important; }
  #account-manage #two > :nth-child(-n+5),
  #account-manage #two > :nth-child(n+6) { grid-column:auto; }
  #account-manage #two table { width:100%; table-layout:auto; }
  #account-manage .native-table-scroll > table { min-width:760px; }
}

/* r20: use the Monk artwork at its own aspect ratio and remove the legacy art frame. */
.native-content figure.article-art-large { display:block!important; width:100%; height:auto!important; min-height:0!important; aspect-ratio:auto!important; margin:16px auto!important; padding:0!important; overflow:hidden; background:none!important; background-image:none!important; box-shadow:none!important; }
.native-content figure.article-art-large > img { display:block!important; width:100%!important; height:auto!important; max-height:none!important; aspect-ratio:auto!important; object-fit:contain!important; object-position:center; margin:0!important; padding:0!important; border:0!important; background:transparent!important; vertical-align:top; }
