@layer components {
@media (max-width: 1023px) {
  .ar-lab { font-size: 12px; }
  .ar-val { font-size: 12px; }
  .ar-term { font-size: 12px; }

  .ar-eg { font-size: 12px; }

}

@media (max-width: 1023px) {

  .ar-frame-chrome {
    height: auto;
    flex-wrap: wrap;
    row-gap: 6px;
    padding: 10px var(--space-5);
  }

  .ar-frame-sp { display: none; }

  .arh-ctx-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
    padding: 8px 0;
  }
  .arh-ctx-row dd {
    overflow: visible;
    text-overflow: clip;
  }
  .arh-ctx-row dd.ar-val { white-space: normal; line-height: 1.45; }

  .arr-tick:nth-child(odd),
  .arr-tick:nth-child(even) { padding-top: 0; }

  .arl-st { grid-template-columns: 168px minmax(0, 1fr); }
}

@media (max-width: 1023px) {

  .ar-sec .site-head { margin-bottom: var(--space-6); }

  .arh-conv { gap: var(--space-5); }
}

@media (max-width: 1023px) {
  .cr-svg--phone .cr-lab { font-size: 16px; }
  .cr-svg--phone .cr-lab--dim { font-size: 16px; }

  .ar-cr .obj-phone { max-width: 480px; }
}

@media (max-width: 1023px) {

  .ar-cx { padding: var(--space-4) 0; }
  .arc-gates { margin: var(--space-4) 0; }
  .arc-gate { padding: var(--space-3); }
  .ar-class .site-head { margin-bottom: var(--space-5); }

  .arr-bar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    column-gap: var(--space-4);
  }
  .arr-name { grid-area: 1 / 1; }
  .arr-end { grid-area: 1 / 2; margin-top: 0; text-align: right; }
  .arr-run { grid-area: 2 / 1 / 3 / -1; }

}
}

@layer components {

@media (max-width: 1023px) {

  .arq-col-t { margin-bottom: var(--space-2); }

  .arc-nots { flex-direction: row; gap: var(--space-3); }
  .arc-gates { margin: var(--space-3) 0; }
  .ar-cx { padding: var(--space-3) 0; }

  .ar-class .site-head { margin-bottom: var(--space-4); }

}

@media (max-width: 1023px) {

  .arc-gate { height: auto; padding: var(--space-3) var(--space-3); }

}

@media (max-width: 1023px) {

  .arc-gate { padding: var(--space-2) var(--space-3); }
  .ar-cx { padding: 0; }
  .arc-gates { margin: var(--space-2) 0; }
  .arc-out { gap: 6px; }
}

@media (max-width: 1023px) {
  .cr-foot { gap: 4px var(--space-4); }
}

@media (max-width: 1023px) {

  .arv-rail { gap: var(--space-3); }
}

@media (max-width: 1023px) {
  .ar-frame-chrome { padding: 8px var(--space-4); }

  .arh-conv { padding: var(--space-4); gap: var(--space-4); }
  .arh-msg--out { margin-left: var(--space-4); }
  .arh-msg p { padding: 10px 14px; }

  .arh-ctx { margin: 0 var(--space-4) var(--space-4); padding: var(--space-4); }
  .arh-ctx-t { margin-bottom: var(--space-2); }
  .arh-ctx-row { padding: 4px 0; }

  .arh-auth { padding: var(--space-4); gap: var(--space-3); }
  .arh-auth-list { gap: 8px var(--space-4); }
  .arh-verdict { margin-left: 0; }

  .ar-hero--a .ar-hero-rail { margin-bottom: 0; }
}
}

@layer components {

@media (max-width: 1023px) {
  .ar-hero--b .ar-frame { margin-top: 0; }
  .ar-frame-chrome { padding: 6px var(--space-4); }
  .arh-conv { padding: var(--space-3); }
  .arh-ctx { padding: var(--space-3) var(--space-4); }
  .arh-ctx-row { padding: 2px 0; }
  .arh-auth { padding: var(--space-3) var(--space-4); gap: var(--space-2); }
  .arh-auth-list { gap: 6px var(--space-4); }
  .arh-verdict { padding-top: var(--space-3); }
}

@media (max-width: 1023px) {
  .arh-verdict { padding-top: 0; }
  .arh-ctx { margin-bottom: var(--space-3); }
  .arh-conv { gap: var(--space-3); }
  .arh-msg p { padding: 8px 12px; }
  .ar-frame-chrome { padding: 4px var(--space-4); }
}

}

