/* Map page: the map fills the window below the navbar. Quarto pads direct
   children of #quarto-content and gives iframes a bottom margin, so the
   selector needs the id to win. */
#quarto-content > .trail-map {
  display: block;
  width: 100%;
  height: calc(100dvh - 62px);
  border: 0;
  padding: 0;
  margin: 0;
}

/* Routes page */
.route-map {
  width: 100%;
  height: min(65vh, 560px);
  border-radius: 4px;
  box-shadow: 0 0 0 1px rgba(11, 11, 11, 0.1);
}
.route-card h3 {
  margin: 0.5rem 0 0.25rem;
}
.route-stats {
  margin-bottom: 0.75rem;
}
.route-id {
  color: #52514e;
}
.cue-sheet td:first-child,
.cue-sheet td:last-child {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
/* Quarto's theme gives Observable buttons the same text and background colour */
.observablehq .btn-quarto,
.observablehq button {
  color: #fff;
}

/* Two-thumb distance slider: two range inputs stacked on one track. Only the
   thumbs take pointer events, so each can be dragged. */
.range2 {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 0.25rem 0 0.5rem;
}
.range2 > label {
  width: 120px; /* matches Observable Inputs labels */
}
.range2-track {
  position: relative;
  flex: 1 1 200px;
  max-width: 320px;
  height: 28px;
}
.range2-track::before {
  content: "";
  position: absolute;
  inset: 12px 0;
  border-radius: 2px;
  background: linear-gradient(
    to right,
    #dee2e6 var(--lo),
    #2a78d6 var(--lo),
    #2a78d6 var(--hi),
    #dee2e6 var(--hi)
  );
}
.range2-track input[type="range"] {
  position: absolute;
  inset: 0;
  width: 100%;
  margin: 0;
  background: none;
  pointer-events: none;
  -webkit-appearance: none;
  appearance: none;
}
.range2-track input[type="range"]::-webkit-slider-runnable-track {
  background: none;
}
.range2-track input[type="range"]::-moz-range-track {
  background: none;
}
.range2-track input[type="range"]::-webkit-slider-thumb {
  pointer-events: auto;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  margin-top: 4px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #2a78d6;
  cursor: pointer;
}
.range2-track input[type="range"]::-moz-range-thumb {
  pointer-events: auto;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #2a78d6;
  cursor: pointer;
}
.range2 output {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

/* Directions and printable card */
.route-actions {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
  margin: 0.5rem 0 1rem;
}
.route-actions form {
  margin: 0;
}
.directions {
  padding-left: 1.5rem;
}
.directions li {
  margin: 0.15rem 0;
}
.directions .at-km {
  display: inline-block;
  min-width: 2.5rem;
  color: #52514e;
  font-variant-numeric: tabular-nums;
}
.cue-details summary {
  cursor: pointer;
  color: #52514e;
  margin: 0.5rem 0;
}
.card-preview {
  overflow-x: auto;
}
.layout-size {
  margin: -0.25rem 0 0.5rem 132px; /* under the buttons, past the label */
  color: #52514e;
  font-size: 0.9rem;
}
@media (max-width: 600px) {
  .layout-size {
    margin-left: 0;
  }
}

.route-note {
  color: #52514e;
  font-size: 0.9rem;
  margin-top: -0.5rem;
}

/* Ultra page */
.ultra-map {
  height: min(75vh, 700px);
}
.ultra-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 1.25rem;
  margin: 0.4rem 0 0.75rem;
  font-size: 0.9rem;
  color: #52514e;
}
.ultra-legend span {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ultra-legend i {
  display: inline-block;
  width: 22px;
  height: 4px;
  border-radius: 2px;
}
.ultra-legend i.dashed {
  background: repeating-linear-gradient(90deg, #4a3aa7 0 4px, transparent 4px 8px);
}
.ultra-legend b {
  display: inline-grid;
  place-items: center;
  font-size: 0.7rem;
  border-radius: 50%;
}
.ultra-legend b.km {
  width: 20px;
  height: 20px;
  border: 2px solid #0b0b0b;
  color: #0b0b0b;
}
.ultra-legend img {
  height: 22px;
}
.directions li.aid {
  font-weight: 600;
}
.directions li.aid-optional {
  color: #898781;
}
.directions li.optional {
  font-style: italic;
  color: #4a3aa7;
}

/* Routes page: a card per route */
.route-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
  gap: 0.6rem;
  margin: 0.5rem 0 1.5rem;
}
.route-item {
  display: flex;
  gap: 0.7rem;
  align-items: center;
  padding: 0.55rem 0.7rem;
  border: 1px solid #e3e2dc;
  border-radius: 8px;
  background: #fff;
  color: #0b0b0b;
  text-decoration: none;
}
.route-item:hover,
.route-item:focus-visible {
  border-color: #2a78d6;
  box-shadow: 0 1px 4px rgba(42, 120, 214, 0.2);
}
.route-thumb {
  flex: 0 0 64px;
  height: 64px;
}
.route-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.route-item-name {
  font-size: 0.95rem;
  line-height: 1.25;
}
.route-item-stats {
  color: #52514e;
  font-size: 0.85rem;

/* Home page */
.home-hero p {
  margin: 0;
}
/* Until the team photo arrives (see index.qmd): a forest-green panel with
   topo-map contour lines, an inline SVG. */
.hero-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 55vh;
  border-radius: 4px;
  background: #2f5d4a url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 675" preserveAspectRatio="xMidYMid slice"%3E%3Cg fill="none" stroke="%23fff" stroke-opacity=".16"%3E%3Cpath d="M982 250C984 256 981 265 976 270C972 275 961 278 953 279C945 281 937 281 930 280C923 280 915 280 909 277C902 275 895 271 891 267C887 262 884 256 884 250C883 244 883 237 887 231C890 226 897 220 904 217C912 215 923 216 930 217C937 219 943 223 949 226C955 229 960 231 966 235C971 239 980 244 982 250Z" stroke-width="1.1"/%3E%3Cpath d="M1036 250C1039 262 1031 279 1021 289C1011 298 990 303 975 307C959 311 945 311 930 311C915 310 900 310 887 305C874 301 860 293 852 283C843 274 838 262 836 250C835 238 835 223 842 212C849 202 865 189 879 185C894 181 915 184 930 187C945 190 955 197 967 203C980 208 994 210 1005 218C1017 226 1034 238 1036 250Z" stroke-width="1.1"/%3E%3Cpath d="M1092 250C1094 268 1079 293 1063 307C1047 321 1017 328 995 333C973 339 952 341 930 341C908 342 884 341 865 334C845 327 825 314 813 300C800 286 790 268 787 250C785 232 785 209 796 193C808 177 833 160 855 154C878 149 908 155 930 159C952 163 966 172 986 178C1005 185 1030 188 1048 200C1065 212 1089 232 1092 250Z" stroke-width="1.1"/%3E%3Cpath d="M1147 250C1149 274 1125 306 1102 324C1080 342 1044 351 1015 359C986 367 959 373 930 373C901 374 868 372 842 363C816 354 791 336 773 317C756 298 741 274 737 250C733 226 734 194 750 173C766 152 803 132 833 126C863 119 901 129 930 133C959 138 978 145 1006 153C1033 160 1071 164 1094 180C1118 196 1146 226 1147 250Z" stroke-width="1.1"/%3E%3Cpath d="M1201 250C1200 280 1167 317 1139 339C1111 362 1069 373 1035 384C1000 395 966 405 930 406C894 407 852 404 819 392C787 380 756 358 733 334C711 311 689 280 685 250C680 220 683 179 705 154C726 128 775 107 813 99C850 92 894 104 930 108C966 113 992 116 1028 125C1063 133 1115 138 1144 159C1172 180 1202 220 1201 250Z" stroke-width="2.2"/%3E%3Cpath d="M1252 250C1249 286 1206 327 1173 354C1140 380 1095 396 1055 410C1014 424 973 437 930 439C887 441 837 435 797 421C757 406 720 380 692 352C664 323 636 286 630 250C625 214 633 164 660 135C687 106 749 84 794 76C839 67 887 81 930 84C973 87 1008 85 1052 94C1096 103 1162 111 1195 137C1228 163 1256 214 1252 250Z" stroke-width="1.1"/%3E%3Cpath d="M1300 250C1293 292 1242 337 1205 368C1168 399 1121 419 1075 436C1029 454 980 471 930 473C880 475 821 467 775 449C728 432 683 403 649 370C616 337 579 292 574 250C569 208 584 149 618 117C652 84 726 64 778 55C830 45 880 58 930 59C980 59 1025 50 1078 60C1131 69 1211 82 1248 114C1284 146 1307 208 1300 250Z" stroke-width="1.1"/%3E%3Cpath d="M1344 250C1333 298 1277 345 1236 381C1195 417 1147 443 1096 464C1045 485 987 505 930 507C873 509 806 498 752 478C698 458 644 427 605 389C566 351 521 298 517 250C513 202 538 136 579 100C620 64 705 48 763 36C822 25 873 33 930 31C987 29 1046 12 1107 22C1169 32 1260 54 1300 92C1339 130 1354 202 1344 250Z" stroke-width="1.1"/%3E%3Cpath d="M1383 250C1369 304 1311 354 1267 394C1223 435 1175 467 1119 492C1062 516 995 538 930 541C865 543 792 529 730 507C668 485 603 452 558 409C513 366 462 304 460 250C458 196 497 124 545 85C593 47 686 33 750 19C814 5 865 6 930 0C995 -6 1069 -29 1139 -18C1209 -6 1309 26 1350 70C1391 115 1397 196 1383 250Z" stroke-width="1.1"/%3E%3Cpath d="M1419 250C1403 310 1345 363 1299 408C1253 453 1203 493 1141 521C1080 549 1002 571 930 574C858 577 777 561 706 537C636 513 559 478 508 430C458 383 404 310 405 250C406 190 460 114 515 72C570 31 668 20 737 2C806 -16 858 -24 930 -35C1002 -45 1094 -74 1172 -60C1250 -46 1356 -2 1398 50C1439 102 1436 190 1419 250Z" stroke-width="2.2"/%3E%3Cpath d="M1452 250C1434 315 1380 372 1332 422C1284 472 1232 520 1164 551C1097 582 1010 604 930 607C850 609 761 594 682 568C603 542 511 506 456 453C401 400 346 315 352 250C358 185 428 106 490 62C552 18 650 8 723 -15C797 -38 850 -60 930 -74C1010 -89 1120 -121 1206 -104C1291 -86 1400 -28 1441 31C1483 90 1471 185 1452 250Z" stroke-width="1.1"/%3E%3Cpath d="M278 560C277 566 271 571 267 576C262 580 257 584 251 587C245 590 237 592 230 592C223 593 215 591 208 589C200 586 192 583 187 578C182 573 177 566 177 560C178 554 184 547 189 543C195 538 204 537 211 536C218 534 223 532 230 531C237 530 247 527 255 528C262 530 273 535 277 540C281 545 280 554 278 560Z" stroke-width="1.1"/%3E%3Cpath d="M324 560C321 572 311 582 303 591C294 600 285 609 273 615C261 620 245 624 230 625C215 625 199 623 185 618C170 613 153 607 143 597C133 587 124 572 125 560C127 548 140 534 151 526C163 518 180 517 193 512C206 508 215 503 230 500C245 497 265 491 281 495C296 498 315 510 323 520C330 531 327 548 324 560Z" stroke-width="1.1"/%3E%3Cpath d="M367 560C362 578 351 593 339 607C327 621 313 634 295 643C276 651 252 656 230 657C208 658 183 655 161 648C139 642 112 632 97 617C83 602 71 578 74 560C78 542 100 523 117 512C134 500 156 497 175 489C194 482 208 471 230 466C252 461 285 454 308 460C331 466 357 485 367 502C376 518 371 542 367 560Z" stroke-width="1.1"/%3E%3Cpath d="M408 560C403 583 391 604 376 623C361 641 341 660 317 671C292 682 260 688 230 690C200 691 167 688 137 680C107 671 68 657 50 637C31 617 20 583 26 560C32 537 64 514 86 498C107 482 132 477 156 465C180 454 200 436 230 429C260 422 306 415 336 424C366 433 396 461 408 484C420 506 414 537 408 560Z" stroke-width="1.1"/%3E%3Cpath d="M449 560C443 589 432 615 414 639C395 662 369 685 338 699C308 713 268 720 230 722C192 725 149 724 111 713C73 702 24 683 2 658C-20 632 -28 589 -19 560C-9 531 31 506 57 486C83 466 108 456 137 440C165 424 192 397 230 389C268 380 328 375 364 388C400 401 433 438 447 467C462 496 454 531 449 560Z" stroke-width="2.2"/%3E%3Cpath d="M489 560C484 594 473 627 452 655C430 683 397 710 360 727C323 744 276 752 230 756C184 759 130 760 84 747C38 734 -22 709 -45 678C-69 647 -71 594 -59 560C-46 526 1 499 30 474C59 450 81 434 115 412C148 391 184 356 230 346C276 336 349 336 391 354C433 371 468 417 484 451C500 486 495 526 489 560Z" stroke-width="1.1"/%3E%3Cpath d="M530 560C525 599 515 639 490 671C465 704 425 734 381 754C338 774 284 786 230 791C176 796 109 799 56 784C2 768 -66 735 -91 697C-116 660 -110 599 -94 560C-79 521 -28 493 3 463C34 433 53 408 91 381C129 355 176 311 230 301C284 291 369 298 417 321C465 343 500 397 519 437C537 477 535 521 530 560Z" stroke-width="1.1"/%3E%3C/g%3E%3C/svg%3E') center / cover no-repeat;
  color: #eaf2ec;
  font-size: clamp(1.1rem, 3.2vw, 1.6rem);
  font-weight: 600;
  text-align: center;
}
.hero-placeholder span {
  padding: 0 1rem;
}
.hero-photo {
  display: block;
  max-width: 100%;
  max-height: 75vh; /* shrinks to fit rather than cropping anyone out */
  margin: 0 auto;
  border-radius: 4px;
}
.home-intro {
  max-width: 40rem;
  margin: 1.75rem 0 2.5rem;
}
.home-intro h1 {
  margin: 0 0 0.75rem;
  font-size: clamp(2rem, 6vw, 2.75rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: #0b0b0b;
}
.home-intro p {
  font-size: 1.15rem;
  color: #52514e;
}
.home-social {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
}
.home-social p {
  display: contents;
}
.home-social .btn-quarto {
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  padding: 0.6rem 1.1rem;
  font-size: 1.05rem;
}
.home-social .bi {
  margin-right: 0.4rem;
}
@media (max-width: 575.98px) {
  .hero-placeholder {
    aspect-ratio: 3 / 2;
  }
  .home-social .btn-quarto {
    flex: 1 1 100%; /* full-width buttons on a phone */
  }
}
.home-pages {
  display: grid;
  gap: 0 2rem;
  margin-bottom: 2rem;
}
@media (min-width: 576px) {
  .home-pages {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 992px) {
  .home-pages {
    grid-template-columns: repeat(4, 1fr);
  }
}
.home-page {
  position: relative; /* the whole cell is the link (.stretched-link) */
  padding: 0.9rem 0 0.5rem;
  border-top: 1px solid #dee2e6;
}
.home-page p {
  margin: 0 0 0.25rem;
  color: #52514e;
}
.home-page a {
  font-size: 1.2rem;
  font-weight: 600;
  color: #2a78d6;
  text-decoration: none;
}
.home-page:hover a,
.home-page a:focus-visible {
  text-decoration: underline;
}