/* MECCHA design system: neutral grays, a single orange, readable copy. */
/* Homepage: matched section headings and two-card event carousel. */
body.mh-site.section-home #real{background:#fff!important}
body.mh-site.section-home #real .mh-home-events>.event-card,
body.mh-site.section-home #real .mh-home-events .event-copy{background:#fff!important;border:0!important;box-shadow:none!important}
body.mh-site.section-home #real .event-card::before,
body.mh-site.section-home #real .event-card::after,
body.mh-site.section-home #real .event-copy::before,
body.mh-site.section-home #real .event-copy::after{display:none!important;content:none!important}

body.mh-site.section-home #main :is(.section-heading h2,.mh-official-events h2){font-size:clamp(40px,6vw,86px)!important;line-height:1.08!important;letter-spacing:-.04em!important}
body.mh-site.section-home #real .mh-home-events{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0;overscroll-behavior-x:contain;scrollbar-width:none;background:transparent}
body.mh-site.section-home #real .mh-home-events::-webkit-scrollbar{display:none}
body.mh-site.section-home #real .mh-home-events>.event-card{border:0!important;box-shadow:none!important;background:transparent!important}
body.mh-site.section-home #real .mh-home-events>.event-card{flex:0 0 calc((100% - 24px)/2);min-width:0;display:flex!important;flex-direction:column;scroll-snap-align:start;margin:0}
body.mh-site.section-home #real .mh-home-events .event-visual{position:relative!important;display:block!important;width:100%!important;height:auto!important;aspect-ratio:16/10!important;min-height:0!important;flex:0 0 auto!important;overflow:hidden;background:#fff!important;padding:0!important}
body.mh-site.section-home #real .mh-home-events .event-visual img{position:absolute!important;inset:0!important;display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;max-width:none!important;margin:0!important;padding:12px!important;object-fit:contain!important;object-position:center!important;background:#fff}
body.mh-site.section-home #real .mh-home-events .event-copy{flex:1;display:flex;flex-direction:column;background:transparent!important;border:0!important;color:#181818!important}
body.mh-site.section-home #real .mh-home-events .event-copy .inline-link{margin-top:auto;padding-top:16px}
body.mh-site.section-home #real .mh-home-events .event-copy{padding:24px}
body.mh-site.section-home #real .mh-home-events .event-copy h3{font-size:clamp(19px,2vw,28px)!important;line-height:1.45}
@media(max-width:620px){
body.mh-site.section-home #real .mh-home-events{gap:12px}
body.mh-site.section-home #real .mh-home-events>.event-card{flex-basis:calc((100% - 12px)/2)}
body.mh-site.section-home #real .mh-home-events .event-copy{padding:12px}
body.mh-site.section-home #real .mh-home-events .event-copy h3{font-size:16px!important}
body.mh-site.section-home #real .mh-home-events .event-copy>p{display:none}
body.mh-site.section-home #real .mh-home-events .event-meta{display:flex;flex-direction:column;gap:4px;font-size:11px}
body.mh-site.section-home #real .mh-home-events .inline-link{font-size:12px}
body.mh-site.section-home #real .mh-home-events .badge{font-size:10px;padding:5px 7px}
}
@media(max-width:520px){body.mh-site.section-home #main :is(.section-heading h2,.mh-official-events h2){font-size:36px!important}}

/* Real-event archives: editorial scale without changing the homepage hero. */
body.mh-site.section-real:has(.event-archive) .page-head h1{
 font-size:clamp(30px,3.4vw,46px);line-height:1.35;letter-spacing:-.025em;
 max-width:1000px;overflow-wrap:break-word;text-wrap:pretty;margin-top:20px
}
body.mh-site.section-real:has(.event-archive) .page-head .lede{max-width:760px;margin-top:22px}
body.mh-site.section-real #main .event-archive :is(.richtext,.detail-section,.event-summary) h2{
 font-size:24px;line-height:1.5;letter-spacing:-.015em;margin:32px 0 16px
}
body.mh-site.section-real #main .event-archive .richtext h3{font-size:20px;line-height:1.55}
body.mh-site.section-real #main .event-card-past .event-copy h3{
 font-size:clamp(24px,2.1vw,28px);line-height:1.5;letter-spacing:-.02em;text-wrap:pretty
}
body.mh-site.section-real #main .event-card-logo .event-visual{
 background:#000000;min-height:260px
}
body.mh-site.section-real #main .event-card-logo .event-visual img{
 width:63%!important;max-width:320px!important;height:auto!important;max-height:180px!important;object-fit:contain
}
body.mh-site.section-real #main .detail-image.event-logo{
 background:#000000;min-height:240px;padding:36px 24px;
 display:flex;align-items:center;justify-content:center
}
body.mh-site.section-real #main .detail-image.event-logo img{
 width:68%!important;max-width:320px!important;height:auto!important;max-height:180px!important;object-fit:contain;background:#000000
}
@media(max-width:767px){
 body.mh-site.section-real:has(.event-archive) .page-head{padding-top:32px;padding-bottom:26px}
 body.mh-site.section-real:has(.event-archive) .page-head h1{font-size:28px;line-height:1.45}
 body.mh-site.section-real #main .event-archive :is(.richtext,.detail-section,.event-summary) h2{font-size:21px;margin:28px 0 14px}
 body.mh-site.section-real #main .event-archive .richtext h3{font-size:18px}
 body.mh-site.section-real #main .event-card-past .event-copy h3{font-size:22px;line-height:1.5}
 body.mh-site.section-real #main .event-card-logo .event-visual{min-height:210px}
 body.mh-site.section-real #main .event-card-logo .event-visual img{width:72%!important;max-width:250px!important}
 body.mh-site.section-real #main .detail-image.event-logo{min-height:180px;padding:28px 20px}
 body.mh-site.section-real #main .detail-image.event-logo img{width:80%!important;max-width:230px!important}
}

