/* Each category has one distinct layout. These also apply to saved reports. */
.layout-pentagon .position-1{grid-area:1/2}.layout-pentagon .position-2{grid-area:2/1}.layout-pentagon .position-3{grid-area:2/3}.layout-pentagon .position-4{grid-area:3/1}.layout-pentagon .position-5{grid-area:3/3}
.layout-fork .position-1{grid-area:3/2}.layout-fork .position-2{grid-area:2/1}.layout-fork .position-3{grid-area:1/1}.layout-fork .position-4{grid-area:2/3}.layout-fork .position-5{grid-area:1/3}
.layout-bridge .position-1{grid-area:3/1}.layout-bridge .position-2{grid-area:2/1}.layout-bridge .position-3{grid-area:1/2}.layout-bridge .position-4{grid-area:2/3}.layout-bridge .position-5{grid-area:3/3}
.layout-stairs .position-1{grid-area:3/1}.layout-stairs .position-2{grid-area:2/1}.layout-stairs .position-3{grid-area:2/2}.layout-stairs .position-4{grid-area:1/2}.layout-stairs .position-5{grid-area:1/3}
.layout-arrow{grid-template-columns:repeat(4,minmax(0,1fr))}.layout-arrow .position-1{grid-area:2/1}.layout-arrow .position-2{grid-area:1/3}.layout-arrow .position-3{grid-area:2/2}.layout-arrow .position-4{grid-area:3/3}.layout-arrow .position-5{grid-area:2/4}
.ritual-experience{padding:14px 14px 8px;position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 58%,#72448c20,transparent 65%)}
.ritual-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.ritual-head .tagline{font-size:10px;letter-spacing:2px;color:#b99dc9}.ritual-head h1{margin:5px 0 0;font-family:var(--serif);font-size:22px;color:#ffe1ae;line-height:1.4}.ritual-head h1 small{display:inline-block;font-family:var(--sans);font-size:12px;font-weight:400;color:#cbb1d6;white-space:nowrap;margin-left:4px}.ritual-topic{font-size:12px;color:#c8b5d0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:9px 0 4px}
.ritual-board{position:relative;padding:2px 0;background:radial-gradient(ellipse,#67427818,transparent 65%);transition:transform .5s ease}
.ritual-board .spread-layout{max-width:300px;margin:8px auto;gap:5px 9px;align-items:start}.ritual-board .position-card{width:56px;height:96px;max-width:100%;aspect-ratio:auto;margin:0 auto 4px;perspective:750px;border-color:#a885bb55;overflow:visible;font-size:20px;background:#ffffff03;transition:border-color .3s,box-shadow .3s}.ritual-board .spread-position{font-size:11px;line-height:1.4}.ritual-board .position-pick-name{font-size:11px;min-height:0;line-height:1.4;margin:2px 0 3px}.ritual-board .position-pick-name:empty{display:none}.ritual-board .has-card{border:0;background:none;box-shadow:0 4px 16px #0003}.slot-number{font-family:var(--serif);color:#9e7fb5}
.ritual-card{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .48s cubic-bezier(.3,.65,.25,1)}.ritual-card.is-revealed{transform:rotateY(180deg)}.ritual-card-back,.ritual-card-front{position:absolute;inset:0;border-radius:5px;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}.ritual-card-front{transform:rotateY(180deg);background:#f6ecd8;display:flex;align-items:center;justify-content:center}.ritual-card-front .card-art-frame{width:100%;height:100%;aspect-ratio:auto}
.tarot-back{box-sizing:border-box;display:block;width:100%;height:100%;position:relative;border:1px solid #dcba867d;border-radius:6px;overflow:hidden;background:radial-gradient(ellipse at 50% 38%,#65477e,#302047 67%,#21152f);box-shadow:inset 0 0 0 3px #302047,inset 0 0 0 4px #cba77855,0 3px 10px #0003}.tarot-back:before,.tarot-back:after{content:'✧';position:absolute;color:#d9b779;font-size:11px;line-height:1;left:7px;top:7px}.tarot-back:after{left:auto;top:auto;right:7px;bottom:7px}.back-orbit{position:absolute;inset:20% 18%;border:1px solid #dec19255;border-radius:50%;transform:rotate(-25deg)}.back-orbit:after{content:'';position:absolute;inset:-7% 19%;border:1px solid #c6a6d955;border-radius:50%;transform:rotate(55deg)}.back-moon{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);font-family:serif;font-size:clamp(22px,7vw,34px);color:#f7d7a5;text-shadow:0 0 12px #e8c28e55}.back-star{position:absolute;left:50%;top:68%;transform:translateX(-50%);color:#d4b0d6;font-size:11px}
.ritual-deck-area{position:relative;min-height:154px;transition:min-height .45s}.shuffle-scene{display:none;position:absolute;inset:0;align-items:center;justify-content:center;height:154px;perspective:850px}.shuffle-stack{position:absolute;left:calc(50% - 35px);top:15px;width:70px;height:120px;transform-style:preserve-3d;box-shadow:2px 2px 0 #b9987855,4px 4px 0 #2a1a3f,6px 6px 0 #b9987844}.shuffle-left{z-index:2;animation:interleave-left 1s cubic-bezier(.45,0,.25,1) 2}.shuffle-right{animation:interleave-right 1s cubic-bezier(.45,0,.25,1) 2}.shuffle-glow{position:absolute;width:140px;height:50px;top:105px;background:#b78ad32b;filter:blur(20px);border-radius:50%;z-index:-1}
.fan-panel{opacity:1;max-height:165px;transition:opacity .3s,max-height .45s;overflow:hidden}.fan-hint{display:flex;gap:8px;justify-content:space-between;color:#d6c2e1;font-size:11px;margin:4px 0 0;line-height:1.5}.fan-hint span{color:#ae94c0;white-space:nowrap}.fan-window{overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none;min-width:0;-webkit-overflow-scrolling:touch}.fan-window::-webkit-scrollbar{display:none}.fan-track{display:flex;align-items:start;position:relative;height:145px;width:max-content;padding:4px 20px 0;gap:0}.fan-card{position:relative;flex:none;width:var(--fan-step,32px);height:140px;margin:0;border:0;background:transparent;color:inherit;padding:0;cursor:pointer;outline-offset:-2px;-webkit-tap-highlight-color:transparent}.fan-card>.tarot-back{position:absolute;left:calc(50% - 34px);top:6px;width:68px;height:116px;transform:translateY(var(--fan-y,0px)) rotate(var(--fan-angle,0deg));transform-origin:50% 120%;transition:transform .18s,opacity .18s;pointer-events:none}.fan-card:focus-visible>.tarot-back{transform:translateY(calc(var(--fan-y,0px) - 12px)) rotate(var(--fan-angle,0deg));box-shadow:0 0 16px #edcda044}.fan-card.picked>.tarot-back{opacity:0}.fan-card.picked{cursor:default;pointer-events:none}.ritual-experience[data-phase="drawing"] .fan-panel{animation:spread-fan .5s ease both}
.ritual-experience[data-phase="shuffling"] .shuffle-scene{display:flex}.ritual-experience[data-phase="shuffling"] .fan-panel{visibility:hidden}.ritual-experience[data-phase="ready"] .fan-panel,.ritual-experience[data-phase="revealing"] .fan-panel,.ritual-experience[data-phase="revealed"] .fan-panel{opacity:0;max-height:0;pointer-events:none}.ritual-experience[data-phase="ready"] .ritual-deck-area,.ritual-experience[data-phase="revealing"] .ritual-deck-area,.ritual-experience[data-phase="revealed"] .ritual-deck-area{min-height:0}
.ritual-status{text-align:center;font-size:12px;line-height:1.6;color:#e5cba8;min-height:20px;margin:5px 0 8px}.ritual-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px}.ritual-controls .btn{min-height:44px}.ritual-controls [hidden]{display:none}.ritual-reshuffle{border:0;background:none;color:#bca2cd;min-height:44px;padding:5px 14px;font-size:12px;cursor:pointer}.ritual-reshuffle:disabled{opacity:.5}.ritual-flying-card{position:fixed;z-index:1000;pointer-events:none;transform-origin:top left;will-change:transform}.ritual-flying-card>.tarot-back{box-shadow:0 10px 24px #0005,0 0 18px #ebc99033}
@keyframes interleave-left{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-57px) rotate(-14deg)}55%{transform:translate(12px,-7px) rotate(5deg)}75%{transform:translate(-8px,0) rotate(-3deg)}}
@keyframes interleave-right{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(57px) rotate(14deg)}55%{transform:translate(-12px,7px) rotate(-5deg)}75%{transform:translate(8px,0) rotate(3deg)}}
@keyframes spread-fan{from{opacity:0;transform:translateY(15px) scaleX(.65)}to{opacity:1;transform:translateY(0) scaleX(1)}}
@media(max-width:350px){.ritual-experience{padding:12px 10px 6px}.ritual-head h1{font-size:20px}.ritual-head h1 small{font-size:11px}.ritual-board .position-card{width:48px;height:83px}.ritual-board .spread-layout{gap:4px 7px}.fan-hint{font-size:10px;gap:4px}}
@media(prefers-reduced-motion:reduce){.ritual-card,.fan-card>.tarot-back,.fan-panel,.ritual-deck-area{transition:none}.shuffle-stack,.ritual-experience[data-phase="drawing"] .fan-panel{animation:none}}

@media(hover:hover) and (pointer:fine){.fan-card:not(:disabled):hover>.tarot-back{transform:translateY(calc(var(--fan-y,0px) - 12px)) rotate(var(--fan-angle,0deg));box-shadow:0 0 16px #edcda044}}
