:root { --blue:#149bd7; --blue-dark:#0f6f9c; --ink:#10212f; --muted:#5d7180; --line:#d8e4ea; --soft:#f4f8fb; --white:#fff; --green:#1f8f6a; --red:#b4233c; --gold:#f2b84b; font-family:Arial, Helvetica, sans-serif; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--soft); color:var(--ink); }
a { color:inherit; font-weight:800; }
button, input { font:inherit; }
[hidden] { display:none !important; }
.course-header { background:#101820; color:#fff; padding:16px 22px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.course-brand { display:flex; align-items:center; gap:14px; text-decoration:none; }
.course-brand img { width:148px; height:auto; display:block; }
.course-brand span { font-size:1.1rem; font-weight:900; }
.course-nav { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.course-nav a, .course-nav button { min-height:42px; display:inline-flex; align-items:center; justify-content:center; padding:0 13px; border:2px solid rgba(255,255,255,.38); border-radius:6px; background:transparent; color:#fff; text-decoration:none; font-weight:900; cursor:pointer; }
.course-shell { width:min(1120px, calc(100% - 32px)); margin:30px auto 48px; }
.course-card { background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 24px rgba(15,33,49,.08); }
.course-button { min-height:46px; display:inline-flex; align-items:center; justify-content:center; padding:0 16px; border:2px solid var(--ink); border-radius:7px; background:#fff; color:var(--ink); text-decoration:none; font-weight:900; cursor:pointer; }
.course-button.primary { border-color:var(--blue); background:var(--blue); color:#06111a; }
.course-button.danger { border-color:var(--red); color:var(--red); }
.course-button:focus-visible, input:focus-visible, summary:focus-visible { outline:4px solid rgba(20,155,215,.25); outline-offset:2px; }
.status-message { padding:13px 15px; margin-bottom:18px; border-radius:8px; background:#eaf8ff; color:#17475e; font-weight:800; line-height:1.45; }
.status-message[data-kind="success"] { background:#edf9f3; color:#176448; }
.status-message[data-kind="error"] { background:#fff0f3; color:var(--red); }
.muted { color:var(--muted); }
.course-footer { padding:25px 16px; background:#101820; color:#c8d7df; text-align:center; line-height:1.8; font-weight:700; }
.course-footer a { color:#c8d7df; }
.eyebrow { margin:0 0 9px; color:var(--blue-dark); font-size:.82rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.pill { display:inline-flex; align-items:center; min-height:30px; padding:0 10px; border-radius:999px; background:#eef9f4; color:#176448; font-size:.85rem; font-weight:900; }
dialog { width:min(650px, calc(100% - 28px)); border:0; border-radius:10px; padding:0; box-shadow:0 24px 70px rgba(0,0,0,.32); }
dialog::backdrop { background:rgba(7,18,27,.68); }
.dialog-body { padding:22px; }
.dialog-head { display:flex; justify-content:space-between; align-items:start; gap:14px; }
.dialog-head h2 { margin:0; }
.dialog-close { min-width:44px; min-height:44px; border:0; border-radius:6px; background:#edf3f6; font-size:1.25rem; cursor:pointer; }
.form-stack { display:grid; gap:13px; }
.form-stack label { display:grid; gap:7px; color:var(--muted); font-weight:800; line-height:1.45; }
.form-stack input[type="text"] { min-height:46px; border:2px solid var(--line); border-radius:7px; padding:0 12px; }
.check-row { grid-template-columns:auto 1fr !important; align-items:start; }
.check-row input { width:20px; height:20px; margin-top:2px; }
@media (max-width:620px) {
  .course-header { align-items:flex-start; }
  .course-brand img { width:132px; }
  .course-shell { width:min(100% - 20px, 1120px); margin-top:18px; }
  .course-nav { width:100%; }
  .course-nav a, .course-nav button { flex:1; }
}

