/* Keep the question, its destination and the card tray visible together. */
.spread-draw.spread-picking{padding:20px;background:radial-gradient(ellipse at 20% 40%,#55526a20,transparent 65%),#11101beF}
.spread-picking .conversation-draw-shell{max-width:1380px;height:calc(100dvh - 40px);min-height:580px;display:flex;flex-direction:column;padding:0;text-align:left}
.spread-picking .conversation-draw-top{flex:none;margin-bottom:18px;min-height:24px}
.spread-picking-layout{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(0,1.3fr);gap:28px;flex:1;min-height:0}
.spread-placement,.spread-choosing{min-width:0;min-height:0;display:flex;flex-direction:column;border:1px solid #ffffff1d;border-radius:22px;background:linear-gradient(135deg,#ffffff09,#ffffff03)}
.spread-placement{padding:22px 24px 14px}.spread-position-copy{min-height:123px;flex:none;text-align:left}
.spread-position-copy .micro-label{font-size:10px;letter-spacing:.14em;margin:0 0 10px;color:#baa58b}
.spread-picking .spread-position-copy h2{font-size:20px;line-height:1.5;margin:0 0 10px;color:#d7bb97;word-break:keep-all}
.spread-picking .spread-position-question{font:400 clamp(21px,2.2vw,30px)/1.45 var(--font-display,'MaruBuri',serif);color:#f4e9dc;margin:0;word-break:keep-all}
.spread-placement-map{container-type:size;flex:1;min-height:270px;display:grid;place-items:center;padding:10px 8px 25px}
.spread-placement-map .spread-map{width:min(95cqw,calc(86cqh * var(--map-ratio)));max-width:530px;margin:0;flex:none}
.spread-placement-map .spread-place small{font-size:10px;line-height:1.35;color:#ada8b9;margin-top:6px;min-width:70px;position:relative;left:50%;transform:translateX(-50%)}
.spread-placement-map .map-tree{width:min(82cqw,420px);height:86cqh;aspect-ratio:auto}
.spread-placement-map .map-tree .spread-place{width:clamp(30px,10cqh,48px)}
.spread-placement-map .map-tree .spread-place small{position:absolute;left:calc(100% + 7px);top:38%;transform:none;min-width:0;width:min(68px,16cqw);font-size:10px;text-align:left;margin:0;word-break:keep-all}
.spread-placement-map .spread-place:not(.is-filled):not(.is-active) .spread-place-card{background:#ffffff04;border-style:dashed;box-shadow:none}
.spread-placement-map .spread-place.is-filled .spread-place-card{border-color:#ae9666b0;box-shadow:0 4px 14px #0006}
.spread-placement-map .spread-place.is-active{z-index:4}.spread-placement-map .spread-place.is-active .spread-place-card{border:2px solid #f5d49b;background:radial-gradient(ellipse,#c7a56c24,#ffffff07);box-shadow:0 0 26px #dfb77d40;animation:spread-destination 2.6s ease-in-out infinite}
.spread-placement-map .spread-place.is-active small{color:#ffe2a9;font-weight:700}.spread-placement-map .spread-place.is-active .spread-place-card b{background:#eed3a1;color:#30241a;border-color:#ffe7b7}
.spread-placement-map .map-celtic .spread-place:nth-of-type(2) small{position:absolute;left:calc(100% + 4px);top:58%;transform:none;min-width:0;width:66px;font-size:9px}
.spread-placement-map .map-celtic .spread-place:nth-of-type(n+7) small{position:absolute;left:auto;right:calc(100% + 8px);top:35%;transform:none;min-width:0;width:70px;text-align:right;margin:0;word-break:keep-all}
.spread-map-key{display:flex;align-items:center;gap:16px;font-size:11px;color:#b4adbe;margin:12px 0 0;min-height:22px;flex:none}
.spread-map-key span{display:flex;align-items:center;gap:6px}.spread-map-key i{width:8px;height:8px;border-radius:50%;background:#efd4a1;box-shadow:0 0 9px #e5be7360}.spread-map-key span:nth-child(2) i{background:#8d7858;box-shadow:none}.spread-map-key strong{margin-left:auto;color:#e3cba6;font-weight:500;white-space:nowrap}
.spread-choosing{padding:22px 24px 16px;gap:18px}.spread-choosing-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;flex:none}.spread-choosing-heading .micro-label{font-size:10px;letter-spacing:.06em;margin:0 0 8px;color:#aba3b7}.spread-choosing-heading h3{font-size:17px;line-height:1.5;margin:0;color:#e6daca;font-weight:500}.spread-choosing-heading .shuffle-button{flex:none;display:flex;align-items:center;gap:6px;font-size:12px;white-space:nowrap;background:#ffffff05;padding:10px 14px!important}.spread-choosing-heading .ui-icon{width:16px;height:16px}
.spread-selection-tray{container-type:size;flex:1;min-height:290px;position:relative;display:flex;align-items:center;border-radius:14px;background:radial-gradient(ellipse,#8f765018,transparent 70%);overflow:hidden}
.spread-picking .spread-deck-viewport{width:100%;max-width:none;height:100%;display:flex;align-items:center;margin:0;border:0;background:transparent;border-radius:12px;scrollbar-width:thin;scrollbar-color:#b79a6670 transparent}
.spread-picking .spread-deck-viewport .conversation-deck{grid-template-rows:repeat(3,clamp(70px,calc((100cqh - 64px)/3),144px));grid-auto-columns:clamp(45px,calc((100cqh - 64px)/3 * .645),92px);gap:13px;align-content:center;padding:18px 16px;width:max-content;max-width:none;margin:0;display:grid;visibility:visible}
.spread-picking .spread-deck-viewport .conversation-deck button{width:100%;height:100%;aspect-ratio:auto;transition:box-shadow .2s,transform .2s,opacity .2s}
.spread-picking .conversation-deck button.is-chosen{opacity:.3;transform:none;box-shadow:none}.spread-picking .conversation-deck button.is-chosen span{font-size:22px}
.spread-picking .conversation-deck button:hover:not(:disabled){transform:translateY(-4px);border-color:#f0d29d;box-shadow:0 0 20px #d7af7b44}
.spread-picking.is-placing .conversation-deck{pointer-events:none}.spread-picking .spread-deck-viewport.is-dragging button{transform:none}
.spread-deck-controls{display:flex;align-items:center;gap:14px;flex:none}.spread-deck-controls p{flex:1;text-align:center;font-size:12px;line-height:1.7;margin:0;color:#d4c2aa}.spread-deck-controls p span{display:block;font-size:10px;color:#9e96ac;margin-top:3px}
.spread-deck-arrow{width:38px;height:38px;flex:none;background:#ffffff08;border:1px solid #ffffff25;border-radius:50%;color:#e1c69f;font-size:20px;cursor:pointer}.spread-deck-arrow:disabled{opacity:.3;cursor:default}.spread-deck-arrow:hover:not(:disabled){background:#ffffff15}
.spread-choosing .spread-shuffle-status{font-size:11px;line-height:1.5;min-height:17px;margin:0;color:#a99eb6;text-align:center}
.spread-picking.is-shuffling .spread-deck-viewport{display:flex;visibility:hidden}.spread-picking.is-shuffling .conversation-deck{display:grid}
.spread-picking .shuffle-stage{position:absolute;inset:0;max-width:none;width:100%;height:100%;margin:0;background:radial-gradient(ellipse,#c0a57214,transparent 60%)}
.spread-picking .shuffle-stage img{top:calc(50% - 80px)}
.spread-picking-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;flex:none;padding:18px 0 0}
.spread-picking-footer p{font-size:12px;margin:0;color:#c5b5a2}.spread-picking-footer small{display:block;font-size:11px;color:#938c9d;margin-top:6px}.spread-picking-footer .primary-action{min-width:220px;flex:none;padding:15px 24px}
.spread-position-cue{position:fixed;z-index:6;pointer-events:none;text-align:center;box-sizing:border-box;padding:26px 30px;border:1px solid #ead1a148;border-radius:20px;background:linear-gradient(130deg,#252330f5,#151520f5);box-shadow:0 24px 70px #0007,0 0 70px #e1b77413;transform-origin:center center}
.spread-position-cue small{display:block;color:#c8b18f;font-size:13px;line-height:1.6;margin-bottom:12px}.spread-position-cue strong{display:block;font:400 clamp(23px,3vw,36px)/1.5 var(--font-display,'MaruBuri',serif);color:#fff0d6;word-break:keep-all}
.spread-card-flight{position:fixed;z-index:5;pointer-events:none;border-radius:6px;border:1px solid #f5ce8a;box-shadow:0 0 25px #f0c58260;transform-origin:top left;object-fit:fill}
@keyframes spread-destination{0%,100%{box-shadow:0 0 16px #dfb77d30}50%{box-shadow:0 0 30px #dfb77d70}}
@media(max-width:860px){.spread-picking-layout{grid-template-columns:minmax(280px,.9fr) minmax(0,1.1fr);gap:16px}.spread-placement,.spread-choosing{padding:18px 16px 14px}.spread-choosing-heading{flex-wrap:wrap;gap:10px}.spread-choosing-heading h3{font-size:15px}.spread-picking .spread-position-copy h2{font-size:17px}.spread-picking .spread-position-question{font-size:22px}}
@media(max-width:680px){.spread-draw.spread-picking{padding:12px}.spread-picking .conversation-draw-shell{height:auto;min-height:calc(100dvh - 24px)}.spread-picking .conversation-draw-top{font-size:9px;margin-bottom:12px;gap:8px}.spread-picking-layout{display:flex;flex-direction:column;gap:14px;flex:none}.spread-placement{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:12px;padding:16px 14px 10px;min-height:230px}.spread-position-copy{grid-column:2;grid-row:1;align-self:center;min-height:0}.spread-position-copy .micro-label{font-size:8px;line-height:1.6;letter-spacing:.04em}.spread-picking .spread-position-copy h2{font-size:13px;margin-bottom:10px}.spread-picking .spread-position-question{font-size:18px;line-height:1.65}.spread-placement-map{grid-column:1;grid-row:1;min-height:210px;height:210px;padding:4px 4px 14px}.spread-placement-map .spread-place small{display:none}.spread-placement-map .spread-place-card b{font-size:9px;width:17px;height:17px;top:-6px}.spread-map-key{grid-column:1/-1;font-size:10px;gap:10px;margin-top:8px}.spread-choosing{gap:10px;padding:15px 12px 12px}.spread-choosing-heading{flex-wrap:nowrap;gap:8px}.spread-choosing-heading .micro-label{font-size:8px;line-height:1.6}.spread-choosing-heading h3{font-size:13px}.spread-choosing-heading .shuffle-button{font-size:11px;padding:9px 10px!important}.spread-selection-tray{min-height:228px;height:228px;flex:none}.spread-picking .spread-deck-viewport .conversation-deck{grid-template-rows:repeat(2,94px);grid-auto-columns:60px;gap:10px;padding:14px 8px}.spread-deck-controls{gap:8px}.spread-deck-controls p{font-size:11px}.spread-deck-controls p span{font-size:9px}.spread-deck-arrow{width:30px;height:30px;font-size:16px}.spread-choosing .spread-shuffle-status{font-size:10px}.spread-picking-footer{gap:12px;padding:14px 0 4px;flex-wrap:wrap}.spread-picking-footer p{font-size:11px}.spread-picking-footer small{font-size:10px}.spread-picking-footer .primary-action{width:100%;min-width:0;padding:14px 20px}.spread-position-cue{padding:20px}.spread-position-cue small{font-size:11px}.spread-position-cue strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.spread-picking *{animation:none!important;transition:none!important}.spread-position-cue,.spread-card-flight{display:none}}
@media(max-width:680px){.spread-placement-map .map-tree .spread-place{width:22px}}