:root{--md-bg:#070b14;--md-panel:#101827;--md-panel2:#0c1422;--md-line:#29364c;--md-blue:#4aafff;--md-cyan:#7ce4ff;--md-gold:#f2bd52;--md-text:#f4f7fc;--md-muted:#aab6c9}.mmod-shell{background:var(--md-bg);color:var(--md-text);font:16px/1.7 Inter,system-ui,sans-serif;min-height:80vh}.mmod-shell *{box-sizing:border-box}.mmod-wrap{width:min(1180px,92%);margin:auto}.mmod-shell a{color:var(--md-cyan)}.mmod-crumb{display:flex;gap:9px;padding:22px 0;color:#8999b0;font-size:14px}.mmod-hero{display:grid;grid-template-columns:minmax(0,1.45fr) 350px;gap:25px;padding:12px 0 42px}.mmod-hero-media{min-height:430px;position:relative;overflow:hidden;border:1px solid var(--md-line);border-radius:17px;background:radial-gradient(circle at 75% 20%,rgba(74,175,255,.28),transparent 34%),linear-gradient(135deg,#111b2e,#133b55)}.mmod-hero-media img{position:absolute;width:100%;height:100%;object-fit:cover}.mmod-hero-media:after{content:"";position:absolute;inset:24% 0 0;background:linear-gradient(transparent,rgba(5,9,17,.95))}.mmod-hero-copy{position:absolute;z-index:1;left:32px;right:32px;bottom:27px}.mmod-hero-copy h1{font-size:clamp(42px,6vw,72px);line-height:1;margin:11px 0}.mmod-hero-copy p{font-size:18px;color:#ced6e2}.mmod-chip{display:inline-block;margin:2px 4px 2px 0;padding:4px 9px;border-radius:99px;background:#153651;border:1px solid #2d6f9f;text-decoration:none;font-size:13px;font-weight:750}.mmod-facts,.mmod-panel,.mmod-toc,.mmod-filters form{background:var(--md-panel);border:1px solid var(--md-line);border-radius:13px}.mmod-facts{padding:24px}.mmod-facts h2{margin-top:0}.mmod-facts dl{margin:0}.mmod-facts dl>div{padding:8px 0;border-bottom:1px solid var(--md-line)}.mmod-facts dt{font-size:12px;color:#8e9db3}.mmod-facts dd{margin:1px 0;font-weight:750}.mmod-facts dd a{margin-right:5px}.mmod-primary{display:block;margin-top:13px;padding:12px;text-align:center;border-radius:7px;background:var(--md-gold);color:#181106!important;text-decoration:none;font-weight:900}.mmod-disclosure{display:block;color:#8d9cb1;margin-top:4px}.mmod-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:25px;padding-bottom:55px}.mmod-panel{padding:28px;margin-bottom:18px}.mmod-panel h2{font-size:29px;line-height:1.2;margin:0 0 14px}.mmod-panel h3{font-size:19px}.mmod-panel p,.mmod-panel li{color:#bdc7d7}.mmod-note{font-size:13px;border-top:1px solid var(--md-line);padding-top:12px;color:#8b9ab0!important}.mmod-toc{position:sticky;top:35px;align-self:start;padding:20px}.mmod-toc>strong{display:block}.mmod-toc>a{display:block;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.06);color:#aebbd0;text-decoration:none}.mmod-toc>div{margin-top:16px}.mmod-toc>div>span{display:block;font-size:12px;color:#8999af}.mmod-gallery,.mmod-balance,.mmod-requirements{display:grid;grid-template-columns:1fr 1fr;gap:14px}.mmod-gallery figure{margin:0}.mmod-gallery img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.mmod-gallery figcaption{font-size:12px;color:#8c9bb0}.mmod-balance>div,.mmod-requirements>div{padding:17px;background:#131e30;border-radius:8px}.mmod-balance>div:first-child{border-left:3px solid #45d492}.mmod-balance>div:last-child{border-left:3px solid #ff7482}.mmod-video-link{display:block;padding:18px;background:#14304a;border-radius:8px;text-align:center;font-weight:850;text-decoration:none}.mmod-faq details{border-top:1px solid var(--md-line);padding:12px 0}.mmod-faq summary{cursor:pointer;font-weight:800}.mmod-related{display:grid;grid-template-columns:repeat(3,1fr);gap:11px}.mmod-related a{display:flex;flex-direction:column;padding:16px;background:#131f31;border:1px solid var(--md-line);border-radius:8px;text-decoration:none}.mmod-related span{color:#8fa0b6;font-size:13px}.mmod-sources small{display:block;color:#8797ad}.mmod-dir-hero{padding:55px 0 36px;background:radial-gradient(circle at 75% 0,rgba(74,175,255,.21),transparent 36%)}.mmod-eyebrow,.mmod-kicker{color:var(--md-blue);letter-spacing:.1em;font-size:11px;font-weight:900}.mmod-dir-hero h1{font-size:clamp(42px,6vw,70px);line-height:1;margin:8px 0}.mmod-dir-hero>div>p:last-child{max-width:700px;color:var(--md-muted);font-size:18px}.mmod-dir-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;padding:35px 0 60px}.mmod-filters form{position:sticky;top:25px;padding:20px}.mmod-filters h2{margin-top:0;font-size:21px}.mmod-filters label{display:block;margin-bottom:12px}.mmod-filters label span{display:block;color:#91a1b7;font-size:12px}.mmod-filters input,.mmod-filters select{width:100%;padding:9px;background:#0b1320;color:white;border:1px solid #3a475b;border-radius:6px}.mmod-filters button{width:100%;padding:11px;border:0;border-radius:7px;background:var(--md-blue);font-weight:900}.mmod-reset{display:block;text-align:center;margin-top:9px;font-size:13px}.mmod-results-head h2{margin-top:0}.mmod-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.mmod-card{overflow:hidden;background:var(--md-panel);border:1px solid var(--md-line);border-radius:11px}.mmod-card-media{display:grid;place-items:center;aspect-ratio:16/10;background:linear-gradient(135deg,#12213a,#17435d);text-decoration:none}.mmod-card-media img{width:100%;height:100%;object-fit:cover}.mmod-card-media span{font-size:26px;font-weight:900}.mmod-card-body{padding:16px}.mmod-card-body h3{margin:4px 0}.mmod-card-body h3 a{color:white;text-decoration:none}.mmod-card-body p{font-size:14px;color:var(--md-muted)}.mmod-card-meta{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:9px}.mmod-card-meta span{background:#17243a;padding:3px 7px;border-radius:4px;color:#b9c5d6;font-size:11px}.mmod-more{font-size:13px;font-weight:800}.nav-links{display:flex;gap:6px;margin-top:23px}.page-numbers{padding:7px 10px;background:#111b2a;border-radius:6px;text-decoration:none}.page-numbers.current{background:var(--md-blue);color:#07111c}.mmod-home{padding:35px 0}@media(max-width:900px){.mmod-hero,.mmod-page-grid{grid-template-columns:1fr}.mmod-toc{position:static;order:-1}.mmod-card-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.mmod-dir-grid{grid-template-columns:1fr}.mmod-filters form{position:static}.mmod-card-grid,.mmod-gallery,.mmod-balance,.mmod-requirements,.mmod-related{grid-template-columns:1fr}.mmod-hero-media{min-height:390px}.mmod-hero-copy{left:21px;right:21px}.mmod-panel{padding:20px}.mmod-dir-hero{padding-top:28px}}
.mmod-skip-link{position:fixed;z-index:100000;top:8px;left:8px;transform:translateY(-200%);padding:12px 16px;border:3px solid #fff;border-radius:6px;background:#070b14;color:#fff;font:700 16px/1.25 system-ui,sans-serif;text-decoration:none}.mmod-skip-link:focus,.mmod-skip-link:focus-visible{transform:none;outline:3px solid #f2bd52;outline-offset:2px}

/* GW2 #27 presentation benchmark: scoped to this profile. */
@media (min-width:901px){
 body.postid-27 .mmod-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding-bottom:24px;align-items:start}
 body.postid-27 .mmod-facts dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
 body.postid-27 .mmod-facts dt{font-size:13px}
 body.postid-27 .mmod-facts .mmod-primary{margin-top:10px;padding:9px}
}
body.postid-27 .mmod-faq summary::after{content:"+";margin-left:auto;padding-left:16px;color:var(--md-cyan);font-size:20px;font-weight:400}
body.postid-27 .mmod-faq details[open] summary::after{content:"−"}
body.postid-27 #overview h2[id]{scroll-margin-top:48px}
body.postid-27 #overview nav{margin:20px 0;padding:12px 16px;background:#131e30;border-radius:8px}
body.postid-27 #overview nav p{margin:0}


/* ==========================================================
   MMOList — canonical game-profile hero layout
   Prevents a tall facts card from creating apparent dead space.
   ========================================================== */

.single-mmo_game .mmod-hero{
    display:grid;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
    gap:24px;
    align-items:start;
    padding-bottom:20px;
}

/*
 * Critical fix:
 * the media column remains visually filled to the height of
 * the facts column instead of leaving a large empty white area.
 */
.single-mmo_game .mmod-hero-media{
    height:100%;
    min-height:100%;
    align-self:stretch;
    overflow:hidden;
}

.single-mmo_game .mmod-hero-media img{
    display:block;
    width:100%;
    height:100%;
    min-height:420px;
    object-fit:cover;
    object-position:center;
}

/*
 * Facts stay compact and readable.
 */
.single-mmo_game .mmod-facts{
    align-self:start;
}

.single-mmo_game .mmod-facts dl{
    margin-bottom:14px;
}

/*
 * Overview follows the hero without an artificial spacer.
 */
.single-mmo_game #overview{
    margin-top:0;
}

