@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#f1f5f9;
  --card:#ffffff;
  --ink:#0f172a;
  --muted:#64748b;
  --line:#e2e8f0;
  --brand:#4c1d95;
  --brand-deep:#2e1065;
  --brand-light:#ede9fe;
  --danger:#dc2626;
  --ok:#16a34a;
  --warn:#d97706;
  --info:#0ea5e9;
  --shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.04);
  --shadow:0 1px 3px 0 rgb(0 0 0 / 0.08), 0 1px 2px -1px rgb(0 0 0 / 0.08);
  --shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.08);
  --shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.08);
  --radius:16px;
  --radius-sm:10px;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:var(--bg);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
  font-size:16.5px;
}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
small.en, h1 small, h2 small, h3 small, label small, th small { color: var(--muted); font-weight: 500; font-size: .72em; }

/* ===== TOPBAR (matches church dashboard) ===== */
.navbar{
  background:linear-gradient(135deg,#4c1d95 0%,#2e1065 60%,#1e1b4b 100%);
  color:#fff;
  padding:0.9rem 1.5rem;
  display:flex;justify-content:space-between;align-items:center;
  position:sticky;top:0;z-index:20;gap:1rem;flex-wrap:wrap;
  box-shadow:0 2px 12px rgba(46,16,101,0.25);
}
.navbar a{color:#ddd6fe;text-decoration:none;font-weight:600}
.navbar a:hover{color:#fff;text-decoration:none}
.navbar .brand{font-weight:800;font-size:1.1rem;letter-spacing:-0.02em;color:#fff;display:flex;align-items:center;gap:0.6rem}
.navbar .brand small{color:#c4b5fd;font-size:.72em;font-weight:600}
.brandlogo{height:40px;width:40px;border-radius:50%;background:#fff;padding:2px;object-fit:contain;flex:none;box-shadow:0 1px 4px rgba(0,0,0,0.3)}
.loginlogo{display:block;margin:0 auto 16px;max-width:250px;width:100%}
.logincard h1 small{color:var(--muted);font-size:.62em;font-weight:600}
.navlinks{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.navbar .who{color:#c4b5fd;font-size:.9rem}
.langswitch{
  display:inline-flex;border:1px solid rgba(255,255,255,0.2);
  border-radius:999px;overflow:hidden;flex:none;
  background:rgba(255,255,255,0.08);font-size:0;
}
.langswitch a{
  color:#ddd6fe;padding:0.4rem 0.85rem;margin:0;
  font-size:0.82rem;font-weight:600;transition:all 0.2s;
}
.langswitch a.on{background:#fff;color:#4c1d95}
.langswitch a:hover:not(.on){background:rgba(255,255,255,0.12);color:#fff}
.langswitch.dark{font-size:.85rem;background:none;border:none;text-align:right;margin-bottom:6px}
.langswitch.dark a{color:#7c7194}
.langswitch.dark a.on{color:var(--brand-deep);background:none;text-decoration:underline}

/* ===== LAYOUT / TYPO ===== */
.wrap{max-width:1200px;margin:0 auto;padding:1.75rem 1.25rem 3rem;width:100%}
h1{font-size:1.9rem;font-weight:800;letter-spacing:-0.025em;margin:0 0 0.4rem;color:var(--ink)}
h2{font-size:1.3rem;font-weight:700;letter-spacing:-0.01em;margin:1.6rem 0 0.8rem}
h3{font-size:1rem;font-weight:700;margin:12px 0 6px}
.muted{color:var(--muted);font-size:0.88rem}

/* ===== CARDS ===== */
.card{
  background:var(--card);border:1px solid var(--line);
  border-radius:var(--radius);padding:1.4rem 1.5rem;margin:1rem 0;
  box-shadow:var(--shadow-sm);
}
.warncard{border-color:#f2c14e;background:#fffbea}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.1rem}
.classcard{
  display:block;color:inherit;transition:all 0.2s;cursor:pointer;
  background:linear-gradient(180deg,#faf7ff 0%,#f1eafd 100%);
  border:1px solid #ddd0fa;border-radius:var(--radius);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),
             inset 0 -3px 0 rgba(76,29,149,0.07),
             0 6px 16px rgba(76,29,149,0.13),
             0 2px 4px rgba(76,29,149,0.08);
}
.classcard:hover{
  text-decoration:none;transform:translateY(-3px);border-color:var(--brand);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),
             inset 0 -3px 0 rgba(76,29,149,0.07),
             0 12px 24px rgba(76,29,149,0.18),
             0 4px 8px rgba(76,29,149,0.10);
}
.classcard:active{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.9),
             inset 0 -1px 0 rgba(76,29,149,0.07),
             0 3px 8px rgba(76,29,149,0.12);
}
.classcard .stats div{background:rgba(255,255,255,0.78)}
.classcard h2{margin-top:0;font-size:1.1rem}
.stats{display:flex;gap:10px;margin:12px 0}
.stats div{flex:1;background:var(--brand-light);border-radius:var(--radius-sm);padding:10px;text-align:center}
.stats a.stattile{flex:1;background:var(--brand-light);border-radius:var(--radius-sm);padding:10px;text-align:center;text-decoration:none;cursor:pointer;transition:all 0.15s}
.stats a.stattile:hover{outline:2px solid var(--brand);text-decoration:none}
#attnlist{display:none;max-height:380px;overflow-y:auto;margin:6px 0 10px;border:1px solid var(--line);border-radius:var(--radius-sm)}
#attnlist table{font-size:.88rem}
#attnlist td{padding:.55rem .8rem}
.stats strong{display:block;font-size:1.35rem;font-weight:800;letter-spacing:-0.02em;color:var(--brand-deep)}
.stats span{font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em;color:var(--muted)}

/* ===== TABLES ===== */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:0.92rem}
th{
  text-align:left;font-size:0.72rem;font-weight:700;text-transform:uppercase;
  letter-spacing:0.06em;color:var(--muted);padding:0.8rem 1rem;
  border-bottom:2px solid var(--line);white-space:nowrap;vertical-align:middle;
}
td{padding:0.8rem 1rem;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:none}
tbody tr{transition:background 0.12s}
tbody tr:hover{background:rgba(76,29,149,0.03)}

/* ===== BADGES ===== */
.badge{display:inline-flex;align-items:center;padding:0.22rem 0.65rem;border-radius:999px;font-size:0.76rem;font-weight:600;line-height:1.5;white-space:nowrap;background:var(--brand-light);color:#5b21b6}
.badge.st-active{background:#dcfce7;color:#15803d}
.badge.st-follow_up{background:#fef3c7;color:#b45309}
.badge.st-at_risk{background:#fee2e2;color:#b91c1c}
.badge.st-completed{background:#e0f2fe;color:#0369a1}
.badge.st-dropped{background:#e5e7eb;color:#4b5563}
.badge.fu-open{background:#fee2e2;color:#b91c1c}
.badge.fu-contacted{background:#fef3c7;color:#b45309}
.badge.fu-resolved{background:#dcfce7;color:#15803d}

/* ===== BUTTONS ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  padding:0.6rem 1.2rem;border-radius:var(--radius-sm);
  font-weight:600;font-size:0.88rem;cursor:pointer;
  border:1px solid var(--line);background:var(--card);color:var(--ink);
  text-decoration:none;transition:all 0.15s;font-family:inherit;
}
.btn:hover{text-decoration:none;border-color:var(--brand);color:var(--brand)}
.btn.primary{background:var(--brand);color:#fff;border-color:transparent;box-shadow:var(--shadow-sm)}
.btn.primary:hover{filter:brightness(1.12);color:#fff;box-shadow:var(--shadow);transform:translateY(-1px)}
.btn.primary small{color:#c4b5fd}
.btn.small{padding:0.4rem 0.8rem;font-size:0.8rem}
.btn.wide{width:100%}
.btn.danger{background:#fee2e2;color:#b91c1c;border-color:#fecaca;margin-top:8px}
.btn.danger:hover{background:#fecaca;color:#b91c1c;border-color:#fca5a5}

/* ===== FORMS ===== */
label{display:block;margin:10px 0;font-weight:600;font-size:0.85rem;color:var(--ink)}
input,select,textarea{
  font-family:inherit;font-size:0.9rem;padding:0.6rem 0.85rem;
  border:1.5px solid var(--line);border-radius:var(--radius-sm);
  background:var(--card);color:var(--ink);width:100%;margin-top:4px;
  transition:border-color 0.15s,box-shadow 0.15s;
}
input[type=checkbox],input[type=radio]{width:auto;padding:0;flex-shrink:0}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(76,29,149,0.12)}
fieldset{border:1px solid var(--line);border-radius:var(--radius-sm);margin:10px 0}
label.check{font-weight:500;display:flex;gap:8px;align-items:flex-start}
label.check input{width:auto;margin-top:3px}
.inlineform,.stackform{margin:8px 0}
.fuform{display:flex;gap:6px;flex-wrap:wrap}
.fuform input{width:130px;margin-top:0}
.note{border-top:1px solid var(--line);padding:8px 0}
.note:first-of-type{border-top:none}

.flash{padding:11px 14px;border-radius:var(--radius-sm);margin:10px 0;font-weight:600}
.flash.ok{background:#dcfce7;color:#15803d}
.flash.error{background:#fee2e2;color:#b91c1c}

/* ===== LOGIN (matches church dashboard) ===== */
.loginbody{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#2e1065 0%,#4c1d95 50%,#6d28d9 100%);
  padding:1rem;position:relative;overflow:hidden;
}
.logincard{
  background:var(--card);border-radius:20px;padding:2.5rem;
  width:100%;max-width:400px;box-shadow:var(--shadow-lg);position:relative;
}
.logincard h1{font-size:1.4rem;text-align:center;margin-bottom:0.5rem;color:var(--ink)}
.logincard .sub{color:var(--muted);text-align:center;margin-top:-4px}

/* important dates */
.dateslist{list-style:none;margin:0;padding:0}
.dateslist li{display:flex;align-items:center;gap:12px;padding:7px 10px;border-bottom:1px solid #f1ecfa;border-radius:8px}
.dateslist li:last-child{border-bottom:none}
.dateslist .dlabel{flex:1;font-weight:600}
.dateslist li.past{opacity:.5}
.dateslist li.next{background:var(--brand-light);outline:1px solid #d6c9f2}
.ddate{font-variant-numeric:tabular-nums;color:var(--muted)}
.dday{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.78rem;font-weight:700;background:var(--brand-light);color:#5b21b6}
.dday.future{background:#e0f2fe;color:#0369a1}
.dday.today{background:#fee2e2;color:#b91c1c}
.dday.past{background:#e5e7eb;color:#4b5563}
.datesedit{margin-top:12px}
.datesedit summary{cursor:pointer;font-weight:700;color:var(--brand)}
.datesgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 16px}
.nextms{margin:4px 0 0;font-size:.92rem}

/* calendar */
.calnav{display:flex;align-items:center;gap:10px;margin:12px 0}
.calmonth{font-size:1.15rem;font-weight:700;color:var(--brand-deep);min-width:170px;text-align:center}
.calwrap{padding:8px;overflow-x:auto}
table.calgrid{min-width:760px}
table.calgrid th{text-align:center}
td.cal-day{width:14.28%;height:108px;vertical-align:top;border:1px solid var(--line);padding:5px}
td.cal-day.outside{opacity:.35}
td.cal-day.past{background:#e9e6f0;opacity:.55}
td.cal-day.today{background:#f5f0ff;outline:2px solid var(--brand);outline-offset:-2px;opacity:1}
.dnum{font-weight:700;font-size:.85rem;display:flex;align-items:center;gap:6px}
.addday{margin-left:auto;background:var(--brand-light);border-radius:6px;padding:0 7px;font-weight:800;color:var(--brand)}
.addday:hover{text-decoration:none;background:#ddd0fa}
.chip{display:block;font-size:.72rem;font-weight:600;border-radius:6px;padding:2px 6px;margin-top:4px;line-height:1.35;overflow:hidden;text-overflow:ellipsis}
a.chip:hover{text-decoration:none;filter:brightness(.95)}
.chip.kind-lesson{background:#e0f2fe;color:#0369a1}
.chip.kind-event{background:#dcfce7;color:#15803d}
.chip.kind-exam{background:#fee2e2;color:#b91c1c}
.chip.kind-holiday{background:#fef3c7;color:#b45309}
.chip.kind-other{background:var(--brand-light);color:#5b21b6}
.chip.kind-milestone{background:linear-gradient(135deg,#4c1d95,#2e1065);color:#fff}
.ecolor-black{color:#0f172a}.ecolor-red{color:#c62828}.ecolor-blue{color:#1545a8}
.chip .official{font-weight:400;font-size:.92em}
.modetoggle{display:inline-flex;gap:6px;margin-left:10px}
.chip.sub-submitted{background:#dcfce7;color:#15803d}
.chip.sub-late{background:#fef3c7;color:#b45309}
.chip.sub-missing{background:#fee2e2;color:#b91c1c}
.chip.sub-pending{background:var(--brand-light);color:#5b21b6}
.chip .submeta{font-weight:400;font-size:.9em}
.compliance{font-size:.92em;color:#4a3566}
tr.mutedrow td{opacity:.75}
.uplist{list-style:none;padding:0;margin:6px 0}
.uplist li{padding:5px 0;border-bottom:1px solid #f1ecfa;display:flex;gap:10px;align-items:center}
.uplist .chip{display:inline-block;margin-top:0}

/* checklist */
.tabs{display:flex;gap:8px;margin:14px 0;flex-wrap:wrap}
.tab{padding:7px 15px;border-radius:999px;background:var(--brand-light);color:var(--brand-deep);font-weight:600}
.tab.on{background:var(--brand);color:#fff}
.tab:hover{text-decoration:none}
.phasestat{display:inline-block;background:var(--brand-light);border-radius:8px;padding:6px 10px;margin:3px 4px 3px 0;font-size:.88rem}
.matrixwrap{overflow-x:auto;padding:6px 0}
table.matrix{font-size:.8rem;min-width:700px}
table.matrix th,table.matrix td{padding:4px;text-align:center}
table.matrix td.sticky,table.matrix th.sticky{position:sticky;left:0;background:#fff;text-align:left;min-width:230px;width:230px;z-index:2;box-shadow:1px 0 0 var(--line),10px 0 12px -10px rgba(46,16,101,.45)}
table.matrix th.sticky{z-index:3}
tbody tr:hover td.sticky{background:#faf8ff}
.vhead{display:inline-block;max-width:86px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.68rem;text-transform:none;letter-spacing:0}
.cellbtn{border:1px solid #d6c9f2;background:#faf8ff;border-radius:6px;width:26px;height:26px;cursor:pointer;font-size:.85rem;line-height:1}
td.done .cellbtn{background:#bbf7d0;border-color:#4ade80;color:#14532d;font-weight:800}
td.due{background:#fef3c7}
ul.checklist{list-style:none;padding-left:2px}
ul.checklist li{display:flex;align-items:flex-start;gap:8px;padding:5px 0;border-bottom:1px solid #f1ecfa}
.tickform{margin:0}
.tick{width:24px;height:24px;border-radius:50%;border:2px solid #b7a8dd;background:#fff;cursor:pointer;font-size:.8rem;line-height:1;color:transparent;flex:none}
.tick.on{background:var(--ok);border-color:var(--ok);color:#fff}
.duetext{color:#9c6a00;font-weight:600}

/* class page tabs */
.classtabs{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 18px}
.classtabs .ctab{padding:8px 16px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--brand-deep);font-weight:600;font-size:.92rem;cursor:pointer;text-decoration:none;font-family:inherit}
.classtabs .ctab.on{background:var(--brand);color:#fff;border-color:var(--brand)}
.classtabs .ctab:hover{text-decoration:none;background:var(--brand-light)}
.classtabs .ctab.on:hover{background:var(--brand)}
.btn.small{padding:4px 12px;font-size:.82rem}
.btn.danger{background:#fee2e2;color:#b91c1c;border-color:#fecaca}
.btn.danger:hover{background:#fecaca}
.inlineform{display:inline;margin:0}
.inlineform .btn{margin-top:0}
tr.droppedrow td{background:#e5e7eb;color:#6b7280}
tr.droppedrow td a{color:#6b7280}
tr.droppedrow td.sticky{background:#e5e7eb}

/* attendance book */
table.attbook td.att{text-align:center;font-weight:800;font-size:.95rem}
td.att-O{color:#15803d}
td.att-X{color:#b91c1c}
td.att-E{color:#b45309}
td.att-A{color:#0369a1}
table.attbook th.planned{background:#ede9fe}
table.attbook td.planned{background:#f5f3ff}
table.attbook tfoot td{background:var(--brand-light)}
table.attbook tfoot td.sticky{background:var(--brand-light)}

/* scrollbar (matches church dashboard) */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:6px;border:2px solid transparent;background-clip:content-box}

@media(max-width:640px){
  .wrap{padding:1.25rem 0.9rem 2.5rem}
  h1{font-size:1.5rem}
  .card{padding:1.1rem}
  .stats strong{font-size:1.1rem}
}

/* ===== THEME TOGGLE + DARK THEME ===== */
.themetoggle{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.3);border-radius:999px;width:34px;height:34px;cursor:pointer;font-size:0.95rem;line-height:1;color:#fff;padding:0}
.themetoggle.onlight{background:transparent;border-color:var(--line);color:var(--ink);float:right}
[data-theme="dark"]{
  --bg:#131022; --card:#1e1936; --ink:#ece8fa; --muted:#a79cc9;
  --line:#3a2f63; --brand:#b79cff; --brand-deep:#d3c2ff; --brand-light:#2b2154;
  --shadow-sm:0 1px 2px 0 rgb(0 0 0 / 0.4);
  --shadow:0 1px 3px 0 rgb(0 0 0 / 0.45), 0 1px 2px -1px rgb(0 0 0 / 0.45);
  --shadow-md:0 4px 6px -1px rgb(0 0 0 / 0.5), 0 2px 4px -2px rgb(0 0 0 / 0.5);
  --shadow-lg:0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.5);
}
[data-theme="dark"] table.matrix td.sticky,
[data-theme="dark"] table.matrix th.sticky{background:#1e1936}
[data-theme="dark"] tbody tr:hover td.sticky{background:#251d47}
[data-theme="dark"] .classtabs .ctab{background:var(--card);color:var(--brand-deep)}
[data-theme="dark"] .classtabs .ctab.on{background:var(--brand);color:#1e1936}
[data-theme="dark"] body{
  background:
    radial-gradient(1100px 550px at 15% -10%, rgba(124,93,250,0.28) 0%, rgba(124,93,250,0) 60%),
    radial-gradient(900px 500px at 95% 0%, rgba(56,89,199,0.20) 0%, rgba(56,89,199,0) 55%),
    var(--bg);
  background-attachment:fixed;
}
[data-theme="dark"] .classcard{
  background:linear-gradient(160deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.04) 55%, rgba(255,255,255,0.06) 100%);
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  backdrop-filter:blur(14px) saturate(150%);
  border:1px solid rgba(255,255,255,0.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.18),
             0 10px 30px rgba(0,0,0,0.35);
}
[data-theme="dark"] .classcard:hover{
  background:linear-gradient(160deg, rgba(255,255,255,0.13) 0%, rgba(255,255,255,0.05) 55%, rgba(255,255,255,0.08) 100%);
  border-color:rgba(255,255,255,0.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.22),
             0 16px 36px rgba(0,0,0,0.42);
}
[data-theme="dark"] .classcard .stats div{background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.07)}
[data-theme="dark"] .classcard .muted{color:#c9bde8}
[data-theme="dark"] .classcard .compliance{color:#d5cbf5}
[data-theme="dark"] .classcard .nextms{color:#ddd5f7}
[data-theme="dark"] tr.droppedrow td{background:#2b2b33;color:#8f8fa3}
[data-theme="dark"] tr.droppedrow td.sticky{background:#2b2b33}
[data-theme="dark"] tr.droppedrow td a{color:#8f8fa3}
[data-theme="dark"] .tick{background:#241c44}
[data-theme="dark"] .cellbtn{background:#241c44;border-color:#453573;color:var(--ink)}
[data-theme="dark"] td.due{background:#4a3a10}
[data-theme="dark"] .warncard{background:#3a2f14}
[data-theme="dark"] td.cal-day.past{background:#241c44}
[data-theme="dark"] td.cal-day.today{background:#2b2154}
[data-theme="dark"] .ecolor-black{color:#ece8fa}
[data-theme="dark"] table.attbook th.planned{background:#3b2a6b}
[data-theme="dark"] table.attbook td.planned{background:#2b2154}
[data-theme="dark"] td.att-O{color:#4ade80}
[data-theme="dark"] td.att-X{color:#f87171}
[data-theme="dark"] td.att-E{color:#fbbf24}
[data-theme="dark"] td.att-A{color:#38bdf8}
[data-theme="dark"] .flash.ok{background:#14532d;color:#bbf7d0}
[data-theme="dark"] .flash.error{background:#5f1d1d;color:#fecaca}
[data-theme="dark"] .loginbody{background:linear-gradient(135deg,#171130 0%,#241a4d 55%,#131022 100%)}
/* date mismatch flag (class info vs calendar) */
.dateslist li.mismatch{background:#fef2f2;border:1px solid #fca5a5;border-radius:8px;padding-left:8px;padding-right:8px}
.dateslist li.mismatch .ddate{color:#b91c1c;font-weight:700}
.mismatchnote{color:#b91c1c;font-weight:600;font-size:.9em;margin-left:8px}
[data-theme="dark"] .dateslist li.mismatch{background:#3d1420;border-color:#9f1239}
[data-theme="dark"] .dateslist li.mismatch .ddate{color:#fda4af}
[data-theme="dark"] .mismatchnote{color:#fda4af}
/* review report structured form */
.revinfo p{margin:2px 0}
.revrow{display:flex;gap:8px;align-items:center;margin:4px 0}
.revrow input{flex:1}
.revno{font-weight:600;min-width:22px}
/* materials */
.matlist{list-style:none;margin:0;padding:0}
.matlist li{padding:9px 4px;border-bottom:1px solid #e5e7eb}
.matlist li:last-child{border-bottom:none}
.matlist a{font-weight:600;text-decoration:none}
.matpoints li{margin:6px 0;line-height:1.5}
[data-theme="dark"] .matlist li{border-color:#3b2f63}