@media(min-width:1500px) {
  .wrap {
    width:min(1250px,calc(100% - 120px))
  }
  .intro {
    gap:140px;
    padding-top:90px
  }
  .guide-layout {
    gap:90px
  }
}
@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 56px)
  }
  .intro {
    gap:45px;
    padding-top:55px
  }
  .guide-layout {
    grid-template-columns:195px minmax(0,1fr);
    gap:35px
  }
  .site-header {
    gap:24px
  }
  .site-header nav {
    gap:18px
  }
  .file-tree em {
    display:block;
    margin-left:24px
  }
  .session-columns {
    gap:20px
  }
}
@media(max-width:720px) {
  .wrap {
    width:calc(100% - 36px)
  }
  .site-header {
    padding-block:20px;
    flex-wrap:wrap;
    gap:16px
  }
  .brand {
    font-size:16px
  }
  .brand svg {
    width:32px;
    height:32px
  }
  .version {
    margin-left:auto
  }
  .version span {
    display:inline;
    margin-left:6px
  }
  .site-header nav {
    order:3;
    width:100%;
    margin:0;
    gap:25px;
    padding-top:12px;
    border-top:1px solid var(--line)
  }
  .site-header nav a {
    font-size:11px
  }
  .intro {
    grid-template-columns:1fr;
    gap:36px;
    padding-block:44px 34px
  }
  .intro h1 {
    font-size:41px
  }
  .intro-copy>p {
    font-size:13px;
    max-width:52ch
  }
  .intro-actions {
    gap:9px
  }
  .button {
    padding:12px 15px;
    font-size:11px;
    gap:17px
  }
  .release-panel {
    max-width:none;
    padding-top:18px
  }
  .package-name {
    font-size:18px;
    margin-top:10px
  }
  .package-name br {
    display:none
  }
  .release-note {
    font-size:11px
  }
  .release-panel dl {
    margin-top:14px
  }
  .compatibility {
    font-size:11px;
    padding:18px
  }
  .guide-layout {
    display:block;
    padding-top:32px
  }
  .contents {
    position:static;
    margin-bottom:38px;
    padding-bottom:26px;
    border-bottom:1px solid var(--line)
  }
  .contents nav {
    grid-template-columns:1fr 1fr;
    gap:0 10px;
    margin-top:15px
  }
  .contents nav a {
    font-size:11px;
    padding:6px 0;
    gap:8px
  }
  .contents .local-note {
    max-width:none;
    font-size:11px
  }
  .contents>p {
    font-size:11px
  }
  .contents h2 {
    font-size:14px
  }
  progress {
    margin-top:10px
  }
  .step {
    padding-bottom:30px;
    margin-bottom:30px
  }
  .step-heading {
    gap:12px;
    margin-bottom:17px
  }
  .step-heading h2 {
    font-size:21px
  }
  .step-number {
    width:28px;
    height:28px;
    font-size:12px
  }
  .step>p,.reading-section>p {
    font-size:13px
  }
  .step .note,.reading-section>.note {
    font-size:11px
  }
  .completion {
    font-size:11px
  }
  .command-top {
    padding:9px 13px;
    font-size:11px;
    gap:8px
  }
  .copy-button {
    font-size:11px;
    min-height:28px
  }
  .command pre {
    font-size:11px;
    padding:16px
  }
  .path-setting {
    padding:20px
  }
  .path-setting h3 {
    font-size:15px
  }
  .path-setting>p {
    font-size:11px
  }
  input[type=text] {
    font-size:11px
  }
  .file-tree {
    padding:18px;
    font-size:11px
  }
  .session-columns {
    grid-template-columns:1fr;
    gap:22px;
    margin-bottom:20px
  }
  .reading-section>h2 {
    font-size:24px
  }
  .session-columns li,.details-body p {
    font-size:12px
  }
  summary {
    font-size:12px;
    padding-block:18px
  }
  .reading-section {
    margin-bottom:42px
  }
  footer {
    margin-top:15px;
    display:block
  }
  footer p,footer a {
    display:block;
    margin-top:8px;
    font-size:11px
  }
  .menu-preview {
    padding:20px
  }
  .announcement {
    bottom:15px;
    font-size:11px
  }
}