/* =====================================================================
   THE SPELL CARD — a slab. Two faces and a stack of edge layers on a 3D
   axis, spinning until held.
   ---------------------------------------------------------------------
   Lifted VERBATIM from the Spell Cards artifact (0eedfd11…), the page-level
   block that sits after the kit. Every bx-* class it leans on is already
   in blexx.css / blexx-atmosphere.css; only the card itself lives here.
   Do not edit, reformat or tidy — extend the artifact first.
   ===================================================================== */

[data-blexx-theme] .stage{position:relative;z-index:5;max-width:1200px;margin:0 auto;display:grid;gap:var(--bx-s-7);padding-block:var(--bx-s-4) var(--bx-s-8)}
[data-blexx-theme] .scene{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(320px,1fr) minmax(220px,.7fr);align-items:center;gap:var(--bx-s-6);perspective:1900px;min-height:calc(100vh - 140px)}
@media (max-width:1000px){[data-blexx-theme] .scene{grid-template-columns:1fr;min-height:0}}

/* Pago */
[data-blexx-theme] .being{position:relative;justify-self:center;width:min(440px,90vw);display:grid;justify-items:center;gap:var(--bx-s-3)}
[data-blexx-theme] .being img{width:100%;height:auto;display:block;position:relative;z-index:1;filter:drop-shadow(0 0 28px rgba(var(--bx-accent),.35))}
[data-blexx-theme] .being .bx-emote{position:absolute;top:8%;right:14%;z-index:2}
[data-blexx-theme] .being .bx-hotspot{position:absolute;top:2%;left:56%;z-index:2}
[data-blexx-theme] .being .tagrow{display:flex;align-items:center;gap:var(--bx-s-3);position:relative;z-index:1}

/* ---- THE CARD: a slab. Two faces + a stack of edge layers on a 3D axis. ---- */
[data-blexx-theme] .cardwrap{justify-self:center;width:min(400px,86vw);aspect-ratio:5/7.6;position:relative;--T:18px;--edge2:var(--bx-olive);--edge3:#5a5c00;--foil3:113,255,140}
[data-blexx-theme] .card{position:absolute;inset:0;transform-style:preserve-3d;animation:card-spin 18s linear infinite}
[data-blexx-theme] .cardwrap.is-held .card{animation-play-state:paused}
@keyframes card-spin{from{transform:rotateY(0) rotateX(4deg)}to{transform:rotateY(360deg) rotateX(4deg)}}
[data-blexx-theme] .card .edge{position:absolute;inset:0;border-radius:var(--bx-r-lg);background:linear-gradient(160deg,rgba(var(--bx-accent),.95),var(--edge2) 40%,var(--edge3) 70%,rgba(var(--bx-accent),.9));box-shadow:inset 0 0 0 1px rgba(0,0,0,.35)}
[data-blexx-theme] .card .face{position:absolute;inset:0;border-radius:var(--bx-r-lg);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:var(--bx-void-3);box-shadow:inset 0 0 0 1px rgba(var(--bx-accent),.55),inset 0 0 0 5px rgba(11,10,10,1),inset 0 0 0 6px rgba(var(--bx-accent),.35),var(--bx-veil-drop),var(--bx-glow-md)}
[data-blexx-theme] .card .front{transform:translateZ(calc(var(--T)/2))}
[data-blexx-theme] .card .back{transform:rotateY(180deg) translateZ(calc(var(--T)/2))}
[data-blexx-theme] .card .face .bx-world{position:absolute;inset:6px;border-radius:calc(var(--bx-r-lg) - 6px);z-index:0}
[data-blexx-theme] .card .face .foil{position:absolute;inset:6px;border-radius:calc(var(--bx-r-lg) - 6px);z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.55;background:conic-gradient(from 200deg at 50% 50%,transparent 0 30%,rgba(var(--bx-accent),.55) 36%,rgba(233,238,238,.35) 40%,transparent 46%,transparent 70%,rgba(var(--foil3),.25) 78%,transparent 84%);animation:foil 18s linear infinite}
@keyframes foil{from{transform:rotate(0)}to{transform:rotate(-360deg)}}
[data-blexx-theme] .card .face .scrim{position:absolute;inset:6px;border-radius:calc(var(--bx-r-lg) - 6px);z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(11,10,10,.55) 0%,rgba(11,10,10,.15) 30%,rgba(11,10,10,.25) 55%,rgba(11,10,10,.92) 100%)}
[data-blexx-theme] .card .face .inner{position:absolute;inset:6px;z-index:2;padding:22px 22px 20px;display:grid;grid-template-rows:auto auto 1fr auto auto;gap:var(--bx-s-3)}
[data-blexx-theme] .card .head{display:flex;justify-content:space-between;align-items:center}
[data-blexx-theme] .card .num{font-family:var(--bx-coded);font-weight:500;font-size:13px;letter-spacing:.3em;color:rgb(var(--bx-accent))}
[data-blexx-theme] .card .bx-word{justify-content:center;flex-wrap:nowrap;gap:6px}
[data-blexx-theme] .card .bx-word .bx-glyph{width:22px;filter:drop-shadow(0 0 8px rgba(var(--bx-accent),.85))}
[data-blexx-theme] .card .centre{display:grid;place-items:center;align-content:center;gap:var(--bx-s-2);position:relative;min-height:0}
[data-blexx-theme] .card .centre .bx-glyph{width:clamp(96px,26%,130px);animation-duration:7s}
[data-blexx-theme] .card .centre .ring{position:absolute;width:64%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(var(--bx-accent),.35);box-shadow:0 0 30px rgba(var(--bx-accent),.25),inset 0 0 30px rgba(var(--bx-accent),.12);animation:bx-char-idle 7s ease-in-out infinite}
[data-blexx-theme] .card .centre .ring::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px dashed rgba(var(--bx-accent),.25)}
[data-blexx-theme] .card .title{text-align:center;display:grid;gap:6px}
[data-blexx-theme] .card .title .bx-d3{font-size:clamp(19px,4.6vw,25px);line-height:1.08;color:var(--bx-ink);text-shadow:0 0 22px rgba(var(--bx-accent),.6),0 0 60px rgba(var(--bx-accent),.35)}
[data-blexx-theme] .card .for{font-family:var(--bx-body);font-size:13px;line-height:1.55;color:var(--bx-t-mid);text-align:center;max-width:30ch;margin:0 auto}
[data-blexx-theme] .card .foot{display:flex;justify-content:space-between;align-items:end;gap:var(--bx-s-3)}
[data-blexx-theme] .card .price{display:grid;gap:2px}
[data-blexx-theme] .card .price b{font-family:var(--bx-coded);font-weight:500;font-size:34px;letter-spacing:.08em;line-height:1;color:rgb(var(--bx-accent));text-shadow:var(--bx-glow-md)}
[data-blexx-theme] .card .buy{display:grid;justify-items:center;gap:6px}
[data-blexx-theme] .card .bx-sigil{width:72px;height:72px}
[data-blexx-theme] .card .bx-ritual-hint{font-size:10px;letter-spacing:.3em;white-space:nowrap}
[data-blexx-theme] .card .bx-blessing{font-size:clamp(12.5px,1.6vh,14.5px);line-height:1.75;align-self:start;text-align:left}
[data-blexx-theme] .card .state{display:none}
[data-blexx-theme] .card[data-state="sealed"] .s-sealed,[data-blexx-theme] .card[data-state="owned"] .s-owned{display:contents}
[data-blexx-theme] .card .back .inner{grid-template-rows:auto auto 1fr auto}
[data-blexx-theme] .card .back .rit{display:grid;place-items:center;align-content:center;gap:var(--bx-s-3);text-align:center;min-height:0}
[data-blexx-theme] .card .back .rit p{font-family:var(--bx-body);font-weight:500;font-size:14px;line-height:1.75;color:var(--bx-ink);max-width:30ch;text-shadow:0 2px 18px rgba(0,0,0,.9)}
[data-blexx-theme] .card .back .clock{font-family:var(--bx-coded);font-weight:500;font-size:44px;letter-spacing:.14em;color:rgb(var(--bx-accent));text-shadow:var(--bx-glow-lg);line-height:1}
[data-blexx-theme] .card .back .bx-sigil.is-locked{opacity:.28;pointer-events:none;filter:grayscale(1)}
[data-blexx-theme] .card .back .r{display:none}
[data-blexx-theme] .card .back[data-r="waiting"] .r-waiting,[data-blexx-theme] .card .back[data-r="delivered"] .r-delivered,[data-blexx-theme] .card .back[data-r="sealed"] .r-sealed{display:contents}
[data-blexx-theme] .card .back .bx-seal{font-size:22px}
[data-blexx-theme] .card .back .sealed-glyph .bx-glyph{width:110px}

