:root{--bg-primary: #1a1b26;--bg-secondary: #24283b;--bg-tertiary: #343b58;--bg-modal: #16161e;--bg-card: #24283b;--text-primary: #ffffff;--text-secondary: #c0caf5;--text-tertiary: #a9b1d6;--text-muted: #9ca3af;--text-disabled: #6e7681;--accent-blue: #7aa2f7;--accent-pink: #f7768e;--accent-purple: #bb9af7;--accent-green: #9ece6a;--accent-orange: #ff9e64;--accent-yellow: #e0af68;--border-primary: #2a2b3a;--border-secondary: #414868;--border-light: #565f89;--element-water: #90CAF9;--element-metal: #FAFAFA;--element-earth: #FFECB3;--element-wood: #C8E6C9;--element-fire: #FFCDD2;--status-success: #9ece6a;--status-warning: #ff9e64;--status-error: #f7768e;--status-info: #7aa2f7;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .2);--shadow-md: 0 3px 6px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .4);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 20px;--space-2xl: 24px;--space-3xl: 40px}.card{background-color:var(--bg-card);border-radius:var(--radius-lg);padding:var(--space-lg);box-shadow:var(--shadow-md);border:1px solid var(--border-primary)}.card-sm{padding:var(--space-md);border-radius:var(--radius-md)}.card-lg{padding:var(--space-2xl);border-radius:var(--radius-xl)}.text-header-xl{font-size:28px;font-weight:700;color:var(--text-primary);line-height:1.3}.text-header-lg{font-size:20px;font-weight:600;color:var(--text-primary);line-height:1.4}.text-header-md{font-size:18px;font-weight:600;color:var(--text-primary);line-height:1.4}.text-body{font-size:14px;font-weight:400;color:var(--text-secondary);line-height:1.5}.text-label{font-size:12px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px}.text-micro{font-size:10px;font-weight:500;color:var(--text-muted)}.btn{padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.btn-primary{background-color:var(--accent-blue);color:var(--text-primary)}.btn-primary:hover{background-color:#6a92e7}.btn-secondary{background-color:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border-secondary)}.btn-secondary:hover{background-color:#414868}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-secondary);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-light)}*{box-sizing:border-box}html{width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;position:fixed;overscroll-behavior:none}body{margin:0!important;padding:0!important;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-primary, #1a1b26)!important;color:var(--text-secondary, #c0caf5);width:100%;height:100%;overflow:hidden;position:fixed;-webkit-overflow-scrolling:touch;overscroll-behavior:none}#root{width:100%;max-width:480px;height:100%;overflow-y:auto;overflow-x:hidden;background-color:var(--bg-primary, #1a1b26);position:relative;margin:0 auto;box-shadow:0 0 20px #0006;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto;overscroll-behavior-x:none}body *{max-width:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.fortune-scroll-container{overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x!important;scrollbar-width:thin;overscroll-behavior-x:contain!important;max-width:100%!important}.fortune-scroll-container::-webkit-scrollbar{display:block;height:4px}.fortune-scroll-container::-webkit-scrollbar-track{background:var(--bg-secondary, #24283b)}.fortune-scroll-container::-webkit-scrollbar-thumb{background:var(--border-secondary, #414868);border-radius:2px}.fortune-scroll-container::-webkit-scrollbar-thumb:hover{background:var(--border-light, #565f89)}@media (max-width: 519px){#root{width:100%!important;max-width:100%!important;margin:0!important;box-shadow:none!important}}@media (min-width: 520px){body{display:flex;justify-content:center;align-items:flex-start}#root{max-width:480px!important;margin:0 auto!important}}@media (display-mode: standalone){body{background-color:var(--bg-primary, #1a1b26)!important;overscroll-behavior:none!important}#root{width:100%!important;max-width:100%!important;margin:0!important;box-shadow:none!important;overscroll-behavior:none!important}.App{overscroll-behavior:none!important}}.App{width:100%;height:100%;overflow-x:hidden;position:relative;background-color:var(--bg-primary, #1a1b26);color:var(--text-secondary, #c0caf5)}.App{height:100%;min-height:100vh}.App-header{background:var(--bg-primary, #1a1b26);min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:var(--text-primary, #ffffff)}.App-header h1{font-size:3rem;margin-bottom:1rem;animation:fadeIn 1s ease-in}.App-header p{font-size:1.5rem;opacity:.9;animation:fadeIn 1.5s ease-in}.install-button{margin-top:2rem;padding:12px 24px;font-size:1.1rem;font-weight:600;color:var(--text-primary, #ffffff);background-color:var(--accent-blue, #7aa2f7);border:none;border-radius:var(--radius-md, 12px);cursor:pointer;transition:all .3s ease;animation:fadeIn 2s ease-in}.install-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg, 0 4px 12px rgba(0, 0, 0, .4));background-color:#6a92e7}.install-button:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:translateY(-50%) rotate(0)}to{transform:translateY(-50%) rotate(360deg)}}.typing-indicator{display:flex;align-items:center;gap:4px}.typing-indicator span{width:8px;height:8px;background-color:var(--text-muted, #9ca3af);border-radius:50%;display:inline-block;animation:typing 1.4s infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.7}30%{transform:translateY(-10px);opacity:1}}@keyframes bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.hexagram-input-container{width:100%;padding:10px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.result-header{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-bottom:15px;padding:0 5px}.copy-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:20px;padding:8px 16px;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:5px;transition:all .3s ease;box-shadow:0 2px 8px #667eea4d}.copy-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66;background:linear-gradient(135deg,#5a6fd8,#6a4190)}.copy-button:active{transform:translateY(0);box-shadow:0 2px 4px #667eea4d}.copy-message{font-size:12px;font-weight:500;padding:4px 8px;border-radius:12px;animation:fadeInOut 2s ease-in-out}.copy-message.success{color:#16a085;background-color:#d5f4e6}.copy-message.error{color:#e74c3c;background-color:#fadbd8}@keyframes fadeInOut{0%{opacity:0;transform:translate(10px)}20%,80%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(10px)}}.hexagram-input-container h2{text-align:center;margin-bottom:15px;font-size:20px}.today-saju-section{background:#f0f7ff;border:1px solid #d0e7ff;border-radius:8px;padding:10px;margin-bottom:15px}.saju-pillars{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}.pillar{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:60px}.pillar-label{font-size:12px;color:#666;font-weight:500}.pillar-chars{font-size:20px;font-weight:700;color:#2c3e50;letter-spacing:2px}.input-section{background:#f5f5f5;border-radius:8px;padding:15px;margin-bottom:15px}.lines-input{margin-bottom:15px}.lines-input h3{margin-bottom:15px;font-size:18px}.lines-container{display:flex;flex-direction:column;gap:10px}.line-selector{display:flex;align-items:center;gap:10px}.line-number{width:50px;font-weight:700;text-align:right}.line-buttons{display:flex;gap:8px}.line-type-button{padding:6px 12px;border:2px solid #ddd;border-radius:5px;background:#fff;color:#333;cursor:pointer;font-size:13px;font-weight:500;transition:all .3s ease;min-width:65px}.line-type-button:hover{border-color:#999}.line-type-button.active{border-color:#333;font-weight:700}.line-type-button.active.yang{background:#333;color:#fff;border-color:#333}.line-type-button.active.yin{background:#fff;color:#333;border-color:#333}.line-type-button.active.yang-changing{background:#f44;color:#fff;border-color:#f44}.line-type-button.active.yin-changing{background:#44f;color:#fff;border-color:#44f}.calculate-button{display:block;width:200px;margin:0 auto;padding:12px 24px;background:#007bff;color:#fff;border:none;border-radius:8px;font-size:18px;font-weight:700;cursor:pointer;transition:background .3s ease}.calculate-button:hover{background:#0056b3}.calculate-button.reset-mode{background:linear-gradient(135deg,#ff6b6b,#ee5a52);width:250px;font-size:16px}.calculate-button.reset-mode:hover{background:linear-gradient(135deg,#ff5252,#d32f2f);transform:translateY(-1px);box-shadow:0 4px 12px #ff6b6b4d}.result-section{background:#fff;border-radius:8px;padding:20px;box-shadow:0 2px 8px #00000014}.hexagram-display{display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:wrap}.hexagram-unified-display{background:#fff;border-radius:8px;padding:20px;margin-top:15px}.hexagram-header-info{margin-bottom:20px}.hexagram-names{margin-bottom:15px}.hexagram-names h3,.hexagram-names h4{margin:5px 0;color:#2c3e50}.hexagram-names h3{font-size:1.4rem}.hexagram-names h4{font-size:1.2rem;color:#7f8c8d}.hexagram-meta{display:flex;flex-wrap:wrap;gap:20px;font-size:14px;color:#555}.hexagram-effects-table{margin:20px 0;overflow-x:auto}.hexagram-effects-table table{width:100%;border-collapse:collapse;border:1px solid #e0e0e0}.hexagram-effects-table th,.hexagram-effects-table td{padding:8px;text-align:center;border:1px solid #e0e0e0;font-size:14px}.hexagram-effects-table th{background:#f5f5f5;font-weight:600;color:#2c3e50}.hexagram-effects-table tr.moving-line{background:#fff3cd}.hexagram-effects-table tr.gongmang{color:#6c757d}.hexagram-effects-table .effect-number{font-weight:600;color:#2c3e50}.hexagram-effects-table .effect-main{font-size:15px}.hexagram-effects-table .sinsu{color:#e74c3c;font-weight:500}.hexagram-visual-container{display:flex;gap:30px;justify-content:center;margin:15px 0}.visual-box{text-align:center}.visual-box h4{margin-bottom:15px;color:#2c3e50}.hexagram-box{text-align:center}.hexagram-box h3{margin-bottom:20px;font-size:20px}.hexagram-visual{padding:15px;background:#fafafa;border-radius:8px;min-width:120px}.hexagram-line{margin:8px 0}.yang-line{font-weight:700;text-align:center;font-size:20px;color:#333}.yang-line.changing{color:#f44}.yin-line{display:flex;justify-content:center;gap:15px;font-weight:700;font-size:20px;color:#333}.yin-line.changing{color:#44f}.arrow{font-size:30px;font-weight:700;color:#007bff}.gua-info{margin-top:20px;padding:15px;background:#f8f9fa;border-radius:8px;text-align:left}.gua-info h4{margin:0 0 10px;font-size:18px;color:#2c3e50;text-align:center}.gua-home{margin:5px 0;color:#666;font-size:14px;text-align:center}.gua-shen{text-align:center;margin:10px 0;font-size:16px;color:#333}.gua-shen-value{font-weight:700;color:#2c3e50;background:#e3f2fd;padding:2px 8px;border-radius:4px;margin-left:5px}.hexagram-character{display:flex;justify-content:center;gap:8px;margin:10px 0;flex-wrap:wrap}.character-tag{background:#f0f4c3;color:#33691e;padding:4px 12px;border-radius:12px;font-size:13px;font-weight:500}.gua-positions{display:flex;justify-content:center;gap:20px;margin:10px 0;font-size:14px;color:#555}.gua-effects{margin-top:15px;border-top:1px solid #e0e0e0;padding-top:15px}.effect-row{display:flex;padding:5px 0;font-size:14px;border-bottom:1px solid #f0f0f0;align-items:center;gap:10px}.effect-row:last-child{border-bottom:none}.effect-label{font-weight:600;color:#333;min-width:50px}.sinsu{font-weight:700;color:#e74c3c;margin-left:10px;min-width:60px;text-align:center}.effect-content{color:#555;margin-left:10px;flex:1}.gongmang-info{display:flex;justify-content:center;align-items:center;gap:8px;margin:10px 0;padding:8px;background:#fff3e0;border-radius:6px;font-size:14px}.gongmang-label{font-weight:600;color:#e65100}.gongmang-value{font-weight:700;color:#ff6f00}.gongmang-sun{color:#666;font-size:13px}.effect-row.gongmang{background:#fff3e0;margin:2px -5px;padding-left:5px;padding-right:5px;border-radius:4px}.effect-row.gongmang .effect-content{font-weight:600;color:#e65100}.fushen{color:#6a1b9a;font-weight:600;margin-left:8px}.special-marks{display:flex;gap:8px;min-width:60px}.se-ung{background:#e3f2fd;color:#1565c0;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:600}.shin-myung{background:#f3e5f5;color:#7b1fa2;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:600}.gongmang-indicator{background:#fff3e0;color:#e65100;padding:2px 6px;border-radius:4px;font-size:12px;font-weight:600;margin-left:8px}.element-status{display:flex;gap:12px;margin-left:auto;font-size:13px;align-items:center}.wangsang,.day-relation{padding:3px 8px;border-radius:4px;font-weight:500;font-size:12px}.wangsang-왕{background:#d32f2f;color:#fff}.wangsang-상{background:#f57c00;color:#fff}.wangsang-휴{background:#7b1fa2;color:#fff}.wangsang-수{background:#616161;color:#fff}.wangsang-사{background:#424242;color:#fff}.day-생\(生\),.day-生{background:#1976d2;color:#fff}.day-비\(比\),.day-比{background:#388e3c;color:#fff}.day-설\(泄\),.day-泄{background:#fbc02d;color:#333}.day-제\(制\),.day-制{background:#ff8a65;color:#333}.day-극\(剋\),.day-剋{background:#e53935;color:#fff}.hexagram-transition{background:#f5f5f5;border-radius:8px;padding:15px;margin-bottom:20px;text-align:center}.transition-display{display:flex;align-items:center;justify-content:center;gap:20px;font-size:24px;font-weight:700;margin-bottom:10px}.hexagram-name{color:#2c3e50}.arrow-symbol{color:#007bff;font-size:28px}.moving-lines-info{font-size:16px;color:#666;margin-top:10px}.moving-lines-header{font-weight:700;color:#1565c0;margin-bottom:10px;text-align:center;font-size:14px}.effect-row.moving-line{background:#e3f2fd;border-left:3px solid #1976d2;padding-left:8px;margin-left:-8px}.no-moving-lines{text-align:center;color:#666;font-style:italic;padding:20px 0}.changed-hexagram .gua-info.simplified{padding:15px}.changed-hexagram .gua-info.simplified h4{margin-bottom:15px}.analysis-section{margin-top:20px;background:#f8f9fa;border-radius:8px;padding:15px}.analysis-toggle-button{display:block;margin:0 auto;padding:10px 20px;background:#007bff;color:#fff;border:none;border-radius:5px;font-size:16px;font-weight:700;cursor:pointer;transition:background .3s ease}.analysis-toggle-button:hover{background:#0056b3}.analysis-content{margin-top:15px}.analysis-group{background:#fff;border-radius:6px;padding:12px;margin-bottom:12px;box-shadow:0 1px 3px #00000014}.analysis-group h4{margin:0 0 15px;color:#2c3e50;font-size:16px;border-bottom:1px solid #eee;padding-bottom:8px}.analysis-items{display:flex;flex-direction:column;gap:10px}.analysis-item{display:flex;align-items:center;gap:15px}.status-label{padding:4px 12px;border-radius:20px;font-weight:700;font-size:14px;min-width:80px;text-align:center}.effect-list{color:#555;font-size:14px}.analysis-content .gongmang-label{font-weight:600;color:#e65100}@media (max-width: 768px){.saju-pillars{gap:15px}.pillar{min-width:50px}.pillar-chars{font-size:18px}.line-buttons{display:grid;grid-template-columns:1fr 1fr;gap:5px}.line-type-button{font-size:13px;padding:6px 12px;min-width:60px}.line-selector{flex-direction:column;align-items:flex-start;gap:8px}.line-number{text-align:left}}@media (max-width: 600px){.hexagram-display{flex-direction:column}.arrow{transform:rotate(90deg);margin:20px 0}.input-section{padding:20px}.hexagram-input-container{padding:10px}.gua-info{padding:12px;font-size:13px}.gua-positions{flex-direction:column;gap:5px;text-align:center}.element-status{flex-direction:column;gap:4px;margin-top:8px;margin-left:0}.result-header{flex-direction:column;align-items:center;gap:8px}.copy-button{font-size:12px;padding:6px 12px;border-radius:16px}.copy-message{font-size:11px}.calculate-button.reset-mode{width:200px;font-size:14px;padding:10px 20px}}.interpretation-section{margin-bottom:20px}.interpretation-toggle-button{width:100%;padding:15px;background:linear-gradient(135deg,#4a90e2,#357abd);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:16px;font-weight:700;margin-bottom:15px;transition:all .3s ease;box-shadow:0 4px 12px #4a90e24d}.interpretation-toggle-button:hover{background:linear-gradient(135deg,#357abd,#2868a5);transform:translateY(-2px);box-shadow:0 6px 16px #4a90e266}.interpretation-content{margin-top:15px}.interpretation-box{background:linear-gradient(135deg,#f8fbff,#e8f4fd);border:2px solid #d1e9ff;border-radius:16px;padding:20px;box-shadow:0 4px 12px #0000001a}.dongja-greeting{display:flex;align-items:center;gap:15px;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #e1ecf7}.dongja-icon{font-size:32px;flex-shrink:0}.greeting-text h4{margin:0 0 8px;color:#2c5aa0;font-size:18px}.greeting-text p{margin:0;color:#666;font-size:14px}.interpretation-sections{display:flex;flex-direction:column;gap:20px}.interpretation-section-item{background:#fff;border-radius:12px;padding:16px;border-left:4px solid #4a90e2;box-shadow:0 2px 8px #0000000d}.interpretation-section-item h5{margin:0 0 10px;color:#2c5aa0;font-size:16px;font-weight:700}.interpretation-section-item p{margin:0;color:#444;line-height:1.6;font-size:14px}.dongja-closing{background:linear-gradient(135deg,#fef9e7,#fff3cd);border:1px solid #ffeaa7;border-radius:12px;padding:15px;text-align:center;margin-top:10px}.dongja-closing p{margin:0;color:#856404;font-weight:500;font-size:14px}.analysis-toggle-button{width:100%;padding:12px;background:#f8f9fa;color:#495057;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;margin-bottom:15px;transition:all .3s ease}.analysis-toggle-button:hover{background:#e9ecef;border-color:#ced4da}.ai-request-section{display:flex;flex-direction:column;gap:20px}.ai-request-button-container{text-align:center;padding:20px}.ai-request-button{width:100%;max-width:300px;padding:16px 24px;background:linear-gradient(135deg,#ff6b6b,#ee5a52);color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:16px;font-weight:700;margin-bottom:10px;transition:all .3s ease;box-shadow:0 4px 12px #ff6b6b4d;display:flex;align-items:center;justify-content:center;gap:8px}.ai-request-button:hover:not(:disabled){background:linear-gradient(135deg,#ee5a52,#dc4f47);transform:translateY(-2px);box-shadow:0 6px 16px #ff6b6b66}.ai-request-button:disabled{background:#ccc;cursor:not-allowed;transform:none;box-shadow:none}.loading-spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ai-request-description{margin:0;color:#666;font-size:14px;font-style:italic}.interpretation-actions{text-align:center;padding-top:15px;border-top:2px solid #e1ecf7;margin-top:15px}.ai-refresh-button{padding:10px 20px;background:#f8f9fa;color:#495057;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:all .3s ease}.ai-refresh-button:hover:not(:disabled){background:#e9ecef;border-color:#ced4da}.ai-refresh-button:disabled{background:#f8f9fa;color:#adb5bd;cursor:not-allowed}.wangsang,.day-relation{font-size:11px}.transition-display{font-size:18px;gap:10px}.arrow-symbol{font-size:20px}.moving-lines-info{font-size:14px}.analysis-section{margin-top:20px;padding:15px}.analysis-toggle-button{font-size:14px;padding:8px 16px}.analysis-group{padding:12px}.analysis-group h4{font-size:14px}.analysis-item{flex-direction:column;align-items:flex-start;gap:8px}.status-label{font-size:13px;min-width:70px}.effect-list{font-size:13px}} .hexagram-page{min-height:100vh;background-color:#f8f9fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;overflow-x:hidden;overflow-y:auto}.hexagram-main{padding:.5rem;width:100%;min-height:100vh}@media (max-width: 768px){.hexagram-main{padding:.5rem}}.hexagram-page .hexagram-input-container{background:#fff;border-radius:12px;box-shadow:0 4px 6px #00000012;padding:2rem}.hexagram-page .hexagram-input-container h2{color:#2c3e50;font-size:1.8rem;margin-bottom:2rem}.hexagram-page .input-section{background:#f8f9fa;border:1px solid #e9ecef}.hexagram-page .calculate-button{background-color:#3498db;font-size:1.1rem;padding:14px 32px;border-radius:25px;transition:all .3s ease}.hexagram-page .calculate-button:hover{background-color:#2980b9;transform:translateY(-2px);box-shadow:0 4px 8px #3498db4d}.hexagram-page .result-section{background:#fff;border:1px solid #e9ecef;box-shadow:0 2px 8px #0000000d}.hexagram-page .line-type-button{border-radius:20px;font-size:.9rem}.hexagram-page .line-type-button.active.yang{background:#2c3e50}.hexagram-page .line-type-button.active.yin{background:#fff;color:#2c3e50;border-color:#2c3e50}.hexagram-page .line-type-button.active.yang-changing{background:#e74c3c}.hexagram-page .line-type-button.active.yin-changing{background:#3498db}