@media (max-width:1080px){
  .gr{gap:64px 28px}
}

@media (max-width:1000px){
  .ar-in{grid-template-columns:1fr;gap:0}
  .toc{display:none}
  .pr,.au{max-width:none}
}

@media (max-width:980px){
  .ex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ex-c{min-height:160px}
}

@media (max-width:860px){
  .nl{grid-template-columns:1fr;gap:28px;padding:40px 28px}
}

@media (max-width:760px){
  .cb{flex-direction:column;align-items:stretch;gap:16px}
  .bs{width:auto}
  .bf{gap:24px}
  .bf>button::after,.bf>a::after{bottom:-4px}
}

@media (max-width:720px){
  .fp{flex-direction:column;align-items:stretch;gap:32px;margin-bottom:64px;padding-bottom:64px}
  .fp-md{order:-1;width:100%;flex-basis:auto}
  .pn{grid-template-columns:1fr}
  .pn-a.prev,.pn-a.next{grid-column:auto;text-align:left}
}

@media (max-width:900px){
  .rl-g{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 20px}
}

@media (max-width:640px){
  .md::before,.fp-md::before,.ex-c::before,.fig::before,.nl::before,.hi-in::before{filter:blur(24px)}

  .bh{padding:64px 16px 72px}
  .bh h1{font-size:clamp(30px,9vw,44px);white-space:normal;text-wrap:balance}
  .bh-sub{font-size:17px}
  .bh-rg{display:none}
  .bf{overflow-x:auto;margin:0 -16px;padding:0 16px}
  .bf-menu{
    position:fixed;left:0;right:0;top:auto;bottom:0;
    min-width:0;max-height:70vh;
    border-radius:18px 18px 0 0;padding:12px 10px 24px;
  }
  .bf-menu button,.bf-menu a{white-space:normal;padding:12px}
  .bl{padding:64px 16px 88px}
  .fp h2{font-size:clamp(28px,7.5vw,36px)}
  .gr{grid-template-columns:1fr;gap:48px}
  .pc{contain-intrinsic-size:auto 360px}
  .pc.fe{grid-column:auto}
  .pg{margin-top:56px}
  .pg .tx{display:none}
  .nl{margin-top:64px;padding:36px 20px;border-radius:22px}

  .ex{padding:0 16px 88px}
  .nlx{padding:0 16px 88px}
  .ex-grid{grid-template-columns:1fr}
  .ex-c{min-height:132px;padding:20px 22px 22px}

  .ah{padding:28px 16px 36px}
  .ah h1{font-size:clamp(30px,8.5vw,40px)}
  .hi{padding:0 16px}
  .hi-in{padding:20px 20px 0;border-radius:20px}
  .ar{padding:56px 16px 88px}
  .pnx{padding:0 16px 72px}
  .rl{margin-top:48px}
  .rl-g{grid-template-columns:1fr;gap:40px}
  .pr{font-size:17px}
  .pr h2{margin-top:48px}
  .pr blockquote{font-size:20px;padding-left:20px}
  .co{padding:20px}
  .au{grid-template-columns:1fr;margin-top:56px;padding:24px}
  .au-l{flex-wrap:wrap;gap:12px 18px}
  .tb{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .tb table{min-width:520px}
}

@media (max-width:480px){
  .nl-nm{grid-template-columns:1fr}
  .nl .nl-nm input{height:56px;border-radius:20px}
  .nl-f{flex-direction:column;border-radius:20px;padding:8px}
  .nl .nl-f input{height:48px}
  .nl-f button{width:100%}
  .nl small{padding-left:4px}
  .nlx{padding:0 16px 80px}
}

@media (max-width:380px){
  .bh h1{font-size:30px}
  .fp h2{font-size:28px}
  .ah h1{font-size:30px}
  .hi-in{padding:14px 14px 0;border-radius:16px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .md,.fp-md,.ex-c,.nl-f button,.nl-nm input,.ex-b svg,.bf-mb svg{transition:none}
  .nl-ok{animation:none}
}