/* 図解の外側にカードを作らず、サイトの背景・余白・文字に揃える。 */
.concept-controls{position:fixed;z-index:10000;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;padding:10px 16px;background:#fffdf8f5;border:1px solid #d8d0c2;border-radius:12px;box-shadow:0 8px 40px #17171715;color:#34332e;font:12px/1.5 Inter,'Noto Sans JP',sans-serif;max-width:calc(100% - 24px);backdrop-filter:blur(15px)}
.concept-controls>span{font-size:9px;letter-spacing:.12em;color:#7b705e;white-space:nowrap}.concept-controls>div{display:flex;gap:5px}.concept-controls button{font:inherit;white-space:nowrap;background:transparent;border:0;border-radius:6px;padding:9px 12px;cursor:pointer}.concept-controls button[aria-pressed=true]{background:#282822;color:#fff}.concept-controls a{white-space:nowrap;color:#686352;text-decoration:none}.concept-controls :focus-visible{outline:2px solid #aa8b59;outline-offset:3px}
#aidx-preview{scroll-margin-top:110px}
html:not([data-concept=original]) .concept-section .ab-amap{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin-top:48px}
html:not([data-concept=original]) .concept-section .am-cap{display:none}
html:not([data-concept=original]) .concept-section .am{margin-top:0}
/* 案1：背景の矩形をなくし、要素と接続だけを残す。 */
html[data-concept=paper] .concept-section{--navy:#292b33;--sub:#686a70;--line:#d9d5cc}
html[data-concept=paper] .ideal-section .am-person circle{fill:#f5f3ed!important;stroke:#979a9d!important}
html[data-concept=paper] .ideal-section .am-person .t,html[data-concept=paper] .ideal-section .am-base .t{fill:#292b33!important}
html[data-concept=paper] .ideal-section .am-person .s,html[data-concept=paper] .ideal-section .am-base .s,html[data-concept=paper] .ideal-section .am-lb .jp,html[data-concept=paper] .ideal-section .am-legend text{fill:#686a70!important}
html[data-concept=paper] .ideal-section .am-base rect{fill:transparent!important;stroke:#b3c7c3!important;rx:0}
html[data-concept=paper] .ideal-section .am-sep{stroke:#d9d5cc!important;stroke-dasharray:2 6}
html[data-concept=paper] .ideal-section .am-lb{stroke:#f5f3ed!important}
html[data-concept=paper] .ideal-section .am-lb .en{fill:#3e7c80!important}
html[data-concept=paper] .ideal-section .am-up{stroke:#666b70!important}
html[data-concept=paper] .ideal-section .am-ask{stroke:#4b5158!important}
html[data-concept=paper] .ideal-section .am-k.navy,html[data-concept=paper] .ideal-section .am-dot.navy{fill:#4b5158!important}
html[data-concept=paper] .ideal-section .am-k.teal{fill:#3e7c80!important}
html[data-concept=paper] .ideal-section .am-tell{stroke:#3e7c80!important}
html[data-concept=paper] .ideal-section .am-link{stroke:#3e7c8060!important}
html[data-concept=paper] .current-section .bm-lb{stroke:#f5f3ed!important}
html[data-concept=paper] .current-section .bm-base rect{fill:transparent!important}
html[data-concept=paper] .current-section .bm-band{fill:#e9e6de66!important}
/* 案2：暗色の図解を見出しごと全幅の章にする。 */
html[data-concept=band] .ideal-section{position:relative;margin-top:110px;padding:80px 0 88px;background:#171717;box-shadow:0 0 0 100vmax #171717;clip-path:inset(0 -100vmax);color:#f1f0ed;--line:#ffffff24;--sub:#bfc2c6;--navy:#f1f0ed}
html[data-concept=band] .ideal-section .ab-h2{color:#f1f0ed!important}
html[data-concept=band] .ideal-section .sv-num{color:#c7ab7b!important}
html[data-concept=band] .current-section .bm-lb{stroke:#f5f3ed!important}
@media(max-width:640px){.concept-controls{bottom:10px;padding:8px;gap:4px;flex-wrap:wrap;justify-content:center;width:max-content}.concept-controls>span{display:none}.concept-controls button{font-size:10px;padding:8px}.concept-controls a{font-size:10px;padding:0 8px}.concept-section .ab-amap{margin-top:28px!important}html[data-concept=band] .ideal-section{margin-top:70px;padding:54px 0}#aidx-preview{scroll-margin-top:90px}}
@media(prefers-reduced-motion:reduce){.concept-section *{animation:none!important;transition:none!important;scroll-behavior:auto!important}.concept-section animateMotion{display:none}}

html[data-concept=paper] .ideal-section marker[id$="-hn"] path{fill:#4b5158!important}
html[data-concept=paper] .ideal-section marker[id$="-ht"] path{fill:#3e7c80!important}
/* PC：横長に組み直し、見出しから凡例までをウィンドウ内に収める。 */
.am-wide{display:none!important}
@media(min-width:760px){
  html:not([data-concept=original]) .ideal-section{position:relative;left:50%;transform:translateX(-50%);width:calc(100vw - 80px);height:calc(100dvh - 100px);margin-top:70px;padding:26px 0 76px;box-sizing:border-box;scroll-margin-top:84px!important}
  html:not([data-concept=original]) .ideal-section>.sv-wrap{width:100%;max-width:none;height:100%;padding:0;display:flex;flex-direction:column}
  html:not([data-concept=original]) .ideal-section .ab-h2{font-size:clamp(26px,2.3vw,40px);margin-top:12px;line-height:1.3}
  html:not([data-concept=original]) .ideal-section .sv-head{flex:none}
  html:not([data-concept=original]) .ideal-section .ab-amap{flex:1;min-height:0;margin-top:18px!important}
  html:not([data-concept=original]) .ideal-section .am-pc,html:not([data-concept=original]) .ideal-section .am-sp{display:none!important}
  html:not([data-concept=original]) .ideal-section .am-wide{display:block!important;width:100%;height:100%;overflow:visible}
  html:not([data-concept=original]) .ideal-section .am-wide>*{opacity:1!important;transition:none!important}
  html[data-concept=band] .ideal-section{margin-top:70px;padding:26px 0 76px}
  html:not([data-concept=original]) .current-section{position:relative;left:50%;transform:translateX(-50%);width:calc(100vw - 80px)}
  html:not([data-concept=original]) .current-section>.sv-wrap{width:100%;max-width:none;padding:0}
  html:not([data-concept=original]) .current-section .am-pc{max-height:calc(100dvh - 270px)}
}
/* 本人調整：全体表示を保ち、図を約10%引いて見せる。 */
@media(min-width:760px){
  html:not([data-concept=original]) .ideal-section .am-wide{width:90%;height:90%;margin:0 auto}
}

/* 現状・理想とも、実測したヘッダーと比較パネルを除いた表示領域に収める。 */
@media(min-width:760px){
  html:not([data-concept=original]) .concept-section{position:relative;left:50%;transform:translateX(-50%);width:calc(100vw - 80px);height:var(--fit-height,calc(100dvh - 190px));padding:16px 0 12px!important;box-sizing:border-box;scroll-margin-top:var(--fit-top,88px)!important}
  html:not([data-concept=original]) .concept-section>.sv-wrap{width:100%;max-width:none;height:100%;padding:0;display:flex;flex-direction:column}
  html:not([data-concept=original]) .concept-section .ab-h2{font-size:clamp(23px,2vw,34px);line-height:1.25;margin-top:10px;flex:none}
  html:not([data-concept=original]) .concept-section .sv-head{flex:none}
  html:not([data-concept=original]) .concept-section .ab-amap{flex:1;min-height:0;margin-top:14px!important;display:flex;align-items:center;justify-content:center}
  html:not([data-concept=original]) .ideal-section .am-wide{width:86%;height:90%;margin:0}
  html:not([data-concept=original]) .current-section .bm-pc{display:block!important;width:86%;height:90%;max-height:none;margin:0;overflow:visible}
  html:not([data-concept=original]) .current-section .bm-sp{display:none!important}
  html:not([data-concept=original]) .current-section .am>*{opacity:1!important;transition:none!important}
}

/* 現状と理想は同じ1400×490の構図・同じ縮尺で比較する。 */
@media(min-width:760px){
  html:not([data-concept=original]) .current-section .bm-pc{display:none!important}
  html:not([data-concept=original]) .current-section .bm-wide{display:block!important;width:86%;height:90%;margin:0;overflow:visible}
  html:not([data-concept=original]) .concept-section .ab-h2{min-height:2.5em}
  html:not([data-concept=original]) .current-section .bm-wide .bm-person{animation:none}
}
@media(min-width:760px){
  html:not([data-concept=original]) .concept-section .ab-h2{height:2.5em;min-height:2.5em;box-sizing:border-box}
  html:not([data-concept=original]) .concept-section .ab-h2 .l{line-height:1.25}
}
/* WHYの見出しを右・下へ移動し、スマホでは折り返しを許可する。 */
@media(min-width:760px){
  html:not([data-concept=original]) .current-section>.sv-wrap>.sv-head,
  html:not([data-concept=original]) .current-section>.sv-wrap>.ab-h2{margin-left:clamp(24px,2.2vw,44px);max-width:calc(100% - clamp(24px,2.2vw,44px))}
  html:not([data-concept=original]) .current-section>.sv-wrap>.sv-head{margin-top:24px}
}
@media(max-width:759px){
  html:not([data-concept=original]) .current-section>.sv-wrap{padding-top:16px}
  html:not([data-concept=original]) .current-section .sv-head{gap:12px;align-items:flex-start}
  html:not([data-concept=original]) .current-section .sv-num{white-space:normal;line-height:1.7;overflow-wrap:anywhere}
  html:not([data-concept=original]) .concept-section .ab-h2{height:auto;min-height:0;font-size:clamp(22px,5.4vw,32px);line-height:1.5}
  html:not([data-concept=original]) .concept-section .ab-h2 .l{white-space:normal;overflow:visible;line-height:1.5}
}