@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&family=Noto+Serif:wght@600;700;800&display=swap');

/* PrimeMC Tarot V3 — mystical circular fan deck */
.tarot-main {
    max-width: none !important;
    width: 100% !important;
    padding: 62px clamp(14px, 3vw, 42px) 92px !important;
    overflow: hidden;
}

.tarot-page {
    --tarot-bg: #070c18;
    --tarot-bg-2: #0b1324;
    --tarot-panel: rgba(7, 14, 29, .88);
    --tarot-panel-soft: rgba(12, 22, 42, .78);
    --tarot-ink: #fffaf0;
    --tarot-muted: #c7c5d1;
    --tarot-muted-2: #959bad;
    --tarot-gold: #f6d58a;
    --tarot-gold-2: #dba95a;
    --tarot-gold-3: #9b6d31;
    --tarot-line: rgba(246, 213, 138, .22);
    --tarot-violet: #9d8cff;
    --tarot-cyan: #74d9de;
    --tarot-green: #9ce6b0;
    position: relative;
    isolation: isolate;
    width: min(1560px, 100%);
    margin: 0 auto;
    color: var(--tarot-ink) !important;
    color-scheme: dark;
}

/* Base light fallback; the full parchment/moonstone light theme is defined in the V3 block below. */
:root[data-theme="light"] .tarot-page {
    --tarot-ink: #fffaf0;
    --tarot-muted: #c7c5d1;
    --tarot-muted-2: #959bad;
    --tarot-panel: rgba(7, 14, 29, .90);
    --tarot-panel-soft: rgba(12, 22, 42, .82);
    --tarot-line: rgba(246, 213, 138, .22);
}

.tarot-page::before {
    content: "";
    position: absolute;
    inset: -62px -7vw -50px;
    z-index: -3;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(2, 6, 16, .78), rgba(4, 9, 19, .93) 43%, rgba(4, 8, 17, .97)),
        radial-gradient(circle at 50% 5%, rgba(69, 76, 160, .28), transparent 35%),
        radial-gradient(circle at 12% 25%, rgba(114, 214, 218, .13), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(133, 84, 176, .18), transparent 30%);
    border-radius: 42px;
    box-shadow: 0 38px 120px rgba(0, 0, 0, .42);
}

.tarot-page::after {
    content: "";
    position: absolute;
    inset: -40px -4vw auto;
    height: 550px;
    z-index: -2;
    pointer-events: none;
    opacity: .7;
    background:
        radial-gradient(circle at 17% 45%, rgba(246,213,138,.16) 0 1px, transparent 1.8px),
        radial-gradient(circle at 69% 18%, rgba(255,255,255,.17) 0 1px, transparent 1.7px),
        radial-gradient(circle at 82% 54%, rgba(116,217,222,.15) 0 1px, transparent 1.8px);
    background-size: 84px 84px, 116px 116px, 138px 138px;
}

.tarot-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
    filter: blur(8px);
    opacity: .48;
}
.tarot-orb-one {
    width: 270px;
    height: 270px;
    top: 250px;
    left: -150px;
    background: radial-gradient(circle, rgba(115, 96, 220, .30), transparent 70%);
}
.tarot-orb-two {
    width: 330px;
    height: 330px;
    top: 670px;
    right: -190px;
    background: radial-gradient(circle, rgba(220, 169, 79, .18), transparent 72%);
}

.tarot-hero {
    position: relative;
    max-width: 1120px;
    margin: 0 auto 34px;
    padding: clamp(30px, 5vw, 58px) clamp(18px, 5vw, 64px) 30px;
    text-align: center;
    border: 1px solid rgba(246, 213, 138, .12);
    border-radius: 34px;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 0%, rgba(109, 101, 207, .20), transparent 46%),
        linear-gradient(145deg, rgba(7, 13, 28, .86), rgba(8, 16, 32, .94));
    box-shadow: 0 26px 72px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.035);
}

.tarot-hero::before {
    content: "☾        ✦        ☽";
    position: absolute;
    top: 18px;
    left: 0;
    width: 100%;
    color: rgba(246, 213, 138, .07);
    font-size: clamp(2.8rem, 8vw, 6rem);
    letter-spacing: .18em;
    white-space: nowrap;
    pointer-events: none;
}

.tarot-eyebrow,
.tarot-step,
.tarot-answer-label {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--tarot-gold) !important;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .18em;
    text-transform: uppercase;
    text-shadow: 0 0 16px rgba(246,213,138,.16);
}

.tarot-hero h1 {
    position: relative;
    z-index: 2;
    margin: 12px auto 14px;
    max-width: 900px;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(2.65rem, 6vw, 5.55rem);
    line-height: .98;
    letter-spacing: -.045em;
    color: #fffaf0 !important;
    text-shadow: 0 4px 32px rgba(0,0,0,.72), 0 0 1px #fff;
    text-wrap: balance;
}

.tarot-lead {
    position: relative;
    z-index: 2;
    max-width: 820px;
    margin: 0 auto;
    color: #d9d7df !important;
    font-size: clamp(1rem, 1.7vw, 1.14rem);
    line-height: 1.7;
    text-shadow: 0 2px 12px rgba(0,0,0,.65);
}
.tarot-lead strong { color: #fff5dc !important; }

.tarot-question-card,
.tarot-deck-frame,
.tarot-answer-panel,
.tarot-meaning-card,
.tarot-reflection,
.tarot-active-question {
    border: 1px solid var(--tarot-line) !important;
    background: linear-gradient(145deg, rgba(11, 20, 40, .94), rgba(5, 11, 24, .91)) !important;
    box-shadow: 0 22px 65px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.035) !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.tarot-question-card {
    position: relative;
    z-index: 2;
    text-align: left;
    margin: 30px auto 12px;
    border-radius: 22px;
    padding: 13px;
}

.tarot-question-card label {
    display: block;
    margin: 0 0 8px 3px;
    color: #f8e9be !important;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.tarot-question-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: stretch;
}

.tarot-question-row textarea {
    width: 100%;
    min-height: 74px;
    max-height: 150px;
    resize: vertical;
    border: 1px solid rgba(180, 180, 230, .24) !important;
    border-radius: 16px !important;
    background: rgba(3, 8, 21, .76) !important;
    color: #fff !important;
    padding: 14px 16px !important;
    font: inherit;
    line-height: 1.55;
    outline: none;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.012);
    transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.tarot-question-row textarea::placeholder { color: #8d92a7 !important; }
.tarot-question-row textarea:focus {
    border-color: rgba(246,213,138,.60) !important;
    background: rgba(2, 7, 19, .91) !important;
    box-shadow: 0 0 0 4px rgba(246,213,138,.075), 0 0 28px rgba(132, 110, 236, .09) !important;
}

.tarot-primary,
.tarot-secondary {
    border-radius: 15px !important;
    padding: 13px 20px !important;
    font: inherit;
    font-weight: 900 !important;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, border-color .18s ease;
}
.tarot-primary {
    border: 1px solid rgba(255,242,199,.48) !important;
    color: #21180d !important;
    background: linear-gradient(135deg, #ffe6a3, #e8bd67 55%, #c98d43) !important;
    box-shadow: 0 10px 30px rgba(216, 158, 65, .22), inset 0 1px 0 rgba(255,255,255,.58) !important;
    min-width: 154px;
}
.tarot-secondary {
    color: #f4ead7 !important;
    background: rgba(255,255,255,.035) !important;
    border: 1px solid rgba(246,213,138,.22) !important;
}
.tarot-primary:hover,
.tarot-secondary:hover { transform: translateY(-2px); }
.tarot-primary:hover { filter: brightness(1.06); box-shadow: 0 14px 38px rgba(216, 158, 65, .29) !important; }
.tarot-primary:active,
.tarot-secondary:active { transform: translateY(0) scale(.985); }
.button-stars { margin-right: 5px; }

.tarot-form-meta {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    margin-top: 9px;
    color: #9da1b0 !important;
    font-size: .79rem;
}
.tarot-error {
    color: #ffd5d5 !important;
    background: rgba(127,29,29,.22) !important;
    border: 1px solid rgba(248,113,113,.24) !important;
    border-radius: 12px;
    padding: 9px 11px;
    margin-top: 10px;
}
.tarot-disclaimer {
    position: relative;
    z-index: 2;
    color: #989dac !important;
    font-size: .78rem;
    line-height: 1.55;
    max-width: 800px;
    margin: 0 auto;
}

.tarot-chooser,
.tarot-result { animation: tarotFadeUp .45s ease both; }
@keyframes tarotFadeUp {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: translateY(0); }
}

.tarot-section-heading,
.tarot-result-head {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: end;
    margin: 0 0 16px;
}
.tarot-section-heading h2,
.tarot-result-head h2 {
    color: #fff9ea !important;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.65rem, 3vw, 2.65rem);
    margin: 5px 0 5px;
    text-shadow: 0 3px 20px rgba(0,0,0,.48);
}
.tarot-section-heading p { color: #c6c4ce !important; margin: 0; }

.tarot-counter,
.tarot-result-mark {
    flex: 0 0 auto;
    border: 1px solid rgba(246,213,138,.28) !important;
    background: rgba(246,213,138,.075) !important;
    color: var(--tarot-gold) !important;
    border-radius: 999px;
    padding: 9px 14px;
    font-weight: 900;
    white-space: nowrap;
    box-shadow: inset 0 1px rgba(255,255,255,.03);
}

.tarot-active-question {
    border-radius: 16px;
    padding: 12px 15px;
    margin: 0 0 14px;
    display: flex;
    gap: 14px;
    align-items: baseline;
}
.tarot-active-question span {
    color: #9ba0ae !important;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
    white-space: nowrap;
}
.tarot-active-question strong { color: #fff7e5 !important; font-weight: 700; }

/* ===== V3 circular fan Tarot deck ===== */
.tarot-deck-frame {
    position: relative;
    border-radius: 34px;
    padding: 18px 0 20px;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(ellipse at 50% 92%, rgba(225,176,83,.16), transparent 38%),
        radial-gradient(circle at 50% 36%, rgba(119,93,205,.12), transparent 44%),
        linear-gradient(145deg, rgba(8,17,36,.98), rgba(4,10,24,.985)) !important;
    border-color: rgba(246,213,138,.26) !important;
    box-shadow:
        0 30px 78px rgba(0,0,0,.42),
        inset 0 1px 0 rgba(255,255,255,.04),
        inset 0 -70px 100px rgba(0,0,0,.18) !important;
}
.tarot-deck-frame::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(4,10,23,.98), transparent 9%, transparent 91%, rgba(4,10,23,.98)),
        repeating-radial-gradient(circle at 50% 118%, transparent 0 55px, rgba(246,213,138,.025) 56px 57px, transparent 58px 105px);
}
.tarot-deck-frame::after {
    content: "✦   ☾   ✧   ☽   ✦";
    position: absolute;
    left: 50%;
    bottom: 12px;
    z-index: 2;
    transform: translateX(-50%);
    color: rgba(246,213,138,.28) !important;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: .82rem;
    letter-spacing: .55em;
    white-space: nowrap;
    pointer-events: none;
}

.tarot-deck-topline {
    position: relative;
    z-index: 300;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 0 22px 4px;
    color: #c9c7d1 !important;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .055em;
}
.tarot-deck-topline span:first-child {
    color: var(--tarot-gold) !important;
    letter-spacing: .12em;
    text-shadow: 0 0 16px rgba(246,213,138,.2);
}
#tarot-pick-hint {
    color: #ddd9e4 !important;
    text-align: right;
}

.tarot-deck-spread {
    position: relative;
    z-index: 3;
    width: 100%;
    height: clamp(390px, 34vw, 500px);
    min-height: 390px;
    overflow: hidden;
    touch-action: pan-y;
    perspective: 1500px;
    --fan-card-w: clamp(88px, 7.2vw, 116px);
    --fan-card-h: clamp(127px, 10.4vw, 168px);
}

/* The mystical circle under the fan. */
.tarot-deck-spread::before {
    content: "";
    position: absolute;
    width: min(950px, 80vw);
    aspect-ratio: 1;
    left: 50%;
    top: 68%;
    transform: translate(-50%, -10%);
    border-radius: 50%;
    border: 1px solid rgba(246,213,138,.13);
    box-shadow:
        0 0 0 18px rgba(246,213,138,.018),
        0 0 0 64px rgba(118,93,196,.018),
        0 0 90px rgba(224,170,74,.08),
        inset 0 0 70px rgba(111,88,201,.04);
    background:
        repeating-conic-gradient(from -10deg, rgba(246,213,138,.075) 0 .7deg, transparent .7deg 15deg),
        radial-gradient(circle, transparent 0 42%, rgba(246,213,138,.035) 42.2% 42.6%, transparent 42.8% 53%, rgba(150,123,218,.035) 53.2% 53.5%, transparent 53.8%);
    pointer-events: none;
}
.tarot-deck-spread::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 7px;
    width: min(830px, 74%);
    height: 80px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse at center, rgba(246,192,92,.15), rgba(103,86,191,.06) 44%, transparent 72%);
    filter: blur(12px);
    pointer-events: none;
}

