@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css";:root{--toss-blue: #3182f6;--toss-blue-hover: #1b64da;--toss-bg: #f8f6fb;--toss-white: #ffffff;--toss-black: #191f28;--toss-gray-800: #333d4b;--toss-gray-600: #4e5968;--toss-gray-400: #8b95a1;--toss-gray-200: #e5e8eb;--toss-gray-100: #f2f4f6;--mystic-purple: #8b5cf6;--mystic-gradient: linear-gradient(135deg, #f3ebfc 0%, #e6d8fa 100%);--mystic-glow: 0 4px 20px rgba(139, 92, 246, .4);--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Roboto,Helvetica Neue,Segoe UI,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,sans-serif;background-color:var(--toss-bg);color:var(--toss-black);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button{border:none;background:none;font-family:inherit;cursor:pointer;outline:none}.app-container{max-width:480px;margin:0 auto;min-height:100vh;background:var(--mystic-gradient);position:relative;display:flex;flex-direction:column}.header{padding:3vh 20px 1vh;background:transparent;margin-bottom:0;text-align:center}.section-title{font-size:18px;font-weight:700;margin-bottom:16px;color:var(--toss-black)}.card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tarot-card{background-color:var(--toss-white);border-radius:var(--radius-md);padding:20px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s;cursor:pointer;box-shadow:0 2px 8px #00000005}.tarot-card:active{transform:scale(.97);box-shadow:0 1px 4px #0000000d}.tarot-card.selected{border:2px solid var(--toss-blue);background-color:#3182f60d}.tarot-emoji{font-size:32px;margin-bottom:12px}.tarot-title{font-size:16px;font-weight:600;color:var(--toss-gray-800);margin-bottom:4px}.tarot-desc{font-size:13px;color:var(--toss-gray-400)}.action-container{padding:20px;margin-top:auto;position:sticky;bottom:0;background:linear-gradient(to top,#e6d8fa 40%,transparent);padding-bottom:calc(20px + env(safe-area-inset-bottom))}.primary-button{background:linear-gradient(135deg,#6b21a8,#9333ea);color:#fff;width:100%;padding:18px;border-radius:28px;font-size:18px;font-weight:700;letter-spacing:.5px;transition:all .3s cubic-bezier(.25,.8,.25,1);box-shadow:0 8px 24px #9333ea4d;border:1px solid rgba(255,255,255,.2)}.primary-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 28px #9333ea80;background:linear-gradient(135deg,#7e22ce,#a855f7)}.primary-button:active:not(:disabled){transform:translateY(1px);box-shadow:0 4px 12px #9333ea4d}.primary-button:disabled{background:linear-gradient(135deg,#6b21a8,#9333ea);color:#fff;border:1px solid rgba(255,255,255,.2);box-shadow:none;cursor:not-allowed;opacity:.5}.chat-container{flex:1;display:flex;flex-direction:column;padding:0 20px 100px}.message{max-width:80%;margin-bottom:16px;padding:14px 18px;border-radius:var(--radius-md);font-size:15px;line-height:1.5;word-break:keep-all}.message.bot{align-self:flex-start;background-color:var(--toss-white);color:var(--toss-black);border-top-left-radius:4px;box-shadow:0 2px 8px #0000000a}.message.user{align-self:flex-end;background-color:var(--toss-blue);color:#fff;border-top-right-radius:4px}.chat-input-area{position:fixed;bottom:0;width:100%;max-width:480px;background-color:var(--toss-white);padding:12px 20px;padding-bottom:calc(12px + env(safe-area-inset-bottom));box-shadow:0 -2px 10px #0000000d;display:flex;gap:12px}.chat-input{flex:1;background-color:var(--toss-gray-100);border:none;border-radius:24px;padding:12px 20px;font-size:15px;font-family:inherit;outline:none}.send-button{background-color:var(--toss-blue);color:#fff;width:44px;height:44px;border-radius:22px;display:flex;align-items:center;justify-content:center}.send-button:disabled{background-color:var(--toss-gray-200)}.loading-dots{display:flex;gap:4px;padding:8px 0}.loading-dots span{width:6px;height:6px;background-color:var(--toss-gray-400);border-radius:50%;animation:bounce 1.4s infinite ease-in-out both}.loading-dots span:nth-child(1){animation-delay:-.32s}.loading-dots span:nth-child(2){animation-delay:-.16s}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.cancel-button{background:#0000000d;color:var(--toss-gray-600);padding:16px;border-radius:var(--radius-md);font-size:16px;font-weight:600;transition:all .2s;border:none;cursor:pointer}.button-group{display:flex;gap:12px;width:100%}.button-group .cancel-button{flex:.4}.button-group .primary-button{flex:1}.mystic-textarea{width:100%;height:150px;background:#fff9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(139,92,246,.3);border-radius:var(--radius-md);padding:16px;font-size:16px;font-family:inherit;resize:none;outline:none;color:var(--toss-black);box-shadow:inset 0 2px 4px #00000005}.mystic-textarea:focus{border-color:var(--mystic-purple);box-shadow:0 0 0 2px #8b5cf633}.payment-card{background:#fffc;border:2px solid var(--mystic-purple);border-radius:var(--radius-lg);padding:32px 24px;text-align:center;box-shadow:var(--mystic-glow);width:100%}.payment-card h3{color:var(--mystic-purple);font-size:16px;margin-bottom:12px}.payment-card h2{font-size:32px;margin-bottom:24px}.payment-card ul{list-style:none;text-align:left}.payment-card li{font-size:15px;margin-bottom:12px;color:var(--toss-gray-800)}.pick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:20px;width:100%}.flip-card{width:100%;background-color:transparent;aspect-ratio:1 / 1.6;perspective:1000px;cursor:pointer}.flip-card-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d;border-radius:8px;box-shadow:0 4px 12px #00000026}.flip-card:hover:not(.flipped) .flip-card-inner{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 20px #8b5cf666}.flip-card.flipped .flip-card-inner{transform:rotateY(180deg);box-shadow:0 8px 24px #8b5cf699}.flip-card-front,.flip-card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:8px;overflow:hidden}.flip-card-front{background:linear-gradient(135deg,#4c1d95,#7c3aed);border:2px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center}.card-back-design{font-size:24px}.flip-card-back{background-color:#fff;transform:rotateY(180deg);border:2px solid var(--mystic-purple)}.revealed-card-img{width:100%;height:100%;object-fit:cover}.picked-cards-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:24px}.picked-card-item{display:flex;flex-direction:column;align-items:center;text-align:center}.picked-card-item img{width:100%;border-radius:6px;box-shadow:0 4px 12px #0000001a;margin-bottom:8px}.time-label{font-size:13px;font-weight:600;color:var(--mystic-purple);margin-bottom:8px;background:#8b5cf61a;padding:4px 12px;border-radius:12px}.card-name{font-size:12px;font-weight:700}.result-text-box{background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:24px;border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.5)}.header{padding:4vh 20px 2vh;background:transparent;margin-bottom:0;text-align:center}.header h1{font-size:clamp(18px,4.5vh,22px);font-weight:700;color:var(--toss-black);line-height:1.3}.header p{font-size:clamp(12px,2.5vh,14px);color:var(--toss-gray-600);margin-top:4px}.section{padding:0 20px;margin-bottom:2vh}.home-card-grid .tarot-card{animation:card-float 3s ease-in-out infinite;transition:transform .3s cubic-bezier(.175,.885,.32,1.275),box-shadow .3s ease;cursor:pointer}.home-card-grid .tarot-card:hover{transform:scale(1.05);box-shadow:0 12px 24px #6f42c133}.home-card-grid .tarot-card:nth-child(2n){animation-delay:.5s}@keyframes card-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.home-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:10px 5px}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tarot-card{background:#ffffffb3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.8);border-radius:var(--radius-lg);padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.175,.885,.32,1.275);cursor:pointer;box-shadow:0 4px 20px #8b5cf614;position:relative;overflow:hidden}.tarot-card:active{transform:scale(.96)}.tarot-card.selected{border:2.5px solid var(--mystic-purple);background:#fffffff2;box-shadow:0 12px 32px #8b5cf633}.tarot-card-image{width:100%;aspect-ratio:1 / 1.4;height:auto;max-height:28vh;object-fit:cover;border-radius:8px;margin-bottom:10px;box-shadow:0 4px 15px #0003;border:1px solid rgba(255,255,255,.5)}.tarot-title{font-size:clamp(15px,4vh,18px);font-weight:800;color:var(--toss-gray-900);margin-bottom:4px;z-index:1}.card-of-the-day{background:#ffffffb3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--radius-lg);padding:24px;margin-bottom:32px;display:flex;align-items:center;gap:20px;box-shadow:0 8px 32px #8b5cf61a;border:1px solid rgba(255,255,255,.8)}.card-of-the-day-img{width:90px;height:140px;border-radius:8px;box-shadow:0 4px 12px #00000026;object-fit:cover}.card-of-the-day-text h3{font-size:18px;color:var(--mystic-purple);margin-bottom:8px}.card-of-the-day-text h2{font-size:22px;font-weight:700;color:var(--toss-black);margin-bottom:8px}.card-of-the-day-text p{font-size:14px;color:var(--toss-gray-600);line-height:1.5}@keyframes teaserSlideUp{0%{transform:translateY(40px);opacity:0}to{transform:translateY(0);opacity:1}}.payment-teaser-panel{animation:teaserSlideUp .8s cubic-bezier(.16,1,.3,1) forwards}.result-text-box.teaser{mask-image:linear-gradient(to bottom,black 0%,black 60%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,black 0%,black 60%,transparent 100%)}
