/* InnerPageShell: original R9 canvas coordinates, unmodified approved PNGs.
 * Native slices: top [0,724), bottom [1640,2545). No image content is redrawn.
 * The two 1672x941 connectors retain their natural aspect ratio. The existing
 * bottom palace image also repeats proportionally beneath them for long pages.
 */
body.ip-page {
    background: #102e54;
    overflow-x: clip;
    min-width: 320px;
}
.ip-shell {
    width: 100%;
    max-width: 3840px;
    margin: 0 auto;
    container-type: inline-size;
    isolation: isolate;
}
.ip-stage-window {
    position: relative;
    width: 100%;
    overflow: hidden;
    isolation: isolate;
}
.ip-stage-window--top { aspect-ratio: 1672 / 724; }
.ip-stage-window--bottom { aspect-ratio: 1672 / 905; }
.ip-native-stage.tc-master {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    box-shadow: none;
}
.ip-stage-window--bottom .ip-native-stage { top: -98.0861244019cqw; }
.ip-stage-window .tc-master__art { max-width: none; }
.ip-stage-window .tc-hero-subtitle { margin: 0; }
.ip-shell.tc-motion-paused .tc-ambient * { animation-play-state: paused; }
.ip-middle {
    position: relative;
    isolation: isolate;
    min-height: 112.5598086124cqw;
    background: #102e54;
}
.ip-middle__art {
    --ip-palace-tile-height: max(56.2799043062cqw, 619.0789473684px);
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    /* Full-height paint follows content; a wider mobile tile crops only sides. */
    background-image: url('../innerpage-v206/innerpage-connect-bottom.png');
    background-position: center top;
    background-size: max(100%, 1100px) auto;
    background-repeat: repeat-y;
}
.ip-middle__art::before {
    /* Cover each base-tile join with the intact middle of the same sharp image.
     * This layer's own joins land halfway between seams, where its mask is clear.
     * The unmasked base below always paints the entire content height. */
    --ip-palace-seam-mask: repeating-linear-gradient(to bottom,
        #000 0 12px, transparent 90px,
        transparent calc(var(--ip-palace-tile-height) - 90px),
        #000 calc(var(--ip-palace-tile-height) - 12px) var(--ip-palace-tile-height));
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background-image: inherit;
    background-size: inherit;
    background-repeat: inherit;
    background-position: center calc(var(--ip-palace-tile-height) / 2);
    -webkit-mask-image: var(--ip-palace-seam-mask);
    mask-image: var(--ip-palace-seam-mask);
}
.ip-connector {
    position: absolute;
    z-index: 1;
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    filter: none;
    transform: none;
}
.ip-connector--top {
    top: 0;
    -webkit-mask-image: linear-gradient(#000 82%, transparent 100%);
    mask-image: linear-gradient(#000 82%, transparent 100%);
}
.ip-connector--bottom {
    bottom: 0;
    -webkit-mask-image: linear-gradient(transparent 0%, #000 18%);
    mask-image: linear-gradient(transparent 0%, #000 18%);
}
.ip-content.forum-shell {
    width: min(64%, 1320px);
    min-width: 0;
    min-height: 0;
    margin: 0 auto;
    padding: clamp(24px, 3cqw, 76px) 0 clamp(40px, 5cqw, 110px);
    color: var(--forum-ink);
    font-family: var(--body-font);
    container: inner-content / inline-size;
    overflow-wrap: anywhere;
}
.ip-content:focus { outline: none; }
.ip-account-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-bottom: 28px;
}
.ip-account-bar .site-account-state { width: auto; flex: 1 1 300px; }
.ip-content-jump {
    padding: 10px 14px;
    color: #fff1c7;
    background: #0a294ae8;
    border: 1px solid #b59552;
    border-radius: 5px;
    text-decoration: none;
    font-size: .85rem;
}
.ip-content-jump:focus-visible { outline: 2px solid #fff1c7; outline-offset: 3px; }
.ip-content #page-content { scroll-margin-top: 20px; }
.ip-content .donation-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@container inner-content (max-width: 1200px) {
    .donation-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .donation-store { grid-template-columns: 190px minmax(0, 1fr); }
    .donation-store__content { padding: 24px 18px 36px; }
}
@container inner-content (max-width: 800px) {
    .donation-store, .donation-detail-shell { grid-template-columns: minmax(0, 1fr); }
    .donation-store__sidebar, .donation-detail-nav { border-right: 0; border-bottom: 1px solid var(--store-line); }
    .donation-store__sidebar { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); padding: 14px; gap: 4px 10px; }
    .donation-store__sidebar-title { grid-column: 1 / -1; margin: 0 8px 6px; }
}
@container inner-content (max-width: 510px) {
    .donation-product-grid { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 900px) {
    .ip-content.forum-shell { width: calc(100% - 32px); padding-top: 24px; }
    .ip-account-bar { margin-bottom: 18px; }
}
@media (max-width: 480px) {
    .ip-content.forum-shell { width: calc(100% - 20px); }
    .ip-content .donation-store__content { padding: 20px 12px 28px; }
    .ip-content .site-account-state { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .ip-shell *, .ip-shell *::before, .ip-shell *::after {
        animation: none !important;
        scroll-behavior: auto !important;
    }
}
@media (forced-colors: active) {
    .ip-content { forced-color-adjust: auto; }
    .ip-content-jump { border: 1px solid LinkText; }
}