.tarot-fan-core {
    position: absolute;
    z-index: 4;
    left: 50%;
    bottom: 6px;
    width: 104px;
    height: 104px;
    transform: translateX(-50%);
    display: grid;
    place-items: center;
    align-content: center;
    border-radius: 50%;
    color: #f8d78c !important;
    border: 1px solid rgba(246,213,138,.25);
    background:
        radial-gradient(circle at 50% 45%, rgba(90,69,163,.34), transparent 50%),
        linear-gradient(145deg, rgba(10,20,42,.94), rgba(4,10,23,.98));
    box-shadow: 0 0 0 8px rgba(246,213,138,.025), 0 0 34px rgba(218,164,64,.12), inset 0 0 24px rgba(117,89,194,.12);
    pointer-events: none;
}
.tarot-fan-core span {
    font-family: Georgia, serif;
    font-size: 2rem;
    line-height: 1;
    text-shadow: 0 0 18px rgba(246,213,138,.45);
}
.tarot-fan-core small {
    margin-top: 5px;
    color: rgba(246,213,138,.7) !important;
    font-size: .52rem;
    font-weight: 900;
    letter-spacing: .17em;
}

.tarot-pick-card {
    position: absolute;
    left: 0;
    top: 0;
    width: var(--fan-card-w);
    height: var(--fan-card-h);
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 15px;
    background: transparent !important;
    cursor: pointer;
    opacity: var(--fan-o, 0);
    transform:
        translate3d(calc(var(--fan-x, 0px) - 50%), calc(var(--fan-y, 0px) - 50%), 0)
        rotate(var(--fan-r, 0deg))
        scale(var(--fan-s, .85));
    transform-origin: 50% 92%;
    will-change: transform, opacity;
    transition: opacity .18s ease, filter .18s ease;
    outline: none;
}
.tarot-deck-spread:not(.fan-ready) .tarot-pick-card { opacity: 0 !important; }

.tarot-card-motion {
    position: absolute;
    inset: 0;
    display: block;
    border-radius: inherit;
    transition: transform .22s cubic-bezier(.18,.82,.22,1), filter .2s ease;
    transform-origin: 50% 100%;
}

.tarot-card-back-mini,
.tarot-card-back {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    border: 1px solid rgba(255,223,148,.82) !important;
    background:
        radial-gradient(circle at 50% 46%, rgba(255,220,134,.20) 0 2%, transparent 2.4% 14%, rgba(255,220,134,.17) 14.3% 15.4%, transparent 15.8% 23%, rgba(255,220,134,.10) 23.4% 24.2%, transparent 24.6%),
        repeating-conic-gradient(from 0deg at 50% 46%, rgba(248,218,144,.115) 0 3.6deg, transparent 3.6deg 11.25deg),
        radial-gradient(circle at 50% 46%, #172952 0 31%, transparent 31.5%),
        linear-gradient(145deg, #0b1732, #17274e 48%, #081326 100%) !important;
    box-shadow:
        inset 0 0 0 4px rgba(3,7,17,.70),
        inset 0 0 0 6px rgba(255,220,137,.25),
        inset 0 0 36px rgba(82,84,180,.27),
        0 12px 30px rgba(0,0,0,.50) !important;
}
.tarot-card-back-mini::before,
.tarot-card-back::before {
    content: "☾";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #ffe0a0 !important;
    font-family: Georgia, serif;
    font-size: 2.65rem;
    font-weight: 400;
    line-height: 1;
    text-shadow: 0 0 13px rgba(248,214,117,.56), 0 0 30px rgba(133,112,226,.30);
}
.tarot-card-back-mini::after,
.tarot-card-back::after {
    content: "✦  ·  ✧  ·  ✦\A\A      ✦\A\A✧  ·  ✦  ·  ✧";
    white-space: pre;
    position: absolute;
    inset: 8px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,224,151,.40);
    border-radius: 9px;
    color: rgba(255,224,151,.56) !important;
    font-size: .56rem;
    line-height: 1.9;
    letter-spacing: .15em;
    text-align: center;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.018);
}

.tarot-pick-card::before {
    content: "";
    position: absolute;
    inset: -12px;
    z-index: -1;
    border-radius: 22px;
    opacity: 0;
    background: radial-gradient(circle, rgba(255,214,122,.48), rgba(128,101,224,.15) 48%, transparent 72%);
    filter: blur(8px);
    transition: opacity .2s ease;
}
.tarot-pick-card:hover .tarot-card-motion,
.tarot-pick-card:focus-visible .tarot-card-motion {
    transform: translateY(-31px) scale(1.10);
    filter: brightness(1.12) saturate(1.08);
}
.tarot-pick-card:hover::before,
.tarot-pick-card:focus-visible::before { opacity: 1; }
.tarot-pick-card:hover .tarot-card-back-mini,
.tarot-pick-card:focus-visible .tarot-card-back-mini {
    border-color: #ffedbd !important;
    box-shadow:
        inset 0 0 0 4px rgba(3,7,17,.52),
        inset 0 0 0 6px rgba(255,225,158,.34),
        0 0 0 2px rgba(246,213,138,.16),
        0 22px 42px rgba(0,0,0,.58),
        0 0 36px rgba(246,213,138,.34) !important;
}

