/* +A Scope Article Components v1.0 — working proposal; not canonical */
:root{--as-bg:#071311;--as-ink:#e9f6ed;--as-muted:#b9d5c8;--as-mint:#bce9b4;--as-teal:#70dfbf;--as-card:#102c24;--as-stroke:#335a4d;--as-radius:12px}
html{scroll-padding-top:94px}body{background:var(--as-bg);color:var(--as-ink);font-family:'Noto Sans JP','Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,system-ui,sans-serif}
.site-head{position:sticky!important;top:0;z-index:250;background:rgba(7,19,17,.97);backdrop-filter:blur(12px)}
.article-head h1{font-size:clamp(34px,4.2vw,56px);font-weight:700!important;line-height:1.43;letter-spacing:-.035em}
.article-body{font-size:16px;line-height:1.94;color:#deebe4}
.article-head .disclosure{font-size:12px;line-height:1.5;padding:12px 16px;border:1px solid var(--as-stroke);border-radius:8px;color:var(--as-muted)}
.article-aside{max-height:calc(100vh - 112px);overflow:auto;position:sticky;top:88px}
.article-toc{margin:0;border:0;padding:0}.article-toc summary{display:none}
.article-toc-nav{display:flex;flex-direction:column;gap:0}
.article-aside .aside-title{font-weight:800;font-size:14px;color:#eaffee}
.article-aside .aside-related{color:#bce9b4}
.article-body .faq-list{margin:16px 0 32px}
.article-body .as-faq{margin:10px 0;padding:0;background:var(--as-card);border:1px solid var(--as-stroke);border-radius:10px;overflow:hidden}
.article-body .as-faq summary{padding:15px 19px;display:flex;align-items:flex-start;gap:10px;font-size:15px;color:#f0fff5;line-height:1.7;font-weight:700;list-style:none;cursor:pointer}
.article-body .as-faq summary::-webkit-details-marker{display:none}
.article-body .as-faq summary::before{content:'▶';font-size:11px;color:#bce9b4;transform:translateY(4px);flex:none;transition:transform .15s}
.article-body .as-faq[open] summary::before{transform:translateY(4px) rotate(90deg)}
.article-body .as-faq .answer{padding:0 20px 17px 41px;font-size:14px;line-height:1.85;color:#dcebe1}
.article-body .as-faq .answer p{margin:0}
.article-body .as-faq summary:focus-visible,.article-toc summary:focus-visible,.as-image-link:focus-visible{outline:2px solid var(--as-teal);outline-offset:3px}
.article-body .end-cta{border-radius:12px;background:#13382d;border:1px solid #477765;padding:22px 24px}
.end-cta .cta-action{display:inline-flex;align-items:center;justify-content:center;min-height:45px;font-weight:700}
.end-cta .as-ad-caption{display:block;margin-top:12px;color:#b5cbbf;font-size:12px}
.as-image-link{display:block;cursor:zoom-in}
.as-image-link img{display:block}
.as-image-link:focus-visible{border-radius:5px}
.as-lightbox{border:none;background:rgba(8,18,17,.95);padding:24px;color:#fff;width:min(95vw,1200px);max-width:95vw;max-height:95vh;border-radius:10px;box-shadow:0 20px 70px #000b}
.as-lightbox::backdrop{background:rgba(0,0,0,.87)}
.as-lightbox img{display:block;max-width:100%;max-height:78vh;object-fit:contain;margin:auto}
.as-lightbox figcaption{font-size:13px;line-height:1.7;text-align:center;color:#d4e9da;margin-top:8px}
.as-lightbox button{display:block;margin-left:auto;margin-bottom:12px;border:1px solid #7ba58b;border-radius:8px;background:#16382c;color:#eaffea;padding:8px 16px;cursor:pointer;font-weight:700}
.as-footer{background:#081913;border-top:1px solid #315a4a;padding:32px 18px 38px;margin-top:12px}
.as-footer-inner{max-width:1100px;margin:auto;display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap;font-size:12px;color:#abc8b7}
.as-footer nav{display:flex;flex-wrap:wrap;gap:15px}
.as-footer a{color:#c4e0ce;text-decoration:none}
.as-footer a:hover{text-decoration:underline}
.as-footer .planned-link{opacity:.6}
@media(max-width:900px){
.reading-grid{display:flex!important;flex-direction:column!important;gap:16px!important}
.reading-grid>.article-body{order:0;width:100%}
.article-aside{position:static;max-height:none;overflow:visible;order:-1!important;width:100%;padding:10px 14px!important}
.article-toc summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:8px 1px;list-style:none;font-size:14px;font-weight:800;color:#e9fff2}
.article-toc summary::-webkit-details-marker{display:none}
.article-toc summary::after{content:'＋';font-weight:600;font-size:20px;color:#bce9b4}
.article-toc[open] summary::after{content:'−'}
.article-toc-nav{padding:8px 2px 5px;max-height:360px;overflow:auto}
.article-aside .aside-related{display:block;font-size:12px;margin:5px 0 0;padding-top:12px}
}
@media(max-width:650px){
.article-head h1{font-size:clamp(28px,8vw,36px);font-weight:700!important}
.article-body{font-size:15px;line-height:1.95}
.article-body h2{font-size:22px}
.article-body .as-faq summary{font-size:14px;padding:14px}
.article-body .as-faq .answer{padding:0 15px 16px 32px;font-size:14px}
.as-footer-inner{flex-direction:column;align-items:flex-start;gap:18px}
.article-body .end-cta .cta-action{width:100%}
}
@media(prefers-reduced-motion:reduce){.article-body .as-faq summary::before{transition:none}}
