:root{--paper: #f7f3ea;--ink: #1a407d;--sun: #f6ec5e;--deck: #1a407d;--deck-deep: #12305f;--fire: #ec1f51;--on-sun: #1a407d;--font-ui: "Hanken Grotesk", system-ui, sans-serif;--font-voice: "Fraunces", Georgia, serif;--font-quote: "Source Serif 4", Georgia, serif;--card-ratio: .5833}:root[data-theme=dark]{--paper: #0e1b3a;--ink: #f7f3ea;--deck: #234c92;--deck-deep: #17376e;--fire: #ff7a9a;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}html{cursor:url(/cursor-sparkle.svg) 16 16,auto}html[data-theme=dark]{cursor:url(/cursor-sparkle-dark.svg) 16 16,auto}html[data-theme=dark] .deck{cursor:url(/cursor-wand-dark.svg) 9 9,pointer}body{background-color:var(--paper);color:var(--ink);transition:background-color .5s ease,color .5s ease;font-family:var(--font-ui);overflow-x:hidden;-webkit-font-smoothing:antialiased}button,select{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}:focus-visible{outline:2px solid var(--ink);outline-offset:4px;border-radius:4px}.sr-only{position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.eyebrow{margin:0;font:500 13px/18px var(--font-ui);letter-spacing:.14em;text-transform:uppercase}.navlink{font:500 15px/20px var(--font-ui);text-underline-offset:5px}.navlink:hover,.navlink[aria-pressed=true],.navlink--back{text-decoration:underline}.pill{padding:12px 26px;border-radius:999px;background:var(--ink);color:var(--paper);font:500 16px/22px var(--font-ui);transition:transform .2s ease}.pill:hover{transform:translateY(-2px)}.textlink{font:500 16px/22px var(--font-ui);text-decoration:underline;text-underline-offset:6px}.aside{font:italic 400 18px/24px var(--font-voice)}.tab{display:inline-flex;align-items:center;gap:8px;padding:6px 15px 6px 11px;--tab-line: var(--ink);border:1.5px solid var(--tab-line);border-radius:12px;background:var(--paper);color:var(--ink);box-shadow:3px 3px 0 var(--tab-line);font:500 14px/20px var(--font-ui);transition:transform .15s ease,box-shadow .15s ease,background-color .15s ease}.tab:hover,.tab:focus-visible{background:#f6ec5e;color:#1a407d;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--tab-line)}.tab:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--tab-line)}@media(min-width:761px){.phone-only{display:none!important}}@media(max-width:760px){.wide-only{display:none!important}}.tab__icon{flex-shrink:0;height:18px;width:auto}.actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px}.app{min-height:100dvh;display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"modes word suits" "stage stage stage" "hand hand hand";column-gap:24px;padding:40px 44px;overflow:clip;animation:fade-in .7s ease both}.corner{display:flex;flex-direction:column;gap:6px;height:36px}.modes{grid-area:modes;align-items:flex-start}.suits{grid-area:suits;align-items:flex-end}.suits__list{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.suits__select{display:none}.masthead{grid-area:word;position:relative;z-index:2;text-align:center}.wordmark{margin:0;font:italic 600 32px/1.1 var(--font-voice);letter-spacing:-.02em}.app[data-big] .wordmark{font-size:clamp(38px,4.7vw,68px)}.tagline{margin-top:10px}.stage{grid-area:stage;position:relative;display:flex;align-items:center;justify-content:center;min-height:0;padding:20px 0}.handbtn{grid-area:hand;justify-self:start;align-self:end;display:flex;align-items:flex-end;gap:14px;text-align:left;font:italic 400 19px/24px var(--font-voice);animation:nudge .5s ease both}.handbtn:hover .handbtn__label{text-decoration:underline;text-underline-offset:5px}.handbtn__cards{display:flex;flex-shrink:0}.handbtn__card,.handbtn__slot{display:block;width:42px;height:72px;border-radius:5px}.handbtn__card{display:flex;align-items:center;justify-content:center;padding:4px;transform:rotate(var(--tilt, 0deg));box-shadow:0 3px 8px #12305f2e;transition:transform .2s ease}.handbtn__card+.handbtn__card{margin-left:-6px}.handbtn__card img{width:100%;height:100%;object-fit:contain}.handbtn:hover .handbtn__card{transform:rotate(var(--tilt, 0deg)) translateY(-4px)}.handbtn__slot{border:1.5px dashed color-mix(in srgb,var(--ink) 45%,transparent)}.credit{grid-area:hand;justify-self:end;align-self:end;font:500 13px/20px var(--font-ui);letter-spacing:.02em;color:inherit;text-decoration:none;opacity:.75;transition:opacity .2s ease}.credit:hover,.credit:focus-visible{opacity:1;text-decoration:underline;text-underline-offset:5px}.card{position:relative;flex-shrink:0;display:block;width:var(--card-w);aspect-ratio:7 / 12;font-size:calc(var(--card-w) / 26.25);border-radius:1em}.card-front{position:absolute;inset:0;display:flex;flex-direction:column;padding:1.9em 2em 2.25em 2.25em;border-radius:inherit;background:var(--card-bg);color:var(--card-ink);box-shadow:0 1.25em 2.75em #1a407d33;text-align:left}.card-front__title{margin:0;font:500 2.375em/1.1 var(--font-ui);letter-spacing:-.01em}.card-front__art{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:.5em 0 .5em 1em}.card-front__art svg,.card-front__art img{width:100%;height:100%}.card-front__art img{display:block;object-fit:contain}.card-front__quote{margin:0;align-self:flex-end;width:12em;font:400 1.25em/1.3 var(--font-quote)}.card-front__spine{position:absolute;left:.75em;bottom:1.9em;writing-mode:vertical-rl;text-orientation:sideways;transform:rotate(180deg);font:500 1.19em/1.2 var(--font-ui);letter-spacing:.02em;white-space:nowrap}.card-front__spine span{opacity:.4}.card-front--image .card-front__art{padding-bottom:2em}.card--mini .card-front{padding:1.5em 1.7em 1.7em;box-shadow:0 .9em 2em #1a407d29}.card--mini .card-front__spine{display:none}.card--mini .card-front__art{padding:.5em 0 1.5em}.card-back{position:absolute;inset:0;display:flex;padding:1.25em;border-radius:inherit;background:var(--deck)}.card-back svg{width:100%;height:100%}.flip{perspective:1600px}.flip__inner{position:absolute;inset:0;border-radius:inherit;transform-style:preserve-3d;-webkit-transform-style:preserve-3d}.flip__face{position:absolute;inset:0;border-radius:inherit;backface-visibility:hidden;-webkit-backface-visibility:hidden}.flip__face--front{transform:rotateY(180deg)}.deck{position:relative;z-index:1;display:block;cursor:url(/cursor-wand.svg) 9 9,pointer;transform:rotate(-4deg);transition:transform .3s ease}.deck:hover{transform:rotate(-2deg) translateY(-8px)}.deck__under{position:absolute;left:var(--x);top:var(--y);width:100%;height:100%;border:1.5px solid var(--paper);border-radius:calc(var(--card-w) / 26.25);background:var(--deck-deep);transform:rotate(var(--turn))}.deck__top{box-shadow:0 1em 2.2em #12305f38}.resting{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.doodles,.prompt,.resting .swash{animation:fade-in .6s ease both}.deck-wrap{--card-w: min(320px, calc((100dvh - 350px) * var(--card-ratio)));position:relative;animation:bob 6s ease-in-out infinite}.swash{position:absolute;left:50%;top:53%;width:190%;transform:translate(-50%,-50%);pointer-events:none}.prompt{position:absolute;right:calc(100% + 64px);top:34%;z-index:2;width:max-content;max-width:5.6em;margin:0;transform:rotate(-5deg);font:italic 500 clamp(34px,3.9vw,56px) / 1.04 var(--font-voice);letter-spacing:-.02em}.prompt__arrow{position:absolute;left:62%;top:calc(100% + 6px);width:3em;animation:wiggle 5s ease-in-out infinite}.doodles{position:absolute;inset:0;pointer-events:none}.doodle{position:absolute;animation:drift 6s ease-in-out infinite alternate}.doodle--moon{left:23%;top:2%;width:60px;--r: -18deg}.doodle--spark-a{left:28.5%;top:17%;width:54px;animation-duration:4.4s}.doodle--spark-b{left:67%;top:6%;width:36px;animation-duration:5.2s;--dy: 7px}.doodle--spark-c{left:8%;top:22%;width:34px;animation-duration:5.6s;--r: 12deg}.doodle--spark-d{left:90%;top:40%;width:28px;animation-duration:4.8s;--dy: 6px}.doodle--spark-e{left:62.5%;top:94%;width:44px;animation-duration:6.4s;--r: -14deg}.doodle--beads{left:75%;top:-2%;width:190px;animation-duration:7s;--dy: 5px}.doodle--star{left:81%;top:66%;width:70px;animation-duration:7.5s;--r: 6deg}.doodle--zigzag{left:69.5%;top:84%;width:124px;animation-duration:6.6s;--r: -8deg;--dx: 8px;--dy: 0px}.doodle--squiggle{left:29%;top:90%;width:146px;--dx: 10px;--dy: 0px}.doodle--eye{left:85.5%;top:93%;width:92px;animation-duration:8s;--r: 6deg}.doodle--jellyfish{left:71%;top:16%;width:144px;animation-duration:9s;--r: 5deg;--dy: -12px}.doodle--gate{left:12.5%;top:65%;width:124px;animation-duration:10s;--r: -8deg;--dy: -4px}.breathe{pointer-events:auto;display:block}.breathe svg{display:block;width:100%;transform-origin:50% 50%;animation:blink 5.5s ease-in-out infinite}.breathe__label{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) rotate(-4deg);font:italic 500 22px/1 var(--font-voice);white-space:nowrap;opacity:0;transition:opacity .25s ease}.breathe:hover .breathe__label,.breathe:focus-visible .breathe__label{opacity:1}.breathe:hover svg{animation-duration:1.4s}@media(hover:none){.breathe__label{opacity:1}}.lights{pointer-events:auto;display:block}.lights svg{display:block;width:100%;transform-origin:50% 50%;transition:color .5s ease;animation:rock 6.5s ease-in-out infinite}.lights:hover svg{animation-duration:1.6s}:root[data-theme=dark] .lights svg{color:var(--sun)}.lights__label{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) rotate(-4deg);font:italic 500 22px/1 var(--font-voice);white-space:nowrap;opacity:0;transition:opacity .25s ease}.lights:hover .lights__label,.lights:focus-visible .lights__label{opacity:1}@media(hover:none){.lights__label{opacity:1}}.reveal__card{position:relative}.reveal__card .card{z-index:1}.reveal__card .flip{cursor:url(/cursor-wand.svg) 9 9,pointer}html[data-theme=dark] .reveal__card .flip{cursor:url(/cursor-wand-dark.svg) 9 9,pointer}.reveal{display:flex;align-items:center;justify-content:center;gap:clamp(32px,3.5vw,56px);width:100%}.reveal__text{position:relative;z-index:1}.reveal__hint{position:absolute;right:0;top:calc(100% + 6px);z-index:1;display:flex;align-items:flex-end;gap:6px;margin:0;white-space:nowrap;font:italic 400 16px/20px var(--font-voice);color:color-mix(in srgb,var(--ink) 70%,transparent);animation:fade-in .6s ease 1.2s backwards}.reveal__hint-arrow{width:22px;flex-shrink:0;margin-bottom:8px}.reveal__hint--tap{display:none}@media(hover:none){.reveal__hint--click{display:none}.reveal__hint--tap{display:inline}}@media(max-width:999px){.reveal__hint{display:none}}html[data-theme=dark] .swash--pebble path{fill-opacity:.22}@media(min-width:1000px){.reveal .swash--pebble{left:-14%;top:-42.4%;width:216%;aspect-ratio:799 / 843;transform:none;transform-origin:0 0;rotate:30deg}}.reveal .card{--card-w: min(420px, calc((100dvh - 240px) * var(--card-ratio)))}.kept .card{--card-w: min(420px, calc((100dvh - 310px) * var(--card-ratio)))}.reveal__text{display:flex;flex-direction:column;align-items:flex-start;gap:48px;width:min(500px,36vw)}.reveal__quote{color:var(--ink)}[data-element=fire]>.reveal__quote,.slot__quote[data-element=fire]{color:var(--fire)}.reveal__quote{margin:0;font:400 clamp(25px,3vw,43px) / 1.16 var(--font-voice);letter-spacing:-.02em}@media(min-width:1000px){.reveal .card-front__quote{display:none}.reveal .card-front__art{padding-bottom:2em}}.reading{display:flex;flex-direction:column;align-items:center;gap:22px;width:100%}.reading .actions{margin-top:16px}.reading__prompt{margin:0;min-height:1.2em;font:italic 500 clamp(22px,2.2vw,30px) / 1.2 var(--font-voice)}.reading__slots{display:flex;align-items:flex-start;justify-content:center;gap:clamp(48px,14vw,210px)}.slot{--card-w: min(260px, 20vw, calc((100dvh - 536px) * var(--card-ratio)));display:flex;flex-direction:column;align-items:center;gap:16px;width:var(--card-w)}.slot__card{width:var(--card-w)}.slot__empty{width:var(--card-w);aspect-ratio:7 / 12;border:1.5px dashed color-mix(in srgb,var(--ink) 45%,transparent);border-radius:calc(var(--card-w) / 26.25)}.slot__quote{margin:6px 0 0;width:calc(var(--card-w) + 130px);min-height:5.3em;text-align:center;color:var(--ink);font:400 clamp(14px,1.15vw,16.5px) / 1.32 var(--font-voice)}.hand{display:flex;flex-direction:column;align-items:center;gap:30px;width:100%;animation:fade-in .5s ease both}.hand__title{margin:0;font:italic 600 clamp(44px,5vw,72px) / 1.05 var(--font-voice);letter-spacing:-.02em}.hand__sub{margin:-16px 0 10px;text-align:center;font:italic 400 clamp(18px,1.6vw,22px) / 1.3 var(--font-voice)}.hand__row{--card-w: min(190px, 13vw);display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(12px,2vw,30px)}.mini{transform:rotate(var(--tilt, 0deg));transition:transform .25s ease}.mini:hover{transform:rotate(0) translateY(-8px)}.hand__empty{display:flex;align-items:center;justify-content:center;color:color-mix(in srgb,var(--ink) 75%,transparent);font:italic 400 17px/22px var(--font-voice)}.kept{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:40px;width:100%;animation:fade-in .5s ease both}.kept__center{display:flex;flex-direction:column;align-items:center;gap:24px}.kept__center .actions{position:relative;z-index:2}.kept__nav{display:inline-flex;align-items:center;gap:14px;justify-self:center;font:italic 400 26px/32px var(--font-voice)}.kept__nav svg{width:38px;flex-shrink:0}.kept__nav:hover{text-decoration:underline;text-underline-offset:6px}.intro{position:relative;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}.intro__wordmark{position:absolute;top:40px;left:0;right:0;text-align:center;font:italic 600 clamp(22px,2.3vw,32px) / 1.1 var(--font-voice);letter-spacing:-.02em}.intro__sun{width:min(52vh,78vw);height:auto;overflow:visible}.intro__line{position:relative;width:100%;height:1.15em;margin-top:2vh;text-align:center;font:italic 600 clamp(34px,5vw,72px) / 1.05 var(--font-voice);letter-spacing:-.02em}.intro__line span{position:absolute;left:16px;right:16px;top:0}.intro__sub{margin-top:16px}.intro__skip{position:absolute;right:44px;bottom:40px;font-size:15px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes nudge{0%{transform:translateY(6px);opacity:.4}to{transform:none;opacity:1}}@keyframes rock{0%,84%,to{transform:rotate(0) scale(1)}88%{transform:rotate(-18deg) scale(1.1)}92%{transform:rotate(10deg) scale(1.04)}96%{transform:rotate(-5deg) scale(1)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes drift{0%{transform:translate(0) rotate(var(--r, 0deg))}to{transform:translate(var(--dx, 0px),var(--dy, -8px)) rotate(calc(var(--r, 0deg) + 6deg))}}@keyframes blink{0%,90%,to{transform:scaleY(1)}95%{transform:scaleY(.08)}}@keyframes wiggle{0%,84%,to{transform:rotate(0)}88%{transform:rotate(-7deg)}94%{transform:rotate(5deg)}}@media(prefers-reduced-motion:reduce){.deck-wrap,.doodle,.breathe svg,.lights svg,.doodles,.prompt,.swash,.prompt__arrow,.app,.hand,.kept,.handbtn{animation:none}}@media(max-width:999px){.reveal{flex-direction:column-reverse;gap:22px}.reveal .card,.kept .card{--card-w: min(336px, 86vw, calc((100dvh - 300px) * var(--card-ratio)))}.reveal__text{width:auto;align-items:center}.reveal__quote{display:none}}@media(max-width:760px){.app{grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto auto auto;grid-template-areas:"word" "suits" "stage" "modes" "hand" "credit";row-gap:14px;padding:26px 22px 24px}.suits,.modes{align-items:center;justify-self:center;height:auto}.app[data-revealed] .suits,.app[data-revealed] .modes,.app[data-revealed] .handbtn,.app[data-revealed] .credit{display:none}.app[data-revealed]{row-gap:4px}.app[data-view=hand],.app[data-view=kept]{grid-template-areas:"word" "modes" "stage" "hand" "credit";grid-template-rows:auto auto 1fr auto auto}.app[data-view=hand] .suits,.app[data-view=kept] .suits{display:none}.app{column-gap:0}.wordmark{font-size:24px}.app[data-big] .wordmark{font-size:34px}.tagline{font-size:11px;line-height:14px}.modes{flex-direction:row;gap:16px}.suits__list{display:none}.suits__select{display:block}.suits__select select{font:500 15px/20px var(--font-ui);text-decoration:underline;text-underline-offset:5px;text-align:center}.handbtn{justify-self:center;align-items:center;gap:10px;text-align:left;font-size:17px}.handbtn__card,.handbtn__slot{width:26px;height:45px;border-radius:4px}.handbtn__card{padding:2px}.credit{grid-area:credit;justify-self:center;margin-top:4px;font-size:12px}.resting{flex-direction:column}.deck-wrap{--card-w: min(230px, 60vw, calc((100dvh - 470px) * var(--card-ratio)));display:flex;flex-direction:column;align-items:center;gap:34px}.prompt{position:relative;right:auto;top:auto;max-width:none;transform:rotate(-4deg);font-size:34px}.prompt__arrow{left:.6em;right:auto;top:calc(100% + .05em);width:1.35em;transform:rotate(48deg);animation:none}.swash{top:62%;width:128%}.doodle--wide,.doodle--squiggle,.doodle--spark-a,.doodle--jellyfish,.doodle--gate{display:none}.doodle--moon{left:1%;top:-1%;width:26px}.doodle--eye{left:auto;right:1%;top:0;width:42px}.doodle--spark-c{left:93%;top:58%;width:14px}.doodle--star{left:2%;top:91%;width:28px}.lights__label{right:auto;left:calc(100% + 8px);top:50%;transform:translateY(-50%) rotate(-4deg);font-size:15px;opacity:1}.breathe__label{right:calc(100% + 8px);left:auto;top:50%;transform:translateY(-50%) rotate(-4deg);font-size:15px;opacity:1}.reveal .swash--suit,.kept .swash--suit{display:none}.reveal .card,.kept .card{--card-w: min(92vw, calc((100dvh - 245px) * var(--card-ratio)))}.reveal{gap:36px}.kept .card{--card-w: min(92vw, calc((100dvh - 330px) * var(--card-ratio)))}.reveal .card-front__title,.kept .card-front__title{font-size:2.6em}.reveal .card-front__quote,.kept .card-front__quote{width:auto;max-width:14em;margin-left:1.3em;font-size:1.55em;line-height:1.28}.reading__slots{flex-direction:column;align-items:center;gap:26px}.slot{--card-w: min(220px, 58vw)}.slot__quote{min-height:0;width:min(320px,84vw);font-size:18px}.hand__row{--card-w: min(150px, 40vw);display:grid;grid-template-columns:repeat(2,var(--card-w));justify-content:center;gap:16px}.kept{grid-template-columns:1fr 1fr;gap:18px}.kept__center{grid-column:1 / -1;grid-row:1}.kept__nav{font-size:20px}.kept__nav--prev{justify-self:start}.kept__nav--next{justify-self:end}.intro__skip{right:auto;left:50%;bottom:24px;transform:translate(-50%);white-space:nowrap}}
