*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--red:#e05050;--blue:#2850a0;--yellow:#d4a020;--gold:#c8a040;--white:#e8e0d0;--dark-bg:#110c0c;--dark-surface:#1a1214;--dark-surface2:#221a1c;--text-primary:#e8ddd0;--text-secondary:#a8a090;--text-muted:#b0a090}html{scroll-behavior:smooth;scroll-padding-top:60px}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}body{background:var(--dark-bg);color:var(--text-primary);overflow-wrap:break-word;overflow-wrap:anywhere;word-break:normal;margin:0;font-family:Cormorant Garamond,Georgia,Noto Serif KR,Batang,Yu Mincho,serif;line-height:1.8;overflow-x:hidden}:lang(ko){word-break:keep-all}#root{width:100%;max-width:100%;min-height:100vh;margin:0}h1,h2,h3,h4,h5{letter-spacing:.08em;color:var(--white);font-family:Cinzel,serif;font-weight:500;line-height:1.3}:lang(ko) h1,:lang(ko) h2,:lang(ko) h3,:lang(ko) h4,:lang(ko) h5,:lang(ja) h1,:lang(ja) h2,:lang(ja) h3,:lang(ja) h4,:lang(ja) h5{letter-spacing:0}h1{font-size:clamp(2rem,5vw,3.5rem)}h2{font-size:clamp(1.5rem,3.5vw,2.5rem)}h3{font-size:clamp(1.1rem,2vw,1.5rem)}a{color:var(--gold);text-decoration:none}a:hover{color:var(--yellow)}:focus-visible{outline:2px solid var(--gold);outline-offset:2px}:focus:not(:focus-visible),[tabindex="-1"]:focus{outline:none}html{scrollbar-width:thin;scrollbar-color:#c8a0404d var(--dark-bg)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--dark-bg)}::-webkit-scrollbar-thumb{background:#c8a0404d;border-radius:3px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fade-in-up{animation:.8s forwards fadeInUp}.dancheong-divider{opacity:.6;background:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201200%2060'%3e%3c!--%20단청%20(Dancheong)%20repeating%20border%20pattern%20--%3e%3crect%20width='1200'%20height='60'%20fill='%230f0a0a'/%3e%3c!--%20Base%20stripes%20--%3e%3crect%20x='0'%20y='0'%20width='1200'%20height='3'%20fill='%23c83232'%20opacity='0.7'/%3e%3crect%20x='0'%20y='57'%20width='1200'%20height='3'%20fill='%23c83232'%20opacity='0.7'/%3e%3crect%20x='0'%20y='5'%20width='1200'%20height='2'%20fill='%232850a0'%20opacity='0.5'/%3e%3crect%20x='0'%20y='53'%20width='1200'%20height='2'%20fill='%232850a0'%20opacity='0.5'/%3e%3c!--%20Repeating%20flower/geometric%20pattern%20--%3e%3cg%20opacity='0.8'%3e%3cpattern%20id='dcpat'%20x='0'%20y='0'%20width='80'%20height='60'%20patternUnits='userSpaceOnUse'%3e%3c!--%20Center%20diamond%20--%3e%3cpolygon%20points='40,12%2055,30%2040,48%2025,30'%20fill='none'%20stroke='%23d4a020'%20stroke-width='1.2'/%3e%3c!--%20Inner%20diamond%20--%3e%3cpolygon%20points='40,20%2048,30%2040,40%2032,30'%20fill='%23d4a020'%20opacity='0.2'/%3e%3c!--%20Corner%20petals%20--%3e%3ccircle%20cx='40'%20cy='12'%20r='3'%20fill='%23c83232'%20opacity='0.5'/%3e%3ccircle%20cx='55'%20cy='30'%20r='3'%20fill='%232850a0'%20opacity='0.5'/%3e%3ccircle%20cx='40'%20cy='48'%20r='3'%20fill='%23c83232'%20opacity='0.5'/%3e%3ccircle%20cx='25'%20cy='30'%20r='3'%20fill='%232850a0'%20opacity='0.5'/%3e%3c!--%20Connecting%20curves%20--%3e%3cpath%20d='M0,30%20Q10,20%2025,30'%20fill='none'%20stroke='%2338a038'%20stroke-width='0.8'%20opacity='0.5'/%3e%3cpath%20d='M55,30%20Q70,20%2080,30'%20fill='none'%20stroke='%2338a038'%20stroke-width='0.8'%20opacity='0.5'/%3e%3cpath%20d='M0,30%20Q10,40%2025,30'%20fill='none'%20stroke='%23d4a020'%20stroke-width='0.6'%20opacity='0.4'/%3e%3cpath%20d='M55,30%20Q70,40%2080,30'%20fill='none'%20stroke='%23d4a020'%20stroke-width='0.6'%20opacity='0.4'/%3e%3c!--%20Small%20dots%20--%3e%3ccircle%20cx='10'%20cy='30'%20r='1.5'%20fill='%23e8d0a0'%20opacity='0.4'/%3e%3ccircle%20cx='70'%20cy='30'%20r='1.5'%20fill='%23e8d0a0'%20opacity='0.4'/%3e%3c/pattern%3e%3crect%20width='1200'%20height='60'%20fill='url(%23dcpat)'/%3e%3c/g%3e%3c/svg%3e") 50%/auto 40px repeat-x;width:100%;height:40px}.section-inner{text-align:center;width:100%;max-width:640px;margin:0 auto}.landing{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex;position:relative;overflow-x:hidden}.landing-bg{object-fit:cover;opacity:.35;z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.landing-overlay{z-index:2;background:linear-gradient(#110c0c26 0%,#110c0c73 45%,#110c0cd9 80%,#110c0cfa 100%);width:100%;height:100%;position:absolute;top:0;left:0}.landing-mudang{object-fit:contain;object-position:center center;z-index:1;pointer-events:none;width:auto;max-width:30%;height:auto;max-height:75%;position:absolute;top:5%;-webkit-mask-image:linear-gradient(#000 65%,#0000 100%);mask-image:linear-gradient(#000 65%,#0000 100%)}.landing-mudang-right{opacity:.25;right:2%}.landing-mudang-center{opacity:.2;left:50%;transform:translate(-50%)}.landing-mudang-left{opacity:.22;left:2%}.landing-content{z-index:3;text-align:center;max-width:600px;margin-top:300px;animation:1s fadeInUp;position:relative}.landing-symbol{opacity:.9;filter:drop-shadow(0 4px 20px #c8a0404d);width:110px;height:110px;margin:0 auto 24px;animation:4s infinite pulse}.landing-subtitle{color:var(--gold);letter-spacing:.35em;text-transform:uppercase;margin-bottom:12px;font-family:Cinzel,serif;font-size:.8rem}.landing h1{text-shadow:0 2px 30px #0009;margin-bottom:16px}.landing-desc{color:var(--text-secondary);text-shadow:0 1px 10px #00000080;margin-bottom:36px;font-size:1.1rem;line-height:1.9}.google-btn{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--white);cursor:pointer;letter-spacing:.05em;background:#1a1214d9;border:1px solid #c8a04059;border-radius:6px;align-items:center;gap:12px;padding:18px 48px;font-family:Cormorant Garamond,serif;font-size:1.1rem;transition:background .3s,border-color .3s,box-shadow .3s,transform .3s;display:inline-flex}@media (hover:hover){.google-btn:hover{border-color:var(--gold);background:#221a1cf2;transform:translateY(-1px);box-shadow:0 0 30px #c8a04026}}.google-btn svg{width:20px;height:20px}.explanation{background:var(--dark-surface);border-top:1px solid #c8a0400f;border-bottom:1px solid #c8a0400f;padding:80px 20px}.explanation .section-inner{max-width:680px}.explanation-tag{color:var(--gold);letter-spacing:.3em;text-transform:uppercase;margin-bottom:15px;font-family:Cinzel,serif;font-size:.8rem}.explanation h2{margin-bottom:30px}.explanation p{color:var(--text-secondary);margin-bottom:20px;font-size:1.08rem;line-height:2}.explanation-line{background:linear-gradient(90deg, var(--red), var(--gold), var(--blue));border-radius:1px;width:60px;height:2px;margin:30px auto 0}.input-section{padding:80px 20px}.input-section .section-inner{max-width:500px}.form-tag{color:var(--gold);letter-spacing:.3em;text-transform:uppercase;margin-bottom:10px;font-family:Cinzel,serif;font-size:.8rem}.input-section h2{margin-bottom:30px}.form-group{text-align:left;margin-bottom:22px}.form-group label{color:var(--text-secondary);letter-spacing:.1em;margin-bottom:8px;font-family:Cinzel,serif;font-size:.85rem;display:block}.form-group label .required{color:var(--red);margin-left:4px}.form-group label .optional{color:var(--text-muted);font-family:Cormorant Garamond,serif;font-size:.8rem;font-style:italic}.form-group input,.form-group select,.form-group textarea{background:var(--dark-surface);width:100%;color:var(--text-primary);border:1px solid #c8a04026;border-radius:6px;outline:none;padding:13px 16px;font-family:Cormorant Garamond,serif;font-size:1.05rem;transition:border-color .3s,box-shadow .3s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--gold);box-shadow:0 0 15px #c8a0401a}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-muted)}.form-group textarea{resize:vertical;min-height:80px}textarea[name=wish]:focus{box-shadow:0 0 15px #c8a0401a;border-color:var(--gold)!important}.form-group select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23a09888' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat}.payment-section{background:var(--dark-surface);border-top:1px solid #c8a0400f;border-bottom:1px solid #c8a0400f;padding:60px 20px}.payment-section .section-inner{max-width:480px}.price-display{margin:30px 0}.price-amount{color:var(--gold);font-family:Cinzel,serif;font-size:3rem;font-weight:600}.price-currency{color:var(--text-secondary);vertical-align:super;font-size:1.5rem}.price-desc{color:var(--text-muted);margin-top:8px;font-size:.95rem}.pay-btn{background:linear-gradient(135deg, var(--red), #a02828);width:100%;max-width:360px;color:var(--white);letter-spacing:.1em;cursor:pointer;border:1px solid #c8323280;border-radius:6px;justify-content:center;align-items:center;gap:10px;padding:16px 40px;font-family:Cinzel,serif;font-size:1.1rem;transition:background .3s,box-shadow .3s,transform .3s;display:inline-flex}@media (hover:hover){.pay-btn:hover{background:linear-gradient(135deg, #d43838, var(--red));transform:translateY(-2px);box-shadow:0 4px 40px #c8323240}}.pay-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.pay-btn:disabled:hover{box-shadow:none;background:linear-gradient(135deg, var(--red), #a02828);transform:none}.payment-features{flex-wrap:wrap;justify-content:center;gap:15px;margin-top:30px;display:flex}.payment-feature{color:var(--text-muted);align-items:center;gap:6px;font-size:.85rem;display:flex}.payment-feature span{color:var(--gold)}.results-section{padding:60px 20px 80px}.results-section .section-inner{max-width:720px}.results-header{text-align:center;margin-bottom:40px;animation:.8s fadeInUp}.results-header .tag{color:var(--gold);letter-spacing:.3em;text-transform:uppercase;margin-bottom:10px;font-family:Cinzel,serif;font-size:.8rem}.pillars-grid{grid-template-columns:repeat(4,1fr);gap:10px;margin:30px 0 45px;animation:.8s .2s both fadeInUp;display:grid}.pillar-card{background:var(--dark-surface);text-align:center;border:1px solid #c8a04026;border-radius:8px;padding:22px 10px;transition:border-color .3s}@media (hover:hover){.pillar-card:hover{border-color:#c8a0404d}}.pillar-label{color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;word-break:break-word;margin-bottom:10px;font-family:Cinzel,serif;font-size:.75rem;line-height:1.4}.pillar-korean{color:var(--gold);margin-bottom:8px;font-size:1.8rem}.pillar-info{color:var(--text-secondary);font-size:.8rem}.reading-card{background:var(--dark-surface);text-align:left;border:1px solid #c8a04014;border-radius:10px;margin-bottom:20px;padding:32px 28px;transition:border-color .3s;animation:.6s both fadeInUp}@media (hover:hover){.reading-card:hover{border-color:#c8a0402e}}.reading-card-tag{color:var(--gold);letter-spacing:.2em;text-transform:uppercase;margin-bottom:10px;font-family:Cinzel,serif;font-size:.68rem}.reading-card h3{margin-bottom:16px;font-size:clamp(1.05rem,2vw,1.35rem)}.reading-card p{color:var(--text-secondary);font-size:1.02rem;line-height:1.9}.lucky-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin:25px 0;animation:.6s .75s both fadeInUp;display:grid}.lucky-item{background:var(--dark-surface);text-align:center;border:1px solid #c8a0401a;border-radius:8px;padding:22px 14px;transition:border-color .3s}@media (hover:hover){.lucky-item:hover{border-color:#c8a04040}}.lucky-item-label{color:var(--text-muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px;font-family:Cinzel,serif;font-size:.75rem}.lucky-item-value{color:var(--gold);font-family:Cinzel,serif;font-size:1.25rem}.quote-block{background:var(--dark-surface);text-align:center;border-top:1px solid #c8a0400f;border-bottom:1px solid #c8a0400f;padding:55px 20px}.quote-block blockquote{color:var(--text-primary);max-width:600px;margin:0 auto 15px;font-family:Cormorant Garamond,serif;font-size:1.25rem;font-style:italic;line-height:1.9}.quote-block cite{color:var(--text-muted);font-size:.9rem}.footer{text-align:center;border-top:1px solid #c8a0400f;padding:45px 20px}.footer-logo{color:var(--gold);letter-spacing:.3em;margin-bottom:12px;font-family:Cinzel,serif;font-size:1.15rem}.footer-copy{color:var(--text-muted);font-size:.85rem}.spinner{border:3px solid #c8a04033;border-top-color:var(--gold);border-radius:50%;width:40px;height:40px;margin:20px auto;animation:.8s linear infinite spin}.user-bar{z-index:100;-webkit-backdrop-filter:blur(12px);background:#110c0ceb;border-bottom:1px solid #c8a04014;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:10px 24px;display:flex;position:fixed;top:0;left:0;right:0}.lang-btn{cursor:pointer;border-radius:4px;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:6px 10px;font-size:1rem;display:flex}.user-bar-flags{flex-wrap:nowrap;justify-content:center;gap:4px;display:flex}@media (width<=600px){.user-bar-flags{order:1;justify-content:center;width:100%;padding-top:6px}}.user-bar-left{color:var(--gold);letter-spacing:.2em;font-family:Cinzel,serif;font-size:.85rem}.user-bar-right{align-items:center;gap:15px;display:flex}.logout-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #c8a04033;border-radius:4px;min-height:44px;padding:10px 14px;font-family:Cormorant Garamond,serif;font-size:.85rem;transition:border-color .3s,color .3s}@media (hover:hover){.logout-btn:hover{border-color:var(--gold);color:var(--gold)}}.card-grid{grid-template-columns:repeat(4,1fr);gap:10px;max-width:400px;margin:0 auto;display:grid}@media (width<=600px){.landing-mudang-right,.landing-mudang-left{display:none}.landing-mudang-center{opacity:.15;max-width:70%;height:60%}.landing-content{margin-top:200px}.landing-symbol{width:80px;height:80px;margin-bottom:18px}.landing-desc{margin-bottom:28px;font-size:1rem}.google-btn{padding:15px 36px;font-size:1rem}.pillars-grid{grid-template-columns:repeat(2,1fr);gap:8px}.pillar-card{padding:16px 8px}.pillar-korean{font-size:1.5rem}.lucky-grid{grid-template-columns:1fr;gap:10px}.price-amount{font-size:2.5rem}.reading-card{border-radius:8px;margin-bottom:16px;padding:24px 20px}.reading-card p{font-size:.98rem}.results-section{padding:50px 16px 60px}.explanation{padding:60px 20px}.quote-block{padding:40px 20px}.quote-block blockquote{font-size:1.1rem}}@media (width<=380px){.landing-content{margin-top:160px}.landing-symbol{width:70px;height:70px}.pillar-korean{font-size:1.3rem}.reading-card{padding:20px 16px}.card-grid{grid-template-columns:repeat(3,1fr)}}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}@media print{body{color:#222!important;background:#fff!important}@page{margin:1.5cm}.user-bar,.landing,.explanation,.input-section,.payment-section,.dancheong-divider,.quote-block,.footer,.pay-btn,.logout-btn,.lang-switcher,.print-note,.google-btn,.spinner{display:none!important}.lucky-item{background:#f5f2ec!important;border:1px solid #ddd!important}.lucky-item-label{color:#666!important}.lucky-item-value{color:#8b6914!important}.results-section{padding-top:20px!important}.reading-card{break-inside:avoid;color:#222!important;box-shadow:none!important;background:#fff!important;border:1px solid #ddd!important}.reading-card-tag{color:#8b6914!important}.reading-card h3{color:#333!important}.reading-card p{color:#444!important}.pillar-card{color:#222!important;background:#f9f6f0!important;border:1px solid #ddd!important}.pillar-korean{color:#333!important}canvas{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;max-width:100%!important}.pillar-card,.lucky-item,.results-section [style*=background]{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.pillars-grid,.reading-card,.lucky-grid{opacity:1!important;animation:none!important;transform:none!important}:root{--dark-bg:#fff!important;--dark-surface:#f9f6f0!important;--dark-surface2:#f0ece4!important;--text-primary:#222!important;--text-secondary:#444!important;--text-muted:#666!important;--gold:#8b6914!important;--white:#222!important}.results-section p,.results-section div,.results-section span,.results-section h3{color:#333!important}.results-section .reading-card-tag,.results-section .pillar-label{color:#8b6914!important}.results-section [style*=color] h3,.results-section [style*=color] p,.results-section [style*=color] span,.results-section [style*=color] div{color:#333!important}.results-section strong{color:#222!important}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
