/* Spiritual intention panel + display for Tarot / I Ching / Runes. */

/* --- Input panel: the seeker sets a number and an intention before the throw --- */
.spirit-intent {
    display: flex; gap: 1rem; flex-wrap: wrap; align-items: stretch;
    margin: 0 0 1rem; padding: 1rem 1.1rem; border-radius: 16px;
    background:
        radial-gradient(120% 140% at 0% 0%, rgba(109,74,166,.28), transparent 60%),
        radial-gradient(120% 140% at 100% 100%, rgba(245,215,110,.14), transparent 55%),
        linear-gradient(160deg, #191430, #120f24);
    border: 1px solid rgba(245,215,110,.35);
    box-shadow: inset 0 0 40px rgba(109,74,166,.18), 0 10px 30px rgba(0,0,0,.35);
}
.spirit-intent__num { display: flex; flex-direction: column; align-items: center; gap: .4rem; }
.spirit-intent__num > label, .spirit-intent__why > label {
    font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
    color: #e7c65a; font-family: Georgia, serif;
}
.spirit-intent__num input {
    width: 88px; height: 88px; border-radius: 50%; text-align: center;
    font-size: 2rem; font-weight: 700; font-family: Georgia, serif;
    color: #fde6a6; background: radial-gradient(circle at 50% 35%, #2a2050, #140f28);
    border: 2px solid rgba(245,215,110,.6);
    box-shadow: 0 0 22px rgba(245,215,110,.35), inset 0 0 18px rgba(109,74,166,.5);
    outline: none; transition: box-shadow .2s, border-color .2s;
}
.spirit-intent__num input:focus { border-color: #f5d76e; box-shadow: 0 0 30px rgba(245,215,110,.6), inset 0 0 18px rgba(109,74,166,.6); }
.spirit-intent__num input::placeholder { color: rgba(253,230,166,.35); font-size: 1.1rem; }
.spirit-intent__why { flex: 1 1 240px; display: flex; flex-direction: column; gap: .4rem; }
.spirit-intent__why textarea {
    flex: 1 1 auto; min-height: 66px; resize: vertical; border-radius: 10px;
    padding: .6rem .8rem; font-family: Georgia, serif; font-size: .95rem; line-height: 1.45;
    color: #efeaff; background: rgba(10,8,22,.55); border: 1px solid rgba(245,215,110,.28);
    outline: none;
}
.spirit-intent__why textarea:focus { border-color: rgba(245,215,110,.6); box-shadow: 0 0 16px rgba(109,74,166,.35); }
.spirit-intent__why textarea::placeholder { color: rgba(220,215,240,.4); font-style: italic; }

/* --- Display: the sacred intention shown with a thrown / reopened reading --- */
.sacred-intent {
    display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap;
    margin: 1rem 0; padding: 1rem 1.2rem; border-radius: 16px;
    background:
        radial-gradient(120% 160% at 100% 0%, rgba(245,215,110,.12), transparent 55%),
        linear-gradient(160deg, #1b1536, #130f28);
    border: 1px solid rgba(245,215,110,.4);
    box-shadow: inset 0 0 46px rgba(109,74,166,.22), 0 12px 34px rgba(0,0,0,.4);
    position: relative;
}
.sacred-intent__num {
    flex: 0 0 auto; width: 76px; height: 76px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 2.1rem; font-weight: 800; font-family: Georgia, serif; color: #fde6a6;
    background: radial-gradient(circle at 50% 32%, #2c2154, #130e28);
    border: 2px solid rgba(245,215,110,.7);
    box-shadow: 0 0 26px rgba(245,215,110,.5), inset 0 0 20px rgba(109,74,166,.6);
    text-shadow: 0 0 14px rgba(245,215,110,.7);
}
.sacred-intent__body { flex: 1 1 220px; min-width: 0; }
.sacred-intent__label {
    font-size: .74rem; letter-spacing: .2em; text-transform: uppercase;
    color: #e7c65a; font-family: Georgia, serif; margin-bottom: .25rem;
}
.sacred-intent__text { color: #efeaff; font-family: Georgia, serif; font-size: 1.05rem; line-height: 1.5; font-style: italic; white-space: pre-wrap; }