body.mk-g-fem {
--mkg-accent:      #e8709f;
--mkg-accent-soft: #f3a8c6;
--mkg-accent-deep: #b8447a;
--mkg-ink:         #7a2b52;
--mkg-glow:        rgba(232, 112, 159, .38);
--mkg-veil:        rgba(232, 112, 159, .10); --mkg-radius:      18px;
--mkg-radius-lg:   26px;
--mkg-border:      1px;
--mkg-border-style: solid;
} body.mk-g-masc {
--mkg-accent:      #ef7d3a;
--mkg-accent-soft: #f5a86e;
--mkg-accent-deep: #b84a15;
--mkg-ink:         #7a3a10;
--mkg-glow:        rgba(239, 125, 58, .38);
--mkg-veil:        rgba(239, 125, 58, .10);
--mkg-radius:      6px;
--mkg-radius-lg:   10px;
--mkg-border:      2px;
--mkg-border-style: solid;
} body.mk-g-fem.text-ui-light  { --mkg-ink: #ffc4dd; }
body.mk-g-masc.text-ui-light { --mkg-ink: #ffcfa6; } .mk-cov {
position: relative;
border-radius: var(--mkg-radius, 12px);
overflow: hidden;
transition: transform .25s ease, box-shadow .25s ease;
}
.mk-cov img {
border-radius: inherit;
} .mk-cov--fem {
border: var(--mkg-border) var(--mkg-border-style) var(--mkg-accent-soft);
box-shadow: 0 4px 18px var(--mkg-glow);
} .mk-cov--fem::after {
content: "";
position: absolute;
inset: 4px;
border: 1px solid rgba(255, 255, 255, .55);
border-radius: calc(var(--mkg-radius) - 5px);
pointer-events: none;
z-index: 2;
} .mk-cov--fem::before {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
pointer-events: none;
z-index: 2;
background:
linear-gradient(var(--mkg-accent), var(--mkg-accent)) left  8px  top    8px / 14px 1px no-repeat,
linear-gradient(var(--mkg-accent), var(--mkg-accent)) left  8px  top    8px / 1px 14px no-repeat,
linear-gradient(var(--mkg-accent), var(--mkg-accent)) right 8px  bottom 8px / 14px 1px no-repeat,
linear-gradient(var(--mkg-accent), var(--mkg-accent)) right 8px  bottom 8px / 1px 14px no-repeat;
opacity: .85;
}
.mk-cov--fem:hover {
transform: translateY(-3px);
box-shadow: 0 10px 26px var(--mkg-glow);
} .mk-cov--masc {
border: var(--mkg-border) var(--mkg-border-style) var(--mkg-accent-deep);
box-shadow: 0 3px 0 0 var(--mkg-accent-deep);
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
}
.mk-cov--masc:hover {
transform: translateY(-2px);
box-shadow: 0 6px 0 0 var(--mkg-accent-deep), 0 10px 22px var(--mkg-glow);
} .mk-cov--hero-fem::after  { inset: 7px; border-radius: calc(var(--mkg-radius-lg) - 8px); }
.mk-cov--hero-fem         { border-radius: var(--mkg-radius-lg); border-width: 2px; }
.mk-cov--hero-masc        { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%); } .mk-cov--grid-fem::before { opacity: .55; }
.mk-cov--grid-fem::after  { inset: 3px; border-width: 1px; }  body.mk-gendered .stitle h2 .bar,
body.mk-gendered .fresh-head .fh-ic {
background: linear-gradient(180deg, var(--mkg-accent), var(--mkg-accent-deep));
}
body.mk-g-fem .stitle h2 .bar {
border-radius: 999px;
}
body.mk-g-masc .stitle h2 .bar {
border-radius: 0;
} body.mk-g-fem .mk-acc-card,
body.mk-g-fem .comment-body {
border-radius: var(--mkg-radius-lg);
border: 1px solid var(--mkg-accent-soft);
box-shadow: 0 2px 14px var(--mkg-veil);
}
body.mk-g-masc .mk-acc-card,
body.mk-g-masc .comment-body {
border-radius: var(--mkg-radius);
border-left: 3px solid var(--mkg-accent);
} body.mk-gendered .mk-acc-btn--primary,
body.mk-gendered .btn.primary {
background: linear-gradient(135deg, var(--mkg-accent), var(--mkg-accent-deep));
border-color: var(--mkg-accent-deep);
}
body.mk-g-fem .mk-acc-btn--primary,
body.mk-g-fem .btn.primary {
border-radius: 999px;
} body.mk-gendered .mk-rank-pill {
background: var(--mkg-accent);
border-color: var(--mkg-accent-deep);
}
body.mk-g-fem .mk-rank-pill {
border-radius: 999px;
letter-spacing: .06em;
}
body.mk-g-masc .mk-rank-pill {
border-radius: 3px;
letter-spacing: .04em;
text-transform: uppercase;
} body.mk-gendered .mk-xp-bar__fill {
background: linear-gradient(90deg, var(--mkg-accent-soft), var(--mkg-accent));
} .mk-gsel {
margin: 14px 0;
}
.mk-gsel__lbl {
display: block;
font-size: 13px;
font-weight: 600;
margin-bottom: 8px;
color: var(--mc-text, inherit);
}
.mk-gsel__opts {
display: flex;
gap: 8px;
flex-wrap: wrap;
}
.mk-gsel__opts--cards {
flex-direction: column;
gap: 10px;
}
.mk-gsel__opt {
position: relative;
display: flex;
align-items: center;
gap: 10px;
flex: 1 1 120px;
padding: 10px 12px;
border: 1px solid var(--mc-border, rgba(128, 128, 128, .35));
border-radius: 12px;
cursor: pointer;
transition: border-color .18s ease, background .18s ease;
background: var(--mc-surface-2, transparent);
}
.mk-gsel__opts--cards .mk-gsel__opt {
flex: 1 1 auto;
align-items: flex-start;
padding: 14px 16px;
} .mk-gsel__opt input[type="radio"] {
position: absolute;
opacity: 0;
width: 1px;
height: 1px;
margin: 0;
}
.mk-gsel__opt:hover {
border-color: var(--mc-primary, #888);
}
.mk-gsel__opt:focus-within {
outline: 2px solid var(--mc-primary, #888);
outline-offset: 2px;
}
.mk-gsel__opt.is-on,
.mk-gsel__opt:has(input:checked) {
border-color: var(--mc-primary, #888);
background: var(--mc-primary-soft, rgba(128, 128, 128, .10));
}
.mk-gsel__ic {
font-size: 20px;
line-height: 1;
flex: 0 0 auto;
}
.mk-gsel__tx {
display: flex;
flex-direction: column;
gap: 2px;
font-size: 13px;
}
.mk-gsel__tx i {
font-style: normal;
opacity: .72;
font-size: 12px;
}
.mk-gsel__prev {
font-style: normal;
font-size: 12px;
opacity: .9;
margin-top: 4px;
}
.mk-gsel__hint {
margin: 8px 0 0;
font-size: 12px;
opacity: .7;
} .mk-gsel__opt--fem  .mk-gsel__ic { color: #e8709f; }
.mk-gsel__opt--masc .mk-gsel__ic { color: #ef7d3a; }
.mk-gsel__opt--fem:has(input:checked)  { border-color: #e8709f; background: rgba(232, 112, 159, .10); }
.mk-gsel__opt--masc:has(input:checked) { border-color: #ef7d3a; background: rgba(239, 125, 58, .10); } .mk-gsel__opt--fem.is-on  { border-color: #e8709f; background: rgba(232, 112, 159, .10); }
.mk-gsel__opt--masc.is-on { border-color: #ef7d3a; background: rgba(239, 125, 58, .10); } @media (prefers-reduced-motion: reduce) {
.mk-cov,
.mk-cov--fem,
.mk-cov--masc {
transition: none;
}
.mk-cov--fem:hover,
.mk-cov--masc:hover {
transform: none;
}
} @media (forced-colors: active) {
.mk-cov--fem::before,
.mk-cov--fem::after {
display: none;
}
.mk-cov--masc {
clip-path: none;
}
}