/* Existing artwork is layered into the working surfaces of the subpages. */
.workspace {
    --scene-navy: #041823;
    --scene-deep: #06131c;
    --scene-teal: #67e0de;
    --scene-copper: #d99553;
    --scene-gold: #ffcc78;
    padding-top: 18px;
}
.workspace .subpage-heading {
    position: relative;
    isolation: isolate;
    display: block;
    min-height: 124px;
    border-color: #326775;
    border-inline-start-color: var(--scene-teal);
    background: radial-gradient(ellipse at 83% 60%,#144350,var(--scene-deep) 67%);
}
.workspace .subpage-heading.accent-warm {
    --page-accent: var(--scene-gold);
    border-color: #98683f;
    border-inline-start-color: var(--scene-gold);
    background: radial-gradient(ellipse at 80% 55%,#4d3022,var(--scene-deep) 70%);
}
.workspace .subpage-heading.accent-cool { --page-accent: var(--scene-teal); }
.workspace .subpage-heading::after,
.route-shop .shop-catalog-heading::after,
.bug-report-strip::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 1px;
    background: linear-gradient(90deg,transparent,var(--page-accent,var(--scene-teal)) 40%,transparent 92%);
    pointer-events: none;
}
.workspace .subpage-heading-copy {
    position: relative;
    z-index: 1;
    max-width: 68%;
    grid-template-columns: minmax(0,1fr);
    padding: 14px clamp(16px,2.7vw,35px);
    row-gap: 4px;
    background: linear-gradient(90deg,#06131cf5,#06131cc5 72%,transparent);
}
.workspace .subpage-heading h1 { margin: 0; text-shadow: 0 2px 14px #000b; }
.workspace .subpage-heading p { margin: 0; }
.workspace .subpage-heading .button { grid-column: 1; grid-row: 4; justify-self: start; }
.workspace .subpage-motif {
    position: absolute;
    inset: 0 0 0 27%;
    min-height: 0;
    mask-image: linear-gradient(90deg,transparent,#000 38%);
}
.workspace .motif-realm .subpage-motif { background-position: center,75% 41%; }
.workspace .motif-reliquary .subpage-motif { background-position: center,center 47%; }
.workspace .route-register .auth-art { background-position: center; }
.route-404 .subpage-heading { min-height: 190px; }
.route-404 .subpage-heading-copy { padding-block: 26px; }

/* The empty catalog and its heading share one illustration on desktop. */
.route-shop .shop-workspace-unpublished {
    position: relative;
    isolation: isolate;
}
.route-shop .shop-workspace-unpublished::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0 0 0 calc(max(200px,25%) + 26px);
    border: 1px solid #88603d;
    border-radius: var(--radius);
    background: linear-gradient(180deg,#06131cbb,transparent 35%,transparent 58%,#061822 94%),
        url('/assets/nova-shop-sunset.webp') center 55% / cover no-repeat;
}
.route-shop .shop-catalog-heading {
    position: relative;
    padding: 14px 18px;
    border: 1px solid #88603d;
    border-radius: var(--radius);
    --page-accent: var(--scene-gold);
    background: linear-gradient(90deg,#06131cf5,#06131caa 58%,#06131c18),
        url('/assets/nova-shop-sunset.webp') center 34% / cover no-repeat;
}
.route-shop .shop-workspace-unpublished .shop-catalog-heading { background: transparent; border-color: transparent; }
.route-shop .shop-workspace-unpublished .shop-catalog-heading::after { display: none; }
.route-shop .shop-workspace-unpublished .shop-catalog > .section-heading { display: none; }
.route-shop .shop-catalog-heading .eyebrow { color: var(--scene-gold); }
.route-shop .shop-catalog-heading p { max-width: 62ch; }
.direction-b-shop .shop-filters {
    border-color: #ad7441;
    background: radial-gradient(ellipse at 24% 0,#68412a,transparent 54%),linear-gradient(140deg,#37251e,#121c25 80%);
    box-shadow: inset 0 0 20px #e6a05818;
}
.shop-filter-art {
    aspect-ratio: 1.65;
    background: linear-gradient(0deg,#37251e,transparent 34%),url('/assets/nova-shop-sunset.webp') center 72% / 148% auto no-repeat;
}
.shop-filter-disclosure { padding-top: 14px; }
.shop-filter-disclosure summary { padding-bottom: 7px; border-bottom: 1px solid #a7774a; }
.shop-empty-state { border-color: #87603c; }
.shop-empty-state h2 { font-size: clamp(1.1rem,2.2vw,1.85rem); margin: 7px 0 11px; }
.shop-empty-unpublished {
    padding: clamp(230px,30vw,420px) clamp(16px,3vw,36px) 30px;
    border-color: transparent;
    background: transparent;
}
.shop-empty-unpublished .shop-empty-art { display: none; }
.shop-empty-unpublished h2 { text-shadow: 0 2px 12px #000; }
.route-shop .shop-catalog .product { border-color: #785737; }

/* Bug list and detail use separate landscape and parchment illustrations. */
.route-bugs .subpage-heading { min-height: clamp(145px,19vw,220px); }
.route-bugs .subpage-heading .subpage-motif {
    inset: 0;
    mask-image: none;
    background: linear-gradient(90deg,#06131c 2%,transparent 71%),
        url('/assets/nova-bugtracker-eclipse.webp') right 45% / cover no-repeat;
}
.route-bugs .motif-report .subpage-motif {
    background-image: linear-gradient(90deg,#06131c 2%,transparent 71%),url('/assets/nova-bugtracker-report.webp');
}
.bug-workspace-list > .bug-search-module,
.bug-workspace-list > .bug-results-module,
.bug-workspace-list > .bug-report-strip { border-color: #438f98; }
.bug-workspace-list > .bug-search-module { background: linear-gradient(105deg,#102f3b,var(--scene-navy) 65%); }
.bug-report-table th { background: linear-gradient(180deg,#17434d,#102c36); }
.bug-report-table .bug-empty-state {
    padding: clamp(28px,5vw,60px) 14px;
    background: linear-gradient(90deg,#06182438,#061824e8 38%,#061824e8 62%,#06182438),
        url('/assets/nova-bugtracker-eclipse.webp') center 59% / cover no-repeat;
    color: var(--text);
    font-size: clamp(1rem,2.5vw,1.55rem);
}
.bug-empty-icon {
    display: block;
    width: 24px;
    height: 30px;
    margin: 0 auto 10px;
    border: 2px solid var(--scene-teal);
    border-radius: 4px;
    background: linear-gradient(var(--scene-teal),var(--scene-teal)) center 44% / 12px 2px no-repeat,
        linear-gradient(var(--scene-teal),var(--scene-teal)) center 66% / 12px 2px no-repeat;
}
.route-bugs .bug-workspace-list > .bug-report-strip {
    position: relative;
    grid-template-columns: minmax(0,1fr) minmax(140px,46%);
    background: radial-gradient(ellipse at 90% 0,#17505a,#061822 69%);
}
.bug-report-strip-art {
    min-height: clamp(110px,16vw,190px);
    background: url('/assets/nova-bugtracker-report.webp') 73% 56% / cover no-repeat;
    mask-image: linear-gradient(90deg,transparent,#000 27%);
}
.bug-report-strip-content { align-self: center; }
.bug-workspace-detail .panel { border-color: #326775; }
.bug-detail-meta {
    grid-column: 1/-1;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    margin: 0;
    border: 1px solid #438f98;
    border-radius: var(--radius);
    background: linear-gradient(125deg,#102f3b,#061822);
}
.bug-detail-meta > div { padding: 10px 16px; overflow-wrap: anywhere; }
.bug-detail-meta > div + div { border-inline-start: 1px solid #326775; }
.bug-detail-meta dt { color: var(--scene-teal); }
.bug-detail-meta dd { margin: 0; }
.route-bugs .bug-workspace-detail > .bug-detail-steps { grid-column: 1/-1; grid-row: 3; }
.route-bugs .bug-workspace-detail > .bug-detail-replies { grid-column: 1/-1; grid-row: 4; position: static; }
.route-bugs .bug-with-team > .bug-detail-steps,
.route-bugs .bug-with-team > .bug-detail-replies { grid-column: 1; }
.route-bugs .bug-with-team > .bug-detail-team { grid-column: 2; grid-row: 3/span 2; border-color: #98683f; }
.bug-replies-empty {
    display: grid;
    align-items: end;
    min-height: clamp(120px,20vw,230px);
    margin: 0 0 14px;
    padding: 16px;
    border-radius: var(--radius);
    text-align: center;
    background: linear-gradient(0deg,#061822 5%,transparent 65%),
        url('/assets/nova-bugtracker-report.webp') 71% 55% / cover no-repeat;
}

/* The existing route layouts carry the same image treatment into their modules. */
.route-login .auth-workspace, .route-register .auth-workspace { border-color: #a5784b; }
.auth-workspace .auth-art { mask-image: linear-gradient(90deg,#000 82%,transparent); }
.auth-workspace .auth-task { background: radial-gradient(ellipse at 100% 0,#102e3b,transparent 73%); }
.reading-nav.panel { border-color: #3c7c86; background: linear-gradient(155deg,#122e3b,var(--scene-deep)); }
.reading-nav.panel::after {
    content: '';
    display: block;
    height: 68px;
    margin-top: 12px;
    border-radius: var(--radius);
    background: url('/assets/nova-features.png') center top / 100% 304% no-repeat;
    mask-image: linear-gradient(180deg,#000 75%,transparent);
}
.route-faq .reading-nav.panel::after { background: url('/assets/reliquary-midnight-v1.png') center 48%/cover; }
.reading-body .reader-question, .reading-body .reader-information {
    padding: 12px 17px;
    margin: 0 0 10px;
    border: 1px solid #32717e;
    border-radius: var(--radius);
    background: linear-gradient(115deg,#12313d,var(--scene-deep));
}
.reader-question summary { cursor: pointer; font-weight: 650; }
.reader-information h2 { margin: 0 0 7px; }
.route-wartung .reader-information { border-inline-start: 2px solid var(--scene-teal); }
.route-news .news-index-grid > .empty,
.route-patchnotes .news-index-grid > .empty,
.route-vote #vote-providers > .empty,
.route-rewards .subpage-primary .cards > .empty {
    grid-column: 1/-1;
    padding: 22px 16px;
    border: 1px solid #43828c;
    background-image: linear-gradient(90deg,#061824b0,#061824eb 48%,#061824a8),url('/assets/nova-features.png');
    background-size: cover,100% 304%;
    background-position: center,top;
}
.route-patchnotes .news-index-grid > .empty { background-position: center,bottom; }
.route-vote #vote-providers > .empty { background-position: center,center; }
.route-rewards .subpage-primary .cards > .empty {
    border-color: #9d7148;
    background-image: linear-gradient(90deg,#06182488,#061824e8 58%),url('/assets/reliquary-midnight-v1.png');
    background-size: cover;
    background-position: center 48%;
}
.route-account .account-activity > .panel:first-child { border-color: #956338; }
.route-account .account-activity > .panel:first-child .empty {
    background-image: linear-gradient(90deg,#0618247a,#061824dc 60%),url('/assets/nova-features.png');
    background-size: cover,100% 304%;
    background-position: center,center;
}
.route-admin .admin-group { border-color: #397982; }
.route-admin .admin-body .page-list { border-color: #32717e; }
.route-legal .reading-body .callout { border-color: #98683f; }
.route-privacy .reading-body .callout { border-color: #32717e; }
@media(max-width:760px) {
    .workspace { padding-top: 12px; }
    .workspace .subpage-heading { min-height: 98px; }
    .workspace .subpage-heading-copy { max-width: 83%; padding: 9px 12px; }
    .workspace .subpage-motif { inset-inline-start: 28%; }
    .workspace .subpage-heading h1 { font-size: clamp(1.5rem,6vw,2.15rem); }
    .route-shop .shop-catalog-heading { padding: 10px 12px; }
    .route-shop .shop-catalog-heading p { max-width: 70%; }
    .shop-filter-art { height: 44px; aspect-ratio: auto; }
    .shop-filter-disclosure { padding-top: 9px; }
    .shop-filter-disclosure summary { padding-bottom: 0; border-bottom: 0; }
    .route-shop .shop-workspace-unpublished::before { display: none; }
    .route-shop .shop-workspace-unpublished .shop-catalog-heading {
        min-height: 220px;
        border-color: #88603d;
        background: linear-gradient(180deg,#06131cec,transparent 65%),
            url('/assets/nova-shop-sunset.webp') center / cover no-repeat;
    }
    .shop-empty-unpublished {
        padding: 16px 12px;
        border-color: #87603c;
        background: var(--scene-deep);
    }
    .shop-empty-unpublished .shop-empty-art {
        display: block;
        max-width: none;
        aspect-ratio: 2.5;
        background: linear-gradient(0deg,#06131c,transparent 35%),
            url('/assets/nova-shop-sunset.webp') center 72% / cover no-repeat;
    }
    .auth-workspace .auth-art { mask-image: none; }
    .route-bugs .bug-workspace-list > .bug-report-strip { grid-template-columns: minmax(0,1fr) minmax(70px,35%); }
    .bug-detail-meta > div { padding: 8px; }
    .route-bugs .bug-workspace-detail > .panel {
        grid-column: 1/-1;
        grid-row: auto;
        position: static;
    }
    .reading-nav.panel::after { display: none; }
}
