
:root{--bg:#0b0f14;--card:#111926;--muted:#8fa3bf;--text:#e8f0ff;--accent:#5eead4;--accent2:#60a5fa;--danger:#fb7185;--border:#233044;}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial; background:radial-gradient(1100px 700px at 15% 0%, rgba(94,234,212,.12), transparent 60%),radial-gradient(900px 700px at 90% 10%, rgba(96,165,250,.10), transparent 55%),var(--bg); color:var(--text);}
a{color:var(--accent2);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:24px auto;padding:0 16px}
.header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent2)); display:grid;place-items:center; box-shadow:0 12px 30px rgba(0,0,0,.35)}
.nav{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:rgba(17,25,38,.7);color:var(--text);cursor:pointer}
.btn:hover{border-color:rgba(94,234,212,.6)}
.btn.primary{background:linear-gradient(135deg, rgba(94,234,212,.18), rgba(96,165,250,.18)); border-color:rgba(94,234,212,.35)}
.btn.danger{border-color:rgba(251,113,133,.35)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
@media(max-width:920px){.grid{grid-template-columns:1fr}}
.card{border:1px solid var(--border);background:rgba(17,25,38,.65);backdrop-filter: blur(8px);border-radius:16px;padding:14px;box-shadow:0 16px 40px rgba(0,0,0,.35)}
h1,h2{margin:0 0 10px}
h1{font-size:22px}
h2{font-size:18px}
h3{margin:10px 0 8px;font-size:14px;color:var(--muted)}
label{display:flex;align-items:center;gap:6px;font-weight:650;margin-top:10px;color:#dbe7ff}
input,select,textarea{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:rgba(9,14,22,.7);color:var(--text);outline:none}
input:focus,select:focus,textarea:focus{border-color:rgba(96,165,250,.6)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:520px){.row{grid-template-columns:1fr}}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;gap:8px;align-items:center;padding:7px 10px;border:1px solid var(--border);border-radius:999px;background:rgba(9,14,22,.6);color:#dbe7ff;font-size:13px}
hr{border:none;border-top:1px solid rgba(35,48,68,.9);margin:14px 0}
.notice{padding:10px 12px;border-radius:14px;border:1px solid rgba(96,165,250,.35);background:rgba(96,165,250,.10)}
.warn{padding:10px 12px;border-radius:14px;border:1px solid rgba(251,113,133,.35);background:rgba(251,113,133,.10)}
.small{color:var(--muted);font-size:13px;line-height:1.35}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:9px 10px;border-bottom:1px solid rgba(35,48,68,.9);text-align:left;font-size:13px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid rgba(35,48,68,.9);border-radius:999px;background:rgba(9,14,22,.55);font-size:12px;color:#dbe7ff}

/* WOW: risk badge */
.risk-badge{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:6px 10px;font-size:13px;font-weight:800;border:1px solid #e5e7eb}
.risk-dot{width:10px;height:10px;border-radius:999px}
.risk-green .risk-dot{background:#22c55e}
.risk-amber .risk-dot{background:#f59e0b}
.risk-red .risk-dot{background:#ef4444}
.risk-green{background:#f0fdf4}
.risk-amber{background:#fffbeb}
.risk-red{background:#fef2f2}

.sim-grid{display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:900px){ .sim-grid{grid-template-columns:1fr 1fr;} }
.sim-controls label{font-size:13px}
.sim-controls input[type=range]{width:100%}
.chart{border:1px solid #e5e7eb;border-radius:16px;padding:12px}
.bar{height:12px;border-radius:999px;background:#e5e7eb;overflow:hidden}
.bar > span{display:block;height:100%;background:#111}
.muted{color:#6b7280}

/* Help modal (dark) */
.fpModal{position:fixed;inset:0;z-index:9999;color:#f9fafb}
.fpModal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65)}
.fpModal__dialog{position:relative;max-width:680px;margin:8vh auto 0;background:#0b0f15;border-radius:18px;border:1px solid #1f2937;box-shadow:0 20px 60px rgba(0,0,0,.45);overflow:hidden}
.fpModal__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px;border-bottom:1px solid #1f2937}
.fpModal__title{font-weight:900;color:#e5e7eb}
.fpModal__close{border:1px solid #1f2937;background:#0b0f15;color:#e5e7eb;border-radius:12px;padding:8px 10px;cursor:pointer}
.fpModal__body{padding:14px 14px;line-height:1.55;color:#e5e7eb}
.fpModal__body b{color:#fff}
.fpModal__body .muted{color:#9ca3af}
.fpModal__foot{padding:12px 14px;border-top:1px solid #1f2937;display:flex;justify-content:flex-end}
.fpModal__foot .btn{background:#111827;color:#e5e7eb;border-color:#1f2937}
.helpbtn{width:26px;height:26px;border-radius:999px;border:1px solid #374151;background:#0b0f15;color:#e5e7eb;cursor:pointer;font-weight:900;display:inline-grid;place-items:center;margin-left:6px}

/* WOW: risk badge (dark theme override) */
.risk-badge{border:1px solid #1f2937;color:#e5e7eb}
.risk-green{background:rgba(34,197,94,.10)}
.risk-amber{background:rgba(245,158,11,.10)}
.risk-red{background:rgba(239,68,68,.10)}
.chart{border-color:#1f2937;background:#0b0f15}
.bar{background:#111827;border:1px solid #1f2937}
.bar > span{background:#60a5fa}
.muted{color:#9ca3af}


/* Dark theme tweaks for risk badge */
.risk-badge{border:1px solid #1f2937;color:#e5e7eb}
.risk-green{background:rgba(34,197,94,.10)}
.risk-amber{background:rgba(245,158,11,.10)}
.risk-red{background:rgba(239,68,68,.10)}

