/* One continuous Sanctum introduction, with distinct learning, listening and game chapters. */
.page-home main { position: relative; isolation: isolate; overflow: clip; }
.page-home main > section { position: relative; }
.page-home main::before { content: ''; position: absolute; left: 12px; top: 620px; bottom: 260px; width: 1px; background: var(--copper); z-index: 3; pointer-events: none; }
.page-home main.has-cable::before { display: none; }
.page-home .home-cable { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; fill: none; stroke: #ba8067; stroke-width: 1.45; opacity: .9; }
.page-home .home-cable[hidden] { display: none; }
.page-home .home-cable-line { vector-effect: non-scaling-stroke; }
.page-home .home-welcome { background: var(--ink); color: var(--chalk); }
.page-home .home-entry { position: relative; display: grid; grid-template-columns: 1.15fr .95fr; gap: 0 5%; max-width: 1360px; padding-top: 52px; padding-bottom: 64px; z-index: 1; }
.page-home .home-welcome-copy { position: relative; z-index: 2; align-self: start; padding-top: 18px; }
.page-home .home-welcome-copy .eyebrow { color: #bbb4b0; margin: 0 0 18px; }
.page-home .home-welcome h1 { font: normal clamp(54px, 5.15vw, 76px)/1.01 Georgia, serif; letter-spacing: -.059em; margin: 0 0 23px; }
.page-home .home-intro { max-width: 465px; color: #c8c3bd; font-size: 16px; line-height: 1.7; margin: 0 0 28px; }
.page-home .home-actions { display: flex; flex-wrap: wrap; gap: 12px 23px; align-items: center; }
.page-home .home-actions > .actions { margin: 0; gap: 12px 23px; }
.page-home .home-actions .button.secondary { border-color: transparent; background: transparent; padding-left: 0; padding-right: 0; }
.page-home .home-computer { align-self: center; margin: -18px -15px 0 0; }
.page-home .home-computer .ink-art { width: 100%; max-width: 480px; margin: auto; }
.page-home .home-computer figcaption { font: italic 16px/1.4 Georgia, serif; color: #b8ada7; text-align: center; margin: -6px 0 0; }
.page-home .home-welcome-foot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-top: 57px; padding-top: 22px; border-top: 1px solid #625750; color: #bfb2a9; font: 12px/1.55 ui-monospace, monospace; }
.page-home .home-welcome-foot a { text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; gap: 25px; }
.page-home .home-welcome-foot a span { font: 24px/1 Georgia, serif; }
.page-home .home-room-line { display: flex; justify-content: space-between; align-items: center; gap: 24px; border-top: 1px solid #726159; padding-top: 19px; }
.page-home .home-room-line .eyebrow { margin: 0; }
.page-home .home-aside-note { font: italic 17px/1.4 Georgia, serif; color: #bdb2ac; }
.page-home h2 { font: normal clamp(47px,4.6vw,69px)/1.01 Georgia,serif; letter-spacing: -.049em; margin: 0 0 22px; }
.page-home h2 em { font-weight: normal; }
.page-home h3 { font: normal 34px/1.1 Georgia,serif; letter-spacing: -.035em; margin: 0 0 14px; }
.page-home .home-learning { background: var(--paper); color: var(--ink); padding: 37px 0 100px; }
.page-home .home-learning .home-room-line { border-color: #b1a59a; }
.page-home .home-learning .home-aside-note { color: #766559; }
.page-home .home-learning-body { display: grid; grid-template-columns: 1.07fr .93fr; align-items: center; gap: 6%; }
.page-home .home-familiar { margin: -5px -29px 0 -42px; }
.page-home .home-familiar img { width: 100%; height: auto; mix-blend-mode: multiply; }
.page-home .home-learning-copy { padding: 56px 0 25px; max-width: 435px; }
.page-home .home-learning-copy h2 { margin-bottom: 25px; }
.page-home .home-learning-copy p { font-size: 15px; line-height: 1.75; color: #655b55; margin-bottom: 22px; }
.page-home .home-learning-copy .home-learn-lead { font-size: 19px; color: var(--ink); }
.page-home .home-learning-copy .button { background: var(--ink); color: var(--paper); border-color: var(--ink); margin-top: 5px; }
.page-home .home-learning-copy .button:hover { background: #554151; border-color: #554151; }
.page-home .home-learning-copy .status { margin-top: 13px; font-size: 11px; }
.page-home .home-details { border-top: 1px solid #b8ac9d; padding-top: 15px; margin-top: 22px; font-size: 14px; }
.page-home .home-details summary { cursor: pointer; padding: 5px 0; }
.page-home .home-details[open] summary { margin-bottom: 16px; }
.page-home .home-details p { margin: 0 0 15px; }
.page-home .home-learning-foot { display: flex; align-items: end; justify-content: space-between; gap: 35px; padding: 15px 30px 0; }
.page-home .home-learning-foot blockquote { font: italic 25px/1.37 Georgia,serif; letter-spacing: -.025em; margin: 0; max-width: 350px; }
.page-home .home-learning-foot blockquote::before { content: '✳'; display: block; margin: 0 0 13px; font: 19px/1 Georgia,serif; color: #ae684c; }
.page-home .home-learning-foot > span { font: 11px/1.65 ui-monospace,monospace; color: #76665d; text-align: right; }
.page-home .home-listening { padding: 45px 0 92px; }
.page-home .home-listening .home-room-line { border-color: var(--maid-line); }
.page-home .home-listening .home-aside-note { color: var(--maid-muted); font: 13px/1.4 var(--maid-sans); }
.page-home .home-listening .musicmaid-wordmark { margin: 0; line-height: 1.1; }
.page-home .musicmaid-wordmark span { color: var(--maid-gold); font-size: 22px; margin-left: 7px; }
.page-home .home-listening-body { display: grid; grid-template-columns: 1fr 1fr; gap: 7%; align-items: center; padding: 40px 0 45px; }
.page-home .home-listening h2.musicmaid-headline { font-family: var(--maid-serif); font-size: clamp(57px,6.6vw,96px); line-height: 1.01; letter-spacing: -.025em; }
.page-home .home-listening-copy > p:not(.status) { color: var(--maid-muted); font-size: 17px; line-height: 1.8; max-width: 400px; margin: 0 0 25px; }
.page-home .home-listen-instructions { max-width: 430px; border: 0; padding: 0; margin: 0; }
.page-home .home-listen-instructions summary { background: var(--maid-ink); color: var(--maid-paper); width: fit-content; max-width: 100%; border-radius: 4px; font-weight: 500; padding: 13px 19px; }
.page-home .home-listen-instructions p { color: var(--maid-muted); margin: 20px 0 0; line-height: 1.8; }
.page-home .home-listen-links { display: flex; flex-direction: column; align-items: start; gap: 15px; padding-top: 24px; }
.page-home .home-listen-links .status { margin: 0; font: 12px/1.6 var(--maid-sans); }
.page-home .home-musicmaid { width: 100%; max-width: 530px; justify-self: end; }
.page-home .home-musicmaid figcaption { text-align: right; font: italic 22px/1.2 var(--maid-serif); padding-right: 28px; margin-top: -12px; }
.page-home .home-music-notes { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--maid-line); padding-top: 22px; color: var(--maid-muted); font: 12px/1.6 var(--maid-sans); }
.page-home .home-arcade { background: #232021; color: var(--chalk); padding: 42px 0 95px; }
.page-home .home-arcade-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 12%; align-items: end; padding: 45px 0 50px; }
.page-home .home-arcade-heading h2 { margin: 0; }
.page-home .home-arcade-heading > p { max-width: 370px; color: #c4b9b4; line-height: 1.8; margin: 0; }
.page-home .home-velocity, .page-home .home-durak { display: grid; grid-template-columns: 1fr 1fr; gap: 9%; align-items: center; }
.page-home .home-velocity { padding-bottom: 48px; }
.page-home .home-typing-plate { border-top: 1px solid #8d7e74; border-bottom: 1px solid #8d7e74; padding: 22px 0; }
.page-home .home-typing-caption { color: #bcb2aa; font: 11px/1.5 ui-monospace,monospace; }
.page-home .home-typing-line { font: clamp(23px,2.35vw,36px)/1.4 ui-monospace,monospace; letter-spacing: -.055em; margin: 35px 0; }
.page-home .home-typing-line em { font-style: normal; color: #d7b39e; }
.page-home .home-typing-line i { display: inline-block; width: 2px; height: .94em; background: var(--copper); margin: 0 0 -.07em .16em; }
.page-home .home-typing-rule { font: italic 14px/1.4 Georgia,serif; color: #bcb2aa; margin: 0; }
.page-home .home-game-copy .eyebrow { color: #bfb0a6; font-size: 11px; }
.page-home .home-game-copy > p:not(.status,.eyebrow) { color: #c9beb8; line-height: 1.75; max-width: 415px; margin-bottom: 23px; }
.page-home .home-game-copy .status { font-size: 11px; }
.page-home .home-durak { border-top: 1px solid #6e5e57; padding-top: 48px; }
.page-home .home-durak-scene { display: block; position: relative; overflow: hidden; aspect-ratio: 1.7; border: 1px solid #887567; color: #212c2c; background: #73c6c0; text-decoration: none; }
.page-home .home-pavilion { width: 100%; height: 100%; object-fit: cover; }
.page-home .home-cast { position: absolute; width: 43%; aspect-ratio: 1; background-image: url('assets/durak-cast.png'); background-size: 200% 200%; bottom: 12%; }
.page-home .home-wolf { left: 5%; background-position: 0% 0%; transform: rotate(-4deg); }
.page-home .home-hare { right: 5%; background-position: 100% 0%; transform: rotate(3deg); }
.page-home .home-scene-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 10px 15px; font: 11px/1.45 ui-monospace,monospace; color: #fbf1db; background: #152c2cdf; display: flex; justify-content: space-between; gap: 20px; }
.page-home .home-scene-caption > span { font-size: 18px; }
.page-home .home-durak-scene:hover { outline: 1px solid var(--copper); outline-offset: 6px; }
.page-home .home-wheel-note { display: grid; grid-template-columns: 120px 1fr auto; align-items: center; gap: 28px; margin-top: 47px; padding: 25px 0; border-top: 1px solid #6e5e57; border-bottom: 1px solid #6e5e57; }
.page-home .home-wheel-note .ink-art { width: 115px; }
.page-home .home-wheel-note h3 { font-size: 29px; margin: 0 0 7px; }
.page-home .home-wheel-note p { margin: 0; color: #c1b5ac; font-size: 14px; line-height: 1.6; }
.page-home .home-wheel-note .status { margin-top: 7px; font-size: 11px; }
.page-home .home-wheel-note > a { margin-right: 12px; }
.page-home .home-arcade-foot { display: flex; justify-content: space-between; align-items: center; gap: 32px; margin-top: 26px; }
.page-home .home-arcade-foot blockquote { font: italic 20px/1.45 Georgia,serif; color: #beaea4; text-align: right; margin: 0; }
.page-home .home-community { background: #e0d7ca; color: var(--ink); padding: 60px 0 100px; }
.page-home .home-community-layout { display: grid; grid-template-columns: 1.12fr .88fr; gap: 12%; }
.page-home .home-community-copy h2 { font-size: clamp(40px,3.6vw,54px); line-height: 1.07; margin-top: 22px; }
.page-home .home-community-copy > p:not(.eyebrow) { color: #62574f; max-width: 390px; font-size: 15px; line-height: 1.75; margin-bottom: 18px; }
.page-home .home-community-projects article { padding: 10px 0 22px; }
.page-home .home-community-projects article + article { padding-top: 24px; border-top: 1px solid #a5988d; }
.page-home .home-community-projects .status { font-size: 11px; color: #685b54; margin: 0 0 11px; }
.page-home .home-community-projects h3 { font-size: 28px; margin-bottom: 10px; }
.page-home .home-community-projects h3 a { display: flex; justify-content: space-between; gap: 25px; text-decoration: none; }
.page-home .home-community-projects h3 a span { font: 23px/1 Arial,sans-serif; }
.page-home .home-community-projects article > p:not(.status) { color: #62574f; line-height: 1.6; font-size: 14px; margin: 0; }
.page-home .home-community-projects .text-link { font-size: 12px; margin-top: 12px; }
.page-home .home-finale { background: var(--night); color: #e0c8ed; }
.page-home .home-finale-copy { padding-top: 70px; padding-bottom: 100px; position: relative; }
.page-home .home-finale h2 { max-width: 660px; }
.page-home .home-finale-copy > p:not(.eyebrow) { color: #bcb1ce; }
.page-home .home-finale .text-link { color: #e0c8ed; }
.page-home .home-cable-end { position: absolute; bottom: 20px; right: 10%; font: 28px/1 Georgia,serif; color: #cb967f; }
.page-home .home-night-window { margin: -20px 0 0; }
.page-home .home-night-window img { width: 100%; height: auto; }
.page-home .site-footer { background: var(--night); color: #c2b4d0; border-top: 1px solid #534659; padding-top: 28px; }
.page-home .site-footer .footer-line { display: none; }
.page-home .site-footer .footer-top { justify-content: flex-end; }
.page-home .site-footer .footer-bottom { border-color: #534659; color: #a99ab7; }
@media (max-width: 1050px) and (min-width: 761px) {
 .page-home .home-welcome h1 { font-size: 60px; }
 .page-home .home-typing-line { font-size: 26px; }
 .page-home .home-listening-body { gap: 4%; }
 .page-home .home-learning-foot { padding-left: 0; padding-right: 0; }
}
@media (max-width: 760px) {
 .page-home main::before { left: 9px; }
 .page-home .home-entry { display: flex; flex-direction: column; padding-top: 30px; padding-bottom: 60px; }
 .page-home .home-welcome-copy { align-self: stretch; padding-top: 0; }
 .page-home .home-welcome-copy .eyebrow { font-size: 11px; margin-bottom: 17px; }
 .page-home .home-welcome h1 { font-size: clamp(41px,10.7vw,66px); line-height: 1.02; letter-spacing: -.057em; margin-bottom: 19px; }
 .page-home .home-intro { font-size: 14px; line-height: 1.7; max-width: 460px; margin-bottom: 22px; }
 .page-home .home-actions .button { font-size: 13px; }
 .page-home .home-computer { width: min(100%,380px); align-self: center; margin: 25px 0 0; }
 .page-home .home-computer figcaption { font-size: 14px; margin: 0; }
 .page-home .home-welcome-foot { margin-top: 30px; width: 100%; font-size: 10px; gap: 20px; padding-top: 15px; }
 .page-home .home-welcome-foot > span { max-width: 170px; }
 .page-home .home-welcome-foot a { gap: 12px; }
 .page-home .home-room-line { gap: 15px; padding-top: 15px; align-items: start; }
 .page-home .home-room-line .eyebrow { font-size: 10px; }
 .page-home .home-aside-note { font-size: 14px; }
 .page-home h2 { font-size: clamp(43px,11.2vw,65px); }
 .page-home .home-learning { padding: 28px 0 85px; }
 .page-home .home-learning .home-room-line { display: block; }
 .page-home .home-learning .home-aside-note { display: block; margin-top: 8px; }
 .page-home .home-learning-body { display: flex; flex-direction: column; gap: 0; }
 .page-home .home-familiar { width: min(calc(100% + 26px),470px); margin: -4px -13px 0; align-self: center; }
 .page-home .home-learning-copy { padding: 0; max-width: 450px; width: 100%; align-self: start; }
 .page-home .home-learning-copy .home-learn-lead { font-size: 18px; }
 .page-home .home-learning-copy p { font-size: 14px; margin-bottom: 20px; }
 .page-home .home-learning-copy .status { font-size: 11px; }
 .page-home .home-learning-foot { display: block; margin: 30px 0 0; padding: 0; }
 .page-home .home-learning-foot blockquote { font-size: 23px; }
 .page-home .home-learning-foot > span { display: block; text-align: left; margin-top: 22px; font-size: 10px; }
 .page-home .home-listening { padding: 32px 0 85px; }
 .page-home .home-listening .home-room-line { align-items: center; }
 .page-home .home-listening .home-aside-note { max-width: 85px; font-size: 11px; text-align: right; }
 .page-home .home-listening-body { display: flex; flex-direction: column; gap: 24px; padding: 35px 0; align-items: stretch; }
 .page-home .home-listening-copy { display: contents; }
 .page-home .home-listening-copy > * { order: 3; }
 .page-home .home-listening h2.musicmaid-headline { font-size: clamp(48px,12.8vw,74px); order: 1; margin: 0; }
 .page-home .home-musicmaid { order: 2; width: min(100%,340px); align-self: center; margin: 0; }
 .page-home .home-musicmaid figcaption { font-size: 20px; margin-top: -9px; padding-right: 12px; }
 .page-home .home-listening-copy > p:not(.status) { font-size: 15px; margin: 0; }
 .page-home .home-listen-links { padding-top: 0; gap: 12px; }
 .page-home .home-music-notes { flex-direction: column; gap: 7px; font-size: 12px; }
 .page-home .home-arcade { padding: 32px 0 85px; }
 .page-home .home-arcade .home-aside-note { max-width: 110px; text-align: right; }
 .page-home .home-arcade-heading { display: block; padding: 34px 0 38px; }
 .page-home .home-arcade-heading h2 { margin-bottom: 24px; }
 .page-home .home-arcade-heading > p { font-size: 14px; }
 .page-home .home-velocity, .page-home .home-durak { display: flex; flex-direction: column; gap: 26px; align-items: stretch; }
 .page-home .home-typing-line { font-size: clamp(23px,6.5vw,34px); margin: 26px 0; }
 .page-home .home-game-copy h3 { font-size: 32px; }
 .page-home .home-game-copy > p:not(.status,.eyebrow) { font-size: 14px; }
 .page-home .home-durak { padding-top: 36px; }
 .page-home .home-cast { bottom: 40px; }
 .page-home .home-scene-caption { font-size: 10px; padding: 8px 11px; }
 .page-home .home-wheel-note { grid-template-columns: 74px 1fr; gap: 15px 19px; padding: 25px 0; margin-top: 36px; }
 .page-home .home-wheel-note .ink-art { width: 75px; }
 .page-home .home-wheel-note h3 { font-size: 27px; }
 .page-home .home-wheel-note p { font-size: 13px; }
 .page-home .home-wheel-note .status { font-size: 10px; }
 .page-home .home-wheel-note > a { grid-column: 2; justify-self: start; margin: 0; font-size: 12px; }
 .page-home .home-arcade-foot { display: block; }
 .page-home .home-arcade-foot blockquote { font-size: 18px; max-width: 290px; margin: 25px 0 0 auto; }
 .page-home .home-community { padding: 36px 0 85px; }
 .page-home .home-community-layout { display: block; }
 .page-home .home-community-copy h2 { font-size: clamp(38px,10vw,48px); }
 .page-home .home-community-copy > p:not(.eyebrow) { font-size: 14px; }
 .page-home .home-community-projects { margin-top: 25px; }
 .page-home .home-community-projects h3 { font-size: 26px; }
 .page-home .home-finale-copy { padding-top: 55px; padding-bottom: 100px; }
 .page-home .home-finale h2 { font-size: clamp(42px,11vw,64px); }
 .page-home .home-night-window img { min-height: 245px; object-fit: cover; object-position: 78% 50%; }
 .page-home .site-footer .footer-top { padding-bottom: 0; }
}
@media (max-width: 370px) {
 .page-home .home-welcome h1 { font-size: 38px; }
 .page-home .home-welcome-copy .eyebrow { font-size: 10px; }
 .page-home .home-actions .button { font-size: 12px; }
 .page-home .home-welcome-foot { font-size: 9px; }
 .page-home .home-game-copy h3 { font-size: 29px; }
 .page-home .home-wheel-note { grid-template-columns: 67px 1fr; gap: 14px; }
 .page-home .home-wheel-note .ink-art { width: 68px; }
 .page-home .home-community-copy h2 { font-size: 37px; }
 .page-home .home-learning-foot blockquote { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
 .page-home *, .page-home *::before, .page-home *::after { scroll-behavior: auto !important; transition-duration: 0s !important; }
}