.game-page-hero--compass .game-page-hero__tagline{color:var(--teal-dark);font-family:var(--font-display);margin:.3rem 0 .5rem;font-size:clamp(1.12rem,2vw,1.45rem);font-weight:750}.game-rule-card--compass{background:#dbe5ca;transform:rotate(-1deg)}.compass-game{--trail-green:#627b54;--trail-green-soft:#dbe5ca;--trail-water:#bcd8dc;--trail-line:#172f3a4d}.compass-game[data-state=transition] .game-progress{padding-bottom:.85rem}.compass-workspace{grid-template-columns:minmax(500px,560px) minmax(270px,310px);justify-content:center;align-items:start;gap:clamp(1rem,3vw,2rem);display:grid}.compass-trail-map{aspect-ratio:1;border:2px solid var(--ink);background:linear-gradient(90deg,#0000 49.6%,#172f3a1a 50%,#0000 50.4%),linear-gradient(15deg,#627b5414,#0000 34%),repeating-linear-gradient(0deg,#0000 0 30px,#3978c60b 31px),#eee7d1;width:min(100%,560px);position:relative;overflow:hidden;transform:rotate(-.25deg);box-shadow:0 10px 22px #172f3a29,inset 0 0 0 7px #fffaf07a}.compass-trail-map:before,.compass-trail-map:after{z-index:0;content:"";pointer-events:none;border:1.5px dashed #627b546b;border-radius:48%;position:absolute}.compass-trail-map:before{width:42%;height:25%;top:11%;left:-5%;transform:rotate(-14deg)}.compass-trail-map:after{width:49%;height:29%;bottom:7%;right:-9%;transform:rotate(11deg)}.trail-map__contours{z-index:0;fill:none;opacity:.45;width:100%;height:100%;stroke:var(--trail-green);stroke-dasharray:4 5;stroke-width:1.3px;position:absolute;inset:0}.trail-map__route{z-index:4;pointer-events:none;width:90%;height:90%;position:absolute;inset:5%;overflow:visible}.trail-map__route polyline{fill:none;stroke:var(--coral);stroke-dasharray:2.5 4.5;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.25px;vector-effect:non-scaling-stroke}.trail-map__route line{stroke:var(--gold);stroke-dasharray:4 3;stroke-linecap:round;stroke-width:5px;vector-effect:non-scaling-stroke}.trail-map__stops{z-index:2;background:radial-gradient(circle,#627b545c 0 2px,#0000 3px) 0 0/25% 25%;grid-template-rows:repeat(5,minmax(44px,1fr));grid-template-columns:repeat(5,minmax(44px,1fr));gap:clamp(3px,.7vw,6px);display:grid;position:absolute;inset:5%}.trail-map__north{z-index:7;letter-spacing:.08em;background:#fffaf0e0;border:1px solid #172f3a73;padding:.2rem .45rem;font-size:clamp(.52rem,1.2vw,.66rem);font-weight:950;line-height:1;position:absolute;top:1.4%;left:50%;transform:translate(-50%)rotate(-1deg)}.trail-map__rose{z-index:6;pointer-events:none;width:clamp(3.5rem,9vw,4.8rem);position:absolute;top:3.5%;right:21.5%;transform:rotate(1deg)}.trail-stop{min-width:44px;min-height:44px;color:var(--ink);background:#fffaf08f;border:1.5px solid #172f3a2e;border-radius:12px 7px 11px 8px;place-items:center;padding:0;display:grid;position:relative;overflow:visible}button.trail-stop{cursor:default;transition:border-color .13s,background .13s,transform .13s,opacity .13s}.trail-stop__paper{z-index:0;aspect-ratio:1;background:var(--paper-light);border:1.5px solid #172f3a7a;border-radius:50%;width:17%;min-width:8px;position:absolute}.trail-stop--landmark .trail-stop__paper{background:#fffaf0e6;border-radius:13px 9px 12px 8px;width:66%;transform:rotate(-2deg);box-shadow:2px 2px #172f3a21}.trail-landmark-icon{z-index:1;fill:none;stroke:currentColor;width:48%;max-height:48%;position:relative;overflow:visible}.trail-landmark-icon--pond{color:#23558f}.trail-landmark-icon--garden,.trail-landmark-icon--pine-grove,.trail-landmark-icon--hilltop{color:#386345}.trail-landmark-icon--trailhead,.trail-landmark-icon--lookout,.trail-landmark-icon--footbridge,.trail-landmark-icon--ranger-station,.trail-landmark-icon--cabin{color:#704c32}.trail-landmark-icon--campsite,.trail-landmark-icon--picnic-area,.trail-landmark-icon--campfire{color:#9e3f32}.trail-stop[aria-disabled=true]:not(.is-current,.is-target,.is-correct,.is-revealed){opacity:.68}.trail-stop.is-valid{cursor:pointer;opacity:1;background:#24b98b1c;border:2px dashed #172f3aa6}.trail-stop.is-valid:hover{border-style:solid;border-color:var(--blue-dark);background:#3978c629;transform:translateY(-1px)}.trail-stop:focus-visible{z-index:8;outline:4px solid var(--gold);outline-offset:1px;box-shadow:inset 0 0 0 3px var(--blue-dark)}.trail-stop.is-current{z-index:6;border:3px solid var(--ink);opacity:1}.trail-stop__marker{z-index:7;aspect-ratio:1;border:2px solid var(--ink);width:48%;min-width:27px;color:var(--ink);background:var(--teal);box-shadow:2px 2px 0 var(--ink);border-radius:50% 50% 50% 7px;place-items:center;display:none;position:absolute;transform:rotate(-45deg)translate(13%,-13%)}.trail-stop__marker span{letter-spacing:.02em;font-size:clamp(.42rem,1.2vw,.58rem);font-weight:950;transform:rotate(45deg)}.trail-stop.is-current .trail-stop__marker{display:grid}.trail-stop__target{z-index:6;border:1.5px solid var(--ink);background:var(--coral);color:var(--paper-light);letter-spacing:.05em;text-transform:uppercase;padding:.18rem .28rem;font-size:clamp(.42rem,1vw,.55rem);font-weight:950;line-height:1;display:none;position:absolute;top:-.35rem;right:-.35rem;transform:rotate(3deg)}.trail-stop.is-target{z-index:5;border:4px solid var(--coral);opacity:1;background:#e7685529}.trail-stop.is-target .trail-stop__target{display:block}.trail-stop.is-clue,.trail-stop.is-supported{border:4px solid var(--gold);opacity:1;background:#e8be5538}.trail-stop.is-incorrect{border-color:var(--coral);background:#e7685521}.trail-stop.is-correct,.trail-stop.is-revealed{border:4px solid var(--teal-dark);opacity:1;background:#24b98b33}.trail-stop.is-revealed{border-color:var(--gold)}.trail-stop__status{z-index:9;aspect-ratio:1;width:1.35rem;color:var(--paper-light);background:var(--teal-dark);border-radius:50%;place-items:center;font-size:.72rem;font-weight:950;display:grid;position:absolute;bottom:3px;right:3px}.compass-answer-panel{min-height:100%}.compass-answer-panel .feedback-panel{margin-top:.65rem}.compass-answer-panel .clue-button[hidden]{display:none}.feedback-panel__stamp{color:var(--teal-dark);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.2rem;font-size:.62rem;font-weight:950;display:block}.compass-rose-control{border:0;margin:.8rem 0 0;padding:0}.compass-rose-control legend{color:var(--ink-soft);margin-bottom:.55rem;padding:0;font-size:.72rem;font-weight:850}.compass-rose-control__grid{grid-template-rows:repeat(3,minmax(52px,1fr));grid-template-columns:repeat(3,minmax(52px,1fr));gap:.35rem;width:min(100%,235px);margin-inline:auto;display:grid}.compass-direction{grid-row:var(--direction-row);grid-column:var(--direction-column);border:2px solid var(--ink);min-width:44px;min-height:44px;color:var(--ink);background:var(--paper-light);font-family:var(--font-display);cursor:pointer;place-items:center;padding:.3rem;font-size:1rem;font-weight:900;display:grid}.compass-direction:hover{background:#24b98b24}.compass-direction[aria-pressed=true]{background:var(--teal);box-shadow:inset 0 0 0 2px var(--paper-light)}.compass-direction:focus-visible{z-index:3;outline:4px solid var(--gold);outline-offset:1px}.compass-direction.is-incorrect{border-color:var(--coral);background:#e768552b}.compass-direction.is-supported,.compass-direction.is-clue{outline:4px solid var(--gold);outline-offset:-5px}.compass-rose-control__center{border:2px solid var(--ink);background:var(--gold);border-radius:50%;grid-area:2/2;place-items:center;min-width:44px;min-height:44px;display:grid;position:relative}.compass-rose-control__center:before,.compass-rose-control__center:after{background:var(--ink);content:"";width:64%;height:2px;position:absolute}.compass-rose-control__center:after{transform:rotate(90deg)}.compass-rose-control__center span{border-right:5px solid #0000;border-bottom:15px solid var(--coral);border-left:5px solid #0000;width:0;height:0;transform:translateY(-8px)}.direction-selection{background:#f3eee29e;border:1.5px dashed #172f3a66;justify-content:space-between;align-items:baseline;margin-block:.75rem;padding:.55rem .7rem;display:flex}.direction-selection span{color:var(--ink-soft);font-size:.68rem;font-weight:850}.direction-selection strong{font-family:var(--font-display)}.compass-rose-graphic{aspect-ratio:1;background:#fffaf0e0;border:1.5px solid #172f3ab3;border-radius:50%;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);place-items:center;width:100%;display:grid;position:relative}.compass-rose-graphic:before,.compass-rose-graphic:after{content:"";background:#172f3a75;width:70%;height:1px;position:absolute}.compass-rose-graphic:after{transform:rotate(90deg)}.compass-rose-graphic__label{z-index:2;grid-row:var(--direction-row);grid-column:var(--direction-column);font-family:var(--font-display);font-size:clamp(.34rem,1vw,.5rem);font-weight:900;line-height:1}.compass-rose-graphic__needle{z-index:1;border-right:4px solid #0000;border-bottom:17px solid var(--coral);border-left:4px solid #0000;width:0;height:0;position:absolute;top:19%}.compass-transition{grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);align-items:center;gap:clamp(2rem,6vw,5rem);padding:clamp(2rem,6vw,4.5rem);display:grid}.compass-transition[hidden]{display:none}.compass-transition h2{max-width:13ch;margin-bottom:1rem}.compass-transition p:not(.eyebrow){max-width:58ch;color:var(--ink-soft);margin-bottom:1.5rem;font-size:1.08rem}.compass-transition__rose{border:2px solid var(--ink);background:var(--trail-green-soft);width:min(100%,330px);box-shadow:6px 6px 0 var(--ink);padding:1.6rem;position:relative;transform:rotate(1deg)}.compass-transition__note{letter-spacing:.05em;text-align:center;text-transform:uppercase;margin-top:.9rem;font-size:.7rem;font-weight:900;display:block}.example-next,.example-actions{margin-top:.75rem}.example-actions{gap:.6rem}.example-actions .button,.example-actions .game-text-button{justify-content:center;width:100%}.compass-results__heading{justify-content:space-between;align-items:flex-start;gap:1.5rem;display:flex}.compass-results__stamp{border:2px solid var(--ink);background:var(--teal);box-shadow:3px 3px 0 var(--ink);letter-spacing:.08em;text-transform:uppercase;padding:.55rem .75rem;font-size:.66rem;font-weight:950;transform:rotate(2deg)}.compass-results__route{border:2px solid var(--ink);background:var(--paper-deep);grid-template-columns:minmax(190px,.4fr) minmax(270px,.6fr);align-items:center;gap:clamp(1.5rem,4vw,3rem);margin-block:2rem;padding:clamp(1rem,3vw,2rem);display:grid}.compass-results__route .compass-trail-map{justify-self:end;max-width:360px;box-shadow:5px 5px #172f3a33}.compass-trail-map--summary .trail-map__rose,.compass-trail-map--summary .trail-map__north{transform:scale(.82)}.compass-preview{aspect-ratio:1;border:2px solid var(--ink);background:linear-gradient(90deg,#0000 49.5%,#172f3a1a 50%,#0000 50.5%),repeating-linear-gradient(0deg,#0000 0 27px,#3978c60f 28px),#eee7d1;width:min(100%,520px);padding:5%;position:relative;overflow:hidden;transform:rotate(.75deg);box-shadow:7px 7px #172f3a3d}.compass-preview:before,.compass-preview:after{content:"";border:2px dashed #627b5459;border-radius:50%;position:absolute}.compass-preview:before{width:45%;height:30%;top:8%;left:-7%}.compass-preview:after{width:50%;height:34%;bottom:6%;right:-8%}.compass-preview__stops{z-index:2;grid-template-rows:repeat(5,1fr);grid-template-columns:repeat(5,1fr);gap:4px;width:100%;height:100%;display:grid;position:relative}.compass-preview__stop{background:#fffaf08c;border:1px solid #172f3a2e;border-radius:9px 6px 8px 5px;place-items:center;display:grid;position:relative}.compass-preview__stop:before{aspect-ratio:1;background:var(--paper-light);content:"";border:1px solid #172f3a73;border-radius:50%;width:13%}.compass-preview__stop.has-landmark:before{border-radius:10px;width:62%;position:absolute}.compass-preview__stop .trail-landmark-icon{width:45%}.compass-preview__stop.is-current{border:3px solid var(--ink)}.compass-preview__marker{z-index:5;aspect-ratio:1;border:1.5px solid var(--ink);background:var(--teal);border-radius:50%;place-items:center;width:46%;min-width:22px;font-size:clamp(.36rem,1vw,.52rem);font-weight:950;display:grid;position:absolute}.compass-preview__route{z-index:4;pointer-events:none;width:90%;height:90%;position:absolute;inset:5%}.compass-preview__route polyline{fill:none;stroke:var(--coral);stroke-dasharray:3 5;stroke-linecap:round;stroke-width:3px;vector-effect:non-scaling-stroke}.compass-preview__rose{z-index:6;width:15%;position:absolute;top:3.5%;right:21%}.compass-preview__label{z-index:6;border:1px solid var(--ink);background:var(--paper-light);padding:.15rem .3rem;font-size:clamp(.4rem,1vw,.55rem);font-weight:950;position:absolute;top:1.25%;left:50%;transform:translate(-50%)}@media (width>=961px){.compass-game:is([data-state=playing],[data-state=example]) .mission-heading{padding-block:.7rem .8rem}.compass-game:is([data-state=playing],[data-state=example]) .compass-trail-map{max-width:465px}.compass-game:is([data-state=playing],[data-state=example]) .compass-answer-panel{padding:.8rem}.compass-game:is([data-state=playing],[data-state=example]) .compass-rose-control__grid{grid-template-rows:repeat(3,minmax(46px,1fr));grid-template-columns:repeat(3,minmax(46px,1fr));gap:.25rem}.compass-game:is([data-state=playing],[data-state=example]) .compass-direction{min-height:46px}.compass-game:is([data-state=playing],[data-state=example]) .keyboard-note,.compass-game:is([data-state=playing],[data-state=example]) .clue-button{margin-top:.55rem}}@media (width<=960px){.compass-workspace,.compass-transition{grid-template-columns:1fr}.compass-trail-map{margin-inline:auto}.compass-answer-panel{max-width:560px;margin-inline:auto}.compass-transition__rose{justify-self:center}}@media (width<=720px){.compass-workspace{gap:.9rem}.compass-trail-map{width:100%;box-shadow:4px 4px #172f3a2e}.trail-map__stops,.trail-map__route{width:93%;height:93%;inset:3.5%}.trail-map__stops{grid-template-rows:repeat(5,minmax(44px,1fr));grid-template-columns:repeat(5,minmax(44px,1fr));gap:3px}.trail-map__rose{width:3.2rem;top:2.4%;right:19%}.trail-map__north{top:.5%}.trail-stop{border-radius:8px 5px 7px}.trail-stop__marker{min-width:25px}.compass-rose-control__grid{grid-template-rows:repeat(3,minmax(56px,1fr));grid-template-columns:repeat(3,minmax(56px,1fr));width:min(100%,260px)}.compass-results__heading{display:grid}.compass-results__stamp{justify-self:start}.compass-results__route{grid-template-columns:1fr}.compass-results__route .compass-trail-map{justify-self:center}}@media (width<=390px){.compass-game:is([data-state=playing],[data-state=example]) .game-stage{padding-inline:.45rem}.trail-map__stops{gap:2px}.trail-stop__target{right:-.15rem}.compass-rose-control__grid{width:100%}}@media (prefers-reduced-motion:reduce){button.trail-stop,.trail-stop__marker{transition:none}.trail-stop.is-valid:hover{transform:none}}