/* Odeyu discovery presentation. The existing topbar/search and sticky
   filter positions are deliberately inherited from saga-theme.css. */
body:is(.discover-shell,.studio-shell) {
    --ink: #070707;
    --panel: #101010;
    --panel-raised: #191919;
    --paper: #f5f5f5;
    --muted: #b2b2b2;
    --faint: #929292;
    --line: #363636;
    --line-strong: #858585;
    --mint: #f0f0f0;
    --discovery-accent: #edc469;
    background: #070707;
    color: #f5f5f5;
}
:is(.discover-shell,.studio-shell) a:hover { color: #fff; }
:is(.discover-shell,.studio-shell) :is(a, button, input, select):focus-visible {
    outline: 2px solid var(--discovery-accent);
    outline-offset: 4px;
}
:is(.discover-shell,.studio-shell) .saga-sidebar {
    background: #050505;
    border-color: #383838;
    padding-top: 24px;
    scrollbar-color: #555 transparent;
}
:is(.discover-shell,.studio-shell) .sidebar-brand { margin-bottom: 32px; }
:is(.discover-shell,.studio-shell) .sidebar-brand .brand {
    color: #fff;
    font: 16px/1.1 Questrian, sans-serif;
    letter-spacing: .2px;
    gap: 6px;
}
:is(.discover-shell,.studio-shell) .brand-light { color: #fff; font-weight: inherit; }
:is(.discover-shell,.studio-shell) .brand-glyph {
    color: #fff;
    font: 42px/1 Jost, sans-serif;
    width: 25px;
}
:is(.discover-shell,.studio-shell) .brand small {
    color: #b2b2b2;
    font: 6px/1.5 Jost, sans-serif;
    letter-spacing: 1.7px;
    margin-top: 7px;
}
:is(.discover-shell,.studio-shell) .icon-button {
    color: #fff;
    background: #080808;
    border: 1px solid #9a9a9a;
    border-radius: 8px;
}
:is(.discover-shell,.studio-shell) .sidebar-collapse { width: 29px; height: 35px; }
:is(.discover-shell,.studio-shell) .sidebar-links { gap: 8px; }
:is(.discover-shell,.studio-shell) .sidebar-links a {
    position: relative;
    gap: 11px;
    min-height: 49px;
    padding: 10px 11px;
    color: #fff;
    background: #050505;
    border: 1px solid #b7b7b7;
    border-radius: 9px;
    font: 14px/1.2 XHeighting, Jost, sans-serif;
    font-weight: 700;
}
:is(.discover-shell,.studio-shell) .sidebar-links a:hover { background: #191919; border-color: #fff; }
:is(.discover-shell,.studio-shell) .sidebar-links a.is-active { background: #0e0e0e; border-color: #eee; }
:is(.discover-shell,.studio-shell) .sidebar-links a.is-active::before {
    content: "";
    position: absolute;
    inset: 6px auto 6px -1px;
    width: 3px;
    background: var(--discovery-accent);
    border-radius: 3px;
}
:is(.discover-shell,.studio-shell) .nav-icon { width: 26px; height: 27px; flex: 0 0 26px; }
:is(.discover-shell,.studio-shell) .nav-icon img { display: block; width: 26px; height: 27px; object-fit: contain; }
:is(.discover-shell,.studio-shell) .nav-arrow { color: #fff; font: 24px/1 Jost, sans-serif; }
:is(.discover-shell,.studio-shell) .sidebar-create {
    min-height: 47px;
    margin-top: 24px;
    border-color: #b7b7b7;
    border-radius: 8px;
    background: #080808;
    color: #fff;
    font: 13px/1.2 XHeighting, Jost, sans-serif;
    font-weight: 700;
}
:is(.discover-shell,.studio-shell) .sidebar-create:hover { border-color: #fff; background: #191919; }
:is(.discover-shell,.studio-shell) .sidebar-history {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid #393939;
    scrollbar-color: #555 transparent;
}
:is(.discover-shell,.studio-shell) .nav-section-label { margin-left: 0; color: #ccc; font-size: 9px; letter-spacing: .8px; }
:is(.discover-shell,.studio-shell) .history-heading { padding: 0 2px; color: #bbb; }
:is(.discover-shell,.studio-shell) .history-date { margin: 22px 0 9px; color: #9fa3a7; font-size: 10px; letter-spacing: .6px; }
:is(.discover-shell,.studio-shell) .history-list a {
    align-items: center;
    gap: 9px;
    padding: 9px 8px;
    margin-bottom: 9px;
    border: 1px solid #777;
    border-radius: 8px;
    background: #080808;
    color: #f4f4f4;
    font-size: 13px;
}
:is(.discover-shell,.studio-shell) .history-list a:hover { border-color: #ddd; background: #151515; }
:is(.discover-shell,.studio-shell) .history-cover { width: 39px; height: 39px; border: 1px solid #969696; border-radius: 50%; object-fit: cover; flex: 0 0 39px; }
:is(.discover-shell,.studio-shell) .history-list small { margin-top: 4px; color: #aaa; font-size: 10px; }
:is(.discover-shell,.studio-shell) .history-empty, :is(.discover-shell,.studio-shell) .history-empty small { color: #aaa; }
:is(.discover-shell,.studio-shell) .history-empty > span { color: #bcbcbc; }
:is(.discover-shell,.studio-shell) .sidebar-bottom { border-color: #393939; color: #ddd; }
:is(.discover-shell,.studio-shell) .sidebar-note { color: #8f8f8f; white-space: normal; }
:is(.discover-shell,.studio-shell) .status-dot { background: var(--discovery-accent); }
:is(.discover-shell,.studio-shell) .saga-topbar { background: #080808; border-color: #353535; }
:is(.discover-shell,.studio-shell) .saga-top-search {
    background: #080808;
    border-color: #808080;
    border-radius: 7px;
    box-shadow: none;
}
:is(.discover-shell,.studio-shell) .saga-top-search svg { stroke: #eee; }
:is(.discover-shell,.studio-shell) .saga-top-search input { color: #fff; }
:is(.discover-shell,.studio-shell) .saga-top-search input::placeholder { color: #aaa; }
:is(.discover-shell,.studio-shell) .saga-top-search:focus-within { border-color: #f0f0f0; box-shadow: 0 0 0 2px #ffffff12; }
:is(.discover-shell,.studio-shell) .saga-top-search kbd { color: #bbb; border-color: #555; background: #0d0d0d; }
:is(.discover-shell,.studio-shell) .topbar-account .account-profile-link,
:is(.discover-shell,.studio-shell) .topbar-account .account-link { color: #eee; }
:is(.discover-shell,.studio-shell) .topbar-account .account-avatar { border-color: #999; box-shadow: none; }
:is(.discover-shell,.studio-shell) .account-button { color: #eee; border-color: #888; background: #080808; }
:is(.discover-shell,.studio-shell) .account-button:hover { background: #1b1b1b; border-color: #eee; }
:is(.discover-shell,.studio-shell) .featured-shelf { margin-bottom: 20px; }
:is(.discover-shell,.studio-shell) .featured-scenario {
    height: auto;
    min-height: 255px;
    border-color: #aaa;
    border-radius: 10px;
    background: #080808;
    box-shadow: none;
}
:is(.discover-shell,.studio-shell) .featured-art { background: #090909; height: auto; }
:is(.discover-shell,.studio-shell) .featured-art img { position: absolute; inset: 0; opacity: 1; filter: none; object-position: center 32%; }
:is(.discover-shell,.studio-shell) .featured-art::after {
    background: linear-gradient(90deg, transparent 65%, #080808 100%);
}
:is(.discover-shell,.studio-shell) .featured-copy { padding: 22px 28px; }
:is(.discover-shell,.studio-shell) .featured-kicker {
    color: var(--discovery-accent);
    font: 12px/1.2 XHeighting, Jost, sans-serif;
    letter-spacing: .3px;
    margin-bottom: 9px;
}
:is(.discover-shell,.studio-shell) .featured-copy h3 { color: #fff; font-size: clamp(28px, 3vw, 42px); line-height: 1.15; }
:is(.discover-shell,.studio-shell) .featured-creator { color: #ddd; margin-bottom: 14px; }
:is(.discover-shell,.studio-shell) .featured-summary { color: #ddd; line-height: 1.5; margin-bottom: 13px; }
:is(.discover-shell,.studio-shell) .featured-meta {
    color: #aaa;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    gap: 8px 13px;
}
:is(.discover-shell,.studio-shell) .featured-meta span + span::before { content: "·"; margin-right: 13px; color: #777; }
:is(.discover-shell,.studio-shell) .button {
    font: 12px/1.3 XHeighting, Jost, sans-serif;
    font-weight: 700;
    border-radius: 7px;
}
:is(.discover-shell,.studio-shell) .button-primary { background: #f5f5f5; border-color: #fff; color: #080808; box-shadow: none; }
:is(.discover-shell,.studio-shell) .button-primary:hover { background: #ddd; border-color: #ddd; color: #050505; }
:is(.discover-shell,.studio-shell) .button-quiet { background: #080808; border-color: #aaa; color: #fff; }
:is(.discover-shell,.studio-shell) .button-quiet:hover { background: #202020; border-color: #fff; color: #fff; }
/* Keep the same sticky anchors; flatten the nested purple filter boxes. */
:is(.discover-shell,.studio-shell) .library-filters {
    background: #080808f7;
    border: 0;
    border-bottom: 1px solid #383838;
    border-radius: 0;
    padding: 0 0 12px;
    box-shadow: 0 10px 18px -16px #000;
    margin-bottom: 25px;
    backdrop-filter: blur(14px);
}
:is(.discover-shell,.studio-shell) .category-tabs-row,
:is(.discover-shell,.studio-shell) .library-filter-row {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
}
:is(.discover-shell,.studio-shell) .category-tabs-row {
    min-height: 49px;
    margin: 0 0 13px;
    border-bottom: 1px solid #424242;
}
:is(.discover-shell,.studio-shell) .scenario-category-tabs { gap: 16px; }
:is(.discover-shell,.studio-shell) .scenario-category-tabs button {
    position: relative;
    min-height: 49px;
    padding: 12px 8px 11px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #aaa;
    font: 14px/1.3 XHeighting, Jost, sans-serif;
    font-weight: 700;
}
:is(.discover-shell,.studio-shell) .scenario-category-tabs button:hover { color: #fff; background: transparent; }
:is(.discover-shell,.studio-shell) .scenario-category-tabs button.is-active { color: #fff; background: transparent; }
:is(.discover-shell,.studio-shell) .scenario-category-tabs button.is-active::after {
    content: "";
    position: absolute;
    bottom: 0;
    height: 3px;
    left: 0;
    right: 0;
    background: var(--discovery-accent);
}
:is(.discover-shell,.studio-shell) .library-filter-row { min-height: 39px; gap: 12px; }
:is(.discover-shell,.studio-shell) [data-nsfw-row] { margin-top: 11px; padding-top: 11px; border-top: 1px solid #2d2d2d; }
:is(.discover-shell,.studio-shell) .type-filter {
    height: 36px;
    background: #080808;
    border-color: #777;
    border-radius: 6px;
    gap: 8px;
    padding: 0 9px;
}
:is(.discover-shell,.studio-shell) .type-filter > span { color: #aaa; border-color: #444; padding-right: 9px; font-size: 11px; }
:is(.discover-shell,.studio-shell) .type-filter select { background: #080808; color: #eee; font-size: 12px; }
:is(.discover-shell,.studio-shell) .genre-filters { gap: 8px; }
:is(.discover-shell,.studio-shell) .genre-filters button {
    min-height: 35px;
    background: #080808;
    border-color: #686868;
    border-radius: 5px;
    color: #ccc;
    padding: 6px 14px;
    font-size: 12px;
}
:is(.discover-shell,.studio-shell) .genre-filters button:hover { color: #fff; border-color: #ddd; background: #181818; }
:is(.discover-shell,.studio-shell) .genre-filters button.is-active { background: #f0f0f0; color: #080808; border-color: #fff; }
:is(.discover-shell,.studio-shell) .rail-arrow { background: #080808; color: #ddd; border-color: #666; border-radius: 5px; }
:is(.discover-shell,.studio-shell) .rail-arrow:hover:not(:disabled) { background: #252525; border-color: #eee; color: #fff; }
:is(.discover-shell,.studio-shell) .nsfw-toggle { color: #ccc; font-size: 11px; }
:is(.discover-shell,.studio-shell) .nsfw-switch { border-color: #aaa; background: #252525; }
:is(.discover-shell,.studio-shell) .nsfw-switch::after { background: #fff; }
:is(.discover-shell,.studio-shell) .nsfw-toggle input:checked + .nsfw-switch { background: #e2ba64; border-color: #edc469; }
:is(.discover-shell,.studio-shell) .nsfw-toggle input:checked + .nsfw-switch::after { background: #080808; }
:is(.discover-shell,.studio-shell) .nsfw-toggle input:focus-visible + .nsfw-switch { outline-color: var(--discovery-accent); }
:is(.discover-shell,.studio-shell) .scenario-category-panel { margin-bottom: 36px; }
:is(.discover-shell,.studio-shell) .discovery-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 17px;
}
:is(.discover-shell,.studio-shell) .discovery-section-heading h2 {
    display: flex;
    align-items: center;
    gap: 11px;
    margin: 0;
    color: #fff;
    font: 21px/1.3 XHeighting, Jost, sans-serif;
    font-weight: 700;
    letter-spacing: 0;
}
:is(.discover-shell,.studio-shell) .discovery-section-heading svg { width: 27px; height: 25px; fill: none; stroke: #fff; stroke-width: 2.5; }
:is(.discover-shell,.studio-shell) .discovery-section-heading h2 > span { font: 34px/1 Jost, sans-serif; }
:is(.discover-shell,.studio-shell) .discovery-section-heading > span { color: #aaa; font-size: 11px; }
:is(.discover-shell,.studio-shell) .saga-card {
    --card-accent: #a9cedb;
    background: #060606;
    border: 1px solid #8c8c8c;
    border-radius: 9px;
    box-shadow: none;
}
:is(.discover-shell,.studio-shell) .saga-card[data-type="Rpg"] { --card-accent: #e7c46d; }
:is(.discover-shell,.studio-shell) .saga-card[data-type="VisualNovel"] { --card-accent: #d5a9bb; }
:is(.discover-shell,.studio-shell) .saga-card:hover { border-color: #eee; transform: translateY(-2px); box-shadow: 0 8px 22px #0006; }
:is(.discover-shell,.studio-shell) .saga-card-open { padding: 12px; }
:is(.discover-shell,.studio-shell) .saga-card-heading { align-items: flex-start; flex-direction: row-reverse; gap: 10px; min-height: 57px; margin-bottom: 9px; }
:is(.discover-shell,.studio-shell) .saga-card-title { flex: 1; color: #fff; font: 20px/1.35 Questrian, sans-serif; }
:is(.discover-shell,.studio-shell) .saga-type-icon { width: 27px; height: 27px; margin-top: 1px; filter: brightness(0) invert(1); opacity: 1; }
:is(.discover-shell,.studio-shell) .saga-cover { border-radius: 6px; background: #151515; }
:is(.discover-shell,.studio-shell) .cover-genre { display: none; }
:is(.discover-shell,.studio-shell) .saga-card-meta { min-height: 27px; }
:is(.discover-shell,.studio-shell) .beginning-badge { color: #eee; background: #050505; border-color: #a0a0a0; border-radius: 4px; font-size: 10px; }
:is(.discover-shell,.studio-shell) .view-count { color: #eee; font-size: 11px; }
:is(.discover-shell,.studio-shell) .saga-card-summary { color: #c6c6c6; font-size: 12px; line-height: 1.6; margin: 11px 0 14px; }
:is(.discover-shell,.studio-shell) .saga-card-footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; margin-top: auto; }
:is(.discover-shell,.studio-shell) .saga-card-format { color: #a7abb0; font-size: 9px; letter-spacing: .5px; text-transform: uppercase; }
:is(.discover-shell,.studio-shell) .saga-card-creator { color: var(--card-accent); font-size: 12px; flex-shrink: 0; max-width: 52%; overflow-wrap: anywhere; }
:is(.discover-shell,.studio-shell) .studio-invitation { background: #0b0b0b; border-color: #626262; border-radius: 9px; }
:is(.discover-shell,.studio-shell) .studio-invitation .eyebrow { color: var(--discovery-accent); }
:is(.discover-shell,.studio-shell) .invitation-mark { color: #fff; }
:is(.discover-shell,.studio-shell) .studio-invitation h2 { font: 26px/1.3 XHeighting, sans-serif; }
:is(.discover-shell,.studio-shell) .studio-invitation p:not(.eyebrow) { color: #aaa; }
:is(.discover-shell,.studio-shell) .filter-empty { border-color: #777; color: #aaa; }
:is(.discover-shell,.studio-shell) .filter-empty h2 { color: #fff; }
:is(.discover-shell,.studio-shell) .site-footer { color: #999; border-color: #333; }
/* Carry the same treatment into the existing scenario modal. */
:is(.discover-shell,.studio-shell) .saga-dialog { background: #090909; border-color: #aaa; }
:is(.discover-shell,.studio-shell) .scenario-modal-shell { background: #090909; color: #eee; }
:is(.discover-shell,.studio-shell) .scenario-modal-cover { border-color: #999; background: #080808; }
:is(.discover-shell,.studio-shell) .scenario-modal-views { color: #ccc; }
:is(.discover-shell,.studio-shell) .scenario-modal-divider { background: #444; }
:is(.discover-shell,.studio-shell) .scenario-modal-sidebar { scrollbar-color: #555 transparent; }
:is(.discover-shell,.studio-shell) .dialog-close { color: #fff; border-color: #aaa; background: #080808; }
:is(.discover-shell,.studio-shell) .scenario-modal-header,
:is(.discover-shell,.studio-shell) .scenario-modal-action-card,
:is(.discover-shell,.studio-shell) .scenario-modal-panels,
:is(.discover-shell,.studio-shell) .scenario-modal-stat-grid > div,
:is(.discover-shell,.studio-shell) .scenario-modal-lore-card,
:is(.discover-shell,.studio-shell) .scenario-modal-gallery-card,
:is(.discover-shell,.studio-shell) .scenario-modal-play-summary { background: #101010; border-color: #505050; }
:is(.discover-shell,.studio-shell) .scenario-modal-header { background: #080808; }
:is(.discover-shell,.studio-shell) .scenario-modal-type-icon { filter: brightness(0) invert(1); }
:is(.discover-shell,.studio-shell) .scenario-modal-tabs { border-color: #555; }
:is(.discover-shell,.studio-shell) .scenario-modal-tabs button { color: #aaa; }
:is(.discover-shell,.studio-shell) .scenario-modal-tabs button.is-active { color: #fff; }
:is(.discover-shell,.studio-shell) .scenario-modal-tabs button.is-active::after { background: var(--discovery-accent); }
:is(.discover-shell,.studio-shell) .scenario-modal-tags span { background: #0b0b0b; border-color: #777; color: #ddd; }
:is(.discover-shell,.studio-shell) .scenario-modal-panel h3,
:is(.discover-shell,.studio-shell) .scenario-modal-creator,
:is(.discover-shell,.studio-shell) .scenario-modal-gallery-card figcaption strong { color: var(--discovery-accent); }
:is(.discover-shell,.studio-shell) .scenario-modal-panel { scrollbar-color: #555 transparent; }
@media (max-width: 800px) {
    :is(.discover-shell,.studio-shell) .featured-copy { padding: 16px 20px; }
    :is(.discover-shell,.studio-shell) .featured-kicker { font-size: 10px; }
    :is(.discover-shell,.studio-shell) .featured-creator { margin-bottom: 10px; }
    :is(.discover-shell,.studio-shell) .library-filters { padding: 0 0 10px; }
    :is(.discover-shell,.studio-shell) .library-filter-row .type-filter { margin-bottom: 9px; }
    :is(.discover-shell,.studio-shell) .category-tabs-row { margin-bottom: 10px; min-height: 44px; }
    :is(.discover-shell,.studio-shell) .scenario-category-tabs button { min-height: 44px; font-size: 13px; }
    :is(.discover-shell,.studio-shell) .discovery-section-heading > span { font-size: 10px; }
}
@media (max-width: 520px) {
    :is(.discover-shell,.studio-shell) .featured-copy { padding: 12px 13px; }
    :is(.discover-shell,.studio-shell) .featured-copy h3 { font-size: 24px; }
    :is(.discover-shell,.studio-shell) .featured-kicker { font-size: 9px; margin-bottom: 7px; }
    :is(.discover-shell,.studio-shell) .featured-summary { font-size: 11px; line-height: 1.4; margin-bottom: 9px; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
    :is(.discover-shell,.studio-shell) .featured-meta { font-size: 8px; letter-spacing: .3px; gap: 5px 7px; margin-bottom: 10px; }
    :is(.discover-shell,.studio-shell) .featured-meta span + span::before { margin-right: 7px; }
    :is(.discover-shell,.studio-shell) .featured-actions .button { font-size: 9px; padding: 6px 7px; min-height: 30px; }
    :is(.discover-shell,.studio-shell) .scenario-category-tabs { gap: 7px; }
    :is(.discover-shell,.studio-shell) .scenario-category-tabs button { font-size: 12px; padding-inline: 5px; }
    :is(.discover-shell,.studio-shell) .nsfw-toggle { font-size: 10px; gap: 6px; }
    :is(.discover-shell,.studio-shell) .genre-filters button { min-height: 32px; font-size: 11px; padding: 5px 12px; }
    :is(.discover-shell,.studio-shell) .discovery-section-heading { margin-bottom: 13px; }
    :is(.discover-shell,.studio-shell) .discovery-section-heading h2 { font-size: 17px; gap: 7px; }
    :is(.discover-shell,.studio-shell) .discovery-section-heading svg { width: 22px; height: 22px; }
    :is(.discover-shell,.studio-shell) .discovery-section-heading > span { display: none; }
    :is(.discover-shell,.studio-shell) .saga-card-open { padding: 8px; }
    :is(.discover-shell,.studio-shell) .saga-card-heading { min-height: 49px; gap: 6px; margin-bottom: 8px; }
    :is(.discover-shell,.studio-shell) .saga-card-title { font-size: 16px; }
    :is(.discover-shell,.studio-shell) .saga-type-icon { width: 20px; height: 20px; }
    :is(.discover-shell,.studio-shell) .beginning-badge { font-size: 8px; padding: 3px 4px; }
    :is(.discover-shell,.studio-shell) .view-count { font-size: 9px; }
    :is(.discover-shell,.studio-shell) .saga-card-summary { font-size: 10px; margin: 8px 0 12px; min-height: 48px; }
    :is(.discover-shell,.studio-shell) .saga-card-footer { flex-wrap: wrap; gap: 5px; }
    :is(.discover-shell,.studio-shell) .saga-card-format { font-size: 8px; letter-spacing: 0; }
    :is(.discover-shell,.studio-shell) .saga-card-creator { margin-left: auto; font-size: 10px; max-width: 100%; }
    :is(.discover-shell,.studio-shell) .studio-invitation h2 { font-size: 23px; }
}

/* Creator studio and scenario editing use the same monochrome Odeyu surface
   as Discover.  These rules only restyle the existing studio controls. */
.studio-shell .site-frame { max-width: 1600px; }
.studio-shell .creator-studio,
.studio-shell .studio-page { max-width: 1280px; margin: 0 auto; }
.studio-shell .discover-intro,
.studio-shell .studio-heading {
    align-items: flex-start;
    gap: 24px;
    margin: 4px 0 28px;
}
.studio-shell .discover-intro h1,
.studio-shell .studio-heading h1 {
    margin: 0 0 10px;
    color: #fff;
    font: clamp(28px, 3vw, 42px)/1.15 XHeighting, Jost, sans-serif;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}
.studio-shell .discover-intro p:not(.eyebrow),
.studio-shell .studio-heading .intro-copy {
    max-width: 660px;
    color: #aaa;
    font-size: 14px;
    line-height: 1.55;
}
.studio-shell .heading-actions { gap: 10px; }
.studio-shell .studio-stats {
    gap: 14px;
    margin: 25px 0 32px;
}
.studio-shell .studio-stats > div {
    padding: 18px 22px;
    border: 1px solid #777;
    border-radius: 9px;
    background: #080808;
}
.studio-shell .studio-stats span { color: #ccc; font: 12px/1.2 XHeighting, Jost, sans-serif; font-weight: 700; }
.studio-shell .studio-stats strong { color: #fff; font: 31px/1 XHeighting, Jost, sans-serif; font-weight: 700; }
.studio-shell .studio-stats i { width: 7px; height: 7px; margin-right: 7px; background: #aaa; }
.studio-shell .studio-stats .public-dot { background: var(--discovery-accent); }
.studio-shell .studio-toolbar {
    gap: 16px;
    margin-bottom: 24px;
    border-color: #424242;
}
.studio-shell .studio-tabs { gap: 18px; }
.studio-shell .studio-tabs button {
    padding: 12px 4px 11px;
    color: #aaa;
    font: 13px/1.3 XHeighting, Jost, sans-serif;
    font-weight: 700;
}
.studio-shell .studio-tabs button.is-active { color: #fff; border-bottom-color: var(--discovery-accent); }
.studio-shell .studio-search input {
    width: 230px;
    margin-bottom: 9px;
    padding: 8px 11px;
    border-color: #777;
    border-radius: 6px;
    background: #080808;
    color: #fff;
}
.studio-shell .studio-search input::placeholder { color: #999; }
.studio-shell .studio-card-controls { margin-top: 12px; color: #ccc; }
.studio-shell .studio-card-controls .status-pill { border-color: #999; background: #080808; color: #eee; }
.studio-shell .studio-card-controls .status-published { border-color: #edc469; color: var(--discovery-accent); }
.studio-shell .studio-card-controls a { color: #fff; }
.studio-shell .studio-card-controls a:hover { color: var(--discovery-accent); }
.studio-shell .studio-updated { color: #999; }
.studio-shell .studio-empty-state {
    border-color: #777;
    border-radius: 9px;
    background: #080808;
}
.studio-shell .studio-empty-state .empty-world,
.studio-shell .studio-privacy-note > span { color: #fff; }
.studio-shell .studio-empty-state h2 { color: #fff; font: 26px/1.3 XHeighting, Jost, sans-serif; font-weight: 700; }
.studio-shell .studio-empty-state p:not(.eyebrow),
.studio-shell .studio-privacy-note { color: #aaa; }
.studio-shell .studio-empty-state .text-link { color: var(--discovery-accent); }
.studio-shell .studio-privacy-note { border-top: 1px solid #393939; padding-top: 18px; }
.studio-shell .studio-privacy-note strong { color: #fff; }

.studio-shell .scenario-editor-page { max-width: 1280px; }
.studio-shell .scenario-editor-page .compact-heading { margin-bottom: 28px; }
.studio-shell .scenario-editor-panel-shell {
    padding: 20px;
    border: 1px solid #777;
    border-radius: 10px;
    background: #080808;
}
.studio-shell .scenario-editor-panel-shell .form-heading { border-color: #444; padding-bottom: 18px; }
.studio-shell .scenario-editor-panel-shell .form-heading h2 {
    color: #fff;
    font: 18px/1.2 XHeighting, Jost, sans-serif;
    font-weight: 700;
}
.studio-shell .scenario-editor-panel-shell .status-pill { border-color: #edc469; color: var(--discovery-accent); background: #15120b; }
.studio-shell .scenario-editor-tabs { border-color: #555; }
.studio-shell .scenario-editor-tab { color: #aaa; font-family: XHeighting, Jost, sans-serif; }
.studio-shell .scenario-editor-tab:hover,
.studio-shell .scenario-editor-tab.is-active { color: #fff; }
.studio-shell .scenario-editor-tab.is-active { border-bottom-color: var(--discovery-accent); background: #171717; }
.studio-shell .scenario-mode-tab { color: #bdbdbd; }
.studio-shell .scenario-mode-tab.is-active { border-bottom-color: var(--discovery-accent); color: #fff; }
.studio-shell .scenario-editor-card {
    border-color: #666;
    border-radius: 9px;
    background: #0b0b0b;
}
.studio-shell .scenario-editor-card h2,
.studio-shell .lore-editor-modal-section h3 {
    color: #fff;
    font: 15px/1.25 XHeighting, Jost, sans-serif;
    font-weight: 700;
    letter-spacing: .04em;
}
.studio-shell .scenario-editor-card > p,
.studio-shell .scenario-editor-card .scenario-type-option small,
.studio-shell .field-hint { color: #999; }
.studio-shell .form-field label,
.studio-shell .media-field-label { color: #eee; }
.studio-shell .form-field input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
.studio-shell .form-field textarea,
.studio-shell .form-field select,
.studio-shell .studio-form input:not([type=radio]):not([type=checkbox]):not([type=hidden]),
.studio-shell .studio-form textarea,
.studio-shell .studio-form select {
    border-color: #777;
    border-radius: 6px;
    background: #050505;
    color: #f5f5f5;
}
.studio-shell .form-field input:focus,
.studio-shell .form-field textarea:focus,
.studio-shell .form-field select:focus,
.studio-shell .studio-form input:focus,
.studio-shell .studio-form textarea:focus,
.studio-shell .studio-form select:focus { border-color: var(--discovery-accent); box-shadow: 0 0 0 2px #edc46922; background: #0b0b0b; }
.studio-shell .scenario-type-option {
    border-color: #666;
    border-radius: 8px;
    background: #080808;
}
.studio-shell .scenario-type-option:hover,
.studio-shell .scenario-type-option.is-selected { border-color: var(--discovery-accent); background: #18140a; }
.studio-shell .scenario-type-option strong { color: #fff; }
.studio-shell .scenario-type-option small { color: #aaa; }
.studio-shell .scenario-type-option.is-selected .scenario-type-icon { background-color: var(--discovery-accent); }
.studio-shell .story-tags-holder { border-color: #777; background: #050505; }
.studio-shell .story-tags-open,
.studio-shell .story-tags-plus { color: #ccc; }
.studio-shell .story-tag-chip { border-color: #8f7837; background: #211b0c; color: #fff; }
.studio-shell .media-editor-card { color: #eee; }
.studio-shell.saga-shell .scenario-editor-card[aria-labelledby="media-heading"] { border-color: #777; background: #101010; }
.studio-shell .media-preview { border-color: #777; background: #050505; }
.studio-shell .media-action-button {
    border-color: #aaa;
    border-radius: 7px;
    background: #080808;
    color: #fff;
}
.studio-shell .media-action-button:hover { border-color: #fff; background: #1a1a1a; }
.studio-shell .media-action-button svg { stroke: var(--discovery-accent); }
.studio-shell .introduction-toolbar { border-color: #666; background: #111; }
.studio-shell .introduction-tool-select select { border-color: #666; background: #080808; color: #eee; }
.studio-shell .introduction-tool-button { color: #eee; }
.studio-shell .introduction-tool-button:hover,
.studio-shell .introduction-tool-button:focus-visible,
.studio-shell .introduction-tool-button.is-active { background: #252525; color: var(--discovery-accent); }
.studio-shell .introduction-surface { border-color: #666; background: #050505; color: #eee; }
.studio-shell .introduction-surface:focus { border-color: var(--discovery-accent); }
.studio-shell .scenario-details-side .scenario-editor-card { background: #080808; }
.studio-shell.saga-shell .scenario-editor-card.player-preview-card { border-color: #777; background: #000; }
.studio-shell .player-preview-phone { border-color: #aaa; }
.studio-shell .readiness-card,
.studio-shell .scenario-visibility-card { border-color: #666; background: #101010; }
.studio-shell .readiness-heading-row h2,
.studio-shell .scenario-visibility-card h2 { color: #fff; }
.studio-shell .readiness-heading-row > span { color: var(--discovery-accent); }
.studio-shell .readiness-item span:first-child { color: #eee; }
.studio-shell .readiness-item.is-complete span:first-child { color: var(--discovery-accent); }
.studio-shell .readiness-message { border-color: #555; background: #080808; color: #aaa; }
.studio-shell .scenario-visibility-card p { color: #aaa; }
.studio-shell .scenario-visibility-switch { border-color: #999; background: #292929; }
.studio-shell .scenario-visibility-toggle input:checked + .scenario-visibility-switch { border-color: var(--discovery-accent); background: #edc469; }
.studio-shell .scenario-visibility-toggle input:checked + .scenario-visibility-switch::after { background: #080808; }
.studio-shell .form-actions { border-color: #444; }
.studio-shell .form-actions .button-primary { background: #f5f5f5; border-color: #fff; color: #080808; }
.studio-shell .form-actions .button-quiet { background: #080808; border-color: #aaa; color: #fff; }
.studio-shell .form-actions .button-danger-quiet { border-color: #b77b7b; color: #ffb4a8; }

@media (max-width: 800px) {
    .studio-shell .studio-heading,
    .studio-shell .discover-intro { flex-wrap: wrap; }
    .studio-shell .studio-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .studio-shell .studio-search input { width: 210px; }
}
@media (max-width: 520px) {
    .studio-shell .studio-stats { gap: 7px; }
    .studio-shell .studio-stats > div { padding: 12px; }
    .studio-shell .studio-stats span { font-size: 10px; }
    .studio-shell .studio-stats strong { font-size: 25px; }
    .studio-shell .studio-toolbar { flex-wrap: wrap; }
    .studio-shell .studio-search { width: 100%; }
    .studio-shell .studio-search input { width: 100%; }
    .studio-shell .scenario-editor-panel-shell { padding: 12px; }
}