/* Card proportions, artwork and type colors follow Odeyu's scenario library. */
.saga-card{--card-accent:#9a78ff;--card-border-accent:#7b4dff;background:#000;border:1px solid #8c8c8c;border-radius:12px}
.creator-hub .creator-scenario-grid,.creator-hub .creator-favorite-grid.saga-grid,.studio-card-grid{grid-template-columns:repeat(auto-fill,minmax(240px,288px));gap:14px;align-items:start}
.scenario-modal-shell,.featured-scenario{--card-accent:#9a78ff}.scenario-modal-shell[data-type="Rpg"],.featured-scenario[data-type="Rpg"]{--card-accent:#ff1d58}.scenario-modal-shell[data-type="VisualNovel"],.featured-scenario[data-type="VisualNovel"]{--card-accent:#1dd4ff}.featured-counts{display:flex;gap:16px;align-items:center}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card{--card-accent:#9a78ff;--card-border-accent:#7b4dff;background:#000;border-radius:12px}
.saga-card[data-type="Rpg"],:is(.discover-shell,.studio-shell,.creator-hub) .saga-card[data-type="Rpg"]{--card-accent:#ff1d58;--card-border-accent:#b2143d}
.saga-card[data-type="VisualNovel"],:is(.discover-shell,.studio-shell,.creator-hub) .saga-card[data-type="VisualNovel"]{--card-accent:#1dd4ff;--card-border-accent:#0d5f72}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-open,.saga-card-open{padding:12px;min-height:610px}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-heading,.saga-card-heading{flex-direction:row;align-items:flex-start;min-height:62px;gap:12px;margin-bottom:12px}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-title,.saga-card-title{flex:1;font:22px/1.15 Questrian,sans-serif;color:#fff;overflow-wrap:anywhere}
.saga-type-symbol{display:block;flex:none;width:36px;height:36px;background:var(--card-accent);mask:center/contain no-repeat url('/images/rpg-hud/Party.svg')}
[data-type="VisualNovel"] .saga-type-symbol{mask-image:url('/images/rpg-hud/ScenarioVisualNovel.svg')}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-cover,.saga-cover{background:#111319;border-radius:9px;aspect-ratio:250/378;width:100%;max-width:250px;height:auto;order:initial;margin:0 auto 12px}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-meta,.saga-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:24px}
:is(.discover-shell,.studio-shell,.creator-hub) .beginning-badge,.beginning-badge{border:1px solid var(--card-border-accent);color:var(--card-accent);background:#000;border-radius:6px;font:11px/1.3 Jost,sans-serif;padding:4px 7px}
.saga-card-counts{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-left:auto}
.scenario-views,.scenario-plays{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font:500 11px/1.3 Jost,sans-serif}
.scenario-views{color:var(--card-accent,#9a78ff)}
.scenario-plays{color:#50d890}
.scenario-plays svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.odeyu-eye{display:inline-block;width:15px;height:11px;background:currentColor;mask:center/contain no-repeat url('/images/rpg-hud/Eye.svg')}
.saga-card-community{display:flex;gap:14px;color:var(--card-accent);font:11px Jost,sans-serif;margin-bottom:12px}.saga-card-community>span{display:flex;align-items:center;gap:4px}.saga-card-community .hub-icon{width:14px;height:14px}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-summary,.saga-card-summary{font:12px/1.4 Jost,sans-serif;color:#b4b6bd;margin:12px 0 16px;min-height:68px;-webkit-line-clamp:4}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-footer,.saga-card-footer{display:flex;justify-content:flex-end;margin-top:auto;padding:0}
:is(.discover-shell,.studio-shell,.creator-hub) .saga-card-creator,.saga-card-creator{color:var(--card-accent);font:600 12px/1.4 Jost,sans-serif;margin-left:auto;text-align:right;max-width:100%}
/* The same badge is used on cards, previews and scenario dialogs. */
.cover-label.odeyu-nsfw,.creator-hub .cover-label.odeyu-nsfw{display:inline-flex;align-items:center;justify-content:center;gap:3px;position:absolute;top:7px;left:7px;right:auto;z-index:2;min-width:66px;height:22px;padding:2px 5px;color:#fff;border:1px solid #fff;border-radius:6px;background:linear-gradient(#ff2783,#ff0064 50%,#e60056);box-shadow:0 0 7px #ff086be6,0 0 4px #ffffffc0;font:900 12px/1 'Segoe UI',sans-serif;white-space:nowrap}
.odeyu-nsfw svg{width:13.5px;height:13.5px;flex:none}
.saga-cover:has(.trending-position) .odeyu-nsfw{left:auto;right:7px}
@media(max-width:760px){
 .discovery-row.saga-grid,.saga-shelf:not(.featured-shelf) .saga-grid,.creator-scenario-grid,.creator-favorite-grid.saga-grid,.studio-card-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-flow:row!important;grid-auto-columns:auto!important;grid-template-rows:none!important;gap:10px!important;overflow:visible!important}
 .discovery-row>.saga-card{width:100%;min-width:0}
 :is(.discover-shell,.studio-shell,.creator-hub) .saga-card-open,.saga-card-open{padding:9px;min-height:0;height:100%}
 :is(.discover-shell,.studio-shell,.creator-hub) .saga-card-heading,.saga-card-heading{min-height:52px;gap:5px;margin-bottom:9px}
 :is(.discover-shell,.studio-shell,.creator-hub) .saga-card-title,.saga-card-title{font-size:clamp(12px,3.7vw,18px);line-height:1.18}
 .saga-type-symbol{width:25px;height:25px}
 :is(.discover-shell,.studio-shell,.creator-hub) .saga-card-summary,.saga-card-summary{font-size:11px;min-height:62px;margin:9px 0 16px}
 .saga-card-counts{gap:8px}.scenario-views,.scenario-plays{font-size:10px;gap:4px}
 :is(.discover-shell,.studio-shell,.creator-hub) .beginning-badge,.beginning-badge{font-size:9px;padding:3px 4px}
 :is(.discover-shell,.studio-shell,.creator-hub) .saga-card-creator,.saga-card-creator{font-size:11px}
 .cover-label.odeyu-nsfw,.creator-hub .cover-label.odeyu-nsfw{min-width:55px;height:19px;font-size:10px;top:6px;left:6px;gap:2px;padding:2px 4px}.odeyu-nsfw svg{width:12px;height:12px}
}

/* Rankings sit in their own row above each card, clear of the cover art. */
.saga-shell .ranked-saga-card{display:flex;flex-direction:column;border:0;background:transparent;box-shadow:none;overflow:visible}
.saga-shell .ranked-saga-card:hover{transform:none;box-shadow:none}
.saga-shell .ranked-saga-card>.saga-card-open{height:auto;flex:1;border:1px solid #8c8c8c;border-radius:12px;background:#000}
.saga-shell .ranked-saga-card>.saga-card-open:hover{border-color:#eee}
.saga-shell .ranked-saga-card>.trending-position{position:static;display:block;align-self:flex-start;width:auto;height:auto;margin:0 12px 10px;padding:3px 0;border:0;border-radius:0;background:none;box-shadow:none;color:#ffd45c;font:900 40px/1.2 Jost,sans-serif;-webkit-text-stroke:6px #000;paint-order:stroke fill;text-shadow:2px 2px 0 #000,-2px -2px 0 #000}
#trending-scenarios>.discovery-section-heading{margin-bottom:26px}
@media(max-width:760px){
 .saga-shell .ranked-saga-card>.trending-position{font-size:32px;-webkit-text-stroke-width:5px;margin:0 9px 9px}
 #trending-scenarios>.discovery-section-heading{margin-bottom:24px}
}