.orientation{padding:58px 0 36px}.orientation-heading{max-width:780px;margin-bottom:36px}.orientation-heading h1{text-wrap:balance;font-size:clamp(34px,4.4vw,60px);line-height:1.55;letter-spacing:3px;margin:12px 0 18px}.orientation-heading>p:last-child{max-width:670px;line-height:2;color:var(--muted)}.orientation-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:70px}.orientation-figure{padding:24px 0;background:var(--panel);border:1px solid var(--edge);color:var(--ink)}.orientation-figure svg{width:100%;height:auto}.orientation-figure figcaption{text-align:center;font-size:11px;color:var(--muted);padding:0 26px}.orientation-reading{min-width:0}.orientation-steps{display:flex;gap:22px;border-bottom:1px solid var(--edge);margin-bottom:28px}.orientation-steps button{min-height:62px;padding:8px 0 16px;display:grid;gap:4px;font-size:12px;color:var(--muted);border-bottom:2px solid transparent;flex:1;text-align:left}.orientation-steps button span:first-child{font-family:var(--latin);font-size:13px}.orientation-steps button[aria-pressed=true]{border-color:var(--ink);color:var(--ink)}.orientation-lesson{min-height:202px;animation:learn-copy .45s both}.orientation-lesson h2{text-wrap:balance;font-size:25px;line-height:1.65;letter-spacing:1px;margin-bottom:20px}.orientation-lesson p{line-height:2;font-size:14px;color:var(--muted)}.orientation-lesson .orientation-note{margin-top:16px;font-size:12px}.orientation-respect{margin:25px 0 28px;border-left:1px solid var(--accent);padding-left:20px}.orientation-respect p{font-family:var(--serif);font-size:19px;margin-bottom:7px}.orientation-respect span{font-size:12px;color:var(--muted)}.orientation-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.orientation-actions .quiet-link{font-size:12px;min-height:44px;display:grid;align-items:center;text-decoration:underline;text-underline-offset:5px}.practice-toolbar{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-bottom:20px;font-size:12px;color:var(--muted)}.practice-toolbar button{min-height:44px;text-decoration:underline;text-underline-offset:5px}.practice-selector{max-width:370px;padding-top:20px;margin-bottom:0}.learn-guide{fill:none;stroke:currentColor;stroke-width:1;opacity:.3}.learn-small{fill:currentColor;font-family:var(--sans);font-size:11px;opacity:.75}.learn-caption{fill:currentColor;font-family:var(--serif);font-size:13px;letter-spacing:1px}.learn-trigram{fill:currentColor;font-family:var(--serif);font-size:28px}.learn-line{animation:learn-line .6s var(--delay,0ms) both}.learn-line path{stroke:currentColor;stroke-width:7;fill:none;stroke-linecap:square}.learn-moving{color:var(--accent)}.learn-transformed{animation:learn-change .7s var(--delay,0ms) both}.learn-coins circle{fill:none;stroke:var(--accent);stroke-width:1}.learn-coins{animation:learn-copy .7s .5s both}.learn-palace,.learn-pillar{animation:learn-copy .7s var(--delay,0ms) both}.learn-palace rect,.learn-pillar rect{stroke:currentColor;stroke-width:.8;fill:none;stroke-opacity:.35}.learn-palace-active rect,.learn-day rect{fill:var(--selected);stroke:var(--accent);stroke-opacity:1}.learn-reveal{animation:learn-copy .7s .3s both}[data-direction=b] .orientation-figure{background:linear-gradient(140deg,#244957,#143248)}[data-direction=b] .orientation-respect{border-left-color:#b7d0cf}[data-direction=b] .orientation-heading h1{font-weight:300}html[lang=en] .orientation-heading h1{font-family:var(--latin);letter-spacing:0;line-height:1.2}html[lang=en] .orientation-lesson h2{font-family:var(--latin);letter-spacing:0}
@keyframes learn-line{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes learn-change{from{opacity:0;transform:translateX(-13px)}to{opacity:1;transform:translateX(0)}}@keyframes learn-copy{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:960px){.orientation-body{gap:38px}.orientation-steps{gap:15px}.orientation-lesson{min-height:235px}.orientation-heading h1{font-size:42px}}
@media(max-width:760px){.orientation{padding-top:32px}.orientation-body{grid-template-columns:1fr;gap:30px}.orientation-heading{margin-bottom:26px}.orientation-heading h1{font-size:34px;letter-spacing:1px;line-height:1.5}.orientation-heading>p:last-child{font-size:13px}.orientation-figure{padding:12px 0 18px}.orientation-figure svg{max-height:300px}.orientation-figure figcaption{font-size:10px;padding:0 20px}.orientation-steps{margin-bottom:22px}.orientation-steps button{min-height:52px;padding-bottom:12px}.orientation-lesson{min-height:0}.orientation-lesson h2{font-size:23px;margin-bottom:15px}.orientation-lesson p{font-size:13px}.orientation-respect{margin:24px 0}.orientation-respect p{font-size:18px}.orientation-actions{gap:15px}.practice-toolbar{gap:15px;font-size:11px}.practice-selector{padding-top:10px}.orientation-actions .solid-button{font-size:13px;padding:12px 20px}}
@media(prefers-reduced-motion:reduce){.orientation *{animation:none!important;transition:none!important}}

.ssj[data-motion=off] .orientation *{animation:none!important;transition:none!important}.orientation .fine{font-size:12px;color:var(--muted)}.orientation .solid-button{min-height:48px;padding:13px 28px;border:1px solid var(--ink);border-radius:0}.orientation .orientation-figure{margin:0}.practice-toolbar a{min-height:44px;display:grid;align-items:center}.practice-selector button{min-height:44px;padding:12px 28px;border-radius:0}.practice-selector{display:flex;border-bottom:1px solid var(--line);gap:12px}.practice-selector [aria-pressed=true]{border-bottom:2px solid var(--ink)}
