/* An optional little card table: CSS materials, no fabricated card draw. */
.reading-atelier{margin:1rem 0 1.3rem;padding:1.1rem 1rem 1rem;border:1px solid #9f7d4f;background:radial-gradient(ellipse at 50% 25%,#ad713d29,transparent 68%),repeating-linear-gradient(2deg,#b3804510 0 1px,transparent 1px 7px),linear-gradient(125deg,#211712,#3e2a20 55%,#251812);box-shadow:inset 0 0 0 4px #170d0830,inset 0 1px #c49b5e44;color:#e7d5b7;overflow:hidden}
.reading-atelier[hidden],.reading-atelier__card[hidden]{display:none!important}
.reading-atelier__fan{position:relative;height:177px;width:100%;max-width:380px;margin:0 auto;isolation:isolate}
.reading-atelier__fan:after{content:'';position:absolute;bottom:5px;left:15%;right:15%;height:17px;background:#1308058c;border-radius:50%;filter:blur(8px);z-index:-1}
.reading-atelier__card{position:absolute;left:50%;bottom:24px;display:block;width:68px;height:112px;margin-left:-34px;padding:0;border:0;border-radius:4px;background:transparent;appearance:none;cursor:pointer;color:#d9bb82;perspective:700px;transform:translateX(var(--fan-x,0px)) translateY(var(--fan-y,0px)) rotate(var(--fan-angle,0deg));transform-origin:50% 120%;transition:transform .42s cubic-bezier(.22,.68,.25,1);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.reading-atelier__card:disabled{cursor:default;opacity:1}
.reading-atelier__card[aria-pressed="true"],.reading-atelier__card:focus-visible{z-index:20;transform:translateX(var(--fan-x,0px)) translateY(calc(var(--fan-y,0px) - 12px)) rotate(var(--fan-angle,0deg))}
.reading-atelier__card:focus-visible{outline:2px solid #e6c892;outline-offset:5px}
.reading-atelier__turn{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(0deg);transition:transform .68s cubic-bezier(.25,.7,.2,1)}
.reading-atelier__card[aria-pressed="true"] .reading-atelier__turn{transform:rotateY(180deg)}
.reading-atelier__side{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:9px 0;border:1px solid #bb9b64;border-radius:4px;backface-visibility:hidden;-webkit-backface-visibility:hidden;box-shadow:2px 5px 8px #10060880,1px 1px 0 #d2bd98;pointer-events:none;overflow:hidden}
.reading-atelier__back{background:repeating-linear-gradient(45deg,#aa744914 0 1px,transparent 1px 6px),radial-gradient(ellipse at 35% 25%,#8b3648,#701c2a 50%,#481420);transform:rotateY(0deg)}
.reading-atelier__side:before,.reading-atelier__side:after{content:'';position:absolute;inset:4px;border:1px solid #c6a36c9c;border-radius:1px;pointer-events:none}
.reading-atelier__side:after{inset:10px 8px;border-color:#b7935b59;border-radius:50%}
.reading-atelier__face{background:repeating-linear-gradient(100deg,#917c5110 0 1px,transparent 1px 5px),radial-gradient(ellipse at 35% 20%,#fff8e9,#e7d7ba);color:#701c2a;transform:rotateY(180deg)}
.reading-atelier__ornament{position:relative;z-index:1;font-size:.6rem;line-height:1}
.reading-atelier__moon{font-family:var(--display);font-size:2.15rem;line-height:1}
.reading-atelier__numeral{font-family:var(--display);font-size:2.1rem;line-height:1;color:#701c2a}
.reading-atelier__face-label{font-family:var(--body);font-size:.39rem;letter-spacing:.09em;text-transform:uppercase;color:#775c37}
.reading-atelier figcaption{text-align:center;max-width:390px;margin:0 auto;line-height:1.6}
.reading-atelier figcaption strong{display:block;font-family:var(--display);font-size:1.35rem;font-weight:400;color:#e4c590;margin-bottom:.3rem}
.reading-atelier figcaption>span,.reading-atelier noscript span{display:block;font-size:.68rem;color:#c6b59c}
.reading-atelier figcaption .reading-atelier__prompt{min-height:3.5em;padding:.45rem .1rem .65rem;margin-bottom:.5rem;border-bottom:1px solid #b3915a40;color:#f5e8d0;font-size:.75rem;line-height:1.55}
.reading-atelier__prompt[hidden]{display:none!important}
.reading-atelier[data-card-count="1"] .reading-atelier__fan{height:157px}
@media(hover:hover){.reading-atelier__card:not(:disabled):hover{z-index:21;transform:translateX(var(--fan-x,0px)) translateY(calc(var(--fan-y,0px) - 12px)) rotate(var(--fan-angle,0deg))}}
.reading-atelier__card[aria-pressed="true"]{z-index:30}
@media(max-width:420px){.reading-atelier{padding-inline:.65rem}.reading-atelier__card{width:60px;height:103px;margin-left:-30px}.reading-atelier__fan{height:166px}.reading-atelier figcaption>span{font-size:.68rem}.reading-atelier__numeral{font-size:1.85rem}}
@media(prefers-reduced-motion:reduce){.reading-atelier__card,.reading-atelier__turn{transition:none!important}}
@supports not (transform-style:preserve-3d){.reading-atelier__turn,.reading-atelier__face{transform:none!important}.reading-atelier__face{display:none}.reading-atelier__card[aria-pressed="true"] .reading-atelier__face{display:flex}.reading-atelier__card[aria-pressed="true"] .reading-atelier__back{display:none}}
