html[data-theme=dark]{--bg: #0a0a0a;--text: #e5e5e5;--muted: #a3a3a3;--card: #1a1a1a;--border: #2a2a2a;--primary: #8b5cf6}html[data-theme=light]{--bg: #ffffff;--text: #0a0a0a;--muted: #737373;--card: #f5f5f5;--border: #e5e5e5;--primary: #7c3aed}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;background-color:var(--bg);color:var(--text);line-height:1.6;min-height:100vh}h1,h2,h3,h4,h5,h6{line-height:1.2;margin-bottom:.5em}h1{font-size:2rem}p{margin-bottom:1em}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button,input,select,textarea{min-height:44px;font-family:inherit;font-size:1rem}button{background-color:var(--primary);color:#fff;border:none;padding:0 1.5rem;border-radius:.5rem;cursor:pointer;font-weight:500;transition:opacity .2s}button:hover{opacity:.9}button:active{opacity:.8}input,select,textarea{background-color:var(--card);color:var(--text);border:1px solid var(--border);padding:.75rem;border-radius:.5rem}input:focus,select:focus,textarea:focus{outline:2px solid var(--primary);outline-offset:2px}.container{max-width:480px;margin:0 auto;padding:1rem}.app-layout{display:flex;flex-direction:column;min-height:100vh}.app-header{background-color:var(--card);border-bottom:1px solid var(--border);padding:1rem}.header-content{max-width:480px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.app-title{font-size:1.25rem;font-weight:600;margin:0}.theme-toggle{min-width:44px;padding:.5rem;background-color:var(--bg);border:1px solid var(--border);font-size:1.25rem}.app-main{flex:1;padding:2rem 0}.app-footer{background-color:var(--card);border-top:1px solid var(--border);padding:1rem;text-align:center;color:var(--muted);font-size:.875rem}.app-footer p{margin:0}.dev-nav{margin-top:2rem;padding:1rem;background-color:var(--card);border:1px solid var(--border);border-radius:.5rem}.dev-nav-title{font-size:.875rem;color:var(--muted);margin-bottom:.5rem;font-weight:600}.dev-nav-links{display:flex;flex-wrap:wrap;gap:.5rem}.dev-nav-link{padding:.5rem 1rem;background-color:var(--bg);border:1px solid var(--border);border-radius:.25rem;font-size:.875rem;transition:background-color .2s}.dev-nav-link:hover{background-color:var(--card);text-decoration:none}.login-page{display:flex;justify-content:center;align-items:center;min-height:80vh;padding:2rem 1rem}.login-container{max-width:400px;width:100%}.login-subtitle{color:#666;margin-bottom:2rem;text-align:center}.login-form{margin-bottom:1.5rem}.form-actions{display:flex;gap:.75rem;margin-top:1.5rem}.btn{flex:1;padding:.75rem 1rem;border:none;border-radius:4px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background-color:#4a90e2;color:#fff}.btn-primary:hover:not(:disabled){background-color:#357abd}.btn-secondary{background-color:#f5f5f5;color:#333;border:1px solid #ddd}.btn-secondary:hover:not(:disabled){background-color:#e8e8e8}.btn-google{width:100%;padding:.75rem 1rem;background-color:#fff;color:#333;border:1px solid #ddd;border-radius:4px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s}.btn-google:hover:not(:disabled){background-color:#f8f8f8}.btn-google:disabled{opacity:.6;cursor:not-allowed}.divider{text-align:center;margin:1.5rem 0;position:relative}.divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background-color:#ddd}.divider span{background-color:#fff;padding:0 1rem;position:relative;color:#999;font-size:.875rem}.onboarding-page{display:flex;justify-content:center;align-items:center;min-height:80vh;padding:2rem 1rem}.onboarding-container{max-width:500px;width:100%}.onboarding-subtitle{color:#666;margin-bottom:2rem;text-align:center}.onboarding-form{margin-bottom:1.5rem}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500}.form-group input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#4a90e2}.form-group input:disabled{background-color:#f5f5f5;cursor:not-allowed}.form-hint{display:block;margin-top:.25rem;font-size:.875rem;color:#999}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.zodiac-preview{margin:1.5rem 0;padding:1rem;background-color:#f0f8ff;border:1px solid #b3d9ff;border-radius:4px;text-align:center}.preview-text{margin:0;font-size:1.125rem;color:#333}.preview-text strong{color:#4a90e2}.btn-submit{width:100%;margin-top:1.5rem}.error-message{padding:.75rem;background-color:#fee;border:1px solid #fcc;border-radius:4px;color:#c33;margin-bottom:1rem;font-size:.875rem}@media(max-width:640px){.form-row{grid-template-columns:1fr}}.home-page{max-width:480px;margin:0 auto;padding:1rem 1rem 4rem}.day-toggle{display:flex;gap:.5rem;background:#f4f4f5;padding:.25rem;border-radius:.75rem;margin-bottom:1.5rem;width:fit-content;margin-left:auto;margin-right:auto}.day-toggle button{flex:1;min-width:100px;padding:.625rem 1.25rem;border:none;border-radius:.5rem;font-size:.9375rem;font-weight:600;background:transparent;color:#71717a;cursor:pointer;transition:all .2s ease}.day-toggle button:hover{color:#3f3f46}.day-toggle button.active{background:#fff;color:var(--primary);box-shadow:0 1px 3px #0000001a}.home-header{text-align:center;margin-bottom:1.5rem}.home-header h1{font-size:2rem;font-weight:700;margin-bottom:.25rem}.home-date{font-size:.875rem;opacity:.7;margin-bottom:.75rem}.home-badge{display:inline-block;background-color:var(--primary);color:#fff;padding:.4rem 1rem;border-radius:1rem;font-size:.875rem;font-weight:500;margin-bottom:.5rem}.home-bands{font-size:.75rem;opacity:.5;font-family:monospace}.new-day-indicator{margin-top:1rem;padding:.75rem;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border-radius:.5rem;text-align:center;font-weight:500;animation:fadeInOut 3s ease-in-out}@keyframes fadeInOut{0%,to{opacity:0;transform:translateY(-10px)}10%,90%{opacity:1;transform:translateY(0)}}.ragondin-pose{margin:1.5rem 0;display:flex;justify-content:center}.pose-placeholder{width:200px;height:200px;background:linear-gradient(135deg,#e0e7ff,#f5f3ff);border:2px dashed #d4d4d8;border-radius:1rem;display:flex;align-items:center;justify-content:center;font-size:1rem;color:#71717a;text-transform:uppercase;letter-spacing:.05em}.fortune-cards-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}.fortune-card{background-color:var(--card);border:1px solid var(--border);border-radius:1rem;padding:1rem;cursor:pointer;transition:all .2s ease-out;min-height:140px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;overflow:hidden;opacity:0;transform:translateY(20px)}.fortune-cards-grid.reveal .fortune-card{animation:cardReveal .4s ease-out forwards}@keyframes cardReveal{to{opacity:1;transform:translateY(0)}}.fortune-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f;border-color:var(--primary)}.fortune-card:active{transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.fortune-card[data-category=love]{border-top:3px solid #ec4899}.fortune-card[data-category=wealth]{border-top:3px solid #f59e0b}.fortune-card[data-category=health]{border-top:3px solid #10b981}.fortune-card[data-category=destiny]{border-top:3px solid #8b5cf6}.card-emoji{font-size:2rem;margin-bottom:.5rem}.card-title{font-weight:600;font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;opacity:.8}.card-score{font-size:1.75rem;font-weight:700;margin-bottom:.5rem}.card-text{font-size:.75rem;line-height:1.4;opacity:.7;margin-top:auto}.fortune-summary-strip{margin:2rem 0;padding:1.5rem;background-color:var(--card);border:1px solid var(--border);border-radius:1rem}.summary-section,.tip-section{margin-bottom:1.5rem}.summary-section:last-child,.tip-section:last-child{margin-bottom:0}.summary-section h3,.tip-section h3{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;opacity:.7}.summary-section p,.tip-section p{margin:0;line-height:1.6}.cta-row{display:flex;flex-direction:column;gap:.75rem;margin:2rem 0}.cta-row button{width:100%}.btn-subtle{background-color:transparent;color:var(--text);border:1px solid var(--border);opacity:.8}.btn-subtle:hover{opacity:1;border-color:var(--primary)}.fallback-banner{background-color:#fef3c7;border:1px solid #f59e0b;border-radius:.5rem;padding:1rem;margin:1rem 0;text-align:center}.fallback-banner p{margin:0 0 .75rem;color:#92400e;font-size:.875rem}.fallback-banner button{background-color:#f59e0b;font-size:.875rem;padding:0 1.25rem;min-height:40px}.modal-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background-color:var(--bg);border-radius:1.5rem;max-width:500px;width:100%;max-height:90vh;overflow-y:auto;position:relative;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-close{position:absolute;top:1rem;right:1rem;background-color:var(--card);color:var(--text);border:1px solid var(--border);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;cursor:pointer;z-index:10;transition:all .2s;padding:0;min-height:unset}.modal-close:hover{background-color:var(--error);color:#fff;border-color:var(--error)}.modal-body{padding:4rem 1.5rem 2rem;text-align:center}.modal-category-emoji{font-size:3rem;margin-bottom:.5rem}.modal-title{font-size:1.5rem;margin-bottom:.5rem}.modal-score{font-size:2.5rem;font-weight:700;margin-bottom:2rem}.modal-section{margin-bottom:2rem;text-align:left}.modal-section:last-child{margin-bottom:0}.modal-section h3{font-size:1rem;font-weight:600;margin-bottom:.75rem;text-transform:uppercase;letter-spacing:.05em;opacity:.8}.short-reading{line-height:1.6;margin:0}.premium-text{line-height:1.7;margin:0;font-size:.95rem}.locked-content{padding:2rem;background:linear-gradient(135deg,#f5f3ff,#ede9fe);border:2px dashed #d4d4d8;border-radius:1rem;text-align:center;color:#3f3f46}.lock-icon{font-size:3rem;margin-bottom:1rem;opacity:.6}.lock-message{margin-bottom:1.5rem;color:#52525b}.unlock-button{background:linear-gradient(135deg,var(--primary),var(--accent));font-weight:600}.segmented-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;padding:1rem;background-color:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:5}.tab{background-color:transparent;border:1px solid var(--border);border-radius:.5rem;padding:.5rem;font-size:.75rem;display:flex;flex-direction:column;align-items:center;gap:.25rem;transition:all .2s;color:var(--text);min-height:unset}.tab:hover{background-color:var(--hover);border-color:var(--primary)}.tab.active{background-color:var(--primary);color:#fff;border-color:var(--primary)}.tab-emoji{font-size:1.25rem}.tab-title{font-size:.7rem;font-weight:500}.fortune-skeleton{max-width:480px;margin:0 auto;padding:1rem}.skeleton-header{text-align:center;margin-bottom:1.5rem}.skeleton-bar{background:linear-gradient(90deg,var(--border) 25%,var(--hover) 50%,var(--border) 75%);background-size:200% 100%;border-radius:.5rem;animation:shimmer 1.5s infinite;margin:0 auto}.skeleton-title{height:2rem;width:120px;margin-bottom:.5rem}.skeleton-date{height:1rem;width:100px;margin-bottom:.5rem}.skeleton-badge{height:1.5rem;width:140px;margin-bottom:1rem}.skeleton-pose{width:200px;height:200px;margin:1.5rem auto;background:linear-gradient(90deg,var(--border) 25%,var(--hover) 50%,var(--border) 75%);background-size:200% 100%;border-radius:1rem;animation:shimmer 1.5s infinite}.skeleton-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}.skeleton-card{height:140px;background:linear-gradient(90deg,var(--border) 25%,var(--hover) 50%,var(--border) 75%);background-size:200% 100%;border-radius:1rem;animation:shimmer 1.5s infinite}.skeleton-summary{margin:2rem 0}.skeleton-text{height:1rem;width:100%;margin-bottom:.75rem}.skeleton-text:last-child{width:80%}.paywall-page{max-width:480px;margin:0 auto;padding:2rem 1rem;text-align:center}.paywall-page h1{font-size:2rem;margin-bottom:.5rem}.paywall-page .subtitle{font-size:1rem;opacity:.7;margin-bottom:2rem}.premium-benefits{background-color:var(--card);border:1px solid var(--border);border-radius:1rem;padding:2rem;margin:2rem 0;text-align:left}.benefit{padding:.75rem 0;border-bottom:1px solid var(--border);font-size:.95rem}.benefit:last-child{border-bottom:none}.pricing-placeholder{margin:2rem 0;padding:2rem;background:linear-gradient(135deg,#f5f3ff,#ede9fe);border-radius:1rem;color:#3f3f46}.pricing-placeholder p{margin:.5rem 0;font-weight:500;color:#3f3f46}.premium-unlocked-badge{display:inline-block;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#fff;padding:.3rem .8rem;border-radius:1rem;font-size:.75rem;font-weight:600;margin:.5rem 0;box-shadow:0 2px 8px #fbbf244d}.pricing-card{margin:2rem 0;padding:2rem;background:linear-gradient(135deg,#f5f3ff,#ede9fe);border-radius:1rem;color:#3f3f46}.pricing-card p{margin:.5rem 0;color:#3f3f46}.pricing-card .price{font-size:2.5rem;font-weight:700;margin:1rem 0;color:#3f3f46}.pricing-card .pricing-note{font-size:.875rem;opacity:.7}.btn-upgrade{width:100%;padding:1rem 2rem;font-size:1.125rem;font-weight:600;background:linear-gradient(135deg,var(--primary),#9333ea);color:#fff;border:none;border-radius:.75rem;cursor:pointer;margin-top:1rem;transition:transform .2s,box-shadow .2s}.btn-upgrade:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #8b5cf666}.btn-upgrade:disabled{opacity:.6;cursor:not-allowed}.secure-note{font-size:.875rem;opacity:.6;margin-top:1rem;text-align:center}.error-banner{background-color:#fee2e2;color:#991b1b;padding:1rem;border-radius:.5rem;margin:1rem 0;text-align:center}.success-banner{background:linear-gradient(135deg,#d1fae5,#a7f3d0);padding:2rem;border-radius:1rem;text-align:center;margin:2rem 0}.success-banner h1{color:#065f46;margin-bottom:1rem}.success-banner p{color:#047857;margin:.5rem 0}.success-details{font-size:.95rem;margin-top:1rem}.canceled-banner{background-color:var(--card);border:1px solid var(--border);padding:2rem;border-radius:1rem;text-align:center;margin:2rem 0}.canceled-banner h1{margin-bottom:1rem}@media(min-width:640px){.cta-row{flex-direction:row}.cta-row button{width:auto;flex:1}}.long-fortune-section{margin-top:2rem;margin-bottom:2rem}.long-fortune-cta-card{background:linear-gradient(135deg,#f0f4ff,#ede9fe);border:2px solid #e0e7ff;border-radius:1rem;padding:1.5rem;text-align:center}.long-fortune-cta-card h3{font-size:1.5rem;font-weight:600;margin-bottom:.75rem;color:var(--primary)}.long-fortune-cta-card p{font-size:1rem;opacity:.8;margin-bottom:1.25rem;line-height:1.5}.btn-unlock,.btn-complete{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:none;padding:.75rem 2rem;border-radius:.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.btn-unlock:hover,.btn-complete:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.long-fortune-content{background:linear-gradient(135deg,#faf5ff,#f5f3ff);border:2px solid #e9d5ff;border-radius:1rem;padding:1.5rem}.long-fortune-content h3{font-size:1.5rem;font-weight:600;margin-bottom:1.25rem;color:var(--primary);text-align:center}.long-fortune-loading{display:flex;flex-direction:column;gap:1rem}.skeleton-text{height:1rem;background:linear-gradient(90deg,#e0e7ff 25%,#f0f4ff,#e0e7ff 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:.25rem}.skeleton-text:nth-child(2){width:90%}.skeleton-text:nth-child(3){width:80%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.long-fortune-error{text-align:center;padding:1.5rem}.long-fortune-error p{font-size:1rem;margin-bottom:1rem;opacity:.8}.long-fortune-error button{background:var(--primary);color:#fff;border:none;padding:.5rem 1.5rem;border-radius:.5rem;font-size:.875rem;cursor:pointer;transition:opacity .2s}.long-fortune-error button:hover{opacity:.9}.long-fortune-display{display:flex;flex-direction:column;gap:1.5rem}.long-fortune-main{background:#fff;padding:1.25rem;border-radius:.75rem;border:1px solid #e9d5ff}.long-fortune-main p{font-size:1rem;line-height:1.7;color:#3f3f46;white-space:pre-wrap}.long-fortune-sections{display:grid;grid-template-columns:1fr;gap:1rem}.long-section{background:#fff;padding:1rem;border-radius:.5rem;border:1px solid #e9d5ff}.long-section h4{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;color:var(--primary)}.long-section p{font-size:.875rem;line-height:1.6;color:#52525b}.long-fortune-advice{background:#fff;padding:1.25rem;border-radius:.75rem;border:1px solid #e9d5ff}.long-fortune-advice h4{font-size:1rem;font-weight:600;margin-bottom:.75rem;color:var(--primary)}.long-fortune-advice ul{list-style:none;padding:0;margin:0}.long-fortune-advice li{padding:.5rem 0 .5rem 1.5rem;position:relative;font-size:.875rem;line-height:1.6;color:#52525b}.long-fortune-advice li:before{content:"•";position:absolute;left:.5rem;color:var(--primary);font-weight:700;font-size:1.25rem}@media(min-width:640px){.long-fortune-sections{grid-template-columns:1fr 1fr}}.settings-page{max-width:600px;margin:0 auto;padding:1rem 1rem 4rem}.settings-header{text-align:center;margin-bottom:2rem}.settings-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.settings-header p{font-size:1rem;opacity:.7}.settings-content{background:#fff;border-radius:1rem;padding:1.5rem;box-shadow:0 2px 8px #0000000d}.settings-section{margin-bottom:2rem}.settings-section h2{font-size:1.25rem;font-weight:600;margin-bottom:.5rem;color:var(--primary)}.section-description{font-size:.875rem;opacity:.7;margin-bottom:1.5rem;line-height:1.6}.form-group{margin-bottom:1.25rem}.form-group label{display:block;font-size:.875rem;font-weight:600;margin-bottom:.5rem;color:#3f3f46}.form-group input{width:100%;padding:.75rem;border:2px solid #e4e4e7;border-radius:.5rem;font-size:1rem;transition:border-color .2s;box-sizing:border-box}.form-group input:focus{outline:none;border-color:var(--primary)}.form-group input.input-error{border-color:#ef4444}.field-error{display:block;font-size:.75rem;color:#ef4444;margin-top:.25rem}.form-actions{display:flex;gap:.75rem;flex-direction:column;margin-top:1.5rem}.btn-primary,.btn-secondary{padding:.75rem 1.5rem;border-radius:.5rem;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:#f4f4f5;color:#52525b}.btn-secondary:hover{background:#e4e4e7}.save-success{margin-top:1rem;padding:.75rem;background:#dcfce7;border:1px solid #86efac;border-radius:.5rem;color:#166534;font-size:.875rem;text-align:center}.save-error{margin-top:1rem;padding:.75rem;background:#fee2e2;border:1px solid #fca5a5;border-radius:.5rem;color:#991b1b;font-size:.875rem;text-align:center}@media(min-width:640px){.form-actions{flex-direction:row}}.compat-page{max-width:480px;margin:0 auto;padding:1rem 1rem 4rem}.compat-page h1{font-size:2rem;font-weight:700;margin-bottom:.5rem;text-align:center}.compat-page .subtitle{text-align:center;opacity:.7;margin-bottom:2rem}.your-profile{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;padding:1rem;border-radius:.75rem;text-align:center;margin-bottom:2rem}.your-profile h3{font-size:.875rem;margin-bottom:.5rem;opacity:.9}.your-profile p{font-size:1.125rem;font-weight:600}.compat-input-section{background:#f9fafb;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.5rem;margin-bottom:2rem}.compat-input-section h3{font-size:1.25rem;font-weight:600;margin-bottom:1.5rem}.input-group{margin-bottom:1rem}.input-group label{display:block;font-size:.875rem;font-weight:500;margin-bottom:.5rem;color:#374151}.input-group input{width:100%;padding:.75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:1rem;transition:border-color .2s}.input-group input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #6366f11a}.input-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:.75rem}.compat-result-section{background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px solid #fbbf24;border-radius:1rem;padding:2rem;margin-bottom:2rem;text-align:center}.compat-result-section h2{font-size:1.75rem;font-weight:700;margin-bottom:.5rem;color:#78350f}.partner-info{margin-bottom:1.5rem}.partner-info p{font-size:1.125rem;font-weight:500;color:#92400e}.match-display{margin-bottom:1.5rem}.match-percentage{font-size:3rem;font-weight:800;color:#78350f;margin-bottom:1rem}.match-meter{width:100%;height:1rem;background:#ffffff80;border-radius:.5rem;overflow:hidden;margin-bottom:1rem}.match-meter-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#10b981);transition:width .5s ease-out;border-radius:.5rem}.match-caption{background:#fffc;padding:1rem;border-radius:.75rem;margin-bottom:1.5rem}.match-caption p{font-size:1rem;font-style:italic;color:#78350f;line-height:1.5}.result-actions{display:flex;gap:.75rem;justify-content:center}.result-actions button{flex:1;max-width:200px}.compat-history-section{margin-top:3rem}.compat-history-section h3{font-size:1.25rem;font-weight:600;margin-bottom:1rem}.empty-message{text-align:center;opacity:.6;padding:2rem;font-style:italic}.history-list{display:flex;flex-direction:column;gap:.75rem}.history-item{background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:1rem;transition:all .2s}.history-item:hover{box-shadow:0 4px 8px #0000001a;transform:translateY(-2px)}.history-main{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.history-main h4{font-size:1.125rem;font-weight:600;color:#111827}.history-match{font-size:1.5rem;font-weight:700;color:var(--primary)}.history-details{display:flex;justify-content:space-between;align-items:center;font-size:.875rem;opacity:.7}.history-date{font-size:.75rem}.share-page{max-width:480px;margin:0 auto;padding:1rem 1rem 4rem}.share-page-header{text-align:center;margin-bottom:1.5rem}.share-page-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.share-page-note{font-size:.875rem;opacity:.6;margin-top:1rem;text-align:center}.share-preview-wrapper{margin:1.5rem auto;background-color:var(--card);border:1px solid var(--border);border-radius:1rem;padding:0;width:calc(100% - 2rem);max-width:400px}.share-preview-inner{width:100%;aspect-ratio:1080 / 1350;position:relative;overflow:hidden;border-radius:.5rem}.share-preview-inner .share-card-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.296);transform-origin:center}.share-export-node{position:fixed;top:0;left:0;width:1080px;height:1350px;opacity:0;pointer-events:none;z-index:-1}.share-export-node .share-card-container{position:relative;top:auto;left:auto;transform:none}.share-actions{display:flex;flex-direction:column;gap:.75rem;margin:1.5rem 0}.share-actions button{width:100%;padding:1rem;font-size:1rem;font-weight:600;border-radius:.75rem;border:none;cursor:pointer;transition:all .2s;min-height:52px}.btn-download{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff}.btn-download:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.btn-download:disabled{opacity:.5;cursor:not-allowed}.btn-share{background-color:var(--card);color:var(--text);border:2px solid var(--border)}.btn-share:hover:not(:disabled){border-color:var(--primary);background-color:var(--hover)}.btn-share:disabled{opacity:.5;cursor:not-allowed}.share-toast{position:fixed;bottom:2rem;left:50%;transform:translate(-50%);background-color:#10b981;color:#fff;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;font-weight:500;box-shadow:0 4px 12px #0003;z-index:1000;animation:toastFadeIn .3s ease-out}@keyframes toastFadeIn{0%{opacity:0;transform:translate(-50%) translateY(10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.share-card-container{width:1080px;height:1350px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;position:relative;display:flex;flex-direction:column;padding:60px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.share-card-header{text-align:center;margin-bottom:13px}.share-card-brand{font-size:52px;font-weight:700;margin:0 0 12px;letter-spacing:-.02em}.share-card-date{font-size:26px;opacity:.9;font-weight:400}.share-card-title{text-align:center;margin-bottom:27px}.share-card-animal-element{font-size:44px;font-weight:600;margin-bottom:10px}.share-card-bands{font-size:22px;opacity:.7;font-family:monospace;letter-spacing:.1em}.share-card-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px}.share-card-category{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:28px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;border:2px solid rgba(255,255,255,.2)}.share-card-emoji{font-size:54px;margin-bottom:10px}.share-card-label{font-size:22px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;margin-bottom:6px;opacity:.9}.share-card-score{font-size:72px;font-weight:700;margin-bottom:10px;line-height:1}.share-card-line{font-size:18px;line-height:1.3;opacity:.85}.share-card-summary{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:28px;border:2px solid rgba(255,255,255,.2);margin-bottom:0}.share-card-summary-text{font-size:22px;line-height:1.45;text-align:center}.share-card-watermark{position:absolute;bottom:25px;right:60px;font-size:24px;font-weight:500;opacity:.4;letter-spacing:.05em}@media(min-width:640px){.share-actions{flex-direction:row}.share-preview-wrapper{max-width:500px}.share-preview-inner .share-card-container{transform:translate(-50%,-50%) scale(.37)}}.share-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:1rem}.share-loading-spinner{width:48px;height:48px;border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.share-error{background-color:#fee2e2;color:#991b1b;padding:1.5rem;border-radius:.75rem;margin:1.5rem 0;text-align:center}.share-error p{margin:0 0 1rem;font-size:1rem}.share-error button{background-color:#dc2626;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.5rem;font-size:.875rem;cursor:pointer;font-weight:600}.share-error button:hover{background-color:#b91c1c}.config-error-panel{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background-color:var(--bg);color:var(--text)}.config-error-content{max-width:600px;padding:2rem;background-color:var(--card);border:2px solid #dc2626;border-radius:.5rem}.config-error-content h1{color:#dc2626;margin-bottom:1rem}.error-message{font-size:1.125rem;font-weight:600;margin-bottom:2rem;padding:1rem;background-color:#dc26261a;border-left:4px solid #dc2626;border-radius:.25rem}.error-details h2{font-size:1rem;margin-bottom:.75rem}.error-details ol,.error-details ul{margin-left:1.5rem;margin-bottom:1.5rem}.error-details li{margin-bottom:.5rem}.error-details code{background-color:var(--bg);padding:.25rem .5rem;border-radius:.25rem;font-family:Courier New,monospace;font-size:.875rem;color:var(--primary)}