:root{
  --bg1:#f4f7fb;
  --bg2:#edf4f7;
  --card:rgba(255,255,255,.96);
  --ink:#172033;
  --muted:#61708a;
  --line:#d7dfeb;
  --purple:#4a1d6d;
  --purple-2:#5c2a86;
  --cyan:#1aa0c4;
  --cyan-soft:#e6f8fc;
  --blue:#2751d3;
  --violet:#6d33a8;
  --green:#10835e;
  --red:#c53535;
  --amber:#c17a12;
  --shadow:0 20px 45px rgba(23,32,51,.08);
  --shadow-soft:0 12px 24px rgba(23,32,51,.05);
  --radius:24px;
  --formula-bg:#132032;
  --formula-color:#e5eef7;
  --canvas-bg:linear-gradient(180deg,#fbfdff,#fff);
}
[data-theme="dark"]{
  --bg1:#0c1220;
  --bg2:#111827;
  --card:rgba(22,32,54,.97);
  --ink:#e2e8f0;
  --muted:#94a3b8;
  --line:#1e2d45;
  --purple:#a56adc;
  --purple-2:#b87de8;
  --cyan:#38bdf8;
  --cyan-soft:#0c2340;
  --blue:#60a5fa;
  --violet:#a78bfa;
  --green:#34d399;
  --red:#f87171;
  --amber:#fbbf24;
  --shadow:0 20px 45px rgba(0,0,0,.35);
  --shadow-soft:0 12px 24px rgba(0,0,0,.25);
  --formula-bg:#060d18;
  --formula-color:#c8e0f8;
  --canvas-bg:linear-gradient(180deg,#0d1b2e,#0a1526);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  font-family:Inter,Segoe UI,Tahoma,Arial,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(26,160,196,.09), transparent 28%),
    radial-gradient(circle at top right, rgba(74,29,109,.10), transparent 32%),
    linear-gradient(180deg,var(--bg1),var(--bg2));
  min-height:100vh;
  transition:background .3s,color .3s;
}
[data-theme="dark"] body{
  background:
    radial-gradient(circle at top left, rgba(56,189,248,.06), transparent 28%),
    radial-gradient(circle at top right, rgba(165,106,220,.08), transparent 32%),
    linear-gradient(180deg,var(--bg1),var(--bg2));
}
html[dir="rtl"] body{font-family:Tahoma,Arial,sans-serif}
.app{max-width:1500px;margin:auto;padding:22px}
.glass{background:rgba(255,255,255,.7);backdrop-filter:blur(12px);border:1px solid rgba(148,163,184,.18);box-shadow:var(--shadow-soft)}
[data-theme="dark"] .glass{background:rgba(15,25,45,.75)}
.hero{
  display:flex;justify-content:space-between;gap:26px;align-items:stretch;
  position:relative;overflow:hidden;padding:26px;border-radius:34px;
  background:linear-gradient(135deg,#ffffff 0%,#f9fbfe 50%,#f2f9fb 100%);
}
[data-theme="dark"] .hero{background:linear-gradient(135deg,#111827 0%,#0f1f38 50%,#0c1e33 100%)}
.hero:before{
  content:"";position:absolute;right:-120px;top:-140px;width:360px;height:360px;border-radius:999px;
  background:radial-gradient(circle,rgba(26,160,196,.14),rgba(26,160,196,0));
}
.hero:after{
  content:"";position:absolute;left:-120px;bottom:-140px;width:340px;height:340px;border-radius:999px;
  background:radial-gradient(circle,rgba(74,29,109,.10),rgba(74,29,109,0));
}
.brand-block,.hero-panel{position:relative;z-index:1}
.brand-block{flex:1;display:flex;flex-direction:column;justify-content:space-between}
.brand-head{display:flex;gap:22px;align-items:flex-start}
.logo-wrap{
  width:138px;height:138px;min-width:138px;border-radius:28px;background:white;border:1px solid rgba(74,29,109,.08);
  display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);
}
[data-theme="dark"] .logo-wrap{background:#1a2744;border-color:rgba(165,106,220,.2)}
.uni-logo{max-width:118px;max-height:118px;width:auto;height:auto;display:block}
.brand-lines{display:flex;flex-direction:column;gap:10px}
.lab-chip{
  display:inline-flex;align-items:center;width:max-content;max-width:100%;
  padding:8px 14px;border-radius:999px;background:linear-gradient(135deg,var(--cyan-soft),#eef2ff);
  color:var(--purple);font-weight:800;border:1px solid #d8e2f1;
}
[data-theme="dark"] .lab-chip{background:linear-gradient(135deg,#0c2340,#1a1a3e);border-color:#2a3a60}
.hero h1{
  font-size:clamp(17px,2vw,21px);line-height:1.85;margin:0;color:#314056;font-weight:600;max-width:950px
}
[data-theme="dark"] .hero h1{color:#94a3b8}
.uni-names{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.uni-names span{
  padding:8px 12px;border-radius:14px;background:#fff;border:1px solid #e0e7f1;
  color:#314056;font-size:13px;font-weight:700;box-shadow:var(--shadow-soft)
}
[data-theme="dark"] .uni-names span{background:#1a2744;border-color:#2a3a60;color:#94a3b8}
.hero-actions,.button-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.hero-panel{
  width:270px;min-width:270px;align-self:flex-start;border:1px solid rgba(74,29,109,.11);background:#fff;
  border-radius:26px;padding:18px;box-shadow:var(--shadow);
}
[data-theme="dark"] .hero-panel{background:#111827;border-color:rgba(165,106,220,.2)}
.hero-panel label{display:block;color:var(--muted);font-size:13px;font-weight:800;margin-bottom:8px}
.hero-panel select,select,input{
  width:100%;border:1px solid var(--line);background:white;border-radius:14px;padding:11px 12px;
  font-weight:700;color:var(--ink);outline:none;transition:.18s;
}
[data-theme="dark"] select,[data-theme="dark"] input{background:#1a2744;border-color:#2a3a60;color:#e2e8f0}
select:focus,input:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(26,160,196,.10)}
.status-line{
  margin-top:14px;padding-top:14px;border-top:1px solid #e6edf6;display:flex;justify-content:space-between;gap:10px;color:var(--muted)
}
[data-theme="dark"] .status-line{border-color:#1e2d45}
.status-line b{color:var(--purple)}
.hero-note{margin-top:12px;font-size:12px;color:var(--muted);font-weight:700;letter-spacing:.05em;text-transform:uppercase}
.theme-btn{
  margin-top:10px;width:100%;border:1px solid var(--line);background:var(--bg1);color:var(--ink);
  border-radius:14px;padding:10px;font-weight:800;cursor:pointer;transition:.18s;font-size:13px;text-align:center;
}
.theme-btn:hover{background:var(--cyan-soft);border-color:var(--cyan)}
.btn,.tab,.tiny{
  border:0;border-radius:16px;padding:12px 17px;font-weight:800;cursor:pointer;transition:.18s;white-space:nowrap
}
.btn:hover,.tab:hover,.tiny:hover{transform:translateY(-1px)}
.primary{color:white;background:linear-gradient(135deg,var(--purple),var(--blue))}
.secondary{color:var(--ink);background:#ecf1f8}
[data-theme="dark"] .secondary{background:#1a2744;color:#e2e8f0}
.ghost{background:#fff;color:var(--purple);border:1px solid rgba(74,29,109,.16)}
[data-theme="dark"] .ghost{background:#1a2744;border-color:rgba(165,106,220,.3)}
.light{background:linear-gradient(135deg,var(--cyan),#37b6d6);color:white}
.danger{background:#fee2e2;color:#991b1b}
[data-theme="dark"] .danger{background:#3f1a1a;color:#f87171}
.tiny{padding:8px 12px;background:#eef4ff;color:#27418f}
[data-theme="dark"] .tiny{background:#1a2744;color:#60a5fa}
.tabs{display:flex;gap:12px;margin:22px 0;padding:10px;border-radius:24px;flex-wrap:wrap}
.tab{background:transparent;color:#334155}
[data-theme="dark"] .tab{color:#94a3b8}
.tab.active{background:linear-gradient(135deg,var(--purple),var(--blue));color:white;box-shadow:var(--shadow-soft)}
.page{display:none}.page.active{display:block}
.heading{margin:8px 0 20px}
.heading h2{font-size:31px;margin:0 0 8px;color:var(--purple)}
.heading p{font-size:16px;line-height:1.9;color:var(--muted);margin:0}
.dashboard{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}
.metric,.card,.guide-card{background:var(--card);border:1px solid rgba(148,163,184,.25);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}
[data-theme="dark"] .metric,[data-theme="dark"] .card,[data-theme="dark"] .guide-card{border-color:rgba(148,163,184,.1)}
.metric{position:relative;overflow:hidden}
.metric:after{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:linear-gradient(90deg,var(--cyan),var(--purple))}
.metric span{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;font-weight:900;letter-spacing:.06em}
.metric strong{display:block;font-size:34px;margin:8px 0 2px;color:var(--purple)}
.metric small{color:var(--muted)}
.layout-3{display:grid;grid-template-columns:1fr 2fr;gap:18px;margin-bottom:18px}
.layout-3 .span-2{grid-column:span 1}
.layout-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}
.card h3{margin:0 0 16px;font-size:21px;color:var(--purple)}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.card-head h3{margin:0}
.form-grid{display:grid;gap:12px}
.form-grid.compact{grid-template-columns:repeat(2,1fr)}
label span{display:block;color:var(--muted);font-size:13px;font-weight:800;margin-bottom:6px}
.slider-line{display:grid;grid-template-columns:170px 1fr 58px;gap:10px;align-items:center;margin-top:15px}
.note{margin-top:14px;color:var(--muted);font-size:13px;line-height:1.7;background:#f8fbfd;border:1px solid var(--line);padding:12px;border-radius:16px}
[data-theme="dark"] .note{background:#0d1b2e}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:18px;background:white}
[data-theme="dark"] .table-wrap{background:#111827}
table{width:100%;border-collapse:collapse}
th,td{border-bottom:1px solid #e8edf5;text-align:center;padding:11px 10px}
[data-theme="dark"] th,[data-theme="dark"] td{border-color:#1e2d45}
th{background:#f8fbfd;color:#475569;font-size:13px}
[data-theme="dark"] th{background:#0d1b2e;color:#64748b}
tbody tr{cursor:pointer}
tbody tr:hover,tbody tr.selected{background:#eef8fd}
[data-theme="dark"] tbody tr:hover,[data-theme="dark"] tbody tr.selected{background:#0c2340}
.editable-table input{min-width:74px;text-align:center;padding:9px}
.small-gap{margin-top:12px}
.weights-panel{display:grid;gap:14px}
.weight-section{border:1px solid var(--line);border-radius:20px;padding:14px;background:#fbfdff}
[data-theme="dark"] .weight-section{background:#0d1b2e}
.weight-section h4{margin:0 0 10px;color:#2a3550}
[data-theme="dark"] .weight-section h4{color:#60a5fa}
.weight-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:10px}
.weight-grid label span{font-family:Consolas,monospace}
.weight-grid input{text-align:center;font-family:Consolas,monospace;padding:9px}
.formula{background:var(--formula-bg);color:var(--formula-color);border-radius:20px;padding:18px;white-space:pre-wrap;line-height:1.8;font-family:Consolas,Monaco,monospace;overflow:auto;min-height:190px}
.good{color:var(--green);font-weight:900}.bad{color:var(--red);font-weight:900}.warn{color:var(--amber);font-weight:900}
canvas,svg{width:100%;height:auto}
.card svg,.card canvas{background:var(--canvas-bg);border:1px solid #e5edf6;border-radius:22px}
[data-theme="dark"] .card svg,[data-theme="dark"] .card canvas{border-color:#1e2d45}

/* Matrix cells */
.matrix{display:grid;gap:8px}.matrix5{grid-template-columns:repeat(5,1fr)}.matrix3{grid-template-columns:repeat(3,1fr)}.output-matrix{grid-template-columns:repeat(var(--cols,3),1fr)}
.cell{min-height:52px;border-radius:15px;border:1px solid #cbd5e1;background:white;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;transition:.18s;position:relative;overflow:hidden}
[data-theme="dark"] .cell{background:#1a2744;border-color:#2a3a60;color:#e2e8f0}
.cell input{height:100%;border:0;border-radius:0;text-align:center;background:transparent;font-size:18px;font-weight:900;padding:0;color:var(--ink)}
[data-theme="dark"] .cell input{color:#e2e8f0}
.cell.clickable{cursor:pointer}.cell.clickable:hover{transform:translateY(-2px);border-color:var(--blue)}.cell.active{background:linear-gradient(135deg,var(--purple),var(--blue))!important;color:white!important;border-color:#34205e}.cell.patch{background:#dff5fb;border-color:#6fd3e9}.cell.out{background:#f8fafc}.cell.hot{background:#e0f2fe}.cell.readonly .cell{background:#f8fafc}
[data-theme="dark"] .cell.patch{background:#0c2340;border-color:#1e5a7a}
[data-theme="dark"] .cell.out{background:#0d1b2e}
.patch-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:16px}

/* Confusion Matrix */
.conf-wrap{display:flex;flex-direction:column;gap:14px}
.conf-grid{
  display:grid;grid-template-columns:auto 1fr 1fr;gap:6px;
  font-size:13px;font-weight:800;align-items:center;
}
.conf-label-top{text-align:center;color:var(--muted);padding:4px}
.conf-label-side{color:var(--muted);padding:4px;text-align:right;padding-right:10px}
.conf-cell{
  border-radius:18px;padding:18px 10px;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:4px;
  font-size:28px;font-weight:900;transition:.3s;
}
.conf-cell small{font-size:11px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
.conf-tp{background:#dcfce7;color:#15803d;border:1px solid #86efac}
.conf-tn{background:#dcfce7;color:#15803d;border:1px solid #86efac}
.conf-fp{background:#fee2e2;color:#dc2626;border:1px solid #fca5a5}
.conf-fn{background:#fef9c3;color:#ca8a04;border:1px solid #fde047}
[data-theme="dark"] .conf-tp,[data-theme="dark"] .conf-tn{background:#052e16;color:#4ade80;border-color:#166534}
[data-theme="dark"] .conf-fp{background:#450a0a;color:#f87171;border-color:#991b1b}
[data-theme="dark"] .conf-fn{background:#422006;color:#fbbf24;border-color:#854d0e}
.conf-metrics{
  display:flex;gap:10px;flex-wrap:wrap;
}
.conf-metric-chip{
  flex:1;min-width:80px;text-align:center;background:var(--bg1);border:1px solid var(--line);
  border-radius:14px;padding:10px 8px;
}
.conf-metric-chip b{display:block;font-size:20px;color:var(--purple)}
.conf-metric-chip span{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em}

/* Speed control */
.speed-row{display:flex;align-items:center;gap:10px;margin-top:12px}
.speed-row label{flex:1;margin:0}
.speed-row input[type=range]{padding:6px 0}
.speed-val{font-size:13px;color:var(--muted);font-weight:800;min-width:50px;text-align:right}

/* Export button */
.export-btn{
  padding:8px 14px;border-radius:14px;border:1px solid var(--line);background:var(--bg1);
  color:var(--ink);font-size:13px;font-weight:800;cursor:pointer;transition:.18s;
  display:inline-flex;align-items:center;gap:6px;
}
.export-btn:hover{background:var(--cyan-soft);border-color:var(--cyan);color:var(--purple)}

/* Guide */
.guide-hero{margin-bottom:18px}.guide-hero ol{margin:0;padding-inline-start:24px;color:#334155;line-height:2}
[data-theme="dark"] .guide-hero ol{color:#94a3b8}
.explanation p{color:#475569;line-height:1.9}
[data-theme="dark"] .explanation p{color:#64748b}
.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.guide-card b{width:44px;height:44px;background:linear-gradient(135deg,var(--purple),var(--blue));color:white;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:21px}
.guide-card h3{margin:14px 0 8px;color:var(--purple)}
.guide-card p{color:var(--muted);line-height:1.75}

/* Footer */
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-top:22px;padding:16px 20px;border-radius:24px;background:rgba(255,255,255,.82)}
[data-theme="dark"] .site-footer{background:rgba(15,25,45,.82)}
.footer-brand{display:flex;align-items:center;gap:14px}
.footer-brand img{width:58px;height:58px;object-fit:contain;border-radius:16px;background:white;padding:6px;border:1px solid #e7edf5}
[data-theme="dark"] .footer-brand img{background:#1a2744;border-color:#2a3a60}
.footer-brand strong{display:block;color:var(--purple);margin-bottom:3px}
.footer-brand span,.footer-note{color:var(--muted);font-size:14px}

@media(max-width:1100px){
  .hero,.brand-head{flex-direction:column}
  .hero-panel{width:100%;min-width:0}
  .dashboard,.layout-2,.layout-3,.guide-grid{grid-template-columns:1fr}
  .form-grid.compact{grid-template-columns:1fr}
  .slider-line{grid-template-columns:1fr}
  .app{padding:14px}
  .patch-row,.site-footer{grid-template-columns:1fr;display:grid}
  .metric strong{font-size:28px}
  .logo-wrap{width:110px;height:110px;min-width:110px}
  .conf-grid{grid-template-columns:auto 1fr 1fr}
}

/* Report export buttons */
.report{background:linear-gradient(135deg,#0f766e,#0891b2);color:white}
.report-outline{background:#ffffff;color:#0f766e;border:1px solid rgba(15,118,110,.28)}
.report:hover,.report-outline:hover{filter:brightness(.98)}
.report-table{width:100%;border-collapse:collapse;margin:14px 0}
.report-table th,.report-table td{border:1px solid #d7dfeb;padding:8px;text-align:center}

/* Dynamic polynomial target and matrix controls */
.equation-card{margin-bottom:18px}
.equation-card .card-head{align-items:flex-start}
.equation-note{margin:0 0 14px;color:var(--muted);line-height:1.8}
.equation-grid{display:grid;grid-template-columns:2fr .7fr repeat(4,auto);gap:12px;align-items:end}
.equation-input input{font-family:Consolas,Monaco,monospace;font-weight:800}
.mode-pill{display:inline-flex;align-items:center;border-radius:999px;padding:8px 12px;background:var(--cyan-soft);color:var(--purple);font-weight:900;font-size:12px;text-transform:uppercase;letter-spacing:.04em;border:1px solid rgba(60,196,224,.35)}
.equation-status{margin-top:12px;border-radius:14px;padding:10px 12px;background:#f8fbfd;border:1px solid var(--line);color:var(--muted);font-size:13px;line-height:1.7}
.equation-status.error{background:#fee2e2;color:#991b1b;border-color:#fca5a5}
[data-theme="dark"] .equation-status{background:#0d1b2e}
[data-theme="dark"] .equation-status.error{background:#450a0a;color:#f87171;border-color:#991b1b}
.button-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
.report{color:white;background:linear-gradient(135deg,#0f766e,#0891b2)}
.report-outline{background:#ecfeff;color:#0e7490;border:1px solid rgba(14,116,144,.18)}
[data-theme="dark"] .report-outline{background:#0d1b2e;color:#67e8f9;border-color:#164e63}
.matrix{grid-template-columns:repeat(var(--cols,3),minmax(42px,1fr));overflow:auto;max-width:100%}
.matrix .cell{min-width:42px}
@media(max-width:1100px){.equation-grid{grid-template-columns:1fr 1fr}.equation-grid .equation-input{grid-column:1/-1}}
@media(max-width:700px){.equation-grid{grid-template-columns:1fr}.button-row .btn{width:100%}}