/* ledger */
[data-blexx-theme] .ledger{display:grid;gap:var(--bx-s-3);align-content:start}
[data-blexx-theme] .ledger .bx-veil{padding:var(--bx-s-4)}
[data-blexx-theme] .ledger .ev{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-family:var(--bx-coded);font-size:11.5px;letter-spacing:.06em;line-height:1.7;color:var(--bx-t-mid);padding-block:8px;border-bottom:1px solid var(--bx-line)}
[data-blexx-theme] .ledger .ev:last-child{border-bottom:0}
[data-blexx-theme] .ledger .ev b{color:rgb(var(--bx-accent));font-weight:500;grid-column:1/-1}
[data-blexx-theme] .ledger .ev span{color:var(--bx-t-low)}
[data-blexx-theme] .ledger .ev em{font-style:normal;color:var(--bx-t-hi)}
[data-blexx-theme] .ctl{display:flex;flex-wrap:wrap;gap:var(--bx-s-3);align-items:center;justify-content:center}


/* -- house edge colours ---------------------------------------------
   The artifact set these from its HOUSES table with style.setProperty.
   Same values, as CSS, keyed off the accent the page already carries. */
[data-blexx-accent="chance"]        .cardwrap{--edge2:var(--bx-olive);   --edge3:#5a5c00;            --foil3:113,255,140}
[data-blexx-accent="devotion"]      .cardwrap{--edge2:var(--bx-burgundy);--edge3:#7a0020;            --foil3:255,146,149}
[data-blexx-accent="manifestation"] .cardwrap{--edge2:var(--bx-purple);  --edge3:var(--bx-softblue); --foil3:0,255,243}

/* a pass that has been given away: the slab goes grey and stops turning */
[data-blexx-theme] .cardwrap.is-voided .card{animation:none;transform:rotateY(0) rotateX(4deg);filter:grayscale(1) brightness(.55)}

/* -- transcription support ------------------------------------------
   The artifact set these four as inline style attributes. Components may
   not carry a style prop, so the same values live here. Values unchanged. */
[data-blexx-theme] .card .card-logo      { height: 14px; }
[data-blexx-theme] .card .card-logo-sm   { height: 12px; }
[data-blexx-theme] .card .card-title-left{ text-align: left; }
[data-blexx-theme] .card .card-wait      { max-width: 26ch; }