/* Tablet */
@media (max-width:900px){

    .single-mmo_game .mmod-hero{
        grid-template-columns:1fr;
        gap:18px;
    }

    .single-mmo_game .mmod-hero-media{
        height:auto;
        min-height:0;
    }

    .single-mmo_game .mmod-hero-media img{
        height:auto;
        min-height:0;
        aspect-ratio:16/9;
        object-fit:cover;
    }
}

/* Mobile */
@media (max-width:680px){

    .single-mmo_game .mmod-hero{
        gap:14px;
        padding-bottom:16px;
    }
}

/* ==========================================================
   MMOList — single-game overview generic-media cleanup
   The large grey "MMO" tile is a fallback presentation,
   not useful content. Hide it inside the overview/profile
   presentation while preserving genuine artwork/media.
   ========================================================== */

.single-mmo_game #overview .mmod-prose > span[aria-hidden="true"],
.single-mmo_game #overview span[aria-hidden="true"] {
    display:none !important;
}

/*
 * Also catch the profile fallback when it is rendered as the
 * first visual sibling inside the overview presentation.
 * Genuine images/pictures are explicitly preserved.
 */
.single-mmo_game #overview [class*="media"]:has(> span[aria-hidden="true"]):not(:has(img)):not(:has(picture)) {
    display:none !important;
}

