:root{--color-paper:#f4f4f5;--color-paper-card:#fff;--color-ink:#18181b;--color-sub:#71717a;--color-wood:#b45309;--color-fire:#be123c;--color-earth:#a16207;--color-metal:#475569;--color-water:#0369a1;--color-accent:#462a0a;--color-border:#e4e4e7;--font-serif:"Noto Serif SC","Noto Serif TC",serif;--font-sans:"Noto Sans SC","Noto Sans Thai",sans-serif;--radius-xl:1rem;--radius-2xl:1.5rem;--radius-3xl:2rem}body{font-family:var(--font-sans);background-color:var(--color-paper);color:var(--color-ink);-webkit-font-smoothing:antialiased;margin:0}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.anim-fade-in{animation:.5s ease-out forwards fadeIn}.anim-slide-up{animation:.5s ease-out forwards slideUp}.spin-slow{animation:60s linear infinite spin}.spin-slow-reverse{animation:40s linear infinite reverse spin}.app-container{background-color:var(--color-paper);min-height:100vh;font-family:var(--font-sans);position:relative}.lang-switcher-wrapper{z-index:50;position:relative}.lang-btn{background-color:var(--color-paper-card);border:1px solid var(--color-border);color:var(--color-sub);cursor:pointer;border-radius:9999px;align-items:center;gap:.5rem;padding:.375rem .75rem;font-size:.75rem;font-weight:500;transition:color .2s;display:flex}.lang-btn:hover{color:var(--color-ink)}.lang-dropdown-mask{z-index:40;position:fixed;inset:0}.lang-dropdown{z-index:50;background-color:#fff;border:1px solid #f3f4f6;border-radius:.75rem;width:8rem;margin-top:.5rem;animation:.2s fadeIn;position:absolute;top:100%;right:0;overflow:hidden;box-shadow:0 10px 15px -3px #0000001a}.lang-option{text-align:left;width:100%;color:var(--color-sub);cursor:pointer;background:0 0;border:none;padding:.75rem 1rem;font-size:.75rem;transition:background-color .2s}.lang-option:hover{background-color:#f9fafb}.lang-option.active{color:var(--color-ink);background-color:#f9fafb;font-weight:700}.spinner-container{flex-direction:column;align-items:center;gap:1.5rem;display:flex}.spinner-wrapper{width:4rem;height:4rem;position:relative}.spinner-bg{border:4px solid #e5e7eb;border-radius:9999px;width:100%;height:100%}.spinner-active{border:4px solid var(--color-ink);border-top-color:#0000;border-radius:9999px;animation:1s linear infinite spin;position:absolute;inset:0}.spinner-text{color:var(--color-sub);letter-spacing:.1em;font-size:.875rem;font-weight:500}.splash-screen{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative;overflow:hidden}.splash-bg-texture{opacity:.05;pointer-events:none;background-image:url(https://www.transparenttextures.com/patterns/rice-paper.png);position:absolute;inset:0}.splash-circle-outer{border:1px solid #18181b0d;border-radius:50%;width:500px;height:500px;position:absolute}.splash-circle-inner{border:1px solid #18181b1a;border-radius:50%;width:400px;height:400px;position:absolute}.splash-content{z-index:10;flex-direction:column;align-items:center;animation:1.5s ease-out fadeIn;display:flex}.splash-title{font-size:2.25rem;font-family:var(--font-serif);color:var(--color-ink);letter-spacing:.3em;margin-top:2rem;margin-left:1rem;font-weight:700}.splash-divider{background-color:#18181b33;width:4rem;height:1px;margin:1.5rem 0}.splash-subtitle{color:var(--color-sub);font-family:var(--font-serif);letter-spacing:.2em;text-align:center;font-size:1rem}.splash-footer{opacity:.6;flex-direction:column;align-items:center;display:flex;position:absolute;bottom:3rem}.splash-footer-text{color:var(--color-sub);text-transform:uppercase;letter-spacing:.3em;font-size:.625rem}.input-screen{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex;position:relative}.input-container{width:100%;max-width:28rem;animation:.5s ease-out slideUp}.input-screen .bg-logo{pointer-events:none;z-index:0;filter:grayscale();width:clamp(150px,19vw,220px);position:absolute;top:1rem;left:2rem;transform:none}@media (max-width:480px){.input-screen .bg-logo{top:.75rem;left:1rem}}.input-screen .input-container{z-index:1;position:relative}.input-header{text-align:center;margin-bottom:2rem}.input-title{color:var(--color-ink);margin-bottom:.5rem;font-size:1.875rem;font-weight:700}.input-subtitle{color:var(--color-sub);font-size:.75rem}.input-card{background-color:var(--color-paper-card);border-radius:var(--radius-3xl);padding:2rem;box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.input-group{flex-direction:column;gap:.5rem;margin-bottom:1.5rem;display:flex}.input-label{color:var(--color-sub);margin-left:.25rem;font-size:.75rem;font-weight:700}.input-field{background-color:var(--color-paper);width:100%;color:var(--color-ink);font-family:var(--font-sans);box-sizing:border-box;border:none;border-radius:1rem;outline:none;padding:1rem 1.25rem;transition:box-shadow .2s}.input-field:focus{box-shadow:0 0 0 2px #d9770633}.gender-toggle{background-color:var(--color-paper);border-radius:1rem;padding:.375rem;display:flex}.gender-btn{cursor:pointer;color:var(--color-sub);background:0 0;border:none;border-radius:.75rem;flex:1;padding:.75rem;font-size:.875rem;font-weight:500;transition:all .3s}.gender-btn.active{color:var(--color-ink);background-color:#fff;box-shadow:0 1px 2px #0000000d}.date-toggle{cursor:pointer;-webkit-user-select:none;user-select:none;gap:1rem;font-size:.75rem;font-weight:500;display:flex}.date-toggle-item{color:var(--color-sub)}.date-toggle-item.active{color:var(--color-accent)}.leap-option{align-items:center;gap:.5rem;margin-top:.5rem;margin-left:.25rem;display:flex}.checkbox-circle{cursor:pointer;border:1px solid #d1d5db;border-radius:50%;justify-content:center;align-items:center;width:1rem;height:1rem;transition:background-color .2s;display:flex}.checkbox-circle.checked{background-color:var(--color-accent);border-color:var(--color-accent)}.btn-primary{background-color:var(--color-ink);color:#fff;cursor:pointer;border:none;border-radius:1rem;width:100%;margin-top:1rem;padding:1rem;font-size:1.125rem;font-weight:700;transition:all .2s;box-shadow:0 10px 15px -3px #18181b33}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 20px 25px -5px #18181b33}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.7;cursor:wait}.result-header{background-color:var(--color-paper-card);border-bottom:1px solid var(--color-border);z-index:40;position:sticky;top:0}.header-content{justify-content:space-between;align-items:center;max-width:56rem;height:4rem;margin:0 auto;padding:0 1rem;display:flex}.back-btn{color:var(--color-sub);cursor:pointer;background:0 0;border:none;border-radius:9999px;margin-left:-.5rem;padding:.5rem;transition:color .2s}.back-btn:hover{color:var(--color-ink);background-color:#f9fafb}.result-main{flex-direction:column;gap:1.5rem;max-width:56rem;margin:0 auto;padding:1rem;animation:.3s ease-out slideUp;display:flex}.info-card{background-color:var(--color-paper-card);border-radius:var(--radius-2xl);border:1px solid #f3f4f6;padding:1.5rem;box-shadow:0 1px 2px #0000000d}.person-name{color:var(--color-ink);font-size:1.5rem;font-weight:700}.gender-badge{border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:700}.gender-badge.male{color:#2563eb;background-color:#eff6ff}.gender-badge.female{color:#dc2626;background-color:#fef2f2}.chart-grid{background-color:var(--color-paper-card);border-radius:var(--radius-2xl);border:1px solid #f3f4f6;overflow:hidden;box-shadow:0 1px 2px #0000000d}.grid-header{background-color:#f9fafbcc;border-bottom:1px solid #f3f4f6;grid-template-columns:80px 1fr 1fr 1fr 1fr;display:grid}.grid-header-cell{text-align:center;color:var(--color-sub);padding:1rem;font-size:.75rem;font-weight:700}.grid-row{grid-template-columns:80px 1fr 1fr 1fr 1fr;display:grid}.grid-label{flex-direction:column;align-items:center;padding:12px;display:flex}.grid-label-cell{color:var(--color-sub);flex:1;justify-content:center;align-items:center;font-size:.875rem;font-weight:500;display:flex}.grid-cell{border-left:1px solid #f3f4f6;flex-direction:column;justify-content:center;align-items:center;padding:.75rem;display:flex}.wuxing-card{background-color:var(--color-paper-card);border-radius:var(--radius-2xl);border:1px solid #f3f4f6;padding:1.5rem;box-shadow:0 1px 2px #0000000d}.section-title{color:var(--color-ink);border-left:4px solid var(--color-ink);margin-bottom:1rem;padding-left:.5rem;font-size:.875rem;font-weight:700}.wuxing-row{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.wuxing-label{align-items:center;gap:.25rem;width:3rem;display:flex}.wuxing-bar-bg{background-color:#f3f4f6;border-radius:9999px;flex:1;height:.75rem;overflow:hidden}.wuxing-bar-fill{border-radius:9999px;height:100%;transition:width 1s ease-out}.wuxing-value{text-align:right;width:3rem;color:#697b96;font-family:monospace;font-size:.75rem}.pillar-card-container{flex-direction:column;align-items:center;width:100%;max-width:90px;display:flex}@media (min-width:768px){.pillar-card-container{max-width:110px}}.pillar-name{color:#b4530999;font-size:.75rem;font-family:var(--font-serif);letter-spacing:.1em;writing-mode:vertical-rl;margin-bottom:.5rem;font-weight:700}@media (min-width:768px){.pillar-name{writing-mode:horizontal-tb}}.pillar-tengod-top{justify-content:center;align-items:flex-end;height:2rem;margin-bottom:.25rem;display:flex}.tengod-label{letter-spacing:-.025em;font-size:.7rem}.tengod-label.day-master,.tengod-label.normal{color:#a8a29e}@media (min-width:768px){.tengod-label{font-size:.8rem}}.pillar-body{border-radius:.125rem;flex-direction:column;width:100%;display:flex;overflow:hidden}.stem-cell,.branch-cell{font-family:var(--font-serif);justify-content:center;align-items:center;padding:.75rem 0;font-size:1rem;font-weight:700;display:flex}@media (min-width:768px){.stem-cell,.branch-cell{padding:1rem 0;font-size:1.5rem}}.hidden-stems{min-height:70px;padding:.5rem .25rem}.hidden-stems-list{flex-direction:column;gap:.125rem;display:flex}.hidden-stem-row{justify-content:space-between;align-items:center;font-size:.7rem;line-height:1.25;display:flex}@media (min-width:768px){.hidden-stem-row{font-size:.8rem}}.hidden-stem-char{opacity:1;font-weight:500}.hidden-stem-god{color:#a8a29e;transform-origin:100%;transform:scale(.9)}.nayin-cell{color:#78716c;text-align:center;padding:.25rem 0;font-size:.5625rem}@media (min-width:768px){.nayin-cell{font-size:.625rem}}