/* "Change how to reach them" on the brand sheet (brand-routes.js). Small on purpose: it's the road less taken. */
.rt{margin-top:10px}
.rt>summary{font-size:13px;font-weight:500;color:var(--mute);min-height:24px}
.rt[open]>summary{margin-bottom:6px}
.rt-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.rt-way{display:flex;flex-direction:column;gap:2px;min-width:0}
.why .rt-way .ch{font-size:12.5px}
.rt-way b{font-size:14.5px;font-weight:500;color:var(--ink);overflow-wrap:anywhere}
.rt-way a{color:inherit}
.rt-way small{font-size:12.5px;color:var(--mute)}
.rt-do{display:flex;align-items:center;gap:8px}
.rt-do .linkish{display:inline-flex;align-items:center;min-height:40px;margin:0;padding:0;white-space:nowrap}
.why .rt-now{font-size:12.5px;color:var(--mute);white-space:nowrap}
.rt-x{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;margin-right:-12px;border:0;background:none;color:var(--mute);cursor:pointer}
.rt-x svg{width:14px;height:14px}
.rt-row>p.small,.rt-ask{grid-column:1/-1}
.why .rt-row>p.small{margin-top:4px;font-size:12.5px}
.rt-ask{margin-top:8px;padding:12px;border-radius:12px;background:var(--hush)}
.why .rt-ask p.small{margin:0 0 10px}
.rt-add{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr) auto;gap:8px;align-items:center;padding-top:10px;border-top:1px solid var(--line)}
.rt-add select,.rt-add input{min-width:0;min-height:40px;border:0;border-radius:999px;background:var(--hush);padding:8px 14px;font-size:14px;color:var(--ink)}
.rt-add select{max-width:140px}
.rt>p.small{padding:10px 0 12px;border-top:1px solid var(--line)}
.rt-list:empty{display:none}
@media (max-width:420px){
  .rt-add{grid-template-columns:minmax(0,1fr) auto}
  .rt-add select{grid-column:1/-1;max-width:none}
}
