:root { --eco-self:#E05A9D; --eco-system:#168C99; --eco-society:#7C4BB4; }
.rtm-ecosystem-utility { display:flex; justify-content:flex-end; padding:0 max(20px, calc((100vw - 1240px) / 2)); border-bottom:1px solid var(--line); }
.rtm-ecosystem-disclosure { position:relative; }
.rtm-ecosystem-disclosure > summary { display:flex; align-items:center; gap:.6rem; min-height:44px; padding:.35rem .25rem; color:var(--paper); font-size:.8125rem; cursor:pointer; list-style:none; }
.rtm-ecosystem-disclosure > summary::-webkit-details-marker { display:none; }
.rtm-ecosystem-disclosure[open] > summary > span { transform:rotate(180deg); }
.header .rtm-ecosystem-panel { display:block; position:absolute; right:0; top:100%; width:25rem; max-width:calc(100vw - 2 * max(20px, calc((100vw - 1240px) / 2))); max-height:65vh; max-height:65dvh; overflow:auto; overscroll-behavior:contain; z-index:40; padding:1rem; border:1px solid #555; background:#111; box-shadow:0 1rem 2rem #0008; }
.rtm-ecosystem-disclosure:not([open]) > .rtm-ecosystem-panel { display:none; }
.rtm-eco-identities { display:grid; gap:.625rem; padding:0; margin:0; list-style:none; }
.rtm-eco-identities li { min-width:0; margin:0; }
.rtm-eco-self { --eco-color:var(--eco-self); }
.rtm-eco-system { --eco-color:var(--eco-system); }
.rtm-eco-society { --eco-color:var(--eco-society); }
:is(.header,.rtm-ecosystem-footer) .rtm-eco-link { display:flex; align-items:center; gap:.75rem; min-height:78px; height:100%; padding:.75rem; border-left:3px solid var(--eco-color); color:#F8F6F1; background:#ffffff06; text-decoration:none; font-size:1rem; font-weight:400; }
:is(.header,.rtm-ecosystem-footer) .rtm-eco-link:hover { background:#ffffff12; }
.rtm-eco-symbol { width:2.75rem; height:2.75rem; flex:0 0 2.75rem; color:var(--eco-color); }
.rtm-eco-copy { display:grid; gap:.2rem; min-width:0; line-height:1.35; }
.rtm-eco-label { color:var(--eco-color); font-size:.8125rem; font-weight:750; letter-spacing:.06em; }
.rtm-eco-domain { font-size:.8125rem; overflow-wrap:anywhere; }
.rtm-eco-current { font-size:.75rem; color:#B9BEC2; }
.rtm-eco-external { margin-left:auto; flex:0 0 auto; }
/* Compact footer utility; header ecosystem treatment remains unchanged. */
.rtm-ecosystem-footer { display:block; width:min(100%,660px); min-width:0; margin:20px 0 0 auto; padding:0; border:0; }
.rtm-ecosystem-footer h2 { margin:0 0 10px; font:600 .8125rem/1.4 var(--body); letter-spacing:.02em; text-transform:none; text-align:left; color:var(--muted); }
.rtm-ecosystem-footer .rtm-eco-identities { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.rtm-ecosystem-footer .rtm-eco-link { gap:8px; min-height:68px; padding:8px; border-left-width:2px; font-size:.8125rem; }
.rtm-ecosystem-footer .rtm-eco-symbol { width:24px; height:24px; flex-basis:24px; }
.rtm-ecosystem-footer .rtm-eco-copy { gap:2px; }
.rtm-ecosystem-footer .rtm-eco-label { font-size:.6875rem; }
.rtm-ecosystem-footer .rtm-eco-domain { font-size:.75rem; }
.rtm-ecosystem-footer .rtm-eco-current { font-size:.6875rem; }
.footer { padding:36px 0 24px; }
:is(.rtm-ecosystem-utility,.rtm-ecosystem-footer) :is(a,summary):focus-visible { outline:3px solid #F8F6F1 !important; outline-offset:3px; box-shadow:0 0 0 2px #0B0C0E; }
@media (max-width:700px) {
.rtm-ecosystem-footer { width:100%; margin-top:24px; }
.rtm-ecosystem-footer .rtm-eco-identities { grid-template-columns:1fr; gap:6px; }
.rtm-ecosystem-footer .rtm-eco-link { padding:8px 10px; }
}
.rtm-ecosystem-panel{max-width:calc(100vw - 40px)!important}
.main-article-hero{padding:48px 0 56px;border-top:0;margin:0;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:48px}
.main-article-hero h1{font-size:clamp(2.7rem,4.5vw,4.8rem);margin:18px 0 24px}
.main-article-hero img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
.back-series-index-item+.back-series-index-item{margin-top:70px;padding-top:70px;border-top:1px solid var(--line)}
@media(max-width:850px){.main-article-hero{grid-template-columns:1fr;gap:28px;padding:28px 0 42px}.main-article-hero h1{font-size:clamp(2.5rem,9vw,4rem)}}

/* Ecosystem Navigation Component v1.0 — RTM / SOCIETY.
   Closed panels have no paint, hit area or keyboard-accessible descendants.
   Native details remains the no-script disclosure fallback. */
.header .rtm-ecosystem-disclosure { position:static; }
/* Anchor the desktop panel to the full header so Stage links stay exposed. */
.header .rtm-ecosystem-panel {
  right:max(20px, calc((100vw - 1240px) / 2));
}
.header .rtm-ecosystem-disclosure:not([open]) > .rtm-ecosystem-panel,
.header .rtm-ecosystem-panel[hidden],
.header .rtm-ecosystem-panel[inert] {
  display:none !important;
  visibility:hidden;
  pointer-events:none;
}
/* Touch layouts follow TBW's v1.0 normal-flow disclosure behavior. The RTM
   Stage navigation and compact footer retain their existing rules. */
@media (max-width:900px), (pointer:coarse) {
  .rtm-ecosystem-disclosure { width:100%; min-width:0; }
  .rtm-ecosystem-disclosure > summary { justify-content:flex-end; }
  .header .rtm-ecosystem-panel {
    position:static;
    inset:auto;
    z-index:auto;
    width:100%;
    max-width:100% !important;
    max-height:none;
    overflow:visible;
    overscroll-behavior:auto;
    margin-bottom:.75rem;
    padding:.65rem;
  }
}
