.app-header{text-align:center;padding:30px 0;margin-bottom:20px;background:linear-gradient(to bottom,#fff,#f8f9fa);border-bottom:1px solid #eee}.app-container{max-width:1200px;margin:0 auto;padding:0 30px 30px;min-height:100vh;background:#f8f9fa}.main-content{display:flex;flex-direction:column;gap:30px}.challenge-section{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:30px}.challenge-section h2{font-size:24px;margin-bottom:20px}.challenge-section textarea{width:100%;padding:15px;border:1px solid #ddd;border-radius:8px;margin-bottom:20px;font-size:16px;resize:vertical}.analyze-button{background:#06c;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:16px;cursor:pointer;transition:background .2s;width:200px;margin:0 auto;display:block}.analyze-button:hover{background:#0052a3;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.analyze-button:disabled{background:#ccc;cursor:not-allowed;transform:none;box-shadow:none}.personality-section{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;padding:30px}.personality-button{background:#fff;border:1px solid #e0e0e0;border-radius:20px;padding:8px 16px;margin:4px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px}.personality-button:hover{background:#f5f5f5;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.personality-button.selected{background:#06c;color:#fff;border-color:#0052a3}.personality-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.trait-count{background:#0000001a;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:500}.personality-button.selected .trait-count{background:#fff3}.personality-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;margin:20px 0}.results-section{padding:20px;max-width:1200px;margin:0 auto}.challenge-category{background:#f8f9ff;padding:25px;border-radius:12px;margin-bottom:30px;border:1px solid rgba(0,102,204,.1);box-shadow:0 2px 12px #0066cc0d}.challenge-category h3{color:#06c;font-size:20px;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid rgba(0,102,204,.1)}.category-name{font-size:24px;font-weight:600;color:#2c3e50;margin-bottom:20px;padding:12px 16px;background:#0066cc0d;border-radius:8px;border-left:4px solid #0066cc}.category-reason,.category-description{margin-top:20px}.category-reason h4,.category-description h4{font-size:16px;color:#06c;margin-bottom:12px;display:flex;align-items:center}.category-reason h4:before,.category-description h4:before{content:"";width:6px;height:6px;background:#06c;border-radius:50%;margin-right:8px}.category-reason p,.category-description p{font-size:15px;line-height:1.7;color:#4a4a4a;margin:0;padding:0 16px}.similar-figures-count{background:#f5fff7;padding:25px;border-radius:12px;margin-bottom:30px;border:1px solid rgba(46,125,50,.1);box-shadow:0 2px 12px #2e7d320d}.similar-figures-count h3{color:#2e7d32;font-size:20px;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid rgba(46,125,50,.1)}.figures-count{color:#1b5e20;font-size:16px;margin-bottom:25px;padding:12px 16px;background:#2e7d320d;border-radius:8px;border-left:4px solid #2e7d32}.top-figures h4{color:#2e7d32;font-size:16px;margin-bottom:15px}.figures-list{display:flex;flex-direction:column;gap:12px;margin-bottom:25px}.figure-item{display:flex;flex-direction:column;padding:12px 16px;background:#2e7d320d;border-radius:8px;transition:transform .2s,box-shadow .2s}.figure-item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #2e7d321a}.figure-name{font-weight:600;color:#1b5e20;font-size:16px;margin-bottom:4px}.figure-info{font-size:14px;color:#388e3c}.figures-analysis{margin-top:25px;padding-top:25px;border-top:1px solid rgba(46,125,50,.1)}.analysis-section{margin-bottom:25px}.analysis-section h4{color:#333;font-size:18px;margin-bottom:15px;font-weight:600}.analysis-section p{font-size:15px;line-height:1.8;color:#333;margin:0;text-align:justify;padding:0}.table-container{overflow-x:auto;margin-top:20px}table{width:100%;border-collapse:collapse;background:#fff}th{background:#f5f5f5;padding:12px;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #ddd}td{padding:15px 12px;border-bottom:1px solid #eee;vertical-align:top}tr:hover{background:#f8f9fa}.citizenship{font-size:13px;color:#666;margin-top:4px}.occupation{font-size:13px;color:#666;margin-top:2px;font-style:italic}.personalities-cell{display:flex;flex-direction:column;gap:4px}.personality-tag{background:#f0f0f0;color:#666;padding:4px 8px;border-radius:12px;font-size:12px;display:inline-block;margin-right:4px;margin-bottom:4px}.personality-tag.matched{background:#06c;color:#fff}.description-cell{max-width:300px;font-size:14px;line-height:1.5;color:#333}.challenge-cell{max-width:250px;font-size:14px;line-height:1.5;color:#d32f2f}.solution-cell{max-width:250px;font-size:14px;line-height:1.5;color:#1976d2}.collapsible-section{margin-top:20px;border:1px solid #eee;border-radius:8px;background:#fff}.collapsible-header{padding:15px 20px;background:#f8f9fa;cursor:pointer;display:flex;justify-content:space-between;align-items:center;border-radius:8px}.collapsible-header h3{margin:0;font-size:16px;color:#333}.collapsible-content{padding:20px;border-top:1px solid #eee;overflow-x:auto}.collapsible-section.closed .collapsible-content{display:none}.loading{display:flex;justify-content:center;align-items:center;min-height:200px;font-size:18px;color:#666}.time-distribution{width:100%;position:relative;background:#fff;border-radius:8px;padding:15px;overflow:visible;margin:0 auto;max-width:1100px}.graph-container{position:relative;margin-top:20px;padding-bottom:30px;height:auto}.y-axis-labels{position:absolute;left:0;top:0;width:160px;z-index:4}.y-axis-label{position:absolute;right:15px;transform:translateY(-50%);white-space:nowrap;font-size:12px;color:#666}.scatter-plot{position:relative;margin-left:160px;padding-left:0;border-left:none;border-bottom:.8px dashed #ddd;background:#fff;min-height:600px;max-height:700px;overflow:visible;width:940px;z-index:3}.x-axis{position:absolute;bottom:0;left:160px;right:0;height:25px}.x-axis-label{position:absolute;transform:translate(-50%);font-size:11px;color:#666;white-space:nowrap}.data-point{position:absolute;transform:translate(-50%,-50%);cursor:pointer;z-index:5;transition:all .3s ease}.point-dot{width:6px;height:6px;border-radius:50%;transition:all .2s;position:relative;box-shadow:0 0 2px #0000004d}.data-point:hover .point-dot{transform:scale(1.8);box-shadow:0 0 0 3px #ffffffe6,0 0 6px #0006}.category-band{position:absolute;width:100%;pointer-events:none;z-index:1;height:30px!important;background-color:#00000005;border-top:1px dashed #ddd;border-bottom:1px dashed #ddd;display:flex;align-items:center;justify-content:center}.trait-button{font-size:12px;padding:6px 12px;display:flex;justify-content:space-between;align-items:center;border-radius:20px;border:1px solid #ddd;background:#fff;cursor:pointer;transition:all .2s ease}.trait-button.initial-selection{background:#4caf50;color:#fff;border-color:#4caf50;opacity:1}.trait-button.selected{background:#06c;color:#fff;border-color:#06c;opacity:1}.trait-button:disabled{cursor:not-allowed;opacity:.5}.trait-count{font-size:12px;opacity:.8}.point-tooltip{position:absolute;background:#fff;padding:15px;border-radius:8px;box-shadow:0 4px 20px #00000026;visibility:hidden;opacity:0;transition:all .3s;z-index:10;min-width:250px;left:50%;transform:translate(-50%);top:-15px;pointer-events:none}.point-tooltip strong{display:block;font-size:14px;color:#333;margin-bottom:8px;border-bottom:1px solid #eee;padding-bottom:8px}.tooltip-occupation{font-size:13px;color:#666;margin-bottom:4px}.tooltip-citizenship{font-size:13px;color:#06c;margin-bottom:4px}.tooltip-year{font-size:12px;color:#999;margin-top:8px;padding-top:8px;border-top:1px solid #eee}.data-point:hover .point-tooltip{visibility:visible;opacity:1;top:-120px}.point-tooltip:after{content:"";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid white}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:12px;padding:30px;max-width:800px;width:90%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 4px 20px #00000026}.modal-close{position:absolute;top:20px;right:20px;background:none;border:none;font-size:24px;cursor:pointer;color:#666;padding:5px;line-height:1}.modal-header{margin-bottom:20px;padding-right:30px}.modal-header h2{font-size:24px;color:#333;margin-bottom:15px}.modal-personalities{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px}.modal-personality-tag{background:#f0f0f0;color:#666;padding:4px 12px;border-radius:20px;font-size:13px;font-weight:500}.modal-basic-info{display:flex;flex-wrap:wrap;gap:16px;color:#666;font-size:14px}.modal-section{margin-bottom:24px}.modal-section h3{color:#1a1a1a;font-size:18px;margin-bottom:12px;font-weight:600}.modal-section p{color:#333;line-height:1.6;font-size:15px}.modal-category{font-size:13px;color:#666;margin-bottom:8px;padding:4px 8px;background:#f5f5f5;border-radius:4px;display:inline-block}.challenge-text{color:#d32f2f!important}.solution-text{color:#1976d2!important}body.modal-open{overflow:hidden}.x-axis-wave{position:absolute;font-size:16px;color:#666;top:10px;transform:translate(-50%)}.input-section{transition:all .3s ease;max-height:1000px;opacity:1;margin-bottom:30px}.input-section.collapsed{max-height:0;opacity:0;overflow:hidden;margin:0}.results-header{margin-bottom:30px;text-align:center}.results-header h2{font-size:32px;color:#2c3e50;margin:0;position:relative;display:inline-block;padding-bottom:15px}.results-header h2:after{content:"";position:absolute;bottom:0;left:50%;transform:translate(-50%);width:60px;height:3px;background:#06c;border-radius:2px}.personality-button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}textarea:disabled{background:#f5f5f5;cursor:not-allowed}.selected-traits-section{background:#f8f9fa;padding:12px;border-radius:8px;margin:15px 0}.selected-traits-section h3{margin-bottom:10px;font-size:13px;color:#333}.selected-traits-buttons{display:flex;flex-wrap:wrap;gap:6px}.selected-traits-buttons .personality-button{font-size:12px;padding:4px 10px;display:flex;align-items:center;gap:6px;border-radius:15px;border:1px solid #ddd;background:#fff;cursor:pointer}.selected-traits-buttons .personality-button.initial-selection{background:#e3f2fd;border-color:#2196f3;color:#0d47a1}.selected-traits-buttons .personality-button.selected:not(.initial-selection){background:#06c;color:#fff;border-color:#0052a3}.selected-traits-buttons .trait-count{background:#0000001a;padding:2px 6px;border-radius:10px;font-size:11px}.time-distribution{width:100%;position:relative;background:#fff;border-radius:8px;padding:20px;overflow:visible;margin:0 auto}.trait-selection{margin-bottom:30px;padding:15px;background:#f8f9fa;border-radius:8px}.trait-selection h3{font-size:14px;color:#333;margin-bottom:12px}.trait-buttons{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.trait-buttons .personality-button{font-size:12px;padding:6px 12px;display:flex;justify-content:space-between;align-items:center;border-radius:20px;border:1px solid #ddd;background:#fff;cursor:pointer;transition:all .2s ease}.trait-buttons .personality-button.initial-selection{background:#e3f2fd;border-color:#2196f3;color:#0d47a1;font-weight:500}.trait-buttons .personality-button.selected:not(.initial-selection){background:#06c;color:#fff;border-color:#0052a3}.trait-buttons .trait-count{background:#0000001a;padding:2px 6px;border-radius:10px;font-size:11px}.trait-buttons .personality-button.initial-selection .trait-count{background:#2196f333}.trait-buttons .personality-button.selected:not(.initial-selection) .trait-count{background:#fff3}.personality-button.initial-selection{border:2px solid #4CAF50;color:#4caf50}.personality-button.initial-selection.selected{background-color:#4caf50;color:#fff}.personality-button.selected:not(.initial-selection){background-color:#2196f3;color:#fff}.no-data-message{font-size:16px;color:#666;text-align:center;padding:20px;background:#0000000d;border-radius:8px;width:80%;max-width:400px}.modal-personality-tag.initial-selection{background:#06c;color:#fff}.graph-container{position:relative;width:100%;margin-top:20px}.app-header{text-align:center;padding:40px 0;margin-bottom:40px;background:linear-gradient(to bottom,#fff,#f8f9fa);border-bottom:1px solid #eee}.app-title{font-size:36px;font-weight:700;color:#1a1a1a;margin-bottom:12px}.app-subtitle{font-size:18px;color:#666;margin-bottom:40px}.introduction-title{font-size:24px;font-weight:600;color:#2c3e50;margin-bottom:20px;text-align:left;position:relative;padding-left:15px}.introduction-title:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:24px;background:#06c;border-radius:2px}.introduction-text{font-size:16px;line-height:1.8;color:#4a4a4a;text-align:justify;background:#fff;padding:25px;border-radius:12px;box-shadow:0 2px 8px #0000000d;margin-bottom:40px;position:relative;border:1px solid #eaeaea}.introduction-text:before{content:'"';position:absolute;top:-15px;left:20px;font-size:60px;color:#06c;opacity:.1;font-family:Georgia,serif}@media (max-width: 768px){.app-header{padding:20px 0}.app-title{font-size:28px}.app-subtitle{font-size:16px;margin-bottom:30px}.introduction-title{font-size:20px}.introduction-text{font-size:15px;padding:20px}}.button-container{display:flex;justify-content:center;gap:20px;margin:20px 0}.button-container .analyze-button,.button-container .reset-button{margin:0}.reset-button{background:#f44336;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:16px;cursor:pointer;transition:background .2s;width:200px;margin:10px auto;display:block}.reset-button:hover{background:#d32f2f;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.reset-button:disabled{background:#ccc;cursor:not-allowed;transform:none;box-shadow:none}.button-container{display:flex;justify-content:center;margin:20px 0}.button-container .analyze-button{margin:0}.results-header{margin-top:10px;margin-bottom:20px}.results-header h2{font-size:24px;color:#2c3e50;margin:0}.figures-analysis{margin-top:20px;padding-top:20px;border-top:1px solid rgba(46,125,50,.2)}.analysis-section{margin-bottom:15px}.analysis-section h4{color:#333;font-size:14px;margin-bottom:8px;display:flex;align-items:center}.analysis-section h4:before{content:"•";margin-right:8px;color:#333}.analysis-section p{font-size:14px;line-height:1.6;color:#333;margin:0;padding-left:16px}.user-input-summary{background:#fff;padding:25px;border-radius:12px;margin-bottom:30px;border:1px solid rgba(0,0,0,.1);box-shadow:0 2px 12px #0000000d}.user-input-summary h3{color:#2c3e50;font-size:20px;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid rgba(0,0,0,.1)}.input-detail{margin-bottom:15px}.input-detail h4{color:#34495e;font-size:16px;margin-bottom:8px;display:flex;align-items:center}.input-detail h4:before{content:"";width:6px;height:6px;background:#34495e;border-radius:50%;margin-right:8px}.input-detail p{color:#2c3e50;font-size:15px;line-height:1.6;padding:0 16px;margin:0}.traits-list{display:flex;gap:10px;flex-wrap:wrap;padding:0 16px}.trait-tag{background:#f0f7ff;color:#06c;padding:6px 12px;border-radius:16px;font-size:14px}.conclusion-section{background:#fff;padding:30px;border-radius:12px;margin:30px 0;border:1px solid rgba(0,102,204,.1);box-shadow:0 2px 12px #0066cc0d}.conclusion-section h3{color:#2c3e50;font-size:24px;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid rgba(0,102,204,.1);display:flex;align-items:center}.conclusion-section h3:before{content:"💡";margin-right:10px;font-size:28px}.conclusion-content{color:#2c3e50;font-size:16px;line-height:1.8;white-space:pre-line;padding:0 15px}.conclusion-content p{margin-bottom:20px}.conclusion-content p:last-child{margin-bottom:0}.loading-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.loading-modal-content{background:#fff;padding:30px;border-radius:12px;text-align:center;max-width:400px;width:90%}.loading-spinner{border:4px solid #f3f3f3;border-top:4px solid #0066cc;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;margin:0 auto 20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-modal-content h3{color:#333;margin-bottom:10px}.loading-modal-content p{color:#666;margin:0;font-size:14px}.y-axis-label:after{content:"";position:absolute;left:100%;top:0;width:10px;border-top:none}
