/* MMS: original character art, quiet wine-colored surfaces, consistent cards. */
:root { --card-bg: #1d141b; --card-border: rgba(196,139,155,.28); }

/* The character-selection artwork deliberately keeps its existing treatment. */
.mms-art-page .hero { background: radial-gradient(ellipse at 77% 48%,#57304455,transparent 55%),#100d10; }
.mms-art-page .hero .hero-media,
.mms-art-page .hero:not(.home-hero):not(.admins-hero) .hero-media {
  inset: 120px 3% 70px 52%; height: auto; aspect-ratio: auto;
  overflow: visible; border: 0; border-radius: 0; box-shadow: none; background: none;
}
.mms-art-page .hero .hero-media::before { content:""; position:absolute; inset:6% 3% 8%; border:1px solid #bd8a9b35; border-radius:50%; background:radial-gradient(circle,#8e4e6426,transparent 70%); }
.mms-art-page .hero .hero-media img,
.mms-art-page .hero:not(.home-hero):not(.admins-hero) .hero-media img {
  position: absolute; inset:0; width:100%; height:100%; max-width:100%; margin:0;
  object-fit:contain; object-position:center bottom; transform:none; filter:none;
  mask-image:none;
}
.mms-art-page .hero .hero-media-wash { display:none; }
.mms-art-page .home-hero .hero-media img { object-position:center; }
.mms-art-page .hero .hero-copy { max-width: 640px; }
.mms-art-page .hero:not(.home-hero) .hero-copy { max-width: 60%; }
.mms-art-page .hero .hero-stamp { z-index:2; }
.mms-art-page .admins-hero h1 { font-size:clamp(50px,5.3vw,78px); }

/* Main-page cards: art and copy have their own space. */
.bento-grid { gap:24px; }
.bento-card { min-height:560px; border:1px solid var(--card-border); border-radius:18px; background:radial-gradient(ellipse at 80% 15%,#65344755,transparent 70%),var(--card-bg); box-shadow:0 16px 44px #0003; transform-style:flat; }
.bento-card .card-topline { padding:5px 7px; color:#c5a6b2; }
.bento-card .card-copy { inset:auto 28px 28px; transform:none; }
.bento-card .card-copy h3 { font-family:var(--serif); font-size:44px; font-weight:500; line-height:1.04; text-transform:none; letter-spacing:-.03em; }
.bento-card .card-copy p { color:#d6c5ce; max-width:460px; }
.bento-card::before { display:none; }
.bento-card::after { background:linear-gradient(0deg,#1d141b 33%,#1d141ba8 53%,transparent 78%); }
.bento-card:not(.bento-role) img { filter:none; object-fit:contain; object-position:center; }
.bento-card .chat-cast { opacity:.85; }
.bento-card .edit-window, .bento-card .anon-visual { top:66px; height:240px; background:radial-gradient(ellipse,#563044,#21171f 75%); transform:none; border-color:#b47f9255; box-shadow:none; }
.bento-card .edit-character, .bento-card .anon-character { opacity:1; object-fit:contain; object-position:75% center; }
.bento-card .edit-frame > span { font-family:var(--serif); font-size:64px; letter-spacing:.03em; justify-self:start; margin-left:30px; opacity:.75; }
.bento-role,.bento-live { grid-column:span 6; }
.bento-role .role-orbit { display:none; }
.bento-role .bento-character-media { inset:50px 20px auto auto; width:70%; height:270px; object-fit:contain; object-position:center; opacity:1; transform:none; filter:none; }
.bento-section::before,.join-section::before,.rules-page-content::before { background:radial-gradient(ellipse at 75% 35%,#74364a55,transparent 65%); filter:none; }

/* Owner and administration cards share a compact portrait/content rhythm. */
.owner-card, .admin-channel-card, .media-link-card, .rules-detail-card { border-color:var(--card-border); border-radius:18px; background:var(--card-bg); box-shadow:0 16px 44px #0003; }
.admin-grid { gap:24px; align-items:stretch; }
.admin-card { grid-template-rows:auto 1fr; }
.admin-card .owner-card-media { height:auto; aspect-ratio:1.15; background:#2c1b26; }
.admin-card .owner-card-media img,.admin-card:hover .owner-card-media img { object-position:center 15%; filter:grayscale(1) contrast(.95) brightness(1.06); transform:none; }
.admin-card .owner-card-media::after { background:linear-gradient(0deg,#1d141b,transparent 45%),linear-gradient(135deg,#743b4d35,#3e203133); }
.admin-card::before,.admin-card::after { display:none; }
.admin-card .owner-card-copy { padding:28px; min-height:310px; border-top:0; background:var(--card-bg); }
.admin-card .owner-card-copy h3 { font-family:var(--serif); font-size:44px; font-weight:500; text-transform:none; letter-spacing:-.03em; }
.admin-card .owner-card-copy > p:not(.owner-fandom) { color:#d6c5ce; font-size:14px; margin-bottom:24px; }
.admin-card .owner-contact { margin-top:auto; padding:14px 10px; font-size:10px; letter-spacing:.02em; min-height:48px; }
.owner-handle { overflow-wrap:anywhere; }
.admin-card .owner-role { right:16px; top:16px; background:#20151de6; }
.admin-card .owner-series { left:16px; top:16px; background:#20151de6; }
.admin-contacts-backdrop { display:none; }
.admin-recruit-portraits img { filter:grayscale(1); opacity:.5; }
.admin-channel-cards { align-items:stretch; }
.admin-channel-card { padding:28px; }
.admin-channel-card h3 { font-family:var(--serif); font-size:38px; font-weight:500; text-transform:none; }
.admin-channel-card > p:not(.eyebrow) { color:#d6c5ce; }
.mms-owner-grid .owner-card { grid-template-columns:42% 58%; min-height:440px; }
.mms-owner-grid .owner-card-media { background:radial-gradient(ellipse at 45% 40%,#62384a,#21171f 75%); }
.mms-owner-grid .owner-card-media img { width:100%; height:100%; object-fit:contain; object-position:bottom; mask-image:none; }
.mms-owner-grid .owner-card-copy { background:var(--card-bg); padding:74px 32px 32px; }
.mms-owner-grid .owner-role { left:calc(42% + 32px); right:auto; }

/* Media cards preserve full PNG silhouettes and align their actions. */
.media-link-grid { gap:24px; }
.media-link-visual { aspect-ratio:1.8; background:radial-gradient(ellipse at 65% 50%,#63374c,#251922 70%); border-bottom:1px solid var(--card-border); }
.media-link-visual > img,.media-link-tiktok .media-link-visual > img,.media-link-life .media-link-visual > img { object-fit:contain; object-position:center bottom; filter:none; padding-top:20px; }
.media-link-overlay { background:linear-gradient(0deg,#1d141b,transparent 35%); }
.media-link-copy { padding:30px; }
.media-link-copy h3 { font-family:var(--body); font-weight:650; font-size:clamp(23px,2.4vw,34px); line-height:1.25; text-transform:none; letter-spacing:-.035em; overflow-wrap:anywhere; }
.media-link-actions { width:100%; gap:10px; }
.media-link-actions .button { flex:1; }
.media-links-section::before { background:radial-gradient(ellipse,#74364a66,transparent 65%); }

/* Supporting illustrations have transparent backgrounds rather than banner text. */
.mms-art-page .final-cta-media { background:radial-gradient(ellipse at 80% 50%,#60314644,transparent 65%); }
.mms-art-page .final-cta-media img { width:50%; height:100%; margin-left:auto; object-fit:contain; object-position:right bottom; opacity:.65; filter:none; mask-image:linear-gradient(90deg,transparent,#000 30%); }
.mms-art-page .fandom-panorama > img { width:50%; margin-left:auto; object-fit:contain; object-position:right bottom; filter:none; }
.mms-art-page .fandom-panorama { background:radial-gradient(ellipse at 75% 50%,#583346,#171117 70%); }
.mms-art-page .impact-cast,.mms-art-page .admin-duty-media { width:48%; left:auto; right:0; object-fit:contain; object-position:right bottom; filter:none; opacity:.45; }
.mms-art-page .rest-guide-media img { object-fit:contain; object-position:right bottom; }
.mms-art-page .team-help-card .team-help-portrait { object-fit:contain; object-position:right bottom; filter:none; }
.meimei-rules::before { background:linear-gradient(90deg,#100d10,#100d10aa),url('assets/mms-meimei-raven.png') right bottom / auto 100% no-repeat; }

/* Typography is lighter and consistent; role-card artwork is untouched. */
.role-catalog-card { border-radius:14px; padding:24px; display:flex; flex-direction:column; min-height:300px; }
.role-catalog-card[hidden] { display:none; }
.role-catalog-card h3 { font-family:var(--body); font-size:22px; font-weight:700; line-height:1.35; text-transform:none; letter-spacing:-.025em; }
.occupied-role-tags { margin-top:auto; padding-top:12px; gap:8px; }
.occupied-role-tags li { font-size:12px; padding:6px 10px; line-height:1.5; background:#181117cf; }
.rules-detail-card { padding:28px; }
.rules-detail-card h3 { font-family:var(--body); font-size:22px; line-height:1.35; text-transform:none; letter-spacing:-.02em; }
.rules-detail-card p { color:#d6c5ce; }
.admin-recruit-roles article { padding:26px; border:1px solid var(--card-border); border-radius:14px; background:#21171f; }
.admin-recruit-roles h3 { font-family:var(--body); font-size:20px; text-transform:none; line-height:1.4; }
.admin-recruit-roles a { overflow-wrap:anywhere; }

@media(max-width:1080px) {
 .admin-grid-three { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .admin-card:last-child { grid-column:auto; }
 .mms-art-page .hero:not(.home-hero) .hero-copy { max-width:66%; }
 .mms-art-page .hero .hero-stamp { display:none; }
 .media-link-copy { padding:24px; }
 .roles-catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:720px) {
 .mms-art-page .hero .hero-media,.mms-art-page .hero:not(.home-hero):not(.admins-hero) .hero-media { inset:95px 16px auto; height:280px; max-width:350px; margin-inline:auto; }
 .mms-art-page .hero .hero-content,.mms-art-page .hero:not(.home-hero):not(.admins-hero) .hero-content { display:block; padding-top:370px; padding-bottom:115px; }
 .mms-art-page .hero .hero-copy,.mms-art-page .hero:not(.home-hero) .hero-copy { max-width:100%; }
 .mms-art-page .hero:not(.home-hero) h1 { font-size:54px; }
 .bento-grid,.admin-grid-three,.media-link-grid,.roles-catalog-grid { grid-template-columns:1fr; gap:20px; }
 .bento-card { grid-column:1; min-height:560px; }
 .bento-card .card-copy { left:24px; right:24px; bottom:26px; }
 .bento-card .card-copy h3 { font-size:38px; }
 .bento-card .edit-window,.bento-card .anon-visual { left:20px; right:20px; height:215px; }
 .admin-card .owner-card-media { aspect-ratio:1.18; }
 .admin-card .owner-card-copy { padding:24px; min-height:290px; }
 .admin-card .owner-card-copy h3 { font-size:40px; }
 .admin-channel-cards-pair { grid-template-columns:1fr; }
 .mms-owner-grid .owner-card { grid-template-columns:1fr; grid-template-rows:300px auto; }
 .mms-owner-grid .owner-card-copy { padding:28px 24px; }
 .mms-owner-grid .owner-role { left:20px; }
 .media-link-visual { aspect-ratio:1.45; }
 .media-link-actions { flex-direction:column; }
 .media-link-actions .button { width:100%; }
 .role-catalog-card { min-height:275px; }
 .role-catalog-card h3 { font-size:21px; }
 .mms-art-page .final-cta-media img { width:100%; opacity:.22; }
 .mms-art-page .fandom-panorama > img { width:100%; opacity:.35; }
 .mms-art-page .impact-cast,.mms-art-page .admin-duty-media { width:100%; opacity:.2; }
}