#root{width:100%;min-height:100vh}:root{--primary-color:#2c3e50;--secondary-color:#3498db;--accent-color:#e74c3c;--success-color:#27ae60;--warning-color:#f39c12;--light-bg:#ecf0f1;--dark-text:#2c3e50;--border-color:#bdc3c7}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--dark-text);background-color:#f5f7fa;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.app{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;padding:40px 20px}.input-section{justify-content:center;display:flex}.form-container{background:#fff;border-radius:12px;width:100%;max-width:400px;padding:30px;box-shadow:0 10px 40px #0003}.form-container h2{color:#2c3e50;border-bottom:2px solid #667eea;margin-bottom:20px;padding-bottom:10px;font-size:1.5em}.form-container h3{color:#34495e;text-transform:uppercase;letter-spacing:.5px;margin-top:20px;margin-bottom:15px;font-size:.95em}.form-group{flex-direction:column;margin-bottom:16px;display:flex}.form-group label{color:#34495e;margin-bottom:6px;font-size:.9em;font-weight:600}.form-group input,.form-group select{border:1px solid #bdc3c7;border-radius:6px;padding:10px 12px;font-family:inherit;font-size:1em;transition:border-color .3s,box-shadow .3s}.form-group input:focus,.form-group select:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.calculate-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:6px;width:100%;margin-top:10px;padding:14px;font-size:1em;font-weight:600;transition:transform .2s,box-shadow .2s}.calculate-btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.calculate-btn:active{transform:translateY(0)}.results-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 10px 40px #0003}.results-section h2{color:#2c3e50;border-bottom:2px solid #667eea;margin-bottom:25px;padding-bottom:10px;font-size:1.8em}.results-section h3{color:#34495e;margin-bottom:15px;font-size:1.1em}.results-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-bottom:30px;display:grid}.result-card{background:#f8f9fa;border:1px solid #e9ecef;border-left:4px solid #667eea;border-radius:8px;padding:20px}.result-item{border-bottom:1px solid #e9ecef;justify-content:space-between;align-items:center;padding:10px 0;font-size:.95em;display:flex}.result-item:last-child{border-bottom:none}.result-item span:first-child{color:#555;font-weight:500}.result-item.value{color:#667eea;font-weight:600}.result-item.highlight{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-bottom:none;border-radius:6px;margin:5px 0;padding:12px;font-size:1.05em}.result-item.highlight .value{color:#27ae60;font-size:1.2em}.result-item.negative .value{color:#e74c3c}.info-box{color:#34495e;background:#ecf0f1;border-left:4px solid #3498db;border-radius:6px;margin-top:10px;padding:12px;font-size:.9em}.info-box.positive{color:#27ae60;background:#27ae601a;border-left-color:#27ae60}.recommendations{background:linear-gradient(135deg,#667eea0d,#764ba20d);border:1px solid #e9ecef;border-left:4px solid #f39c12;border-radius:8px;margin:30px 0;padding:20px}.recommendations h3{color:#f39c12;margin-bottom:15px}.recommendations ul{padding:0;list-style:none}.recommendations li{color:#34495e;padding:10px 0 10px 25px;line-height:1.6;position:relative}.recommendations li:before{content:"✓";color:#27ae60;font-weight:700;position:absolute;left:0}.projection{margin-top:30px}.projection-table{border-collapse:collapse;background:#fff;border:1px solid #e9ecef;border-radius:8px;width:100%;overflow:hidden}.projection-table thead{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2)}.projection-table th{text-align:right;text-transform:uppercase;letter-spacing:.5px;padding:15px;font-size:.85em;font-weight:600}.projection-table th:first-child{text-align:left}.projection-table td{text-align:right;border-bottom:1px solid #e9ecef;padding:12px 15px}.projection-table td:first-child{text-align:left;color:#667eea;font-weight:600}.projection-table tbody tr:hover{background:#f8f9fa}.projection-table tbody tr:last-child td{border-bottom:none}@media (width<=768px){.results-section{padding:20px}.results-grid{grid-template-columns:1fr}.projection-table{font-size:.9em}.projection-table th,.projection-table td{padding:10px 8px}}.retirement-planner{max-width:1200px;margin:0 auto}.header{text-align:center;color:#fff;margin-bottom:40px}.header h1{margin-bottom:10px;font-size:2.5em;font-weight:700}.header p{opacity:.95;font-size:1.1em}.container{grid-template-columns:1fr;gap:30px;display:grid}@media (width>=1024px){.container{grid-template-columns:400px 1fr}}