/* Portal heading: override the former Customizer-generated event slogan. */
body.mh-site.section-home #main .hero-copy>.mh-portal-title{font-size:clamp(22px,2.2vw,32px)!important;line-height:1.45!important;letter-spacing:-.025em!important;white-space:normal!important;margin:0 0 18px!important;max-width:28ch;overflow-wrap:break-word}
body.mh-site.section-home #main .hero-copy>.mh-portal-title::after{content:none!important;display:none!important}
body.mh-site.section-home .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body.mh-site.section-home .hero-actions .button{min-width:0;max-width:none;gap:12px}
.mh-language-links{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:32px;font-size:14px}
.mh-language-links a{text-decoration:underline;text-underline-offset:4px}
@media(max-width:620px){body.mh-site.section-home #main .hero-copy>.mh-portal-title{font-size:23px!important}}
/* Keep listing typography unchanged; constrain only individual article titles. */
@media(min-width:768px){
 body.mh-site.mh-detail-page:is(.section-news,.section-media) #main .page-head h1{font-size:clamp(28px,3.5vw,48px)!important;line-height:1.5;letter-spacing:-.025em;overflow-wrap:anywhere}
}
body.mh-site.mh-detail-page:is(.section-news,.section-media) #main .detail-layout article{min-width:0}
body.mh-site.mh-detail-page:is(.section-news,.section-media) #main .richtext{line-height:1.85}
/* Mobile article hierarchy: shared by all languages and detail sections, not listings. */
@media(max-width:767px){
 body.mh-site.mh-detail-page #main .page-head h1{font-size:clamp(24px,6.2vw,28px)!important;line-height:1.5;letter-spacing:-.02em;overflow-wrap:anywhere;word-break:normal;margin-top:16px}
 body.mh-site.mh-detail-page #main .detail-layout article{min-width:0}
 body.mh-site.mh-detail-page #main :is(.richtext,.detail-section,.event-summary,.detail-aside) h2{font-size:21px!important;line-height:1.55;letter-spacing:-.015em;overflow-wrap:anywhere}
 body.mh-site.mh-detail-page #main :is(.richtext,.detail-section,.event-summary,.detail-aside) h3{font-size:18px!important;line-height:1.6;letter-spacing:0;overflow-wrap:anywhere}
 body.mh-site.mh-detail-page #main .richtext h2{margin:30px 0 14px}
 body.mh-site.mh-detail-page #main .richtext h3{margin:24px 0 12px}
}
@media(max-width:900px){html:lang(ja) body.mh-site.section-home #main .hero-copy>h2{font-size:clamp(16px,4.3vw,27px)!important}}

/* Responsive official video and developer interviews. */
body.mh-site.section-home .hero-bottom{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:clamp(24px,4vw,64px)}
body.mh-site.section-home .hero-art.mh-hero-video{min-width:0;height:auto;aspect-ratio:auto;transform:none;overflow:visible;background:#000;border-radius:0}
.mh-hero-video iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;border:0;min-height:200px}
.mh-hero-video-link{display:block;padding:12px 14px;background:#111;color:#f3f3f3;font-size:13px;line-height:1.6}
.mh-interview-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:28px}
.mh-interview-card{border-top:2px solid #23D520;padding-top:22px;min-width:0}
.mh-interview-card h3{font-size:clamp(20px,2vw,26px);line-height:1.5}
.mh-interview-card a{color:inherit;text-underline-offset:5px}
.mh-interview-card .eyebrow{color:#23D520}
@media(max-width:900px){body.mh-site.section-home .hero-bottom{grid-template-columns:1fr;gap:24px}.mh-interview-list{grid-template-columns:1fr}.mh-hero-video iframe{min-height:200px}}

/* Desktop: align video/copy row with the painted title's inner edges. */
@media(min-width:901px){
 body.mh-site.section-home #main .hero-bottom{width:calc(var(--mh-title-right,94%) - 1%);max-width:calc(var(--mh-title-right,94%) - 1%);margin-left:1%;margin-right:0;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
 body.mh-site.section-home #main .hero-art.mh-hero-video{width:100%!important;max-width:100%!important;margin:0!important;left:auto!important;right:auto!important;justify-self:stretch;transform:none!important}
 body.mh-site.section-home #main .mh-hero-video iframe{width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:16/9;min-height:0;display:block}
}
/* Keep calls to action clear without repeated decorative diagonal arrows. */
body.mh-site :is(.card-arrow,.mh-event-arrow,.inline-link>span,.mh-map-caption>span:last-child){display:none!important}
body.mh-site .button{justify-content:space-between}
body.mh-site a.button::after{
 content:"";display:block;flex:0 0 7px;width:7px;height:7px;
 border-top:2px solid currentColor;border-right:2px solid currentColor;
 transform:rotate(45deg);transition:transform .18s ease;
}
body.mh-site a.button:is(:hover,:focus-visible)::after{transform:translateX(3px) rotate(45deg)}
body.mh-site .news-card .card-image::after{
 content:"+";position:absolute;right:12px;bottom:12px;width:30px;height:30px;
 display:grid;place-items:center;background:#fff;color:#111;border:1px solid #111;
 border-radius:50%;font-size:22px;line-height:1;transition:background .18s ease;
}
body.mh-site .news-card>a:is(:hover,:focus-visible) .card-image::after{background:#23D520}
body.mh-site #main .news-card>a{display:block;outline-offset:6px}
body.mh-site #main .news-card>a:is(:hover,:focus-visible) h3{
 color:#23D520;text-decoration:underline;text-underline-offset:5px;
}
body.mh-site #main .event-card:is(:hover,:focus-visible){
 outline:2px solid #23D520!important;outline-offset:4px;
}
body.mh-site #main .event-card:is(:hover,:focus-visible) h3{text-decoration:underline;text-underline-offset:5px}
body.mh-site #main a.button:is(:hover,:focus-visible){
 background:transparent!important;color:#23D520!important;border-color:#23D520!important;
 box-shadow:inset 0 0 0 1px #23D520!important;
}
body.mh-site.section-home #main .game-banner a.button:is(:hover,:focus-visible){
 background:#111!important;color:#fff!important;border-color:#111!important;box-shadow:none!important;
}
body.mh-site .desktop-nav a:is(:hover,:focus-visible,.active){
 color:#23D520;border-bottom-color:#23D520;
}
@media(prefers-reduced-motion:reduce){
 body.mh-site a.button::after,body.mh-site .news-card .card-image::after{transition:none}
}
body.mh-site .button>span:only-child{font-size:inherit;line-height:inherit}
/* Consistent homepage section numbering and a white game introduction. */
body.mh-site.section-home #main :is(.section-heading,.game-banner,.mh-event-heading) .eyebrow{
 font-size:12px!important;letter-spacing:.08em;line-height:1.7;
}
body.mh-site.section-home #main :is(.section-heading,.game-banner,.mh-event-heading) .index{
 display:inline!important;font-size:12px!important;margin-right:0!important;
}
body.mh-site.section-home #main .game-banner{
 background:#fff!important;color:#111!important;
}
body.mh-site.section-home #main .game-banner :is(h2,h2 span,p,.index){color:#111!important;-webkit-text-fill-color:#111!important}
body.mh-site.section-home #main .game-banner .button{
 background:transparent!important;color:#111!important;border:1px solid #111!important;
}
body.mh-site.section-home #main .game-banner .button:hover{background:#111!important;color:#fff!important}
body.mh-site.section-home #main .game-banner .button span{-webkit-text-fill-color:currentColor!important}
/* Use one neutral black for the page, dark sections, header and footer. */
:root{--mh-background-black:#111111}
body.mh-site,
body.mh-site .header,
body.mh-site .footer,
body.mh-site.section-home #main :is(.hero,.goods-section,.mh-home-media){
 background:var(--mh-background-black)!important;
}
body.mh-site .footer-top,
body.mh-site .footer-bottom{background:transparent!important}
/* Match the site logo orange to #23D520; retain white, alpha and original artwork. */
body.mh-site :is(.wordmark,.footer-brand) img[src*="mecchameleon-game-header-logo"]{filter:url("#mh-brand-green")}
:root{
 --mh-orange:#23D520;
 --mh-body-size:17px;
 --mh-note-size:14px;
 --mh-small-size:12px;
 --mh-copy-leading:1.85;
}
body.mh-site{font-size:var(--mh-body-size);background:#111111;color:#f3f3f3}
body.mh-site #main :is(
 .hero-copy>p:not(.eyebrow,.hero-caption),.event-copy>p:not(.eyebrow),
 .goods-teaser-copy>p:not(.eyebrow),.game-banner p:not(.eyebrow),
 .collab-banner p:not(.eyebrow),.page-head .lede,.steps p,
 .richtext,.richtext p,.richtext li,.richtext table,.detail-section p,
 .update-row p,.collaboration-types p,.contact-panel>p:not(.muted),
 .mh-partner-description,.mh-partner-heading>p:not(.eyebrow),
 .mh-community-card p,.mh-history-row p:not(.eyebrow),
 .mh-game-guide p:not(.eyebrow,.gg-number),.mh-goods-announcement p:not(.mh-goods-kind,.fineprint),
 .mh-about-people p,.mh-about-people a,.mh-social-grid p,.mh-social-grid article>a,
 .event-credits p,.event-credits li,.event-summary dl,
 .inquiry-consent,.inquiry-privacy,.worldwide-intro,
 .worldwide-card p:not(.worldwide-meta,.worldwide-type,.worldwide-status)
){font-size:var(--mh-body-size)!important;line-height:var(--mh-copy-leading)}
body.mh-site #main :is(
 .fineprint,.muted,.section-note,.source-link,.media-credit,
 .event-gallery figcaption,.operator,.detail-aside dd,
 .mh-goods-information-note,.mh-goods-announcement .fineprint,
 .mh-history-references p,.mh-history-citations,
 .mh-map-help,.mh-event-date,.mh-event-venue,.mh-event-action,
 .mh-video-credit,.mh-video-credit>a,.mh-community-footer,.mh-community-meta,
 .inquiry-error,.inquiry-field label,.worldwide-note,.worldwide-disclaimer
){font-size:var(--mh-note-size)!important;line-height:1.75}
body.mh-site #main :is(.button,.text-button,.inline-link,.mh-partner-card>a,.filter-button,.search-label,.gg-nav a){font-size:var(--mh-note-size);line-height:1.6}
body.mh-site #main .section-heading .text-button{white-space:normal}
body.mh-site #main .mh-partner-tag{font-size:var(--mh-small-size);line-height:1.7}
body.mh-site #main .mh-partner-description{color:#c7c7c7}
body.mh-site #main .mh-partner-heading>p:last-child{max-width:760px}
body.mh-site #main .mh-partner-card>a:hover{color:var(--mh-orange);text-decoration:underline}
body.mh-site.section-collaboration .page-head{padding-bottom:24px}
body.mh-site.section-collaboration .page-head+.generic-content{padding-top:24px}
body.mh-site .button.lime:hover{background:var(--mh-orange);box-shadow:inset 0 0 0 2px #111}
body.mh-site .footer-bottom,body.mh-site .legal-links{font-size:var(--mh-small-size);line-height:1.8}
body.mh-site .mh-running-contact span{font-size:var(--mh-small-size)}
body.mh-site .mh-running-contact{width:94px}
body.mh-site .mh-event-credit{font-size:var(--mh-small-size);line-height:1.7}
body.mh-site .mh-japan-stamp{font-size:var(--mh-small-size)}
body.mh-site .mh-japan-stamp b{display:block}

/* Preserve the Customizer's established REAL layout; normalize only its palette. */
body.mh-site.section-home #real{
 background:var(--mh-orange)!important;color:#181818!important;
 box-shadow:0 0 0 100vmax var(--mh-orange)!important;
}
body.mh-site.section-home #real .event-card{border-color:#333333!important;color:#181818!important}
body.mh-site.section-home #real :is(.section-heading .index,.event-copy .eyebrow,.event-meta,.event-copy>p,.inline-link,.section-note,.section-note a,.text-button),
body.mh-site.section-home #real .event-copy::before,
body.mh-site.section-home #real a:hover{color:#181818!important}
body.mh-site.section-home #real .badge{background:#181818!important;color:#fff!important}
body.mh-site.section-home #real .event-copy{background:#ffffff!important;color:#181818!important}
body.mh-site.section-home #real .event-visual,
body.mh-site.section-home #real .event-card.featured{background:#ffffff!important}
body.mh-site.section-home #real a:focus-visible{outline-color:#181818!important}
body.mh-site a.event-card[href$="/real/one-fukuoka-2026/"] .event-copy:not(:has(.event-overview))::before{color:var(--mh-orange)!important}
body.mh-site #main :is(.goods-teaser,.mh-official-events) :is(.fineprint,.muted){color:#333333}
html:lang(ja) body.mh-site.section-home .goods-section .section-heading .eyebrow>.index,
html:lang(ja) body.mh-site.section-home .goods-section .section-heading .eyebrow::after,
html:lang(ja) body.mh-site.section-home #real>.section-heading .eyebrow .index,
html:lang(ja) body.mh-site.section-home #real>.section-heading .eyebrow::after{font-size:var(--mh-small-size)!important}
html:lang(ja) body.mh-site.section-home #real>.section-heading .eyebrow::after,
html:lang(ja) body.mh-site.section-home .goods-section .section-heading .eyebrow::after{content:none!important;display:none!important}
html:lang(ja) body.mh-site.section-home #real>.section-heading .eyebrow,
html:lang(ja) body.mh-site.section-home .goods-section .section-heading .eyebrow{font-size:var(--mh-small-size)!important}
.mh-portal-title>span{display:block}
body.mh-site.section-home #main .hero-copy>.mh-portal-title{font-size:clamp(22px,2vw,28px)!important}

@media(max-width:767px){
 :root{--mh-body-size:16px}
 body.mh-site.section-collaboration .page-head{padding-bottom:18px}
 body.mh-site.section-collaboration .page-head+.generic-content{padding-top:18px}
 body.mh-site #main .mh-partner-heading{margin-bottom:26px}
 body.mh-site #main .mh-partner-card{padding:26px 24px}
 body.mh-site .mh-running-contact{width:72px}
 body.mh-site .mh-event-row{min-width:0}
 body.mh-site .mh-event-info{min-width:0}
 body.mh-site #main .hero-actions .button{padding:13px 10px;gap:8px;min-width:0}
}
@media(max-width:380px){
 body.mh-site .hero-actions{flex-direction:column}
 body.mh-site .hero-actions .button{width:100%;flex:auto}
}
