/* Інтерактивний розклад на сторінці любовного таро. */
[data-love-tarot] { --tarot-night:#211c3a; --tarot-plum:#44324a; --tarot-copper:#b8815f; --tarot-cream:#fffaf3; --tarot-line:#e8d9cb; position:relative; left:50%; width:min(1080px,calc(100vw - 32px)); max-width:none; margin:clamp(2rem,5vw,4rem) 0; transform:translateX(-50%); border:1px solid var(--tarot-line); border-radius:24px; overflow:hidden; background:var(--tarot-cream); color:var(--tarot-night); box-shadow:0 25px 80px rgba(38,28,50,.12); font-family:"Nunito Sans",sans-serif; line-height:1.5; }
[data-love-tarot] *,[data-love-tarot] *::before,[data-love-tarot] *::after { box-sizing:border-box; }
[data-love-tarot] [hidden] { display:none !important; }
[data-love-tarot] button,[data-love-tarot] textarea { font:inherit; }
[data-love-tarot] button { cursor:pointer; }
[data-love-tarot] button:focus-visible,[data-love-tarot] textarea:focus-visible,[data-love-tarot] h3:focus-visible { outline:3px solid #c78458; outline-offset:3px; }
[data-love-tarot] .lft-tarot__sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
[data-love-tarot] .lft-tarot__top { position:relative; isolation:isolate; overflow:hidden; padding:clamp(30px,5vw,64px); color:#fffaf3; background:radial-gradient(circle at 85% 20%,rgba(184,129,95,.25),transparent 29%),linear-gradient(125deg,#211c3a,#49364b); }
[data-love-tarot] .lft-tarot__top::after { content:""; position:absolute; z-index:-1; right:-80px; top:-100px; width:360px; height:360px; border:1px solid rgba(235,201,155,.28); border-radius:50%; box-shadow:0 0 0 33px rgba(235,201,155,.055),0 0 0 70px rgba(235,201,155,.04); }
[data-love-tarot] .lft-tarot__eyebrow,[data-love-tarot] .lft-tarot__step { margin:0 0 10px; color:#edc994; font-size:.74rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
[data-love-tarot] .lft-tarot__eyebrow span { margin:0 .45em; }
[data-love-tarot] .lft-tarot__top h2 { max-width:740px; margin:0; color:#fffaf3; font:600 clamp(2.1rem,5vw,4.15rem)/1.06 "Petrona",Georgia,serif; letter-spacing:-.025em; }
[data-love-tarot] .lft-tarot__top > p:not(.lft-tarot__eyebrow) { max-width:660px; margin:18px 0 0; color:#ebe3e4; font-size:1.05rem; line-height:1.65; }
[data-love-tarot] .lft-tarot__progress { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; max-width:670px; margin-top:32px; padding-top:16px; border-top:1px solid rgba(255,255,255,.28); color:#f5e9dd; font-size:.82rem; font-weight:700; letter-spacing:.04em; }
[data-love-tarot] .lft-tarot__body { position:relative; padding:clamp(24px,5vw,56px); }
[data-love-tarot] .lft-tarot__stage h3 { margin:0 0 18px; color:var(--tarot-night); font:600 clamp(1.7rem,3vw,2.45rem)/1.15 "Petrona",Georgia,serif; }
[data-love-tarot] .lft-tarot__themes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:28px; }
[data-love-tarot] .lft-tarot__theme { min-height:104px; padding:20px; text-align:left; border:1px solid var(--tarot-line); border-radius:14px; background:#fff; color:var(--tarot-night); box-shadow:0 8px 20px rgba(33,28,58,.045); transition:transform .2s,border-color .2s,box-shadow .2s; }
[data-love-tarot] .lft-tarot__theme:hover { transform:translateY(-3px); box-shadow:0 12px 25px rgba(33,28,58,.1); }
[data-love-tarot] .lft-tarot__theme[aria-pressed="true"] { border:2px solid #925639; background:#fff7ed; box-shadow:0 0 0 3px rgba(184,129,95,.15); }
[data-love-tarot] .lft-tarot__theme strong { display:block; font:600 1.28rem/1.2 "Petrona",Georgia,serif; }
[data-love-tarot] .lft-tarot__theme span { display:block; margin-top:8px; color:#655e6c; font-size:.9rem; line-height:1.4; }
[data-love-tarot] .lft-tarot__question-label { display:block; margin:0 0 9px; font-weight:800; }
[data-love-tarot] .lft-tarot__question-label span { color:#696071; font-size:.88rem; font-weight:400; }
[data-love-tarot] textarea { display:block; width:100%; min-height:90px; max-height:240px; padding:14px 16px; resize:vertical; border:1px solid #b9aaad; border-radius:12px; background:#fff; color:var(--tarot-night); }
[data-love-tarot] .lft-tarot__controls { margin-top:20px; }
[data-love-tarot] .lft-tarot__primary { display:inline-flex; align-items:center; gap:14px; min-height:48px; padding:12px 24px; border:1px solid #84462f; border-radius:8px; background:#8a4530; color:white; font-weight:800; box-shadow:0 12px 26px rgba(138,69,48,.2); transition:transform .2s,background .2s; }
[data-love-tarot] .lft-tarot__primary:hover:not(:disabled) { transform:translateY(-2px); background:#713321; }
[data-love-tarot] .lft-tarot__primary:disabled { cursor:not-allowed; opacity:.5; box-shadow:none; }
[data-love-tarot] .lft-tarot__stage-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
[data-love-tarot] .lft-tarot__stage-header p:not(.lft-tarot__step) { margin:0 0 20px; color:#655e6c; }
[data-love-tarot] .lft-tarot__step { color:#8a4530; }
[data-love-tarot] .lft-tarot__text-button { flex:0 0 auto; padding:8px 0; border:0; background:none; color:#8a4530; font-weight:800; text-decoration:underline; }
[data-love-tarot] .lft-tarot__toggle { display:inline-flex; align-items:center; gap:10px; margin:0 0 20px; color:#4c4557; font-size:.9rem; cursor:pointer; }
[data-love-tarot] .lft-tarot__toggle input { width:19px; height:19px; margin:0; accent-color:#8a4530; }
[data-love-tarot] .lft-tarot__spread { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
[data-love-tarot] .lft-tarot__slot { display:flex; flex-direction:column; align-items:center; min-width:0; }
[data-love-tarot] .lft-tarot__slot-label { align-self:stretch; min-height:38px; margin-bottom:8px; color:#433750; font-size:.73rem; font-weight:800; line-height:1.25; text-align:center; }
[data-love-tarot] .lft-tarot__empty,[data-love-tarot] .lft-tarot__card { display:grid; place-items:center; width:100%; max-width:130px; aspect-ratio:2/3; padding:0; border:0; border-radius:10px; }
[data-love-tarot] .lft-tarot__empty { border:1px dashed #bca89f; background:linear-gradient(145deg,#f7eee6,#fffaf3); color:#baa392; font-size:2rem; }
[data-love-tarot] .lft-tarot__card { position:relative; perspective:800px; background:none; color:var(--tarot-night); }
[data-love-tarot] .lft-tarot__card:disabled { cursor:default; }
[data-love-tarot] .lft-tarot__card-inner { position:relative; display:block; width:100%; height:100%; transform-style:preserve-3d; transition:transform .65s cubic-bezier(.2,.7,.2,1); }
[data-love-tarot] .lft-tarot__card.is-revealed .lft-tarot__card-inner { transform:rotateY(180deg); }
[data-love-tarot] .lft-tarot__card-back,[data-love-tarot] .lft-tarot__card-front { position:absolute; inset:0; display:block; overflow:hidden; border-radius:10px; backface-visibility:hidden; box-shadow:0 7px 18px rgba(31,23,45,.18); }
[data-love-tarot] .lft-tarot__card-back { border:3px solid #d4ad79; background:#211c3a url('../img/tarot-back.svg') center/cover no-repeat; }
[data-love-tarot] .lft-tarot__card-front { padding:5px; transform:rotateY(180deg); border:3px solid #bd9364; background:linear-gradient(160deg,#1d1935,#3d2b49); color:#f6dfb8; }
[data-love-tarot] .lft-tarot__card-art { display:block; height:calc(100% - 29px); overflow:hidden; }
[data-love-tarot] .lft-tarot__card-art img { display:block; width:100%; height:100%; object-fit:contain; }
[data-love-tarot] .lft-tarot__card-name { display:grid; place-items:center; height:29px; padding:0 3px; font:600 clamp(.48rem,.8vw,.65rem)/1.1 "Petrona",Georgia,serif; text-align:center; text-transform:uppercase; letter-spacing:.03em; }
[data-love-tarot] .lft-tarot__draw-hint { margin:25px 0 14px; color:#51475a; font-weight:800; text-align:center; }
[data-love-tarot] .lft-tarot__fan { display:flex; justify-content:center; align-items:end; gap:0; max-width:790px; min-height:166px; margin:0 auto; padding:10px 28px 20px; overflow-x:auto; }
[data-love-tarot] .lft-tarot__deck-card { flex:0 0 clamp(48px,8vw,66px); width:clamp(48px,8vw,66px); height:clamp(74px,12vw,100px); margin-left:-12px; padding:0; border:2px solid #d4ad79; border-radius:7px; background:#211c3a url('../img/tarot-back.svg') center/cover no-repeat; box-shadow:0 8px 16px rgba(33,28,58,.24); transform:rotate(calc((var(--index) - 5.5)*2deg)); transition:transform .2s,opacity .2s; }
[data-love-tarot] .lft-tarot__deck-card:first-child { margin-left:0; }
[data-love-tarot] .lft-tarot__deck-card:hover,[data-love-tarot] .lft-tarot__deck-card:focus-visible { z-index:2; transform:translateY(-14px) rotate(0); }
[data-love-tarot] .lft-tarot__deck-card.is-picked { visibility:hidden; pointer-events:none; }
[data-love-tarot] .lft-tarot__result > p:not(.lft-tarot__step) { margin:0 0 24px; color:#51475a; font-size:1.02rem; }
[data-love-tarot] .lft-tarot__interpretations { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
[data-love-tarot] .lft-tarot__interpretations article { display:grid; grid-template-columns:86px minmax(0,1fr); align-items:start; gap:17px; padding:16px; border:1px solid var(--tarot-line); border-radius:12px; background:#fff; }
[data-love-tarot] .lft-tarot__result-art { overflow:hidden; border:2px solid #bd9364; border-radius:7px; background:linear-gradient(160deg,#1d1935,#3d2b49); box-shadow:0 5px 12px rgba(31,23,45,.14); }
[data-love-tarot] .lft-tarot__result-art img { display:block; width:100%; aspect-ratio:2/3; object-fit:contain; }
[data-love-tarot] .lft-tarot__interpretations h4 { margin:0 0 10px; color:var(--tarot-night); font:600 1.18rem/1.2 "Petrona",Georgia,serif; }
[data-love-tarot] .lft-tarot__interpretations p { margin:0 0 8px; color:#51475a; font-size:.93rem; }
[data-love-tarot] .lft-tarot__interpretations .lft-tarot__prompt { margin:0; color:#813f2b; font-weight:700; }
[data-love-tarot] .lft-tarot__closing { margin:24px 0; padding:20px 23px; border-left:4px solid #b8815f; border-radius:0 10px 10px 0; background:#f5e9de; }
[data-love-tarot] .lft-tarot__closing h4 { margin:0 0 8px; font:600 1.3rem "Petrona",Georgia,serif; }
[data-love-tarot] .lft-tarot__closing p { margin:0; }
[data-love-tarot] .lft-tarot__notice { margin:32px 0 0; padding-top:17px; border-top:1px solid var(--tarot-line); color:#675f6e; font-size:.77rem; }
@media(max-width:760px) { [data-love-tarot] .lft-tarot__spread { grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:20px; } [data-love-tarot] .lft-tarot__slot-label { min-height:30px; } [data-love-tarot] .lft-tarot__card-name { font-size:.62rem; } }
@media(max-width:560px) { [data-love-tarot] { width:calc(100vw - 20px); border-radius:16px; } [data-love-tarot] .lft-tarot__themes,[data-love-tarot] .lft-tarot__interpretations { grid-template-columns:1fr; } [data-love-tarot] .lft-tarot__theme { min-height:84px; padding:15px; } [data-love-tarot] .lft-tarot__stage-header { display:block; } [data-love-tarot] .lft-tarot__stage-header .lft-tarot__text-button { margin-bottom:12px; } [data-love-tarot] .lft-tarot__fan { justify-content:flex-start; } [data-love-tarot] .lft-tarot__deck-card { margin-left:-9px; } }
@media(prefers-reduced-motion:reduce) { [data-love-tarot] *,[data-love-tarot] *::before,[data-love-tarot] *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; } }
