:root{--ink-950: #0e0a1f;--ink-900: #120e24;--surface: #1c1638;--surface-raised: #241c46;--surface-line: #34294f;--gold: #c9a24b;--gold-soft: #e2c988;--garnet: #8c2f3b;--garnet-soft: #b9535f;--text-primary: #efe9da;--text-muted: #9c93b8;--font-fa: "Vazirmatn", "Tahoma", sans-serif;--step-0: 1rem;--step-1: 1.25rem;--step-2: 1.6rem;--step-3: 2.1rem;--step-4: 2.9rem;--radius-card: 14px;--radius-pill: 999px;--shadow-soft: 0 18px 40px -20px rgba(0, 0, 0, .6);--max-w: 880px}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;font-family:var(--font-fa);background:radial-gradient(ellipse at top,var(--ink-900) 0%,var(--ink-950) 70%);color:var(--text-primary);line-height:1.75}img{max-width:100%}button{font-family:inherit}a{color:inherit}.container{max-width:var(--max-w);margin:0 auto;padding:0 20px}.site-header{padding:28px 0 10px;text-align:center}.site-header .mark{font-size:var(--step-2);font-weight:700;letter-spacing:.02em;color:var(--gold-soft)}.hero{padding:56px 0 40px;display:grid;grid-template-columns:1fr;gap:28px;justify-items:center;text-align:center}.hero h1{font-size:clamp(2rem,5vw,var(--step-4));font-weight:800;margin:0;max-width:14ch;line-height:1.3}.hero p.lede{color:var(--text-muted);font-size:var(--step-1);max-width:46ch;margin:0}.card-back{width:116px;height:176px;object-fit:cover;border-radius:10px;box-shadow:var(--shadow-soft);border:1px solid var(--surface-line)}.spread-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:8px 0 32px}.spread-card{text-align:right;background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-card);padding:20px;cursor:pointer;transition:border-color .2s ease,transform .2s ease;color:inherit}.spread-card:hover{border-color:var(--gold)}.spread-card.selected{border-color:var(--gold);background:var(--surface-raised);box-shadow:var(--shadow-soft)}.spread-card h3{margin:0 0 6px;font-size:var(--step-1);font-weight:700}.spread-card p{margin:0 0 14px;color:var(--text-muted);font-size:.92rem}.spread-card .meta{display:flex;justify-content:space-between;font-size:.85rem;color:var(--gold-soft)}.question-panel{background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-card);padding:24px;margin-bottom:40px}.question-panel label{display:block;margin-bottom:10px;color:var(--text-muted);font-size:.92rem}.question-panel textarea{width:100%;min-height:96px;resize:vertical;background:var(--ink-950);border:1px solid var(--surface-line);border-radius:10px;color:var(--text-primary);padding:12px 14px;font-family:inherit;font-size:.98rem}.question-panel textarea:focus{outline:none;border-color:var(--gold)}.pay-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px;flex-wrap:wrap}.price-tag{font-size:var(--step-1);font-weight:700;color:var(--gold-soft)}.price-tag small{display:block;font-weight:400;font-size:.78rem;color:var(--text-muted)}.btn-primary{background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#241708;border:none;border-radius:var(--radius-pill);padding:13px 30px;font-size:1rem;font-weight:700;cursor:pointer;transition:filter .2s ease,transform .2s ease}.btn-primary:hover:not(:disabled){filter:brightness(1.06)}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-ghost{background:transparent;border:1px solid var(--surface-line);color:var(--text-primary);border-radius:var(--radius-pill);padding:11px 26px;cursor:pointer}.error-note{color:var(--garnet-soft);font-size:.9rem;margin-top:10px}.disclaimer{color:var(--text-muted);font-size:.8rem;text-align:center;margin:8px 0 48px}.result-header{text-align:center;padding:48px 0 20px}.result-header h1{font-size:var(--step-3);margin:0 0 8px}.result-header .question-echo{color:var(--text-muted);font-size:.95rem}.cards-row{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;margin:32px 0 12px;perspective:1400px}.reveal-card{width:148px}.reveal-card .flip-inner{position:relative;width:148px;height:224px;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.2,.7,.2,1)}.reveal-card.flipped .flip-inner{transform:rotateY(180deg)}.reveal-card .face{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px;text-align:center}.reveal-card .face.back{background:var(--surface);border:1px solid var(--surface-line);padding:0}.reveal-card .face.back .card-back{width:100%;height:100%;object-fit:cover;border-radius:11px}.reveal-card .face.front{background:var(--surface-raised);border:1px solid var(--gold);transform:rotateY(180deg);gap:4px;overflow:hidden}.reveal-card .card-image{width:92px;border-radius:6px;box-shadow:0 6px 16px -8px #000000b3;transition:transform .3s ease}.reveal-card .card-image.reversed{transform:rotate(180deg)}.reveal-card .position-label{font-size:.72rem;color:var(--gold-soft);margin-top:4px}.reveal-card .card-name{font-weight:700;font-size:.86rem;text-align:center}.reveal-card .reversed-tag{font-size:.72rem;color:var(--garnet-soft);font-weight:400}.card-meaning-list{max-width:640px;margin:36px auto 0;display:grid;gap:14px}.card-meaning-list .item{background:var(--surface);border:1px solid var(--surface-line);border-radius:10px;padding:14px 18px}.card-meaning-list .item h4{margin:0 0 4px;font-size:.95rem;color:var(--gold-soft)}.card-meaning-list .item p{margin:0;font-size:.9rem;color:var(--text-muted)}.narrative{max-width:640px;margin:40px auto 60px;background:var(--surface);border:1px solid var(--surface-line);border-radius:var(--radius-card);padding:28px;white-space:pre-line;font-size:1.02rem}.narrative h2{margin-top:0;font-size:var(--step-1)}.center-state{text-align:center;padding:80px 20px;color:var(--text-muted)}@media (max-width: 480px){.pay-row{flex-direction:column;align-items:stretch}.btn-primary{width:100%}}.text-input{width:100%;margin:0 0 14px;background:var(--ink-950);border:1px solid var(--surface-line);border-radius:10px;color:var(--text-primary);padding:12px 14px;font-family:inherit;font-size:.98rem}.text-input:focus{outline:none;border-color:var(--gold)}.full-btn{width:100%;margin-top:6px}.access-note{background:var(--surface);border:1px solid var(--gold);border-radius:var(--radius-card);padding:16px 20px;margin:0 0 22px;text-align:center;color:var(--gold-soft)}
