*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#1e3c72,#2a5298);min-height:100vh;color:#333}.app{min-height:100vh;padding:24px}.header{background:#fff;padding:24px 32px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px}.header h1{font-size:28px;font-weight:600;color:#1e3c72;line-height:1.2}.header p{color:#666;margin-top:8px;font-size:14px;line-height:1.5}.main-nav{display:flex;gap:8px;margin-bottom:24px}.nav-button{padding:12px 24px;border:none;background:#fff;color:#666;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;box-shadow:0 2px 4px #0000001a}.nav-button:hover{background:#f8f9fa;transform:translateY(-1px);box-shadow:0 4px 8px #0000001f}.nav-button.active{background:#1e3c72;color:#fff}.container{background:#fff;border-radius:12px;padding:32px;box-shadow:0 2px 8px #0000001a;max-width:1200px;margin:0 auto}.form-group{margin-bottom:24px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#333;font-size:14px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px;border:1px solid #ddd;border-radius:8px;font-size:14px;transition:all .2s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#1e3c72;box-shadow:0 0 0 3px #1e3c721a}.button{padding:12px 24px;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.button-primary{background:#1e3c72;color:#fff}.button-primary:hover{background:#2a5298;transform:translateY(-1px);box-shadow:0 4px 8px #1e3c724d}.button-secondary{background:#f8f9fa;color:#333}.button-secondary:hover{background:#e9ecef}.button-danger{background:#dc3545;color:#fff}.button-danger:hover{background:#c82333}.button-success{background:#28a745;color:#fff}.button-success:hover{background:#218838}.services-list{margin-bottom:24px}.service-item{display:flex;gap:16px;align-items:center;padding:16px;background:#f8f9fa;border-radius:8px;margin-bottom:12px}.service-item select{flex:2}.service-item span{flex:1;font-weight:600;color:#1e3c72}.service-item button{padding:8px 16px}.table-container{overflow-x:auto;margin-top:24px}table{width:100%;border-collapse:collapse}thead{background:#f8f9fa}th{padding:12px;text-align:left;font-weight:600;color:#333;border-bottom:2px solid #dee2e6;font-size:14px}td{padding:12px;border-bottom:1px solid #dee2e6;font-size:14px}tr:hover{background:#f8f9fa}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:24px}.pricing-card{padding:16px;border:1px solid #dee2e6;border-radius:8px;background:#f8f9fa}.pricing-card h4{margin-bottom:12px;color:#1e3c72}.pricing-card input{margin-top:8px}.invoice-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:24px;border-bottom:2px solid #dee2e6;margin-bottom:24px}.invoice-summary{margin-top:24px;padding:24px;background:#f8f9fa;border-radius:8px}.invoice-summary h3{margin-bottom:16px;color:#1e3c72}.summary-row{display:flex;justify-content:space-between;padding:8px 0;font-size:14px}.summary-row.total{font-size:18px;font-weight:600;color:#1e3c72;border-top:2px solid #dee2e6;padding-top:16px;margin-top:8px}.status-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.status-pending{background:#fff3cd;color:#856404}.status-paid{background:#d4edda;color:#155724}.status-overdue{background:#f8d7da;color:#721c24}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 768px){.two-column,.pricing-grid{grid-template-columns:1fr}}