:root{--demo-bar-height:36px;--demo-focus:#176f9b}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}html.demo-modal-open{overflow:hidden}body.demo-site{background:var(--demo-background,#fff);min-width:320px;color:var(--demo-ink,#111);font-family:var(--demo-body-font,"Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;margin:0;overflow-x:clip}:where(body.demo-site img){max-width:100%;height:auto;display:block}:where(body.demo-site a){color:inherit;text-decoration:none}:where(body.demo-site input,body.demo-site textarea,body.demo-site select){color:inherit;font:inherit}:where(body.demo-site button){font:inherit}:where(body.demo-site button,body.demo-site a){-webkit-tap-highlight-color:transparent}body.demo-site :focus-visible{outline:3px solid var(--demo-focus);outline-offset:4px}.demo-skip-link{z-index:5000;color:#000;background:#fff;padding:8px 12px;position:fixed;top:5px;left:8px;transform:translateY(-160%)}.demo-skip-link:focus{transform:translateY(0)}.demo-bar{z-index:1000;min-height:var(--demo-bar-height);color:#fff;background:#111;font-family:Arial,Yu Gothic,sans-serif;position:relative}.demo-bar__inner{min-height:var(--demo-bar-height);justify-content:space-between;align-items:center;gap:24px;width:min(100% - 32px,1440px);margin:0 auto;display:flex}.demo-bar p{letter-spacing:.04em;white-space:nowrap;margin:0;font-size:10px;font-weight:700}.demo-bar__mobile{display:none}.demo-bar nav{flex:none;align-items:center;gap:20px;font-size:10px;font-weight:700;display:flex}.demo-bar nav a{text-underline-offset:3px;text-decoration:underline 1px}.demo-modal{color:#111;background:0 0;border:0;width:min(100% - 32px,640px);max-height:min(86dvh,720px);margin:auto;padding:0;overflow:visible}.demo-modal::backdrop{background:#000000b8}.demo-modal__panel{background:#fff;border:1px solid #0000002e;padding:clamp(34px,6vw,62px);position:relative;box-shadow:0 24px 80px #00000047}.demo-modal__label{color:#555;letter-spacing:.18em;margin:0 0 24px;font-size:11px;font-weight:700}.demo-modal h2{text-wrap:balance;max-width:12em;margin:0;font-size:clamp(1.75rem,4vw,3.1rem);line-height:1.25}.demo-modal h2+p{margin:28px 0 0;font-size:.94rem;line-height:1.9}.demo-modal__actions{flex-wrap:wrap;gap:12px;margin-top:34px;display:flex}.demo-modal__actions a,.demo-modal__actions button{cursor:pointer;border:1px solid #111;border-radius:0;justify-content:center;align-items:center;min-height:52px;padding:0 22px;font-size:.82rem;font-weight:700;display:inline-flex}.demo-modal__actions a{color:#fff;background:#111}.demo-modal__actions button{color:#111;background:#fff}.demo-modal__close{cursor:pointer;background:0 0;border:0;width:42px;height:42px;padding:0;position:absolute;top:12px;right:12px}.demo-modal__close span:before,.demo-modal__close span:after{content:"";background:currentColor;width:22px;height:1px;position:absolute;top:20px;left:10px}.demo-modal__close span:before{transform:rotate(45deg)}.demo-modal__close span:after{transform:rotate(-45deg)}.demo-footer{padding:clamp(58px, 8vw, 110px) var(--demo-gutter,clamp(20px, 5vw, 72px)) 30px;color:var(--demo-footer-ink,#fff);background:var(--demo-footer-background,#111);grid-template-columns:minmax(220px,1.3fr) minmax(260px,1fr) minmax(240px,1fr);gap:clamp(32px,6vw,96px);display:grid}.demo-footer__identity>a{gap:5px;display:inline-grid}.demo-footer__identity strong{font-family:var(--demo-heading-font,serif);font-size:clamp(1.6rem,3vw,3.5rem);font-weight:600}.demo-footer__identity span,.demo-footer__copyright{letter-spacing:.14em;font-size:10px}.demo-footer__identity p{max-width:28em;margin:30px 0 0;font-size:.78rem;line-height:1.8}.demo-footer__nav,.demo-footer__patchworks{align-content:start;gap:12px;font-size:.78rem;display:grid}.demo-footer__patchworks a{border-bottom:1px solid;padding-bottom:8px}.demo-footer__copyright{opacity:.64;grid-column:1/-1;margin:clamp(42px,7vw,88px) 0 0}.demo-article{--article-measure:760px}.demo-article__header,.demo-article__body,.demo-article__end{width:min(calc(100% - 40px), var(--article-measure));margin-inline:auto}.demo-article__header{padding-block:clamp(80px,13vw,180px) clamp(52px,8vw,100px)}.demo-article__back{margin-bottom:clamp(60px,10vw,120px);font-size:.76rem;font-weight:700;display:inline-block}.demo-article__meta{letter-spacing:.12em;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-bottom:24px;font-size:.68rem;font-weight:700;display:flex}.demo-article__header h1{font-family:var(--demo-heading-font,serif);letter-spacing:-.04em;margin:0;font-size:clamp(2.1rem,6vw,5.7rem);font-weight:500;line-height:1.28}.demo-article__header>p{margin:clamp(30px,5vw,56px) 0 0;font-size:clamp(1rem,1.5vw,1.2rem);line-height:2}.demo-article__hero{width:min(100% - 40px,1180px);margin:0 auto clamp(70px,10vw,140px)}.demo-article__hero img{aspect-ratio:8/5;object-fit:cover;width:100%}.demo-article__body{padding-bottom:clamp(80px,12vw,160px)}.demo-article__body h2{font-family:var(--demo-heading-font,serif);margin:clamp(64px,9vw,108px) 0 24px;font-size:clamp(1.5rem,3vw,2.5rem);line-height:1.45}.demo-article__body p{margin:0 0 1.6em;font-size:1rem;line-height:2.05}.demo-article__body ul,.demo-article__body ol{margin:1.8em 0;padding-left:1.4em;line-height:1.9}.demo-article__end{border-top:1px solid;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 28px;padding-block:36px 90px;font-size:.78rem;display:flex}.demo-article__end p{opacity:.72;flex-basis:100%;margin:0 0 12px}@media (width<=820px){.demo-bar__inner{gap:12px;width:min(100% - 24px,1440px)}.demo-bar__desktop{display:none}.demo-bar__mobile{display:inline}.demo-bar nav a:last-child{display:none}.demo-footer{grid-template-columns:1fr 1fr}.demo-footer__identity{grid-column:1/-1}}@media (width<=560px){:root{--demo-bar-height:32px}.demo-bar p,.demo-bar nav{font-size:9px}.demo-modal__actions{display:grid}.demo-modal__actions a,.demo-modal__actions button{width:100%}.demo-footer{grid-template-columns:1fr}.demo-footer__identity,.demo-footer__copyright{grid-column:auto}.demo-footer__patchworks{margin-top:22px}.demo-article__header,.demo-article__body,.demo-article__end{width:min(calc(100% - 36px), var(--article-measure))}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
