body { font-family: 'Inter', sans-serif; background:#f6f8fa; }
.swp-container { max-width: 600px; margin:40px auto; padding:25px; background:#fff; border-radius:16px; box-shadow:0 8px 20px rgba(0,115,230,0.1); }
.swp-container h1 { text-align:center; color:#003d66; margin-bottom:20px; font-weight:700; }
.swp-toggle { text-align:center; margin-bottom:20px; }
.swp-toggle label { margin:0 10px; font-weight:600; color:#333; cursor:pointer; }
.swp-toggle input { margin-right:6px; }
.swp-inputs label { display:block; font-weight:600; margin-top:12px; color:#333; }
.swp-inputs input { width:100%; padding:12px; margin-top:6px; border-radius:10px; border:1px solid #cfd8dc; font-size:16px; transition:border 0.3s; }
.swp-inputs input:focus { border-color:#00c6a7; outline:none; box-shadow:0 0 5px rgba(0,198,167,0.3); }
.error-message { color:#e53935; font-weight:600; margin-top:10px; }
#calculateSWP { margin-top:15px; width:100%; padding:14px; background:linear-gradient(90deg,#00c6a7,#0073e6); color:#fff; font-size:16px; font-weight:600; border:none; border-radius:10px; cursor:pointer; transition:0.3s; }
#calculateSWP:hover { background:linear-gradient(90deg,#0073e6,#00c6a7); }
.swp-results { margin-top:25px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.result-card { background:#f0f7ff; border-radius:10px; padding:15px; text-align:center; font-weight:600; color:#0073e6; box-shadow:0 4px 12px rgba(0,115,230,0.1); }
.result-card p { margin:0 0 6px 0; font-weight:500; color:#003d66; }
canvas { margin-top:25px; width:100% !important; height:350px !important; }
.download-btn { margin-top:15px; width:100%; padding:12px; background:#0073e6; color:#fff; font-weight:600; border:none; border-radius:10px; cursor:pointer; transition:0.3s; }
.download-btn:hover { background:#00c6a7; }