@layer components {
@media (max-width: 1023px) {

  .mob-lab,
  .mob-leg,
  .mob-cap,
  .mob-lad {
    font-size: 1rem;
    line-height: 1.4;
    margin: 0;
  }

  .mob-lab {
    margin-bottom: var(--space-3);
    color: var(--text-secondary);
  }

  .mob-leg {
    margin-top: var(--space-3);
    color: var(--text-muted);
  }

  .mob-cap {
    margin-top: var(--space-4);
    color: var(--text-secondary);
  }

  .mob-cap b { color: var(--text-primary); font-weight: 600; }

  .ar-sec .ar-term { flex: none; min-width: max-content; }

  .ar-sec .site-lede { display: block; }

  .ar-ovh .site-lede { max-width: none; }

}

@media (max-width: 1023px) {

  .ar-hero--b .ar-frame-chrome { justify-content: flex-start; }

  .ar-hero--b .arh-ctx-row { display: block; padding: 3px 0; }

  .ar-hero--b .arh-auth { display: block; }
  .ar-hero--b .arh-auth-t { display: block; margin-bottom: 6px; }
}

@media (max-width: 1023px) {

  .arq-bar { height: 22px; }
  .arq-pile { gap: 1px; }
  .arq-comb { height: 24px; }
  .arq-col + .arq-col { margin-top: var(--space-2); }
  .arq-head { margin-bottom: var(--space-2); }
  .arq-read { gap: 4px; margin-top: var(--space-2); }

  .ar-queue .mob-leg { margin-top: var(--space-2); }
}

@media (max-width: 1023px) {
  .arc-gate { gap: 3px; }
  .arc-out { margin-top: var(--space-2); }
}

@media (max-width: 1023px) {
  .arr-tick {
    display: flex;
    align-items: baseline;
    gap: var(--space-2);
    padding-bottom: 0;
  }
  .arr-tick-s { margin-left: auto; }
  .arr-axis { margin-top: var(--space-2); padding-top: var(--space-3); }
  .arr-cap { margin-top: var(--space-2); }

  .arr-bars { gap: 6px; }
  .arr-bar { row-gap: 2px; }

  .arr-run { height: 12px; }
  .arr-axis { padding-top: var(--space-2); }
}
}

@layer components {

@media (max-width: 1023px) {
  .ar-cu {
    height: auto;
    position: relative;
  }

  .arcu-ph { position: relative; }

  .arcu-ph-grid {
    --cu-top: 22px;
    --cu-step: 30px;
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    height: calc(var(--cu-top) + 6 * var(--cu-step) + 136px);
  }

  .arcu-ph-scale { position: relative; }

  .arcu-ph-stage .ar-lab { letter-spacing: 0.06em; }

  .arcu-ph-stage {
    position: absolute;
    left: 0;
    right: 0;
    padding-right: 12px;
    top: calc(var(--cu-top) + var(--d) * var(--cu-step));
    transform: translateY(-50%);
    text-align: right;
  }

  .arcu-ph-stage i {
    position: absolute;
    right: 0;
    top: 50%;
    width: 8px;
    height: 1px;
    background: var(--border-strong);
  }

  .arcu-ph-th, .arcu-ph-t { --cu-top: 22px; --cu-step: 30px; }

  .arcu-ph-th {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }

  .arcu-ph-t { position: relative; }

  .arcu-ph-cn {
    position: absolute;
    left: 0;
    top: calc(var(--cu-top) + 6 * var(--cu-step) + 16px);
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    font-size: 12.5px;
    line-height: 1;
    letter-spacing: 0.01em;
    white-space: nowrap;
    color: var(--text-muted);
  }

  .arcu-ph-stem {
    position: absolute;
    left: 3px;
    top: var(--cu-top);
    width: 1px;
    height: calc(var(--d) * var(--cu-step));
    transform: scaleY(var(--p, 1));
    transform-origin: top center;
    background: linear-gradient(180deg,
      var(--border-strong) 0%,
      color-mix(in srgb, var(--accent-color) 70%, transparent) 100%);
  }

  .arcu-ph-t::after {
    content: "";
    position: absolute;
    left: 0;
    top: calc(var(--cu-top) + var(--d) * var(--cu-step) - 3px);
    width: 7px;
    height: 7px;
    border-radius: 2px;
    background: var(--success-color);
    opacity: clamp(0, (var(--p, 1) - var(--d) / 9) * 6, 1);
  }

  .arcu-ph-t--act .arcu-ph-stem {
    background: linear-gradient(180deg, var(--border-strong) 0%, var(--accent-color) 100%);
  }

  .arcu-ph-t--act::after {
    background: var(--accent-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-color) 22%, transparent);
  }

  .arcu-ph-fork {
    position: absolute;
    left: 3px;
    top: calc(var(--cu-top) + 3 * var(--cu-step));
    width: 18px;
    height: 22px;
  }

  .arcu-ph-fork i {
    position: absolute;
    height: 1px;
    background: var(--border-strong);
  }

  .arcu-ph-fork i:nth-child(1) { left: 0;  top: 4px;  width: 14px; background: var(--accent-color); }

  .arcu-ph-fork i:nth-child(2) { left: 6px; top: 12px; width: 8px; }
  .arcu-ph-fork i:nth-child(3) { left: 6px; top: 20px; width: 8px; }

  .arcu-ph-key {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3);
    margin: var(--space-3) 0 0;
  }

  .arcu-ph-key .ar-term { flex: none; }

  .arcu-eg { margin-top: var(--space-1); }
}

