:root{
  --ink:#050a08; --velvet:#0b1511; --wood:#1c120c;
  --green:#0f2a20; --gold:#c9a227; --gold2:#e8d48b; --gold3:#f5e6b8; --gold-dim:#8a7020;
  --cream:#f3e8d0; --parch:#efe2c4; --parch2:#e6d5ad; --mute:#a8b5a8;
  --err:#e8a0a0; --ok:#8fd4a8;
  --font:"Noto Serif TC","Songti TC","Times New Roman",serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--ink);color:var(--cream);font-family:var(--font)}
body{position:relative;overflow-x:hidden;min-height:100vh}

/* ===== FULL-VIEWPORT TABLE ===== */
.room{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  /* velvet cloth + wood grain hybrid */
  background:
    radial-gradient(ellipse 90% 70% at 50% 35%, rgba(201,162,39,.11), transparent 55%),
    radial-gradient(ellipse 120% 90% at 50% 100%, rgba(0,0,0,.75), transparent 55%),
    repeating-linear-gradient(92deg, rgba(255,255,255,.018) 0 1px, transparent 1px 9px),
    repeating-linear-gradient(0deg, rgba(0,0,0,.06) 0 2px, transparent 2px 11px),
    repeating-linear-gradient(45deg, rgba(80,40,20,.04) 0 3px, transparent 3px 14px),
    linear-gradient(165deg, #0a1612 0%, #13241c 28%, #1a140e 62%, #0c100c 100%);
}
.room::before{
  content:"";position:absolute;inset:0;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.05 0 0 0 0 0.12 0 0 0 0 0.08 0 0 0 0.35 0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity:.55;mix-blend-mode:overlay;
}
.vignette{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 55% 45% at 50% 42%, transparent 0%, transparent 40%, rgba(0,0,0,.55) 100%),
    radial-gradient(ellipse at 18% 78%, rgba(255,160,40,.12), transparent 28%),
    radial-gradient(ellipse at 82% 72%, rgba(255,160,40,.1), transparent 26%);
}

