.direction-page{padding-bottom:3rem}.direction-breadcrumbs{padding-top:1.25rem;color:var(--muted);font-size:1rem;line-height:1.6}.direction-head{max-width:48rem;padding-block:1.25rem 1.5rem}.direction-head .eyebrow{margin-bottom:.75rem}.direction-head h1{font-size:clamp(2rem,4.8vw,3.5rem);line-height:1.1}.direction-head>p:last-child{max-width:43rem;margin:1rem 0 0;color:var(--muted);font-size:1rem}.direction-tool{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2rem;padding:2rem;border:1px solid var(--line);border-radius:16px;background:#111a2e}.direction-tool>div{min-width:0}.direction-tool h2{font-size:clamp(1.4rem,2.8vw,2rem);line-height:1.2;letter-spacing:-.025em;margin-bottom:1rem}.direction-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin-bottom:1.25rem}.direction-fields label{display:block;font-size:1rem;font-weight:650;margin-bottom:.5rem}.direction-fields input{width:100%;min-width:0;min-height:48px;font:inherit;font-size:1.125rem;background:var(--ink);color:var(--paper);border:1px solid #8b9cb9;border-radius:8px;padding:.6rem .75rem}.direction-fields input[aria-invalid=true]{border:2px solid #ffc097}.direction-fields p{font-size:.875rem;color:var(--muted);margin:.5rem 0 0}.direction-tool button{font:inherit;font-weight:650;border:0;cursor:pointer;min-height:48px}.direction-tool button:disabled{opacity:.55;cursor:not-allowed}.direction-tool input:focus-visible,.direction-tool button:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.direction-result{padding-left:2rem;border-left:1px solid var(--line)}.direction-result>p:not(.eyebrow){color:var(--muted);font-size:1rem}.direction-result .eyebrow{font-size:.875rem;letter-spacing:.025em;text-transform:none}.bearing-compass{position:relative;width:200px;height:200px;max-width:100%;margin:1.5rem auto;border:1px solid #637391;border-radius:50%;font-size:.875rem;font-weight:650;color:var(--paper);background:var(--ink)}.bearing-compass>span:not(.bearing-pointer){position:absolute}.bearing-north{top:.5rem;left:50%;transform:translateX(-50%)}.bearing-east{right:.5rem;top:50%;transform:translateY(-50%)}.bearing-south{bottom:.5rem;left:50%;transform:translateX(-50%)}.bearing-west{left:.5rem;top:50%;transform:translateY(-50%)}.bearing-pointer{position:absolute;inset:20%;transform-origin:center}.bearing-pointer::before{content:'';position:absolute;width:3px;height:50%;background:var(--accent);left:calc(50% - 1.5px);top:0}.bearing-pointer::after{content:'';position:absolute;left:calc(50% - 6px);top:0;width:12px;height:12px;border-top:3px solid var(--accent);border-right:3px solid var(--accent);transform:rotate(-45deg)}#bearing-text{text-align:center;font-size:1rem}#direction-compass .fine{text-align:center;margin-inline:auto}#direction-compass[hidden]{display:none}.direction-next,.direction-reference,.direction-questions,.direction-sources{padding-block:2.5rem;border-bottom:1px solid var(--line)}.direction-next>div{max-width:50rem}.direction-page section:not(.direction-tool)>h2,.direction-next h2{font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.15;margin-bottom:1.25rem}.direction-page section:not(.direction-tool)>p,.direction-next p,.direction-reference p,.direction-questions p{color:var(--muted);font-size:1rem}.direction-reference-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}.direction-reference h3{font-size:1.25rem;line-height:1.25;margin-bottom:1rem}.direction-questions details{border-top:1px solid var(--line)}.direction-questions summary{font-size:1rem}.direction-questions details p{margin-top:.5rem}.direction-sources{max-width:55rem}.direction-sources p{font-size:1rem}.direction-tool .fine{font-size:.875rem}
@media(max-width:750px){.direction-tool{grid-template-columns:1fr;padding:1.5rem;gap:1.5rem}.direction-result{padding:1.5rem 0 0;border-left:0;border-top:1px solid var(--line)}.direction-reference-grid{grid-template-columns:1fr;gap:1.25rem}.direction-head{padding-top:1rem}}@media(max-width:380px){.direction-fields{grid-template-columns:1fr}.direction-tool{padding:1.1rem}.bearing-compass{width:180px;height:180px}}
.direction-fields label{overflow-wrap:anywhere}.bearing-compass{width:min(100%,14rem);height:auto;aspect-ratio:1}.bearing-compass>span:not(.bearing-pointer){text-align:center;line-height:1.2}.bearing-degrees{display:block}.bearing-pointer{inset:38%}@media(max-width:650px){.direction-fields{grid-template-columns:1fr}.direction-tool{padding:1rem}}
.direction-questions summary{overflow-wrap:anywhere}