.single-mmo_game #overview img,
.single-mmo_game #overview picture {
    display:block;
}



/* SYSTEM104_LOGO_PRESENTATION_FIX_V1 */
/* Keep logo artwork fully visible in shared profile and directory layouts. */
.mmod-profile-logo{display:flex;flex-direction:column;align-items:center;justify-content:center;width:fit-content;max-width:100%;margin:0 auto 12px;padding:10px 14px;border-radius:8px;background:rgba(5,9,17,.58)}
.mmod-profile-logo img{display:block;width:auto;height:auto;max-width:min(360px,76vw);max-height:96px;object-fit:contain;object-position:center}
.mmod-profile-logo .mmod-logo-credit{display:block;margin-top:6px;font-size:11px;line-height:1.35;text-align:center;color:#d4dbea}
.mmod-card-media{position:relative}.mmod-card-media img.mmod-card-logo{position:absolute;inset:0;display:block;box-sizing:border-box;width:100%;height:100%;max-width:none;max-height:none;padding:2px;object-fit:contain;object-position:center}
@media(max-width:680px){.mmod-profile-logo{margin-bottom:8px;padding:8px 10px}.mmod-profile-logo img{max-width:min(280px,72vw);max-height:72px}.mmod-card-media img.mmod-card-logo{max-width:none;max-height:none;padding:2px}}