/* props — larger, more real */
.prop{position:absolute;pointer-events:none}
.prop.candle{
  width:28px;height:110px;bottom:6%;
  border-radius:5px 5px 3px 3px;
  background:linear-gradient(180deg,#f7ecd0 0%,#e8d48b 18%,#c9a227 70%,#5a4010 100%);
  box-shadow:
    0 0 40px 14px rgba(255,170,50,.45),
    0 0 90px 30px rgba(255,140,40,.2),
    4px 8px 20px rgba(0,0,0,.5);
}
.prop.candle::before{
  content:"";position:absolute;top:-4px;left:50%;transform:translateX(-50%);
  width:3px;height:10px;background:#3a2a10;border-radius:1px;
}
.prop.candle::after{
  content:"";position:absolute;top:-28px;left:50%;transform:translateX(-50%);
  width:18px;height:28px;border-radius:50% 50% 45% 45%;
  background:radial-gradient(circle at 40% 30%,#fff8d0 0%,#ffb347 40%,#ff6a00 70%,transparent 75%);
  box-shadow:0 0 28px 10px rgba(255,170,60,.65),0 0 60px 20px rgba(255,120,30,.3);
  animation:flicker 2.6s ease-in-out infinite;
}
.prop.candle.left{left:2.5%;bottom:8%;transform:rotate(-3deg)}
.prop.candle.right{right:3%;bottom:14%;transform:scale(1.15) rotate(4deg)}
.prop.candle.mid{
  left:12%;bottom:4%;width:22px;height:85px;opacity:.9;transform:rotate(2deg) scale(.9);
}
.prop.crystal{
  width:72px;height:96px;right:4%;top:14%;
  background:
    linear-gradient(145deg, rgba(232,212,139,.35), rgba(143,212,168,.2) 40%, rgba(201,162,39,.15) 70%, transparent);
  clip-path:polygon(50% 0%, 88% 32%, 78% 100%, 22% 100%, 12% 32%);
  box-shadow:0 0 40px rgba(201,162,39,.35), 0 12px 24px rgba(0,0,0,.4);
  filter:saturate(1.1);
  opacity:.85;
}
.prop.crystal::after{
  content:"";position:absolute;inset:18% 30% 20% 30%;
  background:linear-gradient(180deg,rgba(255,255,255,.35),transparent);
  clip-path:polygon(50% 0%, 100% 100%, 0 100%);
}
.prop.flowers{width:clamp(92px,13vw,174px);height:auto;left:-1.7%;top:16%;transform:rotate(-12deg);
  opacity:.78;filter:drop-shadow(3px 6px 4px rgba(0,0,0,.65))}
.prop.flowers svg{display:block;width:100%;height:auto}
.prop.smoke{
  width:180px;height:220px;left:6%;bottom:16%;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(220,220,220,.14), transparent 55%),
    radial-gradient(ellipse at 40% 70%, rgba(200,200,200,.08), transparent 40%);
  animation:rise 9s ease-in-out infinite;opacity:.5;filter:blur(4px);
}
.prop.incense{
  width:8px;height:48px;left:9%;bottom:10%;
  background:linear-gradient(180deg,#5a4030,#2a1810);border-radius:2px;
  box-shadow:0 0 8px rgba(0,0,0,.4);
}
@keyframes flicker{
  0%,100%{opacity:.88;transform:translateX(-50%) scale(1) rotate(-2deg)}
  40%{opacity:1;transform:translateX(-50%) scale(1.1) rotate(2deg)}
  70%{opacity:.92;transform:translateX(-50%) scale(1.04) rotate(-1deg)}
}
@keyframes rise{
  0%,100%{transform:translateY(0) scaleX(1);opacity:.35}
  50%{transform:translateY(-28px) scaleX(1.15);opacity:.55}
}

.mast,.table-scene{position:relative;z-index:1}
.mast{text-align:center;padding:1.8rem 1rem .2rem}
.mast h1{
  margin:0;font-size:clamp(1.45rem,3.8vw,2rem);letter-spacing:.3em;font-weight:700;
  background:linear-gradient(180deg,var(--gold3),var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 24px rgba(201,162,39,.35));
}
.mast .sub{color:var(--mute);margin:.45rem 0 0;font-size:.92rem;letter-spacing:.1em}
.table-music{max-width:30rem;margin:0 auto;color:var(--gold2)}
.table-music button{font:inherit;color:inherit;background:transparent;border:0;cursor:pointer}
#musicToggle{min-height:44px;padding:.35rem .8rem;font-size:.85rem;letter-spacing:.08em}
#musicToggle span[aria-hidden]{padding-right:.25rem}
.table-music :is(button,a):focus-visible{outline:2px solid var(--gold2);outline-offset:2px}
#musicPlayer iframe{display:block;width:100%;aspect-ratio:16/9;min-height:200px;border:0;background:var(--ink)}
.music-caption{display:flex;align-items:center;justify-content:center;gap:0 .85rem;flex-wrap:wrap;font-size:.78rem}
.music-caption span{color:var(--mute)}
.music-caption :is(a,button){display:inline-flex;align-items:center;min-height:44px;color:var(--gold2);text-decoration:underline;text-underline-offset:.18em}

/* continuous table — NO bordered scene cards */
.table-scene{
  max-width:1100px;margin:0 auto;padding:0 1rem 4rem;
  display:flex;flex-direction:column;gap:1.8rem;
}
.scene-block{
  background:transparent;border:none;box-shadow:none;padding:.4rem .2rem 1rem;
  backdrop-filter:none;
}
.scene-title{
  margin:0 0 .3rem;font-size:1.05rem;color:var(--gold2);
  letter-spacing:.16em;text-align:center;font-weight:600;
  text-shadow:0 2px 12px rgba(0,0,0,.6);
}
.scene-sub{margin:0 0 1.1rem;color:var(--mute);font-size:.86rem;text-align:center}

/* parchment note on table */
.parchment.note{
  background:
    radial-gradient(ellipse at 15% 0%, rgba(255,255,255,.12), transparent 45%),
    linear-gradient(168deg, #f4e9cf 0%, var(--parch) 40%, var(--parch2) 100%);
  color:#2a1f10;border-radius:3px;padding:1.5rem 1.4rem 1.5rem;
  box-shadow:
    0 18px 40px rgba(0,0,0,.55),
    0 4px 0 rgba(90,64,16,.15),
    inset 0 0 60px rgba(139,105,20,.1);
  transform:rotate(-1.2deg);
  position:relative;max-width:560px;margin:0.6rem auto 0;
  border:1px solid rgba(90,64,16,.25);
}
.parchment.note::before,.parchment.note::after{
  content:"";position:absolute;width:16px;height:16px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#fff6c8,#c9a227 55%,#5a4010);
  box-shadow:0 3px 6px rgba(0,0,0,.4);
}
.parchment.note::before{top:12px;left:12px}
.parchment.note::after{top:12px;right:12px}
.parchment.note label{display:block;font-weight:700;letter-spacing:.12em;margin-bottom:.5rem;color:#3a2a12}
.parchment.note textarea{
  width:100%;min-height:100px;resize:vertical;padding:.8rem .9rem;border-radius:2px;
  border:1px dashed rgba(90,64,16,.35);background:rgba(255,255,255,.4);
  color:#2a1f10;font:inherit;line-height:1.6;
}
.parchment.note textarea:focus{outline:2px solid var(--gold);outline-offset:2px}
.parchment.note .cats{display:flex;flex-wrap:wrap;gap:.45rem;margin:.9rem 0 .5rem}
.parchment.note .cats button{
  background:transparent;border:1px solid rgba(90,64,16,.4);color:#3a2a12;
  border-radius:999px;padding:.35rem 1rem;cursor:pointer;font:inherit;font-size:.9rem;
}
.parchment.note .cats button.on{background:#3a2a12;color:var(--gold2);border-color:#3a2a12}
.parchment.note .hint-line{margin:.45rem 0 .95rem;font-size:.8rem;color:#5a4a30}
.parchment.note .primary{width:100%}

.parchment-soft,.letter{
  background:
    radial-gradient(ellipse at 20% 0%, rgba(255,255,255,.06), transparent 40%),
    linear-gradient(180deg, rgba(239,226,196,.16), rgba(230,213,173,.1));
  border:1px solid rgba(201,162,39,.28);
  border-radius:2px;padding:1.15rem 1.25rem;color:var(--cream);
  box-shadow:0 14px 36px rgba(0,0,0,.45);
  transform:rotate(.4deg);
  max-width:640px;margin-left:auto;margin-right:auto;
}
.letter{transform:rotate(-.6deg);background:linear-gradient(175deg,#f2e6c8,#e8d5a8);color:#2a1f10}
.letter h3{color:#3a2a12;margin-top:0;letter-spacing:.1em}
.notebook{
  background:
    repeating-linear-gradient(180deg, transparent 0 27px, rgba(201,162,39,.12) 27px 28px),
    linear-gradient(90deg, #3a2818 0 14px, #1a221c 14px 16px, rgba(20,30,24,.92) 16px);
  border:1px solid rgba(201,162,39,.3);border-radius:3px 10px 10px 3px;
  padding:1rem 1.1rem 1.1rem 1.6rem;max-width:560px;margin:1rem auto;
  box-shadow:0 12px 32px rgba(0,0,0,.5);color:var(--cream);
  transform:rotate(.8deg);
}
.notebook h3{color:var(--gold2);letter-spacing:.08em;margin:.2rem 0 .6rem;font-size:1rem}

button.primary,button.ghost{
  font:inherit;cursor:pointer;border-radius:999px;padding:.72rem 1.4rem;letter-spacing:.05em;
  transition:transform .15s,box-shadow .15s;
}
button.primary{
  background:linear-gradient(180deg,var(--gold2),var(--gold));color:#1a1205;border:0;font-weight:700;
  box-shadow:0 6px 22px rgba(201,162,39,.4);
}
button.primary:hover:not(:disabled){transform:translateY(-1px)}
button.primary:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
button.ghost{background:transparent;border:1px solid rgba(201,162,39,.45);color:var(--gold2)}
button.ghost:hover{background:rgba(201,162,39,.1)}
.row-actions{display:flex;flex-wrap:wrap;gap:.65rem;justify-content:center;margin-top:1.1rem}

.err{color:var(--err);min-height:1.2em;font-size:.9rem;text-align:center}
.disc{color:var(--mute);font-size:.8rem;line-height:1.55;text-align:center}
.small{font-size:.78rem;word-break:break-all;color:var(--mute)}
.reading-source{display:block;margin:.25rem 0 .8rem;font-size:.8rem;letter-spacing:.05em;font-weight:400}
.qshow{color:var(--gold2);font-size:1.05rem;text-align:center;margin:.2rem 0 1rem;
  text-shadow:0 2px 10px rgba(0,0,0,.5)}
.locked-banner{text-align:center;color:var(--gold);letter-spacing:.1em;margin:.4rem 0 .9rem;
  text-shadow:0 2px 8px rgba(0,0,0,.5)}

/* spreads as cloth markers / tiles on table */
.spread-grid{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.85rem;
  padding:.5rem 0 0;
}
.spread-opt{
  text-align:left;background:rgba(8,18,14,.72);
  border:1.5px solid rgba(201,162,39,.32);
  border-radius:4px;padding:1rem 1.05rem;cursor:pointer;color:var(--cream);font:inherit;
  width:min(240px,100%);
  box-shadow:0 10px 28px rgba(0,0,0,.4), inset 0 0 30px rgba(201,162,39,.04);
  transition:border-color .15s,transform .15s,box-shadow .15s;
  transform:rotate(-.6deg);
}
.spread-opt:nth-child(2n){transform:rotate(.7deg)}
.spread-opt:nth-child(3n){transform:rotate(-1deg)}
.spread-opt:hover{border-color:var(--gold);transform:translateY(-3px) rotate(0)}
.spread-opt.on{
  border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold),0 0 28px rgba(201,162,39,.3),0 12px 28px rgba(0,0,0,.45);
}
.spread-opt h3{margin:0 0 .25rem;font-size:1rem;color:var(--gold2)}
.spread-opt .cat-tag{font-size:.7rem;color:var(--gold-dim);letter-spacing:.1em;margin-bottom:.35rem}
.spread-opt .pos-list{margin:0;padding:0;list-style:none;font-size:.8rem;color:var(--mute);line-height:1.5}
.spread-opt .n{float:right;font-size:.75rem;color:var(--gold)}

/* decks scattered on cloth */
.deck-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem;padding:.5rem 0}
.deck-card{
  background:rgba(8,18,14,.65);border:1.5px solid rgba(201,162,39,.3);border-radius:6px;
  padding:1rem .9rem 1.1rem;cursor:pointer;color:inherit;font:inherit;text-align:center;
  width:min(200px,90vw);box-shadow:0 14px 32px rgba(0,0,0,.5);
  transition:border-color .15s,transform .15s;
  transform:rotate(-2deg);
}
.deck-card:nth-child(2){transform:rotate(1.5deg)}
.deck-card:nth-child(3){transform:rotate(-.5deg)}
.deck-card:hover:not(:disabled){border-color:var(--gold);transform:translateY(-4px) rotate(0)}
.deck-card[aria-pressed="true"]{
  border-color:var(--gold);
  box-shadow:0 0 0 1px var(--gold),0 0 32px rgba(201,162,39,.35),0 14px 32px rgba(0,0,0,.5);
}
.deck-card.soon{opacity:.5;cursor:not-allowed}
.deck-card h3{margin:.65rem 0 .2rem;font-size:1rem;color:var(--gold2)}
.deck-card p{margin:0;font-size:.8rem;color:var(--mute)}
.deck-card .badge{
  display:inline-block;margin-top:.35rem;padding:.15rem .55rem;border-radius:999px;
  border:1px solid rgba(201,162,39,.4);color:var(--gold);font-size:.72rem;letter-spacing:.06em;
}
.deck-preview{position:relative;height:150px;margin:0 auto;width:120px}
.deck-preview img{
  position:absolute;width:78px;height:130px;object-fit:cover;border-radius:8px;
  box-shadow:0 10px 20px rgba(0,0,0,.55);border:1px solid rgba(201,162,39,.4);background:#000;
}
.deck-preview .back{left:0;top:10px;transform:rotate(-10deg);z-index:1}
.deck-preview .m1{left:22px;top:0;transform:rotate(1deg);z-index:2}
.deck-preview .m2{left:44px;top:10px;transform:rotate(12deg);z-index:3}

/* embroidered position markers on cloth */
.pick-slots.table-slots,.spread-on-table{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-end;
  gap:0;min-height:170px;margin:0.4rem 0 1.2rem;position:relative;
}
.slot,.rcard{
  text-align:center;position:relative;
  margin:0 .35rem;
}
.slot .lab,.rcard .lab{
  font-size:.72rem;color:var(--gold2);margin-bottom:.4rem;letter-spacing:.08em;
  min-height:2.3em;text-shadow:0 2px 8px rgba(0,0,0,.7);
}
/* embroidered oval marker under empty slot */
.slot .ph{
  width:100px;height:160px;margin:0 auto;border-radius:10px;
  border:1.5px dashed rgba(201,162,39,.4);
  background:
    radial-gradient(ellipse at 50% 50%, rgba(201,162,39,.06), transparent 70%),
    rgba(0,0,0,.2);
  box-shadow:inset 0 0 20px rgba(201,162,39,.08), 0 8px 16px rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;color:var(--gold-dim);font-size:.7rem;
  letter-spacing:.12em;
}
.slot .ph::before{
  content:"";position:absolute;width:110px;height:170px;border-radius:50% 50% 45% 45%;
  border:1px solid rgba(201,162,39,.15);pointer-events:none;
  top:50%;left:50%;transform:translate(-50%,-46%);
}
.slot{position:relative}
.slot .ph.filled{border-style:solid;border-color:var(--gold);padding:0;overflow:hidden;background:#000}
.slot .ph.filled .card-face,.slot .ph.filled img,.slot .ph.filled svg{width:100%;height:100%;display:block;object-fit:cover}

/* arc / fan of cards on cloth */
.deck.on-table{
  display:grid;grid-template-columns:repeat(var(--cols,18),minmax(0,1fr));justify-items:center;
  row-gap:16px;perspective:1100px;padding:1.5rem 1.4rem 3rem;min-height:150px;
  overflow:visible;position:relative;z-index:2;pointer-events:auto;
}
.card-back{
  width:56px;height:90px;border-radius:7px;cursor:pointer;position:relative;
  border:1px solid rgba(201,162,39,.45);overflow:hidden;flex:0 0 auto;
  box-shadow:0 8px 18px rgba(0,0,0,.55), 0 2px 0 rgba(201,162,39,.15);
  transition:transform .22s,box-shadow .22s,filter .22s;
  background:#000;margin:0;
  pointer-events:auto;z-index:1;
  transform:rotate(var(--rot,0deg)) translateY(var(--lift,0px));
}
.card-back .card-face,.card-back img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.card-back:hover,.card-back:focus-visible{
  transform:rotate(var(--rot,0deg)) translateY(-18px) scale(1.08);z-index:5;
  box-shadow:0 0 0 2px var(--gold),0 16px 32px rgba(201,162,39,.45);
  outline:none;
}
.card-back.picked{opacity:.3;pointer-events:none;filter:grayscale(.35)}
.card-back.fly{position:fixed;z-index:50;transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .55s;pointer-events:none;margin:0}

.commit{font-size:.72rem;color:var(--mute);word-break:break-all;text-align:center;margin:.3rem 0 .7rem}
.commit code{color:var(--gold2)}

/* card face chrome (majors via img) */
.card-face{
  position:relative;width:100%;height:100%;background:#0b0a09;overflow:hidden;border-radius:inherit;
}
.card-face .art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.card-face .frame-overlay{
  position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  box-shadow:inset 0 0 0 2px rgba(200,169,106,.9), inset 0 0 0 5px rgba(11,10,9,.85), inset 0 0 0 6px rgba(228,207,156,.45);
}
.card-face .num{
  position:absolute;top:5px;left:50%;transform:translateX(-50%);
  font-size:9px;letter-spacing:.06em;color:var(--gold2);font-family:Georgia,serif;
  background:rgba(11,10,9,.88);border:1px solid rgba(200,169,106,.7);
  padding:1px 8px;border-radius:3px;z-index:2;
}
.card-face .name{
  position:absolute;bottom:6px;left:50%;transform:translateX(-50%);
  font-size:11px;font-weight:700;color:var(--cream);white-space:nowrap;
  background:rgba(11,10,9,.92);border:1px solid rgba(200,169,106,.7);
  padding:2px 10px;border-radius:3px;z-index:2;
}
.minor-face svg{display:block;width:100%;height:100%}

.chk{display:flex;gap:.55rem;align-items:flex-start;margin:.65rem auto;font-size:.86rem;line-height:1.5;color:var(--cream);max-width:560px}
.chk input{margin-top:.25rem;accent-color:var(--gold)}
/* result spread — arc on cloth */
.spread-on-table{perspective:1100px;padding:0.5rem 0 1rem}
.rcard{width:128px}
.rcard .flip{
  width:118px;height:188px;margin:0 auto;position:relative;transform-style:preserve-3d;
  transition:transform .9s cubic-bezier(.2,.7,.2,1);
  transform:rotate(var(--rot,0deg));
  box-shadow:0 14px 28px rgba(0,0,0,.55);
  border-radius:10px;
}
.rcard .flip.show{transform:rotate(var(--rot,0deg)) rotateY(180deg)}
.rcard .face{
  position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  border-radius:10px;overflow:hidden;
  border:1px solid rgba(201,162,39,.5);background:#000;
}
.rcard .face.front{transform:rotateY(180deg)}
.rcard .face .card-face,.rcard .face img,.rcard .face svg{width:100%;height:100%;object-fit:cover;display:block}
.rcard .face.front.rev > .card-face{transform:rotate(180deg)}
.rcard .meta{margin-top:.45rem;font-size:.8rem;color:var(--cream);text-shadow:0 2px 6px #000}
.rcard .meta .rev{color:var(--gold)}

.reading{line-height:1.75;white-space:pre-wrap;min-height:100px}
.reading .wait{text-align:center;color:var(--gold2);letter-spacing:.08em}
.fade-in{animation:fadeIn .6s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.share-box{margin:1.3rem auto;text-align:center;max-width:280px}
.share-box h3{color:var(--gold2);letter-spacing:.1em}
.share-preview-wrap{
  margin:1rem auto;max-width:200px;border-radius:10px;overflow:hidden;
  border:1px solid rgba(201,162,39,.4);box-shadow:0 14px 32px rgba(0,0,0,.5);
}
.share-preview-wrap img{width:100%;display:block;background:#000}

.verify.notebook .vresult{margin-top:.55rem;font-size:.88rem}
.vresult.ok{color:var(--ok)}.vresult.bad{color:var(--err)}
#fu textarea{
  width:100%;min-height:68px;margin:.5rem 0;padding:.65rem;border-radius:6px;
  border:1px solid rgba(201,162,39,.3);background:rgba(0,0,0,.35);color:var(--cream);font:inherit;
}
#fuLog .item{background:rgba(0,0,0,.28);border-radius:6px;padding:.7rem;margin:.45rem 0;font-size:.9rem;line-height:1.55;white-space:pre-wrap}
#fuLog .item b{color:var(--gold2)}

.deck.shuffling .card-back{animation:shuffleWiggle .4s ease-in-out infinite alternate}
.deck.fanning .card-back{animation:fanOpen .42s ease-out}
@keyframes fanOpen{
  from{transform:translateX(var(--fan-from)) rotate(0);opacity:.55}
  to{transform:rotate(var(--rot)) translateY(var(--lift));opacity:1}
}
#vDeck{max-height:14rem;overflow:auto;text-align:left}
#askCrisis a,#fuCrisis a{color:inherit;text-decoration:underline}
@keyframes shuffleWiggle{
  from{transform:rotate(var(--rot,0deg)) translateY(0)}
  to{transform:rotate(calc(var(--rot,0deg) + 4deg)) translateY(-10px)}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
  .card-back:hover,.card-back:focus-visible{transform:rotate(var(--rot,0deg))}
  .rcard .flip{transition:none}
  .rcard .flip.show{transform:rotate(var(--rot,0deg))}
  .rcard .flip.show .face.back{display:none}
  .rcard .flip.show .face.front{transform:none;position:absolute;inset:0}
}

@media (max-width:640px){
  .prop.candle.left{left:-2%;transform:scale(.75) rotate(-4deg)}
  .prop.candle.right{right:-2%;transform:scale(.85) rotate(5deg)}
  .prop.candle.mid{display:none}
  .prop.crystal{top:10%;right:-2%;transform:scale(.75)}
  .prop.flowers{left:-6%;top:12%;transform:scale(.7) rotate(-10deg)}
  .prop.smoke,.prop.incense{opacity:.35}
  .card-back{width:clamp(32px,10.5vw,48px);height:auto;aspect-ratio:56/90;margin:0}
  .pick-slots.table-slots{display:grid;grid-template-columns:repeat(var(--slots),minmax(0,1fr));gap:.2rem;align-items:end;min-height:0;margin-block:1rem 1.4rem}
  .slot{width:100%;margin:0}.slot .ph{width:min(100%,69px);height:auto;aspect-ratio:5/8;margin:auto}
  .slot .lab{display:grid;align-items:end;line-height:1.35;min-height:2.7em}
  #spread:has(.rcard:nth-child(4):last-child){display:grid;grid-template-columns:repeat(2,max-content);justify-content:center;gap:1rem}
  .deck.on-table{row-gap:12px;padding-bottom:2rem}
  .rcard{width:92px}.rcard .flip{width:84px;height:134px}
  .parchment.note{transform:rotate(-.4deg);margin:0 .2rem}
  .deck.on-table{padding-left:.5rem;padding-right:.5rem}
}

@media(max-width:640px){.prop.flowers{opacity:.32;left:-9%;top:11%}.prop.crystal{opacity:.35}}

[hidden]{display:none!important}
#fuLog .item,#fuLog .qa{white-space:pre-wrap}