@import"https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Cinzel:wght@400;500;600;700&family=Noto+Sans+KR:wght@300;400;500;700&display=swap";html,body,#root{margin:0;padding:0;min-height:100vh;background:#0a0a1a}.start-screen{position:relative;z-index:1;width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:40px 20px}.start-content{max-width:700px;width:100%;text-align:center}.logo-area{margin-bottom:48px}.logo-symbol{font-size:1.8rem;color:var(--gold);letter-spacing:.4em;margin-bottom:16px;text-shadow:0 0 20px rgba(212,168,83,.5)}.logo-title{font-size:clamp(2.2rem,6vw,3.5rem);margin-bottom:8px}.logo-subtitle{font-family:Noto Sans KR,sans-serif;font-size:1rem;color:var(--text-dim);letter-spacing:.3em;font-weight:300}.logo-desc{font-size:.95rem;color:var(--text-dim);margin-top:16px;font-weight:300;line-height:1.6}.mode-heading{font-size:1.1rem;margin-bottom:24px;letter-spacing:.15em}.mode-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;justify-items:center;max-width:450px;margin:0 auto}.mode-card{background:linear-gradient(160deg,var(--bg-surface),var(--bg-card));border:var(--border-mystic);border-radius:12px;padding:28px 20px;width:200px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;transition:all .3s ease;font-family:inherit;color:var(--text)}.mode-card:hover{border-color:var(--gold)}.mode-card-icon{font-size:1.4rem;color:var(--gold);margin-bottom:4px;letter-spacing:.15em}.mode-card-name{font-family:Noto Sans KR,sans-serif;font-size:1.15rem;font-weight:500;color:var(--text-bright)}.mode-card-en{font-family:Cinzel,serif;font-size:.75rem;color:var(--gold-dim);letter-spacing:.1em}.mode-card-count{font-size:.8rem;color:var(--purple-light);font-weight:500}.mode-card-desc{font-size:.8rem;color:var(--text-dim);font-weight:300;margin-top:4px}.start-footer{margin-top:60px;font-size:.75rem;color:var(--text-dim);opacity:.5}@media(max-width:680px){.mode-cards{grid-template-columns:1fr;max-width:300px}.mode-card{width:100%;padding:20px}}@media(min-width:681px){.mode-card{width:200px}}.reading-screen{position:relative;z-index:1;width:100%;min-height:100vh;padding:24px 20px 40px;display:flex;flex-direction:column;align-items:center}.reading-header{width:100%;max-width:900px;display:flex;align-items:center;gap:20px;margin-bottom:20px}.reading-mode-info{display:flex;align-items:baseline;gap:12px}.reading-mode-info h2{font-size:1.2rem;color:var(--gold-light)}.reading-progress{font-size:.85rem;color:var(--text-dim);font-family:Cinzel,serif}.reading-instruction{text-align:center;margin-bottom:32px;color:var(--text-dim);font-size:.9rem;min-height:24px}.reading-spread{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;align-items:flex-start;max-width:900px;width:100%}.spread-position{display:flex;flex-direction:column;align-items:center}.spread-one{justify-content:center}.spread-one .tarot-card{--card-width: 180px;--card-height: 312px;width:var(--card-width);height:var(--card-height)}.spread-three{justify-content:center;gap:24px}.spread-three .tarot-card{--card-width: 160px;--card-height: 278px;width:var(--card-width);height:var(--card-height)}.spread-celtic{display:grid;grid-template-columns:repeat(4,var(--card-width));grid-template-rows:repeat(4,auto);gap:12px 16px;justify-content:center;justify-items:center;align-items:start;padding:20px;max-width:100%;overflow-x:auto}.spread-celtic .pos-0{grid-column:2;grid-row:2}.spread-celtic .pos-1{grid-column:2;grid-row:3}.spread-celtic .pos-2{grid-column:2;grid-row:1}.spread-celtic .pos-3{grid-column:2;grid-row:4}.spread-celtic .pos-4{grid-column:1;grid-row:2 / span 2;align-self:center}.spread-celtic .pos-5{grid-column:3;grid-row:2 / span 2;align-self:center}.spread-celtic .pos-6{grid-column:4;grid-row:4}.spread-celtic .pos-7{grid-column:4;grid-row:3}.spread-celtic .pos-8{grid-column:4;grid-row:2}.spread-celtic .pos-9{grid-column:4;grid-row:1}.reading-actions{margin-top:32px}@media(max-width:768px){.spread-celtic{grid-template-columns:repeat(4,var(--card-width));gap:8px 10px}.spread-three .tarot-card{--card-width: 120px;--card-height: 208px;width:var(--card-width);height:var(--card-height)}.spread-one .tarot-card{--card-width: 150px;--card-height: 260px;width:var(--card-width);height:var(--card-height)}}@media(max-width:480px){.spread-celtic{grid-template-columns:repeat(4,75px);gap:6px 8px}.spread-celtic .tarot-card{--card-width: 75px;--card-height: 130px;width:var(--card-width);height:var(--card-height)}.tarot-card-label{font-size:.6rem}}.result-screen{position:relative;z-index:1;width:100%;max-width:800px;margin:0 auto;padding:40px 20px 60px}.result-header{text-align:center;margin-bottom:48px}.result-symbol{font-size:2rem;color:var(--gold);margin-bottom:12px;text-shadow:0 0 20px rgba(212,168,83,.5)}.result-title{font-size:clamp(1.6rem,4vw,2.2rem);margin-bottom:8px}.result-mode-name{font-family:Cinzel,serif;font-size:.9rem;color:var(--text-dim);letter-spacing:.1em}.result-cards{display:flex;flex-direction:column;gap:28px}.result-card-item{background:linear-gradient(160deg,#1a1a3ecc,#12122ae6);border:var(--border-mystic);border-radius:14px;padding:24px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.result-card-position{display:flex;align-items:center;gap:10px;margin-bottom:16px}.position-number{font-family:Cinzel Decorative,serif;font-size:1.4rem;color:var(--gold);width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gold-dim);border-radius:50%;flex-shrink:0}.position-label{font-family:Cinzel,serif;font-size:.85rem;color:var(--gold-light);letter-spacing:.08em}.result-card-content{display:flex;gap:20px}.result-card-image-wrap{position:relative;flex-shrink:0}.result-card-img{width:120px;height:208px;object-fit:cover;border-radius:8px;border:1px solid var(--gold-dim);box-shadow:0 4px 16px #0006}.result-card-img.reversed{transform:rotate(180deg)}.reversed-badge{position:absolute;bottom:8px;left:50%;transform:translate(-50%);background:var(--accent-red);color:#fff;font-size:.65rem;padding:2px 8px;border-radius:10px;font-weight:500;letter-spacing:.05em}.result-card-info{flex:1;min-width:0}.result-card-name{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:12px}.name-kr{font-size:1.2rem;color:var(--text-bright);font-weight:500}.name-en{font-family:Cinzel,serif;font-size:.8rem;color:var(--text-dim);letter-spacing:.05em}.reversed-tag{font-family:Cinzel,serif;font-size:.65rem;color:var(--accent-red);border:1px solid var(--accent-red);padding:1px 6px;border-radius:4px;letter-spacing:.05em}.result-keywords{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.keyword-tag{background:#7b5ea726;border:1px solid rgba(123,94,167,.3);color:var(--purple-light);font-size:.78rem;padding:3px 10px;border-radius:20px}.result-meaning{font-size:.92rem;line-height:1.75;color:var(--text);font-weight:300;margin-bottom:12px}.arcana-badge{display:inline-block;font-size:.7rem;padding:2px 10px;border-radius:4px;letter-spacing:.05em}.arcana-badge.major{background:#d4a8531f;color:var(--gold);border:1px solid rgba(212,168,83,.25)}.arcana-badge.minor{background:#4a7fb51f;color:var(--accent-blue);border:1px solid rgba(74,127,181,.25)}.result-ai-section{margin-top:48px}.ai-prompt{text-align:center;padding:32px 20px}.ai-prompt-text{font-size:.95rem;color:var(--text-dim);margin-bottom:20px;line-height:1.6}.btn-ai{font-size:1.05rem;padding:16px 40px;box-shadow:0 4px 20px #d4a8534d}.ai-result{background:linear-gradient(160deg,#1a1a3e99,#12122acc);border:1px solid rgba(123,94,167,.3);border-radius:14px;padding:32px;margin-top:24px}.ai-result-header{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}.ai-icon{font-size:1.8rem}.ai-result-header h3{font-size:1.3rem;letter-spacing:.08em}.ai-loading{text-align:center;padding:40px 20px}.loading-spinner{width:40px;height:40px;margin:0 auto 16px;border:3px solid rgba(212,168,83,.1);border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.ai-loading p{color:var(--text-dim);font-size:.9rem}.ai-error{text-align:center;padding:20px;color:var(--accent-red)}.ai-error p{margin-bottom:16px;font-size:.95rem}.btn-retry{margin-top:12px}.ai-interpretation{padding:8px 0}.ai-content{line-height:1.8;color:var(--text);font-size:.95rem}.ai-content h3{color:var(--gold-light);font-family:Cinzel,serif;font-size:1.1rem;margin:24px 0 12px;letter-spacing:.05em}.ai-content strong{color:var(--text-bright);font-weight:600}.ai-content li{margin-left:20px;margin-bottom:8px;color:var(--text)}.ai-interpretation .btn-retry{margin-top:24px;width:100%}.result-footer{text-align:center;margin-top:48px;display:flex;flex-direction:column;align-items:center;gap:20px}.result-disclaimer{font-size:.8rem;color:var(--text-dim);font-weight:300}@media(max-width:600px){.result-card-content{flex-direction:column;align-items:center;text-align:center}.result-card-img{width:100px;height:174px}.result-keywords,.result-card-name{justify-content:center}.result-card-item{padding:18px 14px}.ai-result{padding:20px 16px}.ai-result-header h3{font-size:1.1rem}.ai-content{font-size:.9rem}}.free-selection-screen{width:100%;min-height:100vh;display:flex;flex-direction:column;position:relative;z-index:1;padding-bottom:120px}.free-selection-header{display:flex;align-items:center;justify-content:space-between;padding:20px;gap:16px;position:sticky;top:0;background:#0a0a1af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;border-bottom:var(--border-mystic)}.free-selection-title{flex:1;text-align:center}.free-selection-title h2{font-size:1.5rem;margin-bottom:4px}.free-selection-count{font-size:.9rem;color:var(--text-dim);font-family:Noto Sans KR,sans-serif}.free-selection-count span{color:var(--gold);font-weight:600;font-size:1.1rem}.free-selection-instruction{padding:16px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.free-selection-instruction p{color:var(--text-dim);font-size:.9rem}.btn-clear{font-family:Cinzel,serif;background:transparent;color:var(--accent-red);border:1px solid rgba(181,74,74,.3);padding:6px 16px;font-size:.8rem;border-radius:4px;cursor:pointer;transition:all .3s ease}.btn-clear:hover{background:#b54a4a1a;border-color:var(--accent-red)}.free-selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:12px;padding:0 20px 20px;max-width:1200px;margin:0 auto;width:100%}.free-card{position:relative;cursor:pointer;transition:transform .2s ease}.free-card-inner{position:relative;width:100%;aspect-ratio:140 / 243;border-radius:8px;overflow:hidden;border:2px solid transparent;transition:all .3s ease;background:linear-gradient(135deg,#1a1040,#2a1860);box-shadow:0 2px 8px #0000004d;display:flex;align-items:center;justify-content:center}.free-card.selected .free-card-inner{border-color:var(--gold);box-shadow:0 0 20px #d4a85380,0 0 40px #d4a85333}.free-card-inner .tarot-card-back-design{width:80%;height:85%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:1px solid var(--gold-dim);border-radius:6px;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(rgba(212,168,83,.05) 0% 25%,transparent 0% 50%) 50% / 20px 20px}.free-card-inner .tarot-card-back-design:before{content:"✦";font-size:2rem;color:var(--gold);text-shadow:0 0 20px rgba(212,168,83,.6)}.free-card-badge{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;background:var(--gold);color:var(--bg-deep);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem;font-family:Cinzel,serif;box-shadow:0 2px 8px #0006;z-index:2}.free-card-name{font-size:.65rem;color:var(--text-dim);text-align:center;margin-top:6px;line-height:1.2;height:28px;display:flex;align-items:center;justify-content:center;word-break:keep-all;padding:0 2px}.free-card.selected .free-card-name{color:var(--gold);font-weight:500}.free-selection-bottom{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(10,10,26,.98) 0%,rgba(10,10,26,.95) 80%,transparent 100%);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:var(--border-mystic);z-index:101;padding:16px 20px 20px;box-shadow:0 -4px 20px #0000004d}.free-selection-bottom-content{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:600px;margin:0 auto}.free-selection-info{display:flex;align-items:baseline;gap:6px;color:var(--text-dim)}.free-selection-count-big{font-size:2rem;font-weight:700;color:var(--gold);font-family:Cinzel,serif;line-height:1}.btn-complete{flex-shrink:0;padding:14px 32px;box-shadow:0 4px 20px #d4a8534d}.btn-complete:active{transform:scale(.95)}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}.modal-content{background:var(--bg-surface);border:var(--border-mystic);border-radius:12px;padding:32px;max-width:400px;text-align:center;box-shadow:0 8px 40px #00000080}.modal-content h3{color:var(--gold);font-family:Cinzel,serif;margin-bottom:12px}.modal-content p{color:var(--text-dim);margin-bottom:24px;line-height:1.6}@media(max-width:768px){.free-selection-grid{grid-template-columns:repeat(4,1fr);gap:10px;padding:0 12px 12px}.free-card-name{font-size:.6rem;height:24px}.free-selection-header{padding:16px 12px}.free-selection-title h2{font-size:1.3rem}}@media(min-width:769px)and (max-width:1024px){.free-selection-grid{grid-template-columns:repeat(6,1fr)}}@media(min-width:1025px){.free-selection-grid{grid-template-columns:repeat(8,1fr);gap:16px}.free-card-inner{aspect-ratio:140 / 243}.free-card-name{font-size:.7rem;height:32px}}@media(max-width:480px){.free-selection-grid{grid-template-columns:repeat(3,1fr);gap:8px;padding:0 8px 8px}.free-card-badge{width:20px;height:20px;font-size:.65rem;top:4px;right:4px}.free-selection-header{padding:12px 8px}.free-selection-title h2{font-size:1.1rem}.free-selection-count{font-size:.8rem}.free-selection-bottom{padding:12px 12px 16px}.free-selection-bottom-content{gap:12px}.free-selection-count-big{font-size:1.6rem}.btn-complete{padding:12px 24px;font-size:.9rem}.free-card-name{font-size:.55rem;height:20px}}@media(hover:none)and (pointer:coarse){.free-card:active .free-card-inner{transform:scale(.95)}.btn-complete:active{transform:translateY(2px)}}:root{--bg-deep: #0a0a1a;--bg-card: #12122a;--bg-surface: #1a1a3e;--gold: #d4a853;--gold-light: #f0d48a;--gold-dim: #8a6e2f;--purple: #7b5ea7;--purple-light: #a78bdb;--purple-glow: rgba(123, 94, 167, .3);--text: #e8e0d4;--text-dim: #8a8694;--text-bright: #fff;--accent-blue: #4a7fb5;--accent-red: #b54a4a;--card-width: 140px;--card-height: 243px;--border-mystic: 1px solid rgba(212, 168, 83, .2)}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--bg-deep);color:var(--text);font-family:Noto Sans KR,sans-serif;min-height:100vh;overflow-x:hidden}.app{min-height:100vh;position:relative;display:flex;flex-direction:column;align-items:center}.stars,.stars2,.stars3{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0}.stars{background:radial-gradient(1.5px 1.5px at 20px 30px,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 40px 70px,rgba(255,255,255,.5),transparent),radial-gradient(1.2px 1.2px at 90px 40px,rgba(255,255,255,.6),transparent),radial-gradient(1px 1px at 160px 120px,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 200px 50px,rgba(212,168,83,.5),transparent),radial-gradient(1px 1px at 300px 180px,rgba(255,255,255,.3),transparent);background-size:350px 220px;animation:starFloat 80s linear infinite}.stars2{background:radial-gradient(1px 1px at 50px 90px,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 130px 30px,rgba(255,255,255,.3),transparent),radial-gradient(1px 1px at 250px 160px,rgba(212,168,83,.3),transparent);background-size:450px 300px;animation:starFloat 120s linear infinite reverse}.stars3{background:radial-gradient(2px 2px at 180px 80px,rgba(123,94,167,.4),transparent),radial-gradient(1px 1px at 60px 200px,rgba(255,255,255,.2),transparent);background-size:550px 350px;animation:starFloat 150s linear infinite;opacity:.6}@keyframes starFloat{0%{transform:translateY(0)}to{transform:translateY(-1000px)}}.title-decorative{font-family:Cinzel Decorative,serif;color:var(--gold);text-shadow:0 0 30px rgba(212,168,83,.4),0 0 60px rgba(212,168,83,.1)}.title-cinzel{font-family:Cinzel,serif;color:var(--gold-light);letter-spacing:.05em}.btn-mystic{font-family:Cinzel,serif;background:linear-gradient(135deg,var(--gold-dim),var(--gold));color:var(--bg-deep);border:none;padding:14px 36px;font-size:1rem;font-weight:600;border-radius:6px;cursor:pointer;letter-spacing:.08em;transition:all .3s ease;position:relative;overflow:hidden}.btn-mystic:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.btn-mystic:hover:before{left:100%}.btn-mystic:hover{transform:translateY(-2px);box-shadow:0 4px 20px #d4a85366}.btn-ghost{font-family:Cinzel,serif;background:transparent;color:var(--gold);border:var(--border-mystic);padding:10px 24px;font-size:.9rem;border-radius:6px;cursor:pointer;letter-spacing:.05em;transition:all .3s ease}.btn-ghost:hover{background:#d4a8531a;border-color:var(--gold)}.tarot-card{width:var(--card-width);height:var(--card-height);perspective:800px;cursor:pointer;flex-shrink:0}.tarot-card-inner{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,0,.2,1);border-radius:10px}.tarot-card.revealed .tarot-card-inner{transform:rotateY(180deg)}.tarot-card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:10px;overflow:hidden}.tarot-card-back{background:linear-gradient(135deg,#1a1040,#2a1860);border:2px solid var(--gold-dim);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #00000080}.tarot-card-back-design{width:80%;height:85%;border:1px solid var(--gold-dim);border-radius:6px;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(rgba(212,168,83,.05) 0% 25%,transparent 0% 50%) 50% / 20px 20px;position:relative}.tarot-card-back-design:before{content:"✦";font-size:2.5rem;color:var(--gold);text-shadow:0 0 20px rgba(212,168,83,.6)}.tarot-card-front{transform:rotateY(180deg);border:2px solid var(--gold-dim);box-shadow:0 4px 20px #00000080;background:var(--bg-card)}.tarot-card-front img{width:100%;height:100%;object-fit:cover;display:block}.tarot-card.reversed .tarot-card-front img{transform:rotate(180deg)}.tarot-card-label{font-family:Cinzel,serif;font-size:.7rem;color:var(--gold);text-align:center;margin-top:10px;letter-spacing:.05em;white-space:nowrap}.mystic-divider{width:200px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-dim),transparent);margin:16px auto}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--gold-dim);border-radius:3px}@media(max-width:768px){:root{--card-width: 100px;--card-height: 174px}.btn-mystic{padding:12px 28px;font-size:.9rem}}@media(max-width:480px){:root{--card-width: 80px;--card-height: 139px}}