.hexagram-reader-shell{width:100%;max-width:82rem;min-height:100svh;margin-inline:auto;padding-inline:clamp(1.25rem,5vw,5rem);position:relative;overflow-x:clip}.reader-header,.reader-footer{transition:opacity .46s ease, transform .54s var(--ease-settle);justify-content:space-between;align-items:center;display:flex}.reader-header{z-index:20;border-bottom:1px solid color-mix(in srgb, var(--line) 76%, transparent);flex-wrap:wrap;gap:.25rem .75rem;min-height:5rem;position:relative}.reader-header>.reader-wordmark{flex-shrink:0}.reader-header>.header-meta{margin-inline-start:auto}.reader-wordmark,.reader-overview-link,.reader-footer a{color:inherit;-webkit-text-decoration-color:color-mix(in srgb, currentColor 34%, transparent);text-decoration-color:color-mix(in srgb, currentColor 34%, transparent);text-underline-offset:.35em}.reader-wordmark{font-family:var(--font-classical);letter-spacing:.18em;font-size:1.1rem;font-weight:600;text-decoration:none}.reader-overview-link,.reader-footer{color:var(--ink-soft);letter-spacing:.13em;font-size:.72rem}html[data-locale=en] .reader-overview-link,html[data-locale=de] .reader-overview-link,html[data-locale=en] .reader-footer,html[data-locale=de] .reader-footer,html[data-locale=en] .reader-number,html[data-locale=de] .reader-number,html[data-locale=en] .reader-trigram-note,html[data-locale=de] .reader-trigram-note,html[data-locale=en] .reader-swipe-note,html[data-locale=de] .reader-swipe-note{letter-spacing:.055em}.reader-stage{touch-action:pan-y;grid-template-columns:minmax(16rem,.82fr) minmax(0,1.18fr);align-items:start;column-gap:clamp(3.5rem,7vw,6rem);width:100%;max-width:70rem;min-height:calc(100svh - 9.8rem);margin-inline:auto;padding-block:clamp(3.75rem,8vh,6.5rem);animation:.32s ease-out backwards reader-stage-enter;display:grid}.reader-stage.is-leaving-previous{opacity:0;transform:translate(1.35rem)}.reader-stage.is-leaving-next{opacity:0;transform:translate(-1.35rem)}.reader-stage.is-leaving-home{opacity:0;transform:translateY(.55rem)scale(.994)}.hexagram-reader-shell.is-returning-home .reader-header{opacity:0;transform:translateY(-.35rem)}.hexagram-reader-shell.is-returning-home .reader-footer{opacity:0;transform:translateY(.35rem)}.reader-figure{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:27rem;display:flex;position:sticky;top:clamp(7rem,14vh,9rem)}.reader-lines{flex-direction:column;gap:.6rem;width:clamp(9.5rem,17vw,11.25rem);display:flex}.reader-line{justify-content:space-between;width:100%;height:.62rem;display:flex;position:relative}.reader-line>span:not(.moving-line-dot){background:var(--ink);border-radius:1px;width:41.5%;height:100%;display:block}.reader-line.is-yang>span:not(.moving-line-dot):nth-last-child(2){width:100%}.reader-line.is-yang>span:not(.moving-line-dot):last-child{display:none}.reader-caption{margin-top:1.9rem}.reader-number,.reader-trigram-note,.reader-swipe-note{color:var(--ink-soft);letter-spacing:.13em;margin:0;font-size:.72rem}.reader-caption h1{font-family:var(--font-classical);letter-spacing:.18em;margin:.35rem 0 .48rem;font-size:clamp(2.5rem,5vw,3.5rem);font-weight:500;line-height:1.2}.reader-caption h1 span{letter-spacing:.08em;font-size:.52em}@media (min-width:800px){html[data-locale=en] .reader-figure,html[data-locale=en] .reader-caption{width:100%;min-width:0;max-width:100%}html[data-locale=en] .reader-caption h1{letter-spacing:.015em;font-size:clamp(1.45rem,2.2vw,1.85rem);line-height:1.35}html[data-locale=en] .reader-caption h1 .bilingual-hexagram-name{letter-spacing:.015em;gap:.4rem;max-width:100%;line-height:1.35}}.reader-swipe-note{opacity:.72;margin-top:2.2rem;display:none}.reader-text{min-width:0}.reader-text .reading-panel{border-top:0;width:100%;padding-block:0 clamp(3rem,7vw,5.5rem)}.reader-text .reading-section h2{margin-top:.45rem}.reader-nav{z-index:20;width:4.25rem;height:7rem;transition:opacity .42s ease, transform .52s var(--ease-settle);place-items:center;padding:0;text-decoration:none;display:grid;position:fixed;top:50%;transform:translateY(-50%)}.reader-nav-previous{left:max(.35rem, env(safe-area-inset-left))}.reader-nav-next{right:max(.35rem, env(safe-area-inset-right))}.reader-nav-glass{background-blend-mode:screen, multiply, normal;filter:drop-shadow(0 .7rem 1.15rem #4f391829)drop-shadow(0 0 1px #5c411957);opacity:.72;-webkit-backdrop-filter:blur(17px)saturate(112%)contrast(102%);width:2.8rem;height:4.7rem;transition:opacity .22s ease, transform .3s var(--ease-settle);background:linear-gradient(125deg,#fff4d266,#0000 42%),radial-gradient(circle at 38% 30%,#c49d5657,#0000 62%),#84632d40;display:block}.reader-nav-previous .reader-nav-glass{clip-path:polygon(88% 3%,12% 50%,88% 97%)}.reader-nav-next .reader-nav-glass{clip-path:polygon(12% 3%,88% 50%,12% 97%)}:is(.reader-nav:hover .reader-nav-glass,.reader-nav:focus-visible .reader-nav-glass){opacity:.92;transform:scale(1.045)}.hexagram-reader-shell.is-returning-home .reader-nav{opacity:0;pointer-events:none;transform:translateY(-50%)scale(.94)}.reader-footer{border-top:1px solid color-mix(in srgb, var(--line) 76%, transparent);min-height:4.8rem}@media (max-width:799px){.reader-header{min-height:4.25rem}.reader-stage{flex-direction:column;min-height:auto;padding-block:1.4rem 4.5rem;display:flex}.reader-figure{text-align:center;justify-content:flex-start;align-self:center;align-items:center;width:100%;min-height:min(25rem,68svh - 4.25rem);padding-top:clamp(2.25rem,7svh,4rem);position:static}.reader-lines{width:clamp(8.8rem,40vw,10.25rem);margin-inline:auto}.reader-swipe-note{display:block}.reader-text{width:100%;margin-top:clamp(2.5rem,9vw,4.5rem)}.reader-text .reading-panel{border-top:1px solid var(--line);padding-block:2.5rem 1rem}.reader-nav{width:3rem;height:6rem}.reader-nav-previous{left:max(.05rem, env(safe-area-inset-left))}.reader-nav-next{right:max(.05rem, env(safe-area-inset-right))}.reader-nav-glass{opacity:.68;width:2rem;height:3.75rem}}@media (max-width:480px){.hexagram-reader-shell{padding-inline:1.25rem}.reader-stage{padding-top:.75rem}.reader-figure{min-height:min(24rem,66svh - 4.25rem);padding-top:clamp(2rem,6.5svh,3.4rem)}.reader-footer{min-height:5.4rem}}@media (prefers-reduced-motion:reduce){.reader-stage{animation:none}}@keyframes reader-stage-enter{0%{opacity:0;transform:translateY(.75rem)}to{opacity:1;transform:translate(0,0)}}