.arcu-ph-stage.arcu-ph-stage--d-1 { --d: 1; }
.arcu-ph-stage.arcu-ph-stage--d-2 { --d: 2; }
.arcu-ph-stage.arcu-ph-stage--d-3 { --d: 3; }
.arcu-ph-stage.arcu-ph-stage--d-4 { --d: 4; }
.arcu-ph-stage.arcu-ph-stage--d-5 { --d: 5; }
.arcu-ph-stage.arcu-ph-stage--d-6 { --d: 6; }
.arcu-ph-t.arcu-ph-t--d-2 { --d: 2; }
.arcu-ph-t.arcu-ph-t--d-3 { --d: 3; }
.arcu-ph-t.arcu-ph-t--d-4 { --d: 4; }
.arcu-ph-t.arcu-ph-t--d-5 { --d: 5; }
.arcu-ph-t.arcu-ph-t--d-6 { --d: 6; }
}

@layer components {

@media (max-width: 1023px) {
  .arcs-ph {
    position: relative;
    margin: 0;
    width: 100%;
  }
  .arcs-ph > svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .arcs-ph-floors {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-rows: repeat(3, 100px);
  }
  .arcs-ph-floor {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "tier name term" "tier note term";
    align-content: center;
    align-items: baseline;
    column-gap: var(--space-3);
    row-gap: 4px;
    padding-inline: var(--space-3);
    border-top: 1px solid var(--border-light);
  }
  .arcs-ph-floor--i-0 { border-top: 0; }
  .arcs-ph-floor .arcs-tier { grid-area: tier; align-self: center; }
  .arcs-ph-name {
    grid-area: name;
    font-size: var(--mt-body);
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--text-primary);
  }
  .arcs-ph-note {
    grid-area: note;
    font-size: var(--mt-label);
    line-height: 1.35;
    color: var(--text-secondary);
  }
  .arcs-ph-floor .ar-term { grid-area: term; align-self: center; }

  .arcs-ph > svg { transform-origin: center top; transition: transform .9s cubic-bezier(.16,1,.3,1); }
  .js .ar-cascade:not(.visible) .arcs-ph > svg { transform: scaleY(0); }
}
@media (max-width: 1023px) and (prefers-reduced-motion: reduce) {
  .arcs-ph > svg { transition: none; }
  .js .ar-cascade:not(.visible) .arcs-ph > svg { transform: none; }
}

@media (max-width: 1023px) {
  .ar-sec .arq-head,
  .ar-sec .arr-head-ph,
  .ar-sec .arcu-head-ph { margin-bottom: var(--stack-md); }
  .ar-sec .mob-lab { margin-bottom: var(--stack-xs); }

  .main-content > .ar-hero--a {
    padding-top: calc(var(--navbar-h) + var(--hero-lede));
    padding-bottom: 0;
  }
}

@media (max-width: 1023px) {
  .cr-foot-t { font-size: 1rem; line-height: 1.4; }

  .ar-human .obj-phone { max-width: 700px; }
  .cr-foot { margin-top: var(--space-3); }
  .cr-head { margin-bottom: var(--space-4); }
  .ar-human .section-route { margin-top: var(--space-3); }
}

@media (max-width: 1023px) {
  .ar-loadin--a .arl-mass-h { margin-bottom: var(--space-2); }

}

@media (max-width: 400px) {

  .arcu-ph-grid,
  .arcu-ph-th,
  .arcu-ph-t { --cu-step: 26px; }
  .arcu-ph-key { margin-top: 6px; }

  .arcu-eg { margin-top: 2px; }

  .ar-cascade .site-lede { line-height: 1.4; }
  .ar-cascade .site-head { margin-bottom: 0; }

  .ar-cascade .mob-cap { margin-top: 0; line-height: 1.3; }

  .arcu-ph-key { margin-top: 4px; }
  .arcu-eg { margin-top: 0; }

  .ar-human .section-route { margin-top: 4px; }
  .cr-foot { margin-top: 8px; }

}

@media (max-width: 1023px) {
  .ar-hero--b .arh-auth-list {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 8px;
  }

  .ar-hero--b .arh-verdict { margin-top: var(--space-3); }
}
}