@font-face{font-family:Geist;src:url('assets/fonts/Geist.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:GeistMono;src:url('assets/fonts/GeistMono.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--zw-paper:#f1eee7;--zw-ink:#232323;--zw-accent:#eaa04b;--zw-muted:#68665f;--zw-line:#d6d3cc;--zw-soft:#e7e4dd;--zw-mono:GeistMono,'SFMono-Regular',Consolas,monospace;--zw-sans:Geist,-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;--ease-out:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--zw-paper);color:var(--zw-ink);font:18px/1.7 var(--zw-sans);overflow-x:hidden}button,input{font:inherit}button,a{color:inherit;-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{text-decoration:none}.section-wrap{width:min(calc(100% - 128px),1440px);margin-inline:auto}.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.wordmark{font:700 16px/1 var(--zw-mono);letter-spacing:-.05em}.wordmark span{font-weight:400;color:var(--zw-accent);margin-left:4px}.language-toggle,.secondary-button{border:1px solid var(--zw-line);background:transparent;color:var(--zw-ink);padding:8px 12px;font:12px/1.5 var(--zw-mono);transition:background-color 160ms ease,color 160ms ease}.hero{min-height:calc(100svh - 80px);position:relative;display:flex;align-items:center;overflow:hidden}.hero canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.36}.hero-copy{position:relative;z-index:1;max-width:560px;padding-block:64px}.eyebrow{font:12px/1.5 var(--zw-mono);letter-spacing:.04em;margin:0 0 24px;color:var(--zw-muted)}h1,h2,p{margin:0}h1,h2{font-weight:500;letter-spacing:-.04em;line-height:1.08}h1{font-size:clamp(52px,8vw,112px);max-width:8ch}h2{font-size:clamp(36px,5vw,64px)}.hero-description{max-width:45ch;color:var(--zw-muted);margin:32px 0;line-height:1.75}.primary-button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:48px;padding:12px 16px 12px 20px;background:var(--zw-ink);color:var(--zw-paper);border:1px solid var(--zw-ink);font:14px/1.5 var(--zw-mono);transition:transform 160ms var(--ease-out),background-color 160ms ease}.primary-button span{color:var(--zw-accent);font-size:18px}.hero-index{position:absolute;right:0;bottom:48px;color:var(--zw-muted);font:12px/1.7 var(--zw-mono)}.reading{padding-block:128px 96px;border-top:1px solid var(--zw-line)}.section-heading{display:grid;grid-template-columns:1fr 1fr;gap:24px 64px;margin-bottom:64px}.section-heading .eyebrow{grid-column:1/-1;margin:0}.spread-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.spread-choice{min-height:168px;border:1px solid var(--zw-line);background:transparent;text-align:left;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;transition:background-color 160ms ease,border-color 160ms ease,transform 160ms var(--ease-out)}.spread-choice.is-selected{background:var(--zw-ink);border-color:var(--zw-ink);color:var(--zw-paper)}.choice-number{font:12px/1.5 var(--zw-mono);color:var(--zw-muted)}.is-selected .choice-number{color:var(--zw-accent)}.spread-choice strong{font-size:22px;font-weight:500;margin-top:auto;letter-spacing:-.02em}.spread-choice small{font-size:14px;color:var(--zw-muted)}.is-selected small{color:#c8c5be}.draw-form{margin-top:64px;border-top:1px solid var(--zw-line);padding-top:24px}.draw-form label{display:block;font:12px/1.5 var(--zw-mono);margin-bottom:12px}.draw-form label span{color:var(--zw-muted)}.draw-row{display:flex;gap:16px}.draw-row input{min-width:0;flex:1;border:0;border-bottom:1px solid var(--zw-ink);background:transparent;padding:8px 0;color:var(--zw-ink);outline:0}.draw-row input:focus{border-color:var(--zw-accent)}.results{padding-block:96px;border-top:1px solid var(--zw-line)}.results-header{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:48px}.question-readout{color:var(--zw-muted);font-style:italic;margin-top:16px;max-width:60ch}.spread-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}.spread-grid.celtic{grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(4,minmax(120px,auto));gap:8px}.card-slot{min-width:0;display:flex;flex-direction:column;gap:8px}.celtic .card-slot:nth-child(1){grid-column:3;grid-row:2}.celtic .card-slot:nth-child(2){grid-column:3;grid-row:2;transform:translate(12px,12px);z-index:1}.celtic .card-slot:nth-child(3){grid-column:2;grid-row:2}.celtic .card-slot:nth-child(4){grid-column:3;grid-row:3}.celtic .card-slot:nth-child(5){grid-column:3;grid-row:1}.celtic .card-slot:nth-child(6){grid-column:4;grid-row:2}.celtic .card-slot:nth-child(7){grid-column:6;grid-row:4}.celtic .card-slot:nth-child(8){grid-column:6;grid-row:3}.celtic .card-slot:nth-child(9){grid-column:6;grid-row:2}.celtic .card-slot:nth-child(10){grid-column:6;grid-row:1}.card-button{min-height:240px;background:var(--zw-paper);border:1px solid var(--zw-ink);padding:16px;display:flex;flex-direction:column;justify-content:space-between;text-align:left;transition:background-color 160ms ease,transform 160ms var(--ease-out)}.celtic .card-button{min-height:160px;padding:12px}.card-button[aria-expanded=true]{background:var(--zw-ink);color:var(--zw-paper)}.card-symbol{font:24px/1 var(--zw-mono);color:var(--zw-accent)}.card-title{font-size:20px;line-height:1.2;overflow-wrap:anywhere}.celtic .card-title{font-size:14px}.card-meta{font:11px/1.5 var(--zw-mono);color:var(--zw-muted)}.card-button[aria-expanded=true] .card-meta{color:#c8c5be}.card-position{font:11px/1.5 var(--zw-mono);color:var(--zw-muted);min-height:1.5em}.interpretation{margin-top:48px;padding:32px;background:var(--zw-ink);color:var(--zw-paper);max-width:760px;animation:reveal 220ms var(--ease-out)}.interpretation .eyebrow{color:var(--zw-accent)}.interpretation h3{font-size:32px;line-height:1.15;font-weight:500;margin:8px 0 16px}.interpretation p{color:#d4d1ca}.keyword-list{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0 24px}.keyword-list span{border:1px solid #68665f;padding:4px 8px;font:11px/1.5 var(--zw-mono)}.footer{border-top:1px solid var(--zw-line);padding-block:24px 48px;display:flex;justify-content:space-between;gap:24px;color:var(--zw-muted);font:12px/1.5 var(--zw-mono)}:focus-visible{outline:2px solid var(--zw-accent);outline-offset:4px}@keyframes reveal{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@media (hover:hover) and (pointer:fine){.primary-button:hover{transform:translateY(-2px)}.spread-choice:hover{transform:translateY(-2px);border-color:var(--zw-ink)}.card-button:hover{transform:translateY(-2px);background:var(--zw-soft)}.card-button[aria-expanded=true]:hover{background:var(--zw-ink)}.language-toggle:hover,.secondary-button:hover{background:var(--zw-ink);color:var(--zw-paper)}}.primary-button:active{transform:translateY(0);transition-duration:100ms}@media(max-width:720px){.section-wrap{width:calc(100% - 32px)}.topbar{height:64px}.hero{min-height:calc(100svh - 64px);align-items:flex-end}.hero-copy{padding-block:64px 96px}.hero-index{right:0;bottom:32px;font-size:10px}.reading,.results{padding-block:80px 64px}.section-heading{display:block;margin-bottom:40px}.section-heading h2{margin-top:16px}.spread-choices{grid-template-columns:1fr;gap:8px}.spread-choice{min-height:112px;padding:16px}.spread-choice strong{margin-top:8px;font-size:20px}.draw-form{margin-top:48px}.draw-row{display:grid;grid-template-columns:1fr}.draw-row .primary-button{width:100%}.results-header{align-items:flex-start;flex-direction:column;margin-bottom:32px}.spread-grid,.spread-grid.celtic{display:flex;flex-direction:column;gap:16px}.celtic .card-slot:nth-child(n){transform:none}.card-button,.celtic .card-button{min-height:180px}.interpretation{margin-top:32px;padding:24px}.interpretation h3{font-size:26px}.footer{flex-direction:column;gap:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.primary-button,.spread-choice,.card-button{transition:none;transform:none!important}.interpretation{animation:none}}

/* T-002 motion layer: the existing tokens and layout remain unchanged. */
.topbar-actions{display:flex;align-items:center;gap:8px}
.motion-control{border:1px solid var(--zw-line);background:var(--zw-paper);color:var(--zw-ink);padding:8px 12px;font:12px/1.5 var(--zw-mono);transition:background-color 160ms ease,color 160ms ease}
.motion-control{display:inline-flex;align-items:center;gap:8px}
.motion-icon{color:var(--zw-accent);font-size:14px;line-height:1}
.architecture-intro{height:200svh;position:relative}
.hero-stage{position:sticky;top:0;height:calc(100svh - 80px);min-height:560px;isolation:isolate;overflow:hidden}
.hero-stage .hero{height:100%;min-height:0}
.hero-stage .hero-copy{transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out)}
.hero-stage #glyphCanvas{clip-path:inset(0 0 0 50%);opacity:.58;transition:clip-path 220ms var(--ease-out),opacity 220ms ease}
.scroll-cue{position:absolute;left:0;bottom:48px;display:flex;align-items:center;gap:12px;color:var(--zw-muted);font:12px/1.5 var(--zw-mono);transition:opacity 220ms ease}
.scroll-arrow{width:24px;height:24px;border:1px dotted var(--zw-line);display:grid;place-items:center;color:var(--zw-accent)}
.ticker{contain:inline-size;overflow:hidden;border-top:1px solid var(--zw-line);border-bottom:1px solid var(--zw-line);height:32px;line-height:32px;font:12px/32px var(--zw-mono);white-space:nowrap}
.ticker-track{width:max-content;display:flex;animation:arcana-ticker 28s linear infinite}
.ticker-track span{display:block;padding-right:0}
@keyframes arcana-ticker{to{transform:translateX(-33.333333%)}}
.reveal-target{opacity:0;transform:translateY(8px);transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out)}
.reveal-target.is-revealed{opacity:1;transform:none}
.spread-choice.reveal-card{opacity:0;transform:translateY(8px)}
.is-revealed .spread-choice.reveal-card{opacity:1;transform:none;transition:opacity 220ms var(--ease-out),transform 220ms var(--ease-out)}
.is-revealed .spread-choice.reveal-card:nth-child(1){transition-delay:0ms}.is-revealed .spread-choice.reveal-card:nth-child(2){transition-delay:60ms}.is-revealed .spread-choice.reveal-card:nth-child(3){transition-delay:120ms}
.card-back-mark{font:500 20px/1 var(--zw-mono);letter-spacing:.12em;color:var(--zw-accent);border:1px solid var(--zw-accent);padding:12px 8px}
.card-back-rule{width:40%;border-top:1px solid #68665f}
.results.is-ready .interpretation{animation:reveal 220ms var(--ease-out)}
.motion-paused .ticker-track{animation-play-state:paused}
.motion-paused .hero-stage #glyphCanvas{transition:none}
.motion-paused .card-inner{transition:none}
@media(max-width:720px){
  .hero-stage{height:120svh;min-height:0;position:relative;overflow:visible}
  .architecture-intro{height:auto}
  .hero-stage .hero{height:auto;min-height:calc(120svh - 64px);align-items:flex-end}
  .hero-stage #glyphCanvas{clip-path:none;opacity:.5}
  .hero-stage .hero-copy{padding-block:64px 96px}
  .scroll-cue{left:0;bottom:32px}
  .motion-label{display:none}
  .motion-control{width:32px;height:32px;justify-content:center;padding:8px}
}
@media(prefers-reduced-motion:reduce){
  .architecture-intro{height:100svh}
  .hero-stage{position:relative}
  .hero-stage .hero-copy,.hero-stage #glyphCanvas,.scroll-cue,.reveal-target,.spread-choice.reveal-card{transition:none}
  .ticker-track{animation:none}
  .reveal-target,.spread-choice.reveal-card{opacity:1;transform:none}
}

/* T-004: real card flip and local card of the day. */
.daily-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:24px;padding:24px 0;border-top:1px solid var(--zw-line);border-bottom:1px solid var(--zw-line);margin-bottom:64px}.daily-card h3{font-size:28px;line-height:1.15;font-weight:500;letter-spacing:-.03em;max-width:14ch}.daily-date{margin-top:16px;color:var(--zw-muted);font:11px/1.5 var(--zw-mono)}.daily-card-content{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end}.daily-card-result h4,.anyway-result h4{font-size:28px;line-height:1.15;font-weight:500;margin:0}.daily-orientation{color:var(--zw-accent);font:11px/1.5 var(--zw-mono);margin-top:8px}.daily-card .keyword-list,.anyway-result .keyword-list{margin:16px 0}.daily-sentence{color:var(--zw-muted);max-width:52ch}.anyway-result{grid-column:2;padding-top:24px;border-top:1px solid var(--zw-line);margin-top:24px}.anyway-result[hidden]{display:none}
.card-flip{min-height:240px;width:100%;position:relative;perspective:900px;background:var(--zw-paper);border:1px solid var(--zw-ink);padding:0;display:block;text-align:left;overflow:hidden;color:var(--zw-ink)}.celtic .card-flip{min-height:160px}.card-inner{display:block;position:relative;width:100%;min-height:inherit;transform-style:preserve-3d;transition:transform 520ms cubic-bezier(.23,1,.32,1)}.card-face{position:absolute;inset:0;padding:16px;display:flex;flex-direction:column;justify-content:space-between;backface-visibility:hidden;-webkit-backface-visibility:hidden}.card-front{transform:rotateY(180deg);background:var(--zw-paper);color:var(--zw-ink)}.card-back{transform:rotateY(0);background:var(--zw-ink);color:var(--zw-paper);align-items:center;justify-content:center;gap:16px;text-align:center}.card-flip.is-revealed .card-inner{transform:rotateY(180deg)}.card-face>*{position:relative;z-index:1}.card-front .card-title{margin-top:auto}.card-front .card-meta{margin-top:8px}.results.is-drawing .card-flip{cursor:default;pointer-events:none}.motion-paused .card-inner{transition:none}
@media(max-width:720px){.daily-card{display:block;margin-bottom:48px}.daily-card-content{display:block}.daily-card-content .secondary-button{margin-top:24px}.anyway-result{margin-top:24px}.card-flip,.celtic .card-flip{min-height:180px}.card-face{padding:16px}}
@media(prefers-reduced-motion:reduce){.card-inner{transition:none}.card-button,.card-flip{transition:none;transform:none!important}.card-button:not(.is-revealed) .card-front,.card-flip:not(.is-revealed) .card-front{transform:rotateY(0)}.card-button:not(.is-revealed) .card-back,.card-flip:not(.is-revealed) .card-back{transform:rotateY(-180deg)}}
/* Illustrated Rider–Waite–Smith cards; images remain local. */
.card-flip{aspect-ratio:500/860;min-height:0}
.celtic .card-flip{min-height:0}
.card-inner{height:100%;min-height:0}
.card-front{padding:0;overflow:hidden}
.card-art{display:block;width:100%;height:100%;object-fit:contain;background:var(--zw-paper)}
.card-art.is-reversed{transform:rotate(180deg)}
.card-art-label{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.daily-card-image{display:block;float:left;width:96px;height:auto;margin:0 24px 16px 0}
.daily-card-image.is-reversed{transform:rotate(180deg)}
.daily-card-result::after,.anyway-result::after{content:"";display:block;clear:both}
@media(max-width:720px){.card-flip,.celtic .card-flip{min-height:0;max-width:320px}.daily-card-image{width:80px;margin-right:16px}}
@media(min-width:721px){.celtic .card-slot:nth-child(2){grid-column:4;grid-row:2;transform:none}.celtic .card-slot:nth-child(6){grid-column:5;grid-row:2}}
.reading-guide{max-width:40ch;align-self:end;color:var(--zw-muted)}
.question-note,.daily-explanation{margin-top:16px;max-width:60ch;color:var(--zw-muted);font-size:14px;line-height:1.6}
.daily-card.section-wrap{padding-block:48px;margin-bottom:64px}
@media(max-width:720px){.reading-guide{margin-top:16px}.daily-card.section-wrap{padding-block:32px}}
.pick-section{padding-block:64px;border-top:1px solid var(--zw-line)}
.pick-section[hidden]{display:none}
.pick-header{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.pick-header h2{font-size:32px}.pick-header .eyebrow{margin-bottom:16px}
.pick-instruction{margin-top:16px;max-width:60ch;color:var(--zw-muted)}
.pick-progress{margin:32px 0 16px;font:14px/1.6 var(--zw-mono);color:var(--zw-ink)}
.pick-deck{display:flex;gap:8px;overflow-x:auto;padding:8px 4px 24px;overscroll-behavior-inline:contain}
.pick-card{flex:0 0 80px;height:128px;border:1px solid var(--zw-ink);background:var(--zw-ink);color:var(--zw-paper);display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:16px 8px;font:12px/1.5 var(--zw-mono);transition:transform 160ms var(--ease-out),opacity 160ms ease}
.pick-card span:first-child{color:var(--zw-accent);font-size:11px}.pick-card.is-picked{opacity:.32;cursor:default}
@media(hover:hover) and (pointer:fine){.pick-card:not(.is-picked):hover{transform:translateY(-4px)}}
@media(max-width:720px){.pick-section{padding-block:48px}.pick-header{flex-direction:column}.pick-card{flex-basis:64px;height:112px;padding:12px 4px}.pick-card span:first-child{font-size:10px}}
@media(prefers-reduced-motion:reduce){.pick-card{transition:none}.pick-card:not(.is-picked):hover{transform:none}}
.topic-select{display:block;width:min(100%,320px);min-height:48px;margin:12px 0 24px;padding:8px 12px;border:1px solid var(--zw-line);background:var(--zw-paper);color:var(--zw-ink);font:16px/1.5 var(--zw-sans)}
.overall-reading{margin-top:48px;padding:32px;border-top:1px solid var(--zw-ink);background:var(--zw-soft);max-width:900px}
.overall-reading[hidden]{display:none}.overall-reading .eyebrow{margin-bottom:16px}.overall-reading h3{font-size:32px;line-height:1.2;font-weight:500}.overall-note{margin-top:16px;color:var(--zw-muted);font-size:14px}.overall-text{margin-top:24px;white-space:pre-line;line-height:1.75}.interpretation-position{margin-bottom:16px;font:14px/1.5 var(--zw-mono)}
@media(max-width:720px){.overall-reading{padding:24px}.overall-reading h3{font-size:26px}}