.tarot-pick-card.is-picked .tarot-card-motion {
    transform: translateY(-25px) scale(1.07);
    filter: brightness(1.09) saturate(1.06);
}
.tarot-pick-card.is-picked::before { opacity: 1; }
.tarot-pick-card.is-picked .tarot-card-back-mini {
    border-color: #fff0c5 !important;
    box-shadow:
        inset 0 0 0 4px rgba(3,7,17,.48),
        inset 0 0 0 6px rgba(255,226,158,.36),
        0 0 0 2px rgba(246,213,138,.18),
        0 0 34px rgba(246,190,88,.50),
        0 20px 44px rgba(0,0,0,.56) !important;
}
.tarot-pick-card.is-picked::after {
    content: attr(data-pick-order);
    position: absolute;
    top: -17px;
    left: 50%;
    transform: translateX(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    z-index: 8;
    color: #251609 !important;
    -webkit-text-fill-color: #251609 !important;
    background: linear-gradient(#fff0bf, #dda44e);
    border: 1px solid rgba(255,246,218,.80);
    box-shadow: 0 5px 20px rgba(0,0,0,.48), 0 0 25px rgba(246,213,138,.34);
    font-weight: 950;
    font-size: .8rem;
}
.tarot-deck-spread.selection-complete .tarot-pick-card:not(.is-picked) {
    filter: saturate(.45) brightness(.68);
}

.tarot-auto-motion {
    position: relative;
    z-index: 310;
    width: min(660px, calc(100% - 56px));
    height: 28px;
    margin: -12px auto 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}
.tarot-auto-motion::before {
    content: "VÒNG BÀI ĐANG XOAY";
    color: rgba(246,213,138,.66) !important;
    font-size: .61rem;
    font-weight: 950;
    letter-spacing: .22em;
}
.tarot-auto-motion span {
    position: absolute;
    width: 88%;
    height: 1px;
    border-radius: 99px;
    background: linear-gradient(90deg, transparent, rgba(246,213,138,.18), rgba(246,213,138,.72), rgba(141,113,215,.30), transparent);
}
.tarot-auto-motion span::after {
    content: "✦";
    position: absolute;
    top: 50%;
    left: 12%;
    transform: translate(-50%, -50%);
    color: #ffe1a0 !important;
    text-shadow: 0 0 14px rgba(255,216,126,.8);
    animation: tarotOrbitIndicator 4.8s linear infinite;
}
@keyframes tarotOrbitIndicator {
    from { left: 10%; opacity: .35; }
    45% { opacity: 1; }
    to { left: 90%; opacity: .35; }
}

/* ===== Selected 3 cards ===== */
.tarot-selected-area {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    max-width: 960px;
    margin: 24px auto 0;
}
.tarot-slot {
    position: relative;
    min-height: 315px;
    padding: 17px 15px 14px;
    border-radius: 22px;
    border: 1px solid rgba(246,213,138,.13) !important;
    background: linear-gradient(180deg, rgba(11,19,37,.68), rgba(5,10,22,.54)) !important;
    overflow: hidden;
    text-align: center;
    box-shadow: inset 0 1px rgba(255,255,255,.02);
}
.tarot-slot::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 45%;
    background: linear-gradient(to top, rgba(246,213,138,.035), transparent);
    pointer-events: none;
}
.tarot-slot-index {
    position: absolute;
    right: 14px;
    top: 11px;
    color: rgba(246,213,138,.18) !important;
    font-size: 1.9rem;
    font-weight: 950;
    letter-spacing: -.05em;
}
.tarot-slot-copy {
    position: relative;
    z-index: 2;
    padding: 0 35px;
}
.tarot-slot-copy span {
    color: var(--tarot-gold) !important;
    font-size: .75rem;
    font-weight: 950;
    letter-spacing: .14em;
}
.tarot-slot-copy small {
    display: block;
    color: #959aa9 !important;
    margin-top: 3px;
    line-height: 1.35;
}
.tarot-slot-card {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    min-height: 235px;
    padding-top: 10px;
}
.tarot-placeholder-card {
    width: 118px;
    aspect-ratio: 520 / 750;
    border: 1px dashed rgba(246,213,138,.22) !important;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: rgba(246,213,138,.42) !important;
    background: rgba(3,7,16,.42) !important;
    font-size: 1.8rem;
}
.tarot-reveal-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    width: 100%;
    animation: tarotCardArrive .42s cubic-bezier(.2,.85,.25,1.2) both;
}
@keyframes tarotCardArrive {
    from { opacity: 0; transform: translateY(22px) scale(.92); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.tarot-flip-card {
    width: 132px;
    aspect-ratio: 520 / 750;
    perspective: 1200px;
}
.tarot-flip-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform .82s cubic-bezier(.2,.72,.2,1);
}
.tarot-flip-card.is-revealed .tarot-flip-inner { transform: rotateY(180deg); }
.tarot-face {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: 15px;
    overflow: hidden;
}
.tarot-face.tarot-card-back { transform: rotateY(0); }
.tarot-card-front {
    transform: rotateY(180deg);
    background: #070b12 !important;
    border: 1px solid rgba(246,213,138,.52) !important;
    box-shadow: 0 15px 34px rgba(0,0,0,.48), 0 0 0 1px rgba(246,213,138,.08) !important;
}
.tarot-card-front img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.tarot-flip-card.is-reversed .tarot-card-front img { transform: rotate(180deg); }
.tarot-selected-caption { text-align: center; min-height: 45px; }
.tarot-selected-caption strong { display: block; color: #fff8e7 !important; font-size: .94rem; line-height: 1.25; }
.tarot-selected-caption span {
    display: inline-flex;
    margin-top: 4px;
    border-radius: 999px;
    padding: 3px 8px;
    font-size: .68rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.tarot-selected-caption .upright { color: #c4f5d1 !important; background: rgba(45,170,96,.13) !important; }
.tarot-selected-caption .reversed { color: #ffd3e5 !important; background: rgba(208,64,124,.13) !important; }

.tarot-chooser-actions,
.tarot-result-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 18px;
}

/* ===== Reading result ===== */
.tarot-result { margin-top: 48px; scroll-margin-top: 100px; }
.tarot-answer-panel {
    border-radius: 26px;
    padding: clamp(22px, 4vw, 34px);
    position: relative;
    overflow: hidden;
}
.tarot-answer-panel::after {
    content: "☾";
    position: absolute;
    right: 22px;
    top: -6px;
    color: rgba(246,213,138,.07) !important;
    font-size: 9rem;
    line-height: 1;
    pointer-events: none;
}
.tarot-answer-panel h3 {
    position: relative;
    z-index: 2;
    margin: 7px 0 10px;
    color: #fff7e7 !important;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(1.35rem, 2.8vw, 2.05rem);
}
.tarot-answer-panel p {
    position: relative;
    z-index: 2;
    margin: 0;
    color: #d0ced7 !important;
    font-size: 1.01rem;
    line-height: 1.8;
    max-width: 1060px;
}
.tarot-meaning-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    margin-top: 18px;
}
.tarot-meaning-card { border-radius: 22px; padding: 18px; }
.tarot-meaning-card-top {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}
.tarot-meaning-thumb {
    width: 78px;
    aspect-ratio: 520/750;
    border-radius: 9px;
    overflow: hidden;
    border: 1px solid rgba(246,213,138,.38) !important;
    background: #070b12 !important;
    box-shadow: 0 9px 24px rgba(0,0,0,.30);
}
.tarot-meaning-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tarot-meaning-thumb.is-reversed img { transform: rotate(180deg); }
.tarot-position-name { color: var(--tarot-gold) !important; font-size: .69rem; font-weight: 950; letter-spacing: .12em; }
.tarot-meaning-card h4 { color: #fff7e6 !important; margin: 3px 0 4px; font-size: 1.08rem; line-height: 1.25; }
.tarot-orientation { color: #aeb2bf !important; font-size: .78rem; font-weight: 700; }
.tarot-meaning-card p { margin: 14px 0 0; color: #c3c1cb !important; line-height: 1.65; font-size: .93rem; }
.tarot-reflection {
    margin-top: 18px;
    border-radius: 22px;
    padding: 19px 21px;
    color: #c9c7d1 !important;
}
.tarot-reflection strong { color: var(--tarot-gold) !important; }
.tarot-reflection p { margin: 4px 0 0; }

@media (max-width: 980px) {
    .tarot-main { padding-top: 42px !important; }
    .tarot-pick-card { flex-basis: 96px; width: 96px; height: 139px; }
    .tarot-deck-group { gap: 12px; }
    .tarot-selected-area,
    .tarot-meaning-grid { grid-template-columns: 1fr; max-width: 680px; }
    .tarot-slot {
        display: grid;
        grid-template-columns: minmax(0,1fr) 175px;
        min-height: 250px;
        align-items: center;
        text-align: left;
    }
    .tarot-slot-copy { align-self: start; padding: 0 48px 0 0; }
    .tarot-slot-card { min-height: 218px; grid-column: 2; grid-row: 1 / span 2; }
    .tarot-slot-index { left: 18px; right: auto; top: auto; bottom: 14px; }
}

@media (max-width: 680px) {
    .tarot-main { padding: 24px 9px 70px !important; }
    .tarot-page::before { inset: -30px -8px -30px; border-radius: 0; }
    .tarot-hero { border-radius: 24px; padding: 30px 13px 22px; }
    .tarot-hero h1 { font-size: clamp(2.5rem, 13vw, 4rem); }
    .tarot-question-row { grid-template-columns: 1fr; }
    .tarot-primary { width: 100%; }
    .tarot-form-meta { font-size: .72rem; }
    .tarot-section-heading,
    .tarot-result-head { align-items: flex-start; flex-direction: column; }
    .tarot-active-question { align-items: flex-start; flex-direction: column; gap: 4px; }
    .tarot-deck-frame { border-radius: 22px; }
    .tarot-deck-topline { align-items: flex-start; flex-direction: column; gap: 4px; padding-inline: 14px; }
    #tarot-pick-hint { text-align: left; }
    .tarot-deck-spread { min-height: 180px; padding-block: 20px 22px; }
    .tarot-pick-card { flex-basis: 84px; width: 84px; height: 122px; }
    .tarot-deck-group { gap: 10px; padding-right: 10px; }
    .tarot-slot {
        display: block;
        min-height: 320px;
        text-align: center;
    }
    .tarot-slot-copy { padding: 0 35px; }
    .tarot-slot-card { min-height: 240px; }
    .tarot-slot-index { left: auto; right: 14px; top: 11px; bottom: auto; }
    .tarot-result-actions,
    .tarot-chooser-actions { flex-direction: column; }
    .tarot-result-actions button,
    .tarot-chooser-actions button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .tarot-pick-card,
    .tarot-flip-inner,
    .tarot-reveal-wrap,
    .tarot-chooser,
    .tarot-result,
    .tarot-auto-motion span { transition: none !important; animation: none !important; }
    .tarot-deck-spread { overflow-x: auto; }
    .tarot-marquee-track { animation: none !important; }
    .tarot-deck-group:nth-child(2) { display: none; }
}

/* ========================================================================
   PrimeMC Tarot V3 — premium mystical palette + real light theme rescue
   This block intentionally has higher specificity than the site's green
   frog-theme so Tarot headings never inherit the normal page heading color.
   ======================================================================== */

/* Tarot owns its own title language in DARK mode: ivory -> antique gold -> lilac. */
:root[data-theme="dark"] .tarot-page .tarot-hero h1,
:root:not([data-theme="light"]) .tarot-page .tarot-hero h1 {
    background: linear-gradient(106deg, #fff7dd 4%, #f0c779 48%, #d9ccff 92%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 8px 28px rgba(0,0,0,.54));
}

:root[data-theme="dark"] .tarot-page :is(.tarot-section-heading h2,.tarot-result-head h2),
:root:not([data-theme="light"]) .tarot-page :is(.tarot-section-heading h2,.tarot-result-head h2) {
    color: #f4dfaa !important;
    -webkit-text-fill-color: #f4dfaa !important;
    text-shadow: 0 3px 22px rgba(0,0,0,.5), 0 0 22px rgba(188,142,64,.08) !important;
}

:root[data-theme="dark"] .tarot-page :is(.tarot-lead,.tarot-section-heading p,.tarot-answer-panel p,.tarot-meaning-card p,.tarot-reflection p),
:root:not([data-theme="light"]) .tarot-page :is(.tarot-lead,.tarot-section-heading p,.tarot-answer-panel p,.tarot-meaning-card p,.tarot-reflection p) {
    -webkit-text-fill-color: currentColor !important;
}

/* Tarot LIGHT mode is parchment + moonstone, not the site's green light theme. */
:root[data-theme="light"] .tarot-page {
    --tarot-bg: #f4efe5;
    --tarot-bg-2: #ebe3d8;
    --tarot-panel: rgba(255, 252, 245, .90);
    --tarot-panel-soft: rgba(250, 245, 237, .82);
    --tarot-ink: #2f2637;
    --tarot-muted: #685f70;
    --tarot-muted-2: #81788a;
    --tarot-gold: #a56a21;
    --tarot-gold-2: #c58b3c;
    --tarot-gold-3: #81501d;
    --tarot-line: rgba(113, 78, 126, .20);
    --tarot-violet: #72558f;
    --tarot-cyan: #587b8f;
    --tarot-green: #5c7564;
    color: var(--tarot-ink) !important;
    color-scheme: light;
}

:root[data-theme="light"] .tarot-page::before {
    background:
        linear-gradient(180deg, rgba(249,245,237,.89), rgba(242,235,226,.95) 48%, rgba(235,226,217,.97)),
        radial-gradient(circle at 50% 4%, rgba(119,82,151,.17), transparent 36%),
        radial-gradient(circle at 12% 22%, rgba(197,139,60,.11), transparent 28%),
        radial-gradient(circle at 88% 18%, rgba(83,118,140,.10), transparent 31%) !important;
    border: 1px solid rgba(116,80,128,.10);
    box-shadow: 0 34px 96px rgba(72,55,77,.13) !important;
}
:root[data-theme="light"] .tarot-page::after {
    opacity: .5;
    background:
        radial-gradient(circle at 17% 45%, rgba(132,86,153,.18) 0 1px, transparent 1.8px),
        radial-gradient(circle at 69% 18%, rgba(154,106,39,.22) 0 1px, transparent 1.7px),
        radial-gradient(circle at 82% 54%, rgba(87,117,137,.16) 0 1px, transparent 1.8px) !important;
    background-size: 84px 84px, 116px 116px, 138px 138px !important;
}

:root[data-theme="light"] .tarot-page .tarot-hero {
    border-color: rgba(117,79,130,.18) !important;
    background:
        radial-gradient(circle at 50% 0%, rgba(126,83,155,.14), transparent 47%),
        linear-gradient(145deg, rgba(255,253,248,.86), rgba(239,231,223,.91)) !important;
    box-shadow: 0 24px 62px rgba(70,52,78,.12), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
:root[data-theme="light"] .tarot-page .tarot-hero::before {
    color: rgba(113,71,134,.08) !important;
}

/* The hero title deliberately differs from every other PrimeMC page. */
:root[data-theme="light"] .tarot-page .tarot-hero h1 {
    background: linear-gradient(106deg, #3f2b56 2%, #6d3e78 44%, #9a6323 91%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: none !important;
    filter: drop-shadow(0 7px 18px rgba(80,57,88,.10));
}
:root[data-theme="light"] .tarot-page .tarot-eyebrow,
:root[data-theme="light"] .tarot-page .tarot-step,
:root[data-theme="light"] .tarot-page .tarot-answer-label {
    color: #98621e !important;
    -webkit-text-fill-color: #98621e !important;
    text-shadow: none !important;
}
:root[data-theme="light"] .tarot-page .tarot-lead {
    color: #665d6d !important;
    -webkit-text-fill-color: #665d6d !important;
    text-shadow: none !important;
}
:root[data-theme="light"] .tarot-page .tarot-lead strong {
    color: #4a315b !important;
    -webkit-text-fill-color: #4a315b !important;
}

:root[data-theme="light"] .tarot-page :is(
    .tarot-question-card,
    .tarot-answer-panel,
    .tarot-meaning-card,
    .tarot-reflection,
    .tarot-active-question
) {
    border-color: rgba(116,77,128,.18) !important;
    background: linear-gradient(145deg, rgba(255,253,248,.92), rgba(243,236,229,.86)) !important;
    color: #322a39 !important;
    box-shadow: 0 18px 48px rgba(65,49,71,.10), inset 0 1px 0 rgba(255,255,255,.78) !important;
}

:root[data-theme="light"] .tarot-page .tarot-question-card label {
    color: #704a75 !important;
    -webkit-text-fill-color: #704a75 !important;
}
:root[data-theme="light"] .tarot-page .tarot-question-row textarea {
    border-color: rgba(111,78,126,.22) !important;
    background: rgba(255,253,249,.86) !important;
    color: #342a3b !important;
    -webkit-text-fill-color: #342a3b !important;
    box-shadow: inset 0 1px 6px rgba(62,48,69,.045) !important;
}
:root[data-theme="light"] .tarot-page .tarot-question-row textarea::placeholder {
    color: #8b8190 !important;
    -webkit-text-fill-color: #8b8190 !important;
}
:root[data-theme="light"] .tarot-page .tarot-question-row textarea:focus {
    border-color: rgba(147,94,37,.48) !important;
    background: #fffdf9 !important;
    box-shadow: 0 0 0 4px rgba(160,104,33,.08), 0 10px 28px rgba(88,64,94,.08) !important;
}
:root[data-theme="light"] .tarot-page :is(.tarot-form-meta,.tarot-disclaimer) {
    color: #766e7b !important;
    -webkit-text-fill-color: #766e7b !important;
}

:root[data-theme="light"] .tarot-page :is(.tarot-section-heading h2,.tarot-result-head h2) {
    color: #57345f !important;
    -webkit-text-fill-color: #57345f !important;
    text-shadow: none !important;
}
:root[data-theme="light"] .tarot-page .tarot-section-heading p {
    color: #6d6471 !important;
    -webkit-text-fill-color: #6d6471 !important;
}
:root[data-theme="light"] .tarot-page :is(.tarot-counter,.tarot-result-mark) {
    color: #8c5c20 !important;
    -webkit-text-fill-color: #8c5c20 !important;
    border-color: rgba(158,105,33,.24) !important;
    background: rgba(185,126,43,.08) !important;
}
:root[data-theme="light"] .tarot-page .tarot-active-question span {
    color: #817587 !important;
    -webkit-text-fill-color: #817587 !important;
}
:root[data-theme="light"] .tarot-page .tarot-active-question strong {
    color: #45344d !important;
    -webkit-text-fill-color: #45344d !important;
}

/* Light-mode fan keeps a night-sky altar so the cards remain dramatic. */
:root[data-theme="light"] .tarot-page .tarot-deck-frame {
    border-color: rgba(111,77,127,.25) !important;
    background:
        radial-gradient(ellipse at 50% 92%, rgba(227,177,77,.16), transparent 39%),
        radial-gradient(circle at 50% 34%, rgba(117,88,183,.13), transparent 44%),
        linear-gradient(145deg, #16182b, #0d1223 58%, #0a0f1d) !important;
    box-shadow: 0 28px 68px rgba(61,46,69,.18), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
:root[data-theme="light"] .tarot-page .tarot-deck-topline,
:root[data-theme="light"] .tarot-page #tarot-pick-hint {
    color: #eee7ef !important;
    -webkit-text-fill-color: #eee7ef !important;
}
:root[data-theme="light"] .tarot-page .tarot-deck-topline span:first-child {
    color: #f2d08a !important;
    -webkit-text-fill-color: #f2d08a !important;
}
:root[data-theme="light"] .tarot-page .tarot-auto-motion::before {
    color: rgba(249,220,153,.78) !important;
    -webkit-text-fill-color: rgba(249,220,153,.78) !important;
}

:root[data-theme="light"] .tarot-page .tarot-slot {
    border-color: rgba(114,79,126,.17) !important;
    background: linear-gradient(180deg, rgba(255,253,248,.72), rgba(238,231,225,.65)) !important;
    box-shadow: 0 16px 38px rgba(68,51,74,.08), inset 0 1px rgba(255,255,255,.70) !important;
}
:root[data-theme="light"] .tarot-page .tarot-slot-index {
    color: rgba(104,67,117,.18) !important;
    -webkit-text-fill-color: rgba(104,67,117,.18) !important;
}
:root[data-theme="light"] .tarot-page .tarot-slot-copy span {
    color: #8f5c1d !important;
    -webkit-text-fill-color: #8f5c1d !important;
}
:root[data-theme="light"] .tarot-page .tarot-slot-copy small {
    color: #756d79 !important;
    -webkit-text-fill-color: #756d79 !important;
}
:root[data-theme="light"] .tarot-page .tarot-placeholder-card {
    border-color: rgba(110,73,123,.20) !important;
    color: rgba(111,73,125,.38) !important;
    -webkit-text-fill-color: rgba(111,73,125,.38) !important;
    background: rgba(255,253,248,.58) !important;
}
:root[data-theme="light"] .tarot-page .tarot-selected-caption strong {
    color: #46364e !important;
    -webkit-text-fill-color: #46364e !important;
}

:root[data-theme="light"] .tarot-page .tarot-answer-panel h3 {
    color: #5a3863 !important;
    -webkit-text-fill-color: #5a3863 !important;
}
:root[data-theme="light"] .tarot-page .tarot-answer-panel p,
:root[data-theme="light"] .tarot-page .tarot-meaning-card p,
:root[data-theme="light"] .tarot-page .tarot-reflection,
:root[data-theme="light"] .tarot-page .tarot-reflection p {
    color: #655d69 !important;
    -webkit-text-fill-color: #655d69 !important;
}
:root[data-theme="light"] .tarot-page .tarot-meaning-card h4 {
    color: #46344e !important;
    -webkit-text-fill-color: #46344e !important;
}
:root[data-theme="light"] .tarot-page :is(.tarot-position-name,.tarot-reflection strong) {
    color: #925f20 !important;
    -webkit-text-fill-color: #925f20 !important;
}
:root[data-theme="light"] .tarot-page .tarot-orientation {
    color: #776e7c !important;
    -webkit-text-fill-color: #776e7c !important;
}
:root[data-theme="light"] .tarot-page .tarot-secondary {
    color: #5b4264 !important;
    -webkit-text-fill-color: #5b4264 !important;
    background: rgba(255,252,246,.65) !important;
    border-color: rgba(110,72,124,.22) !important;
}

/* Dark-mode text rescue against any high-specificity theme rules. */
:root[data-theme="dark"] .tarot-page :is(
    .tarot-question-card label,.tarot-slot-copy span,.tarot-position-name,.tarot-reflection strong,
    .tarot-counter,.tarot-result-mark,.tarot-active-question strong,.tarot-selected-caption strong,
    .tarot-answer-panel h3,.tarot-meaning-card h4
) {
    -webkit-text-fill-color: currentColor !important;
}

@media (max-width: 980px) {
    .tarot-deck-spread {
        height: 420px;
        --fan-card-w: 98px;
    }
}

@media (max-width: 680px) {
    .tarot-deck-spread {
        height: 350px;
        min-height: 350px;
        --fan-card-w: 78px;
    }
    .tarot-fan-core { width: 82px; height: 82px; bottom: 3px; }
    .tarot-fan-core span { font-size: 1.55rem; }
    .tarot-fan-core small { font-size: .42rem; }
    .tarot-deck-frame::after { font-size: .64rem; letter-spacing: .38em; }
}

@media (prefers-reduced-motion: reduce) {
    .tarot-auto-motion span::after { animation: none !important; }
    .tarot-pick-card { transition: none !important; }
}

/* Final responsive fan geometry reset (wins over V2 marquee media rules). */
@media (max-width: 980px) {
    .tarot-page .tarot-deck-spread { padding: 0 !important; }
    .tarot-page .tarot-pick-card {
        width: var(--fan-card-w) !important;
        height: var(--fan-card-h) !important;
        flex-basis: auto !important;
    }
}
@media (max-width: 680px) {
    .tarot-page .tarot-deck-spread { padding: 0 !important; }
    .tarot-page .tarot-pick-card {
        width: var(--fan-card-w) !important;
        height: var(--fan-card-h) !important;
        flex-basis: auto !important;
    }
}

/* Small celestial labels also ignore the global light-theme green text rules. */
:root[data-theme="light"] .tarot-page .tarot-fan-core :is(span,small) {
    color: #f2cf82 !important;
    -webkit-text-fill-color: #f2cf82 !important;
}

/* ========================================================================
   PrimeMC Tarot V4 — reading depth, quota/credit UI, typography + mobile
   ======================================================================== */
.tarot-page,
.tarot-page button,
.tarot-page textarea,
.tarot-page input,
.tarot-page select,
.tarot-page a {
    font-family: "Be Vietnam Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-kerning: normal;
    text-rendering: optimizeLegibility;
}
.tarot-page .tarot-hero h1,
.tarot-page :is(.tarot-section-heading h2,.tarot-result-head h2,.tarot-login-gate h2,.tarot-no-credit h2),
.tarot-page :is(.tarot-answer-panel h3,.tarot-context-panel h3) {
    font-family: "Noto Serif", Cambria, "Times New Roman", serif !important;
    letter-spacing: -.022em !important;
    word-spacing: normal !important;
    font-kerning: normal !important;
    font-variant-ligatures: common-ligatures;
    text-rendering: optimizeLegibility;
}
.tarot-page .tarot-hero h1 {
    line-height: 1.08 !important;
    max-width: 980px;
}

.tarot-access-bar {
    position: relative;
    z-index: 3;
    width: min(920px,100%);
    margin: 24px auto 0;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(246,213,138,.18);
    border-radius: 18px;
    background: linear-gradient(135deg,rgba(12,20,41,.76),rgba(5,11,24,.84));
    box-shadow: inset 0 1px rgba(255,255,255,.035),0 12px 30px rgba(0,0,0,.2);
    text-align: left;
}
.tarot-access-main { display:flex;align-items:center;gap:11px;min-width:0; }
.tarot-access-icon { width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:rgba(246,213,138,.09);border:1px solid rgba(246,213,138,.2);color:#f6d58a;font-size:1.25rem; }
.tarot-access-main div { display:grid;gap:2px;min-width:0; }
.tarot-access-main small,.tarot-credit-pill small { color:#9ca3b4 !important;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase; }
.tarot-access-main strong { color:#fff5dc !important;font-size:.92rem;white-space:normal; }
.tarot-credit-pill { display:grid;grid-template-columns:auto auto;column-gap:6px;align-items:center;padding:8px 12px;border-radius:13px;background:rgba(246,213,138,.075);border:1px solid rgba(246,213,138,.17); }
.tarot-credit-pill > span { color:#f4c86f; }
.tarot-credit-pill > strong { color:#fff5d5 !important;font-size:1rem; }
.tarot-credit-pill > small { grid-column:1/-1; }
.tarot-buy-credit { display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 14px;border-radius:12px;color:#21180d !important;background:linear-gradient(135deg,#ffe6a3,#dca752);font-size:.8rem;font-weight:900;text-decoration:none;box-shadow:0 8px 22px rgba(216,158,65,.16); }
.tarot-guest-note { color:#c1bec9 !important;font-size:.78rem;line-height:1.45;max-width:330px; }

.tarot-active-question { flex-wrap:wrap; }
.tarot-active-question em { margin-left:auto;color:#e0bc70 !important;font-style:normal;font-size:.72rem;font-weight:800;letter-spacing:.04em;white-space:nowrap; }

.tarot-login-gate,
.tarot-no-credit {
    position: relative;
    margin: 42px auto 0;
    max-width: 860px;
    padding: clamp(26px,5vw,48px);
    text-align:center;
    border:1px solid rgba(246,213,138,.23);
    border-radius:30px;
    background:radial-gradient(circle at 50% 0%,rgba(116,92,205,.18),transparent 48%),linear-gradient(145deg,rgba(10,19,39,.96),rgba(4,10,23,.98));
    box-shadow:0 28px 74px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.04);
    overflow:hidden;
}
.tarot-gate-symbol { width:72px;height:72px;display:grid;place-items:center;margin:0 auto 14px;border-radius:50%;border:1px solid rgba(246,213,138,.24);color:#f2cf82;font-size:2rem;background:rgba(246,213,138,.06);box-shadow:0 0 40px rgba(209,166,83,.10); }
.tarot-login-gate h2,.tarot-no-credit h2 { margin:9px auto 10px;color:#fff5df !important;font-size:clamp(1.7rem,4vw,2.65rem); }
.tarot-login-gate p,.tarot-no-credit p { max-width:680px;margin:0 auto;color:#c5c3cd !important;line-height:1.75; }
.tarot-login-gate > small { display:block;margin-top:14px;color:#969bad !important; }
.tarot-gate-actions { display:flex;justify-content:center;gap:10px;margin-top:22px; }
.tarot-link-btn { display:inline-flex;align-items:center;justify-content:center;text-decoration:none; }

.tarot-result-side { display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end; }
.tarot-topic-badge { display:inline-flex;align-items:center;min-height:37px;padding:0 13px;border-radius:999px;border:1px solid rgba(157,140,255,.28);background:rgba(157,140,255,.08);color:#d9d0ff !important;font-size:.71rem;font-weight:900;letter-spacing:.10em; }
.tarot-answer-heading { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; }
.tarot-payment-source { color:#b9c0d0 !important;font-size:.72rem;font-weight:700; }
.tarot-answer-panel h3 { font-size:clamp(1.55rem,3vw,2.35rem);line-height:1.3 !important; }
.tarot-answer-panel p { font-size:.97rem;line-height:1.86 !important; }

.tarot-insight-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0 18px; }
.tarot-insight-card { min-height:170px;display:flex;gap:13px;padding:18px;border:1px solid rgba(246,213,138,.14);border-radius:20px;background:linear-gradient(145deg,rgba(13,23,44,.84),rgba(7,13,28,.91));box-shadow:0 16px 38px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.025); }
.tarot-insight-card > span { width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;color:#f0c978;background:rgba(246,213,138,.07);border:1px solid rgba(246,213,138,.14); }
.tarot-insight-card small,.tarot-card-reading-block small,.tarot-card-mini-grid small { display:block;color:#e2bd72 !important;font-size:.66rem;font-weight:900;letter-spacing:.11em;margin-bottom:7px; }
.tarot-insight-card p { margin:0;color:#c7c5cf !important;font-size:.87rem;line-height:1.68; }

.tarot-meaning-grid { align-items:stretch; }
.tarot-meaning-card { display:flex;flex-direction:column;gap:14px;padding:19px !important; }
.tarot-card-heading { min-width:0; }
.tarot-card-reading-block { padding-top:13px;border-top:1px solid rgba(246,213,138,.11); }
.tarot-card-reading-block p { margin:0 !important; }
.tarot-card-mini-grid { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto; }
.tarot-card-mini-grid > div { padding:12px;border-radius:14px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.055); }
.tarot-card-mini-grid p { margin:0 !important;font-size:.82rem !important;line-height:1.58 !important; }

.tarot-context-panel { display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);gap:22px;margin:18px 0;padding:22px;border:1px solid rgba(157,140,255,.17);border-radius:24px;background:radial-gradient(circle at 0 0,rgba(117,91,207,.10),transparent 34%),linear-gradient(145deg,rgba(11,20,39,.88),rgba(6,12,25,.92));box-shadow:0 18px 45px rgba(0,0,0,.24); }
.tarot-context-panel h3 { margin:7px 0 8px;color:#fff4da !important;font-size:1.4rem;line-height:1.35; }
.tarot-context-panel > div > p { margin:0;color:#c3c1cb !important;font-size:.9rem;line-height:1.72; }
.tarot-context-points { display:grid;gap:9px;align-content:start; }
.tarot-context-points > div { display:grid;grid-template-columns:auto 1fr;gap:9px;padding:11px 12px;border-radius:13px;border:1px solid rgba(246,213,138,.10);background:rgba(255,255,255,.025); }
.tarot-context-points span { color:#e5bd68; }
.tarot-context-points p { margin:0 !important;color:#d1ced6 !important;font-size:.82rem !important;line-height:1.55 !important; }

.tarot-primary.is-loading { opacity:.72;cursor:wait; }
.tarot-primary:disabled { opacity:.55;cursor:not-allowed;transform:none !important; }

/* Light Tarot remains a distinct moonstone/parchment theme. */
:root[data-theme="light"] .tarot-page .tarot-access-bar,
:root[data-theme="light"] .tarot-page :is(.tarot-login-gate,.tarot-no-credit),
:root[data-theme="light"] .tarot-page :is(.tarot-insight-card,.tarot-context-panel) {
    background:linear-gradient(145deg,rgba(255,253,248,.93),rgba(241,234,228,.88)) !important;
    border-color:rgba(111,77,127,.18) !important;
    box-shadow:0 17px 44px rgba(64,48,70,.10),inset 0 1px rgba(255,255,255,.75) !important;
}
:root[data-theme="light"] .tarot-page .tarot-access-icon,
:root[data-theme="light"] .tarot-page .tarot-credit-pill,
:root[data-theme="light"] .tarot-page .tarot-gate-symbol { background:rgba(155,102,31,.07) !important;border-color:rgba(155,102,31,.17) !important;color:#9b651f !important; }
:root[data-theme="light"] .tarot-page .tarot-access-main small,
:root[data-theme="light"] .tarot-page .tarot-credit-pill small,
:root[data-theme="light"] .tarot-page .tarot-guest-note,
:root[data-theme="light"] .tarot-page .tarot-payment-source { color:#786f7c !important; }
:root[data-theme="light"] .tarot-page .tarot-access-main strong,
:root[data-theme="light"] .tarot-page .tarot-credit-pill strong { color:#493751 !important; }
:root[data-theme="light"] .tarot-page .tarot-active-question em { color:#8c5b20 !important; }
:root[data-theme="light"] .tarot-page :is(.tarot-login-gate h2,.tarot-no-credit h2,.tarot-context-panel h3) { color:#57345f !important;-webkit-text-fill-color:#57345f !important; }
:root[data-theme="light"] .tarot-page :is(.tarot-login-gate p,.tarot-no-credit p,.tarot-insight-card p,.tarot-context-panel>div>p,.tarot-context-points p,.tarot-card-mini-grid p) { color:#655d69 !important;-webkit-text-fill-color:#655d69 !important; }
:root[data-theme="light"] .tarot-page .tarot-topic-badge { color:#6c4d7a !important;background:rgba(113,79,132,.07);border-color:rgba(113,79,132,.18); }
:root[data-theme="light"] .tarot-page :is(.tarot-insight-card small,.tarot-card-reading-block small,.tarot-card-mini-grid small) { color:#96621e !important; }
:root[data-theme="light"] .tarot-page .tarot-insight-card>span { color:#925e1f !important;background:rgba(151,96,31,.06);border-color:rgba(151,96,31,.14); }
:root[data-theme="light"] .tarot-page .tarot-card-mini-grid>div,
:root[data-theme="light"] .tarot-page .tarot-context-points>div { background:rgba(255,255,255,.45);border-color:rgba(108,78,121,.10); }

/* Responsive: desktop -> tablet -> phone. Keep tap targets >= 44px. */
@media (max-width: 980px) {
    .tarot-access-bar { grid-template-columns:minmax(0,1fr) auto; }
    .tarot-buy-credit { grid-column:1/-1; }
    .tarot-insight-grid { grid-template-columns:1fr; }
    .tarot-insight-card { min-height:0; }
    .tarot-context-panel { grid-template-columns:1fr; }
    .tarot-card-mini-grid { grid-template-columns:1fr; }
}
@media (max-width: 680px) {
    .tarot-main { padding-inline:8px !important; }
    .tarot-page .tarot-hero { padding-inline:14px !important; }
    .tarot-page .tarot-hero h1 { font-size:clamp(2.25rem,11.5vw,3.45rem) !important;line-height:1.08 !important;letter-spacing:-.018em !important; }
    .tarot-lead { font-size:.92rem !important;line-height:1.72 !important; }
    .tarot-access-bar { grid-template-columns:1fr;padding:10px; }
    .tarot-credit-pill { grid-template-columns:auto auto 1fr; }
    .tarot-credit-pill>small { grid-column:auto; }
    .tarot-buy-credit { min-height:46px; }
    .tarot-question-card { padding:11px !important; }
    .tarot-question-row textarea { min-height:112px !important;font-size:16px !important; }
    .tarot-primary,.tarot-secondary,.tarot-link-btn { min-height:46px; }
    .tarot-active-question em { margin-left:0;white-space:normal; }
    .tarot-deck-frame { margin-inline:-2px; }
    .tarot-deck-topline { font-size:.67rem;line-height:1.45; }
    .tarot-selected-area { gap:10px; }
    .tarot-slot { min-height:292px !important; }
    .tarot-result-side { justify-content:flex-start; }
    .tarot-answer-panel,.tarot-context-panel,.tarot-insight-card,.tarot-meaning-card,.tarot-reflection { border-radius:18px !important; }
    .tarot-answer-panel { padding:18px !important; }
    .tarot-answer-panel h3 { font-size:1.5rem !important; }
    .tarot-answer-panel p { font-size:.9rem !important;line-height:1.75 !important; }
    .tarot-insight-grid { gap:10px; }
    .tarot-insight-card { padding:14px; }
    .tarot-meaning-card { padding:15px !important; }
    .tarot-meaning-card-top { align-items:flex-start; }
    .tarot-meaning-thumb { width:72px !important;height:104px !important;flex:0 0 72px !important; }
    .tarot-card-reading-block p,.tarot-card-mini-grid p { font-size:.84rem !important; }
    .tarot-context-panel { padding:16px;gap:14px; }
    .tarot-login-gate,.tarot-no-credit { border-radius:22px;padding:25px 16px; }
    .tarot-gate-actions { flex-direction:column; }
    .tarot-gate-actions .tarot-link-btn { width:100%; }
    .tarot-result-actions { gap:8px; }
    .tarot-result-actions .tarot-link-btn { width:100%; }
}
@media (max-width: 390px) {
    .tarot-page .tarot-hero h1 { font-size:2.15rem !important; }
    .tarot-access-main strong { font-size:.84rem; }
    .tarot-section-heading h2,.tarot-result-head h2 { font-size:1.55rem !important; }
    .tarot-meaning-thumb { width:64px !important;height:92px !important;flex-basis:64px !important; }
}

/* V4.1 Vietnamese typography guard — keep accented glyph clusters intact. */
.tarot-page .tarot-hero h1,
.tarot-page :is(.tarot-section-heading h2,.tarot-result-head h2,.tarot-answer-panel h3,.tarot-context-panel h3) {
    font-synthesis: none !important;
    font-feature-settings: "kern" 1, "liga" 1 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    white-space: normal !important;
}
@media (max-width: 430px) {
    .tarot-page .tarot-hero h1 { max-width: 12ch; margin-inline:auto; }
}

/* ========================================================================
   PrimeMC Tarot V5 — cinematic shuffle -> cut -> fan, smooth PC/mobile
   ======================================================================== */
.tarot-deck-frame {
    contain: layout paint;
}
.tarot-shuffle-stage {
    position: absolute;
    z-index: 280;
    inset: 58px 0 40px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 18px;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity .22s ease, visibility 0s linear .22s;
}
.tarot-shuffle-stage.is-active {
    opacity: 1;
    visibility: visible;
    transition: opacity .22s ease;
}
.tarot-shuffle-stack {
    position: relative;
    width: 290px;
    height: 205px;
    filter: drop-shadow(0 24px 34px rgba(0,0,0,.38));
}
.tarot-shuffle-stack::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 58%;
    width: 230px;
    height: 72px;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(246,194,91,.20), rgba(123,95,208,.08) 46%, transparent 72%);
    filter: blur(12px);
}
.tarot-shuffle-card {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 94px;
    aspect-ratio: 520/750;
    border-radius: 12px;
    opacity: 0;
    transform: translate3d(-50%,-50%,0) translate3d(0,48px,0) scale(.9);
    transform-origin: 50% 88%;
    will-change: transform, opacity;
}
.tarot-shuffle-card .tarot-card-back-mini {
    border-radius: 12px;
    box-shadow: inset 0 0 0 3px rgba(3,7,17,.65), inset 0 0 0 5px rgba(255,220,137,.22), 0 12px 28px rgba(0,0,0,.42) !important;
}
.tarot-shuffle-card .tarot-card-back-mini::before { font-size: 2.1rem; }
.tarot-shuffle-card .tarot-card-back-mini::after { inset: 6px; font-size:.43rem; }
.tarot-shuffle-stage.phase-gather .tarot-shuffle-card {
    opacity: 1;
    transform: translate3d(-50%,-50%,0) translate3d(var(--stack-x),var(--stack-y),0) rotate(var(--stack-r)) scale(1);
    transition: transform .42s cubic-bezier(.18,.84,.2,1), opacity .22s ease;
    transition-delay: var(--shuffle-delay);
}
.tarot-shuffle-stage.phase-shuffle .tarot-shuffle-card {
    opacity: 1;
    animation: tarotRiffleShuffle .51s cubic-bezier(.44,.05,.2,.98) 2 both;
    animation-delay: var(--shuffle-delay);
}
@keyframes tarotRiffleShuffle {
    0% { transform:translate3d(-50%,-50%,0) translate3d(var(--stack-x),var(--stack-y),0) rotate(var(--stack-r)) scale(1); }
    28% { transform:translate3d(-50%,-50%,0) translate3d(var(--split-x),-8px,0) rotate(var(--split-r)) scale(.985); }
    55% { transform:translate3d(-50%,-50%,0) translate3d(var(--cross-x),7px,0) rotate(var(--cross-r)) scale(1.012); }
    78% { transform:translate3d(-50%,-50%,0) translate3d(var(--mid-x),-3px,0) rotate(var(--mid-r)) scale(.995); }
    100% { transform:translate3d(-50%,-50%,0) translate3d(var(--stack-x),var(--stack-y),0) rotate(var(--stack-r)) scale(1); }
}
.tarot-shuffle-stage.phase-cut .tarot-shuffle-card {
    opacity: 1;
    transform:translate3d(-50%,-50%,0) translate3d(var(--cut-x),var(--cut-y),0) rotate(var(--stack-r)) scale(.99);
    transition:transform .31s cubic-bezier(.2,.78,.2,1),opacity .18s ease;
    transition-delay:var(--shuffle-delay);
}
.tarot-shuffle-stage.phase-spread .tarot-shuffle-card {
    opacity: .78;
    transform:translate3d(-50%,-50%,0) translate3d(var(--spread-x),var(--spread-y),0) rotate(var(--spread-r)) scale(.86);
    transition:transform .42s cubic-bezier(.18,.78,.2,1),opacity .36s ease;
    transition-delay:var(--shuffle-delay);
}
.tarot-shuffle-stage.is-finished .tarot-shuffle-card {
    opacity: 0;
    transform:translate3d(-50%,-50%,0) translate3d(var(--spread-x),-26px,0) rotate(var(--spread-r)) scale(.74);
    transition:transform .28s ease,opacity .22s ease;
}
.tarot-shuffle-copy {
    min-height: 46px;
    text-align:center;
    transform:translateY(-10px);
}
.tarot-shuffle-copy strong {
    display:block;
    color:#ffe3a4 !important;
    -webkit-text-fill-color:#ffe3a4 !important;
    font-size:.82rem;
    font-weight:900;
    letter-spacing:.13em;
    text-transform:uppercase;
    text-shadow:0 0 20px rgba(246,205,119,.24);
}
.tarot-shuffle-copy small {
    display:block;
    margin-top:5px;
    color:#aaa8b6 !important;
    -webkit-text-fill-color:#aaa8b6 !important;
    font-size:.72rem;
}
.tarot-deck-spread.fan-dealing .tarot-pick-card {
    transition: transform .88s cubic-bezier(.16,.82,.18,1), opacity .54s ease, filter .18s ease !important;
}
.tarot-deck-spread.fan-ready:not(.fan-dealing) .tarot-pick-card {
    transition: opacity .12s linear, filter .16s ease !important;
}
.tarot-deck-spread.fan-ready:not(.fan-dealing) .tarot-card-motion {
    transition: transform .18s cubic-bezier(.16,.86,.2,1), filter .16s ease !important;
}
.tarot-admin-contact {
    min-height:46px;
    padding:12px 17px;
    border-radius:14px;
    color:#201526 !important;
    -webkit-text-fill-color:#201526 !important;
    background:linear-gradient(135deg,#ffe5a4,#c9a5ff) !important;
    border:1px solid rgba(255,242,207,.56) !important;
    box-shadow:0 10px 25px rgba(168,125,222,.18), inset 0 1px rgba(255,255,255,.62);
    font-weight:900;
    transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.tarot-admin-contact:hover { transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 14px 30px rgba(168,125,222,.24); }

/* Keep motion GPU-friendly on mobile and across browsers/OSes. */
.tarot-pick-card,.tarot-card-motion,.tarot-shuffle-card,.tarot-flip-inner { backface-visibility:hidden;-webkit-backface-visibility:hidden; }
@media (max-width: 680px) {
    .tarot-shuffle-stage { inset:54px 0 32px;gap:10px; }
    .tarot-shuffle-stack { width:220px;height:158px; }
    .tarot-shuffle-card { width:72px;border-radius:10px; }
    .tarot-shuffle-copy { transform:translateY(-4px); }
    .tarot-shuffle-copy strong { font-size:.73rem; }
    .tarot-shuffle-copy small { max-width:270px;font-size:.66rem;line-height:1.45; }
    .tarot-deck-spread.fan-dealing .tarot-pick-card { transition-duration:.72s,.42s,.14s !important; }
    .tarot-deck-frame { box-shadow:0 18px 46px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.03) !important; }
}
@media (hover:none) and (pointer:coarse) {
    .tarot-pick-card:active .tarot-card-motion { transform:translateY(-18px) scale(1.055);filter:brightness(1.08); }
}
@media (prefers-reduced-motion: reduce) {
    .tarot-shuffle-stage,.tarot-shuffle-card,.tarot-deck-spread.fan-dealing .tarot-pick-card { animation:none !important;transition:none !important; }
}

/* V6 internal-route arrival: subtle Tarot-only staging, no page/background scaling. */
html[data-route-to="tarot"] body.prime-route-entering .tarot-eyebrow {
    animation: tarotRouteDetailIn .42s cubic-bezier(.16,.84,.2,1) .04s both;
}
html[data-route-to="tarot"] body.prime-route-entering .tarot-hero h1 {
    animation: tarotRouteDetailIn .48s cubic-bezier(.16,.84,.2,1) .08s both;
}
html[data-route-to="tarot"] body.prime-route-entering .tarot-lead {
    animation: tarotRouteDetailIn .46s cubic-bezier(.16,.84,.2,1) .13s both;
}
html[data-route-to="tarot"] body.prime-route-entering .tarot-access-bar,
html[data-route-to="tarot"] body.prime-route-entering .tarot-question-card {
    animation: tarotRouteDetailIn .5s cubic-bezier(.16,.84,.2,1) .17s both;
}
@keyframes tarotRouteDetailIn {
    from { opacity:0; transform:translate3d(0,10px,0); }
    to { opacity:1; transform:translate3d(0,0,0); }
}
@media (prefers-reduced-motion: reduce) {
    html[data-route-to="tarot"] body.prime-route-entering :is(.tarot-eyebrow,.tarot-hero h1,.tarot-lead,.tarot-access-bar,.tarot-question-card) {
        animation:none!important;
    }
}

/* V7 faster route detail staging: visible immediately, no long stagger. */
html[data-route-to="tarot"] body.prime-route-entering .tarot-eyebrow{animation-duration:.32s!important;animation-delay:.02s!important}
html[data-route-to="tarot"] body.prime-route-entering .tarot-hero h1{animation-duration:.36s!important;animation-delay:.045s!important}
html[data-route-to="tarot"] body.prime-route-entering .tarot-lead{animation-duration:.34s!important;animation-delay:.07s!important}
html[data-route-to="tarot"] body.prime-route-entering .tarot-access-bar,
html[data-route-to="tarot"] body.prime-route-entering .tarot-question-card{animation-duration:.38s!important;animation-delay:.095s!important}

/* ===== PrimeMC Tarot V20 · Gemini interpretation state ===== */
.tarot-ai-loader {
    margin: 18px 0;
    min-height: 138px;
    border: 1px solid rgba(246,213,138,.26) !important;
    border-radius: 24px;
    background:
        radial-gradient(circle at 18% 50%, rgba(151,114,255,.13), transparent 34%),
        linear-gradient(145deg, rgba(8,16,34,.94), rgba(12,19,39,.88));
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 24px;
    color: var(--tarot-ink) !important;
    box-shadow: 0 18px 46px rgba(0,0,0,.22), inset 0 0 40px rgba(137,106,255,.035);
}
.tarot-ai-loader[hidden] { display: none !important; }
.tarot-ai-loader strong { display:block; color:#fff7e6 !important; font-size:1.05rem; margin-bottom:5px; }
.tarot-ai-loader p { margin:0; color:#c9c5d4 !important; line-height:1.55; }
.tarot-ai-orbit { width:58px; height:58px; border-radius:50%; position:relative; flex:0 0 auto; border:1px solid rgba(246,213,138,.25); box-shadow:0 0 34px rgba(153,119,255,.12); }
.tarot-ai-orbit::before,.tarot-ai-orbit::after { content:""; position:absolute; inset:7px; border-radius:50%; border:1px solid rgba(246,213,138,.22); }
.tarot-ai-orbit::after { inset:17px; background:radial-gradient(circle,#f6d58a 0 16%,rgba(157,140,255,.42) 18% 42%,transparent 45%); border:0; }
.tarot-ai-orbit span,.tarot-ai-orbit i { position:absolute; width:8px; height:8px; border-radius:50%; background:#f6d58a; top:50%; left:50%; margin:-4px; transform-origin:4px 4px; animation:tarotAiOrbit 1.25s linear infinite; box-shadow:0 0 16px rgba(246,213,138,.75); }
.tarot-ai-orbit i { width:6px; height:6px; margin:-3px; background:#b9a6ff; animation-duration:1.85s; animation-direction:reverse; }
@keyframes tarotAiOrbit { from{transform:rotate(0deg) translateX(25px)} to{transform:rotate(360deg) translateX(25px)} }
.tarot-result.is-ai-loading > :not(.tarot-result-head):not(.tarot-ai-loader) { display:none !important; }
.tarot-answer-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.tarot-answer-meta { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.tarot-reading-engine { display:inline-flex; align-items:center; min-height:28px; padding:5px 9px; border-radius:999px; font-size:.7rem; font-weight:900; letter-spacing:.04em; color:#d7d4df !important; border:1px solid rgba(255,255,255,.09); background:rgba(255,255,255,.035); }
.tarot-reading-engine:empty { display:none; }
.tarot-reading-engine.is-gemini { color:#f9e5ff !important; border-color:rgba(185,151,255,.3); background:linear-gradient(135deg,rgba(121,83,211,.13),rgba(246,213,138,.07)); box-shadow:0 0 22px rgba(138,102,227,.08); }
.tarot-reading-engine.is-local { color:#c8c4cf !important; opacity:.8; }
.tarot-card-connection { margin-top:12px; padding:12px 13px; border-radius:14px; border:1px solid rgba(157,140,255,.15); background:rgba(139,112,224,.055); }
.tarot-card-connection small,.tarot-card-reading-block small,.tarot-card-mini-grid small { color:var(--tarot-gold) !important; font-size:.66rem; letter-spacing:.1em; font-weight:950; }
.tarot-card-connection p { margin:5px 0 0 !important; }

@media (max-width:680px){
    .tarot-ai-loader{min-height:126px;padding:18px 15px;gap:14px;align-items:flex-start}
    .tarot-ai-orbit{width:48px;height:48px;margin-top:3px}
    .tarot-ai-orbit span{animation-name:tarotAiOrbitMobile}
    .tarot-ai-orbit i{animation-name:tarotAiOrbitMobile}
    .tarot-answer-meta{justify-content:flex-start}
}
@keyframes tarotAiOrbitMobile { from{transform:rotate(0deg) translateX(20px)} to{transform:rotate(360deg) translateX(20px)} }
@media (prefers-reduced-motion:reduce){.tarot-ai-orbit span,.tarot-ai-orbit i{animation:none!important}}
.tarot-ai-capability{display:inline-flex;align-items:center;justify-content:center;margin:13px auto 0;padding:7px 11px;border-radius:999px;color:#eadcff!important;background:rgba(126,91,205,.09);border:1px solid rgba(182,151,255,.2);font-size:.72rem;font-weight:900;letter-spacing:.045em;box-shadow:0 0 26px rgba(145,101,224,.06)}

/* ========================================================================
   PrimeMC Tarot V22 — answer-first AI reading
   Prioritises direct answer, observable signs and flexible time windows.
   ======================================================================== */
.tarot-question-focus {
    margin: 0 0 10px !important;
    color: #aeb4c7 !important;
    font-size: .82rem !important;
    line-height: 1.55 !important;
    font-weight: 750;
}
.tarot-trend-line {
    margin-top: 18px;
    display: grid;
    grid-template-columns: auto auto minmax(0,1fr);
    gap: 9px 12px;
    align-items: center;
    padding: 13px 14px;
    border-radius: 16px;
    border: 1px solid rgba(246,213,138,.22);
    background: linear-gradient(135deg,rgba(246,213,138,.09),rgba(142,111,219,.06));
}
.tarot-trend-line[hidden] { display:none !important; }
.tarot-trend-line > span {
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:5px 10px;
    border-radius:999px;
    color:#10131b !important;
    background:linear-gradient(135deg,#f8df9c,#d6a956);
    font-size:.76rem;
    font-weight:950;
    letter-spacing:.02em;
}
.tarot-trend-line > b {
    color:#f5dfaa !important;
    font-size:.77rem;
    white-space:nowrap;
}
.tarot-trend-line > p {
    margin:0 !important;
    color:#c9c8d0 !important;
    font-size:.86rem !important;
    line-height:1.55 !important;
}

.tarot-priority-grid,
.tarot-scenario-panel,
.tarot-signals-panel,
.tarot-timeline-panel,
.tarot-action-panel {
    margin-top:16px;
}
.tarot-priority-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.tarot-priority-grid > article,
.tarot-scenario-card,
.tarot-signals-grid > article,
.tarot-timeline-panel,
.tarot-action-panel {
    border:1px solid rgba(157,140,255,.16);
    background:linear-gradient(145deg,rgba(11,20,39,.91),rgba(6,12,25,.94));
    box-shadow:0 16px 38px rgba(0,0,0,.19),inset 0 1px 0 rgba(255,255,255,.025);
}
.tarot-priority-grid > article {
    min-height:160px;
    padding:18px;
    border-radius:20px;
}
.tarot-priority-grid small,
.tarot-scenario-card small,
.tarot-signals-grid small {
    display:block;
    color:#e7c77d !important;
    font-size:.68rem;
    line-height:1.45;
    font-weight:950;
    letter-spacing:.095em;
}
.tarot-priority-grid p,
.tarot-scenario-card p,
.tarot-signals-grid p {
    margin:9px 0 0;
    color:#c8c7cf !important;
    font-size:.9rem;
    line-height:1.68;
}
.tarot-scenario-panel {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}
.tarot-scenario-card {
    position:relative;
    padding:18px 20px;
    border-radius:20px;
    overflow:hidden;
}
.tarot-scenario-card.is-primary::before {
    content:'';
    position:absolute;
    inset:0 auto 0 0;
    width:3px;
    background:linear-gradient(#f1cf7d,#8d71d9);
}

.tarot-panel-title {
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:14px;
    margin-bottom:14px;
}
.tarot-panel-title p {
    margin:0;
    color:#9296a5 !important;
    font-size:.76rem;
    line-height:1.5;
    text-align:right;
}
.tarot-timeline-panel,
.tarot-action-panel {
    border-radius:24px;
    padding:20px;
}
.tarot-timeline {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:10px;
}
.tarot-time-card {
    display:grid;
    grid-template-columns:32px minmax(0,1fr);
    gap:10px;
    min-height:185px;
    padding:14px;
    border-radius:17px;
    border:1px solid rgba(246,213,138,.13);
    background:rgba(255,255,255,.025);
}
.tarot-time-index {
    display:flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    border-radius:50%;
    background:rgba(246,213,138,.10);
    color:#eacb82 !important;
    font-size:.68rem;
    font-weight:950;
}
.tarot-time-head {
    display:flex;
    flex-direction:column;
    gap:3px;
}
.tarot-time-head strong { color:#fff2d2 !important;font-size:.91rem;line-height:1.3; }
.tarot-time-head span { color:#a78bc8 !important;font-size:.7rem;font-weight:850; }
.tarot-time-card p { margin:9px 0 8px;color:#c7c6ce !important;font-size:.82rem;line-height:1.58; }
.tarot-time-card small { display:block;color:#aeb2bf !important;font-size:.72rem;line-height:1.5; }
.tarot-time-card em { display:block;margin-top:7px;color:#d1b36d !important;font-size:.67rem;line-height:1.45;font-style:normal; }

.tarot-signals-panel {
    border-radius:24px;
    padding:20px;
    border:1px solid rgba(157,140,255,.14);
    background:radial-gradient(circle at 50% 0,rgba(130,99,203,.08),transparent 34%),rgba(6,12,25,.72);
}
.tarot-signals-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:11px;
}
.tarot-signals-grid > article {
    border-radius:17px;
    padding:15px;
}
.tarot-signals-grid > article.is-positive { border-color:rgba(91,202,132,.22); }
.tarot-signals-grid > article.is-warning { border-color:rgba(230,125,137,.22); }
.tarot-signals-grid > article.is-confirm { border-color:rgba(246,213,138,.22); }
.tarot-signal-item {
    display:grid;
    grid-template-columns:16px minmax(0,1fr);
    gap:7px;
    align-items:start;
    margin-top:9px;
}
.tarot-signal-item span { color:#d7b966 !important;font-size:.69rem;line-height:1.65; }
.tarot-signal-item p { margin:0 !important;font-size:.81rem !important;line-height:1.55 !important; }
.tarot-empty-note { color:#8e93a2 !important;font-size:.78rem !important;font-style:italic; }

.tarot-action-list {
    display:grid;
    gap:8px;
}
.tarot-action-step {
    display:grid;
    grid-template-columns:38px minmax(0,1fr);
    gap:10px;
    align-items:center;
    padding:10px 12px;
    border-radius:15px;
    border:1px solid rgba(246,213,138,.12);
    background:rgba(255,255,255,.024);
}
.tarot-action-step > span {
    display:flex;
    width:32px;
    height:32px;
    align-items:center;
    justify-content:center;
    border-radius:11px;
    color:#0d1220 !important;
    background:linear-gradient(135deg,#f3d58d,#c99d4d);
    font-size:.7rem;
    font-weight:950;
}
.tarot-action-step p { margin:0;color:#d1cfd6 !important;font-size:.86rem;line-height:1.58; }

/* V22 card roles are analytical roles, not fixed past/present/future timestamps. */
.tarot-slot-copy span { max-width:100%; }

:root[data-theme="light"] .tarot-page :is(.tarot-priority-grid>article,.tarot-scenario-card,.tarot-timeline-panel,.tarot-action-panel,.tarot-signals-grid>article,.tarot-signals-panel) {
    border-color:rgba(116,77,128,.16) !important;
    background:linear-gradient(145deg,rgba(255,253,248,.94),rgba(243,236,229,.88)) !important;
    box-shadow:0 14px 38px rgba(65,49,71,.08),inset 0 1px 0 rgba(255,255,255,.8) !important;
}
:root[data-theme="light"] .tarot-page .tarot-question-focus,
:root[data-theme="light"] .tarot-page :is(.tarot-priority-grid p,.tarot-scenario-card p,.tarot-signals-grid p,.tarot-time-card p,.tarot-action-step p) {
    color:#625b67 !important;
    -webkit-text-fill-color:#625b67 !important;
}
:root[data-theme="light"] .tarot-page :is(.tarot-priority-grid small,.tarot-scenario-card small,.tarot-signals-grid small,.tarot-time-card em) {
    color:#98621e !important;
    -webkit-text-fill-color:#98621e !important;
}
:root[data-theme="light"] .tarot-page .tarot-trend-line {
    border-color:rgba(141,91,35,.18);
    background:linear-gradient(135deg,rgba(197,139,60,.11),rgba(111,78,126,.06));
}
:root[data-theme="light"] .tarot-page .tarot-trend-line > b { color:#754c74 !important; }
:root[data-theme="light"] .tarot-page .tarot-trend-line > p { color:#655d69 !important; }
:root[data-theme="light"] .tarot-page .tarot-time-card,
:root[data-theme="light"] .tarot-page .tarot-action-step {
    border-color:rgba(116,77,128,.12);
    background:rgba(255,255,255,.44);
}
:root[data-theme="light"] .tarot-page .tarot-time-head strong { color:#4c3555 !important; }
:root[data-theme="light"] .tarot-page .tarot-time-head span { color:#7b5790 !important; }
:root[data-theme="light"] .tarot-page .tarot-time-card small { color:#716978 !important; }
:root[data-theme="light"] .tarot-page .tarot-panel-title p { color:#746c77 !important; }

@media (max-width: 980px) {
    .tarot-priority-grid { grid-template-columns:1fr; }
    .tarot-scenario-panel { grid-template-columns:1fr; }
    .tarot-signals-grid { grid-template-columns:1fr; }
    .tarot-priority-grid > article { min-height:0; }
}
@media (max-width: 680px) {
    .tarot-trend-line { grid-template-columns:1fr;gap:7px;padding:12px; }
    .tarot-trend-line > span,.tarot-trend-line > b { justify-self:start; }
    .tarot-panel-title { align-items:flex-start;flex-direction:column;gap:4px; }
    .tarot-panel-title p { text-align:left; }
    .tarot-timeline-panel,.tarot-signals-panel,.tarot-action-panel { padding:14px;border-radius:18px; }
    .tarot-timeline { grid-template-columns:1fr; }
    .tarot-time-card { min-height:0; }
    .tarot-priority-grid > article,.tarot-scenario-card { padding:15px;border-radius:17px; }
}
.tarot-card-evidence { margin-top:12px; padding:11px 12px; border-radius:14px; border:1px solid rgba(246,213,138,.14); background:rgba(246,213,138,.04); }
.tarot-card-evidence small { color:#e2bd72 !important; font-size:.66rem; letter-spacing:.1em; font-weight:950; }
.tarot-card-evidence p { margin:5px 0 0 !important; color:#bbb9c4 !important; font-size:.82rem !important; line-height:1.55 !important; }
:root[data-theme="light"] .tarot-page .tarot-card-evidence { border-color:rgba(152,98,30,.16); background:rgba(197,139,60,.055); }
:root[data-theme="light"] .tarot-page .tarot-card-evidence small { color:#96621e !important; }
:root[data-theme="light"] .tarot-page .tarot-card-evidence p { color:#655d69 !important; }

/* ===== Tarot V23: kết luận ghép lá, rút gọn nội dung ===== */
.tarot-combined-panel,
.tarot-essential-panel,
.tarot-watch-panel,
.tarot-bottom-line,
.tarot-evidence-drawer {
    border:1px solid rgba(246,213,138,.14);
    background:linear-gradient(145deg,rgba(7,14,29,.90),rgba(10,17,33,.82));
    border-radius:24px;
    box-shadow:0 18px 46px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.035);
}
.tarot-combined-panel,.tarot-essential-panel,.tarot-watch-panel { padding:20px; }
.tarot-combined-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; }
.tarot-combined-card {
    position:relative;overflow:hidden;padding:17px;border-radius:18px;
    border:1px solid rgba(224,186,103,.16);
    background:radial-gradient(circle at 90% 0,rgba(188,143,63,.09),transparent 34%),rgba(255,255,255,.025);
}
.tarot-combined-card::after { content:"";position:absolute;inset:auto 14px 0;height:1px;background:linear-gradient(90deg,transparent,rgba(246,213,138,.28),transparent); }
.tarot-combined-head { display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:start; }
.tarot-combined-head>span { width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#f0d38c,#b98739);color:#111827;font-size:.7rem;font-weight:950;box-shadow:0 0 20px rgba(225,181,87,.16); }
.tarot-combined-head small { display:block;color:#d3b36c !important;font-size:.65rem;font-weight:900;letter-spacing:.07em;line-height:1.4; }
.tarot-combined-head h4 { margin:3px 0 0;color:#fff2d8 !important;font-size:1rem;line-height:1.35; }
.tarot-combined-head b { padding:5px 8px;border-radius:999px;border:1px solid rgba(246,213,138,.14);background:rgba(246,213,138,.06);color:#e4c87e !important;font-size:.65rem;white-space:nowrap; }
.tarot-combined-conclusion { margin:13px 0 0;color:#e8e5ea !important;font-size:.94rem;line-height:1.65; }
.tarot-combined-reason { margin:10px 0 0;padding-top:10px;border-top:1px solid rgba(255,255,255,.06);color:#9ea4b3 !important;font-size:.78rem;line-height:1.55; }
.tarot-combined-reason strong { color:#cfb06c !important; }

.tarot-essential-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.tarot-essential-grid>article { padding:15px 16px;border-radius:16px;border:1px solid rgba(159,133,214,.14);background:rgba(255,255,255,.022); }
.tarot-essential-grid small { color:#d3b36c !important;font-size:.68rem;font-weight:950;letter-spacing:.08em; }
.tarot-essential-grid p { margin:7px 0 0;color:#d8d5df !important;font-size:.87rem;line-height:1.6; }
.tarot-essential-grid em { display:block;margin-top:8px;color:#8f95a8 !important;font-size:.68rem;font-style:normal; }

.tarot-watch-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.tarot-watch-item { display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;padding:11px 12px;border-radius:14px;background:rgba(255,255,255,.022);border:1px solid rgba(103,184,146,.12); }
.tarot-watch-item span { color:#d9ba6c !important;line-height:1.6; }
.tarot-watch-item p { margin:0;color:#c9c7d0 !important;font-size:.82rem;line-height:1.55; }

.tarot-bottom-line { padding:16px 18px;background:linear-gradient(135deg,rgba(181,132,50,.10),rgba(107,72,139,.07)); }
.tarot-bottom-line span { display:block;color:#e1bf73 !important;font-size:.68rem;font-weight:950;letter-spacing:.12em; }
.tarot-bottom-line p { margin:6px 0 0;color:#eee7dc !important;font-size:.94rem;line-height:1.62;font-weight:650; }

.tarot-evidence-drawer { padding:0;overflow:hidden; }
.tarot-evidence-drawer summary { cursor:pointer;list-style:none;display:flex;align-items:center;gap:10px;padding:15px 18px;color:#d9c384 !important;font-size:.84rem;font-weight:900;user-select:none;transition:background .18s ease,color .18s ease; }
.tarot-evidence-drawer summary::-webkit-details-marker { display:none; }
.tarot-evidence-drawer summary:hover { background:rgba(246,213,138,.045);color:#ffe8a9 !important; }
.tarot-evidence-drawer[open] summary { border-bottom:1px solid rgba(246,213,138,.10); }
.tarot-evidence-intro { margin:14px 18px 0;color:#9299a8 !important;font-size:.78rem;line-height:1.55; }
.tarot-evidence-drawer .tarot-meaning-grid { padding:14px 18px 6px; }
.tarot-meaning-card.is-compact .tarot-card-mini-grid,.tarot-meaning-card.is-compact .tarot-card-evidence { display:none !important; }
.tarot-evidence-caution { margin:6px 18px 18px;padding:12px 14px;border-radius:14px;border:1px solid rgba(220,123,134,.12);background:rgba(220,123,134,.035); }
.tarot-evidence-caution small { color:#d9a0a8 !important;font-size:.66rem;font-weight:950;letter-spacing:.09em; }
.tarot-evidence-caution p { margin:5px 0 0;color:#aaa7b0 !important;font-size:.78rem;line-height:1.55; }

/* Hide V22-only blocks if older markup survives a partial upload. */
.tarot-priority-grid,.tarot-scenario-panel,.tarot-signals-panel,.tarot-insight-grid,.tarot-context-panel { }

:root[data-theme="light"] .tarot-page :is(.tarot-combined-panel,.tarot-essential-panel,.tarot-watch-panel,.tarot-bottom-line,.tarot-evidence-drawer) {
    border-color:rgba(127,84,119,.16) !important;
    background:linear-gradient(145deg,rgba(255,253,248,.96),rgba(244,238,232,.92)) !important;
    box-shadow:0 14px 34px rgba(69,48,67,.08),inset 0 1px 0 #fff !important;
}
:root[data-theme="light"] .tarot-page .tarot-combined-card,
:root[data-theme="light"] .tarot-page .tarot-essential-grid>article,
:root[data-theme="light"] .tarot-page .tarot-watch-item { background:rgba(255,255,255,.56) !important;border-color:rgba(127,84,119,.12) !important; }
:root[data-theme="light"] .tarot-page .tarot-combined-head h4 { color:#49354f !important;-webkit-text-fill-color:#49354f !important; }
:root[data-theme="light"] .tarot-page :is(.tarot-combined-conclusion,.tarot-essential-grid p,.tarot-watch-item p,.tarot-bottom-line p) { color:#625964 !important;-webkit-text-fill-color:#625964 !important; }
:root[data-theme="light"] .tarot-page :is(.tarot-combined-head small,.tarot-essential-grid small,.tarot-bottom-line span) { color:#98621e !important;-webkit-text-fill-color:#98621e !important; }
:root[data-theme="light"] .tarot-page .tarot-combined-reason { color:#7a707a !important;-webkit-text-fill-color:#7a707a !important; }

@media (max-width: 900px) {
    .tarot-combined-grid,.tarot-essential-grid,.tarot-watch-list { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
    .tarot-combined-panel,.tarot-essential-panel,.tarot-watch-panel { padding:14px;border-radius:18px; }
    .tarot-combined-card { padding:14px;border-radius:16px; }
    .tarot-combined-head { grid-template-columns:32px minmax(0,1fr); }
    .tarot-combined-head>b { grid-column:2;justify-self:start;margin-top:-2px; }
    .tarot-combined-conclusion { font-size:.9rem; }
    .tarot-evidence-drawer summary { padding:14px; }
    .tarot-evidence-drawer .tarot-meaning-grid { padding:12px 14px 4px; }
}

/* ===== Tarot V24: Answer-first, compact and direct ===== */
.tarot-card-summary-panel,
.tarot-direct-card {
    border:1px solid rgba(246,213,138,.15);
    background:linear-gradient(180deg,rgba(9,18,34,.86),rgba(8,15,29,.72));
    box-shadow:0 18px 42px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.025);
}
.tarot-card-summary-panel { padding:20px;border-radius:22px; }
.tarot-card-summary-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px; }
.tarot-card-summary-item { display:grid;grid-template-columns:62px minmax(0,1fr);gap:12px;align-items:center;padding:12px;border:1px solid rgba(246,213,138,.10);border-radius:16px;background:rgba(255,255,255,.022);min-width:0; }
.tarot-card-summary-thumb { width:58px;aspect-ratio:2/3;border-radius:9px;overflow:hidden;border:1px solid rgba(246,213,138,.24);box-shadow:0 10px 24px rgba(0,0,0,.24); }
.tarot-card-summary-thumb img { width:100%;height:100%;object-fit:cover;display:block; }
.tarot-card-summary-thumb.is-reversed img { transform:rotate(180deg); }
.tarot-card-summary-item small { display:block;color:#c8a96b !important;font-size:.64rem;font-weight:900;letter-spacing:.08em;margin-bottom:3px; }
.tarot-card-summary-item strong { display:block;color:#f8f3e8 !important;font-size:.92rem;line-height:1.25;margin-bottom:5px; }
.tarot-card-summary-item p { margin:0;color:#b8bdc9 !important;font-size:.79rem;line-height:1.52 !important; }

.tarot-answer-panel-v24 { border-color:rgba(246,213,138,.26) !important;background:radial-gradient(circle at 84% 18%,rgba(225,181,88,.09),transparent 28%),linear-gradient(180deg,rgba(10,19,36,.94),rgba(7,14,28,.88)) !important; }
.tarot-answer-panel-v24 #tarot-answer-summary { color:#f2eee5 !important;font-size:1.04rem !important;line-height:1.75 !important;font-weight:650; }
.tarot-question-focus { opacity:.72; }

.tarot-direct-grid { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.tarot-direct-card { border-radius:20px;padding:18px;min-width:0; }
.tarot-direct-card.tarot-direct-next { grid-column:1/-1;background:linear-gradient(180deg,rgba(23,28,50,.88),rgba(8,16,31,.80));border-color:rgba(184,154,255,.17); }
.tarot-direct-card p { margin:10px 0 0;color:#d3d5dc !important;font-size:.92rem;line-height:1.7 !important; }
.tarot-direct-why p { color:#c6c9d1 !important; }
.tarot-direct-next p { color:#eee8f8 !important;font-weight:620; }

.tarot-combined-panel-v24[hidden],
#tarot-watch-panel[hidden] { display:none !important; }
.tarot-bottom-line-v24 { border-color:rgba(246,213,138,.20) !important;background:linear-gradient(90deg,rgba(228,179,84,.065),rgba(142,100,213,.045)) !important; }
.tarot-bottom-line-v24 p { color:#f0ebdf !important;font-weight:700; }

:root[data-theme="light"] .tarot-page .tarot-card-summary-panel,
:root[data-theme="light"] .tarot-page .tarot-direct-card {
    border-color:rgba(93,65,126,.16);
    background:linear-gradient(180deg,rgba(255,252,247,.94),rgba(248,243,238,.90));
    box-shadow:0 14px 34px rgba(70,52,91,.08), inset 0 1px 0 rgba(255,255,255,.75);
}
:root[data-theme="light"] .tarot-page .tarot-card-summary-item { border-color:rgba(105,76,132,.13);background:rgba(255,255,255,.64); }
:root[data-theme="light"] .tarot-page .tarot-card-summary-item small { color:#8a6232 !important; }
:root[data-theme="light"] .tarot-page .tarot-card-summary-item strong { color:#34253f !important; }
:root[data-theme="light"] .tarot-page .tarot-card-summary-item p,
:root[data-theme="light"] .tarot-page .tarot-direct-card p { color:#5f5867 !important; }
:root[data-theme="light"] .tarot-page .tarot-answer-panel-v24 { background:linear-gradient(180deg,rgba(255,251,244,.97),rgba(249,243,238,.94)) !important;border-color:rgba(138,97,49,.20) !important; }
:root[data-theme="light"] .tarot-page .tarot-answer-panel-v24 #tarot-answer-summary { color:#302839 !important; }
:root[data-theme="light"] .tarot-page .tarot-direct-card.tarot-direct-next { background:linear-gradient(180deg,rgba(249,245,255,.95),rgba(244,239,250,.92));border-color:rgba(103,71,136,.16); }
:root[data-theme="light"] .tarot-page .tarot-direct-next p,
:root[data-theme="light"] .tarot-page .tarot-bottom-line-v24 p { color:#3c3048 !important; }

@media (max-width: 820px) {
    .tarot-card-summary-grid { grid-template-columns:1fr;gap:9px; }
    .tarot-card-summary-item { grid-template-columns:50px minmax(0,1fr);padding:10px; }
    .tarot-card-summary-thumb { width:48px;border-radius:7px; }
    .tarot-card-summary-item p { font-size:.77rem;line-height:1.48 !important; }
    .tarot-direct-grid { grid-template-columns:1fr;gap:10px; }
    .tarot-direct-card.tarot-direct-next { grid-column:auto; }
    .tarot-direct-card { padding:14px;border-radius:17px; }
    .tarot-answer-panel-v24 #tarot-answer-summary { font-size:.94rem !important;line-height:1.68 !important; }
}

@media (max-width: 520px) {
    .tarot-card-summary-panel { padding:13px;border-radius:17px; }
    .tarot-card-summary-item { grid-template-columns:44px minmax(0,1fr);gap:9px; }
    .tarot-card-summary-thumb { width:42px; }
    .tarot-card-summary-item strong { font-size:.84rem; }
    .tarot-card-summary-item p { font-size:.74rem; }
    .tarot-direct-card p { font-size:.84rem;line-height:1.6 !important; }
}