* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
       background: #f4f6f8; color: #222; }
.wrap { max-width: 720px; margin: 0 auto; padding: 24px 16px 64px; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.15rem; margin-top: 2rem; }
.card { background: #fff; border: 1px solid #e2e6ea; border-radius: 10px;
        padding: 16px 18px; margin: 14px 0; }
label { display: block; font-weight: 600; margin: 12px 0 4px; }
input[type=text], input[type=password], input[type=number], textarea, select {
  width: 100%; padding: 9px 10px; border: 1px solid #c9d1d9; border-radius: 6px; font-size: 1rem; }
textarea { min-height: 90px; font-family: inherit; }
button, .btn { display: inline-block; background: #1a6fd4; color: #fff; border: 0; border-radius: 6px;
  padding: 10px 18px; font-size: 1rem; cursor: pointer; text-decoration: none; margin-top: 12px; }
button:hover, .btn:hover { background: #155db3; }
.btn.secondary { background: #6c757d; } .btn.secondary:hover { background: #5a6268; }
.opt { display: block; background: #fff; border: 1px solid #c9d1d9; border-radius: 8px;
       padding: 10px 12px; margin: 8px 0; cursor: pointer; font-weight: 400; }
.opt:hover { border-color: #1a6fd4; }
.opt input { margin-right: 8px; }
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td { padding: 8px 10px; border-bottom: 1px solid #e2e6ea; text-align: left; font-size: .95rem; }
th { background: #eef2f5; }
.pass { color: #1e7e34; font-weight: 700; } .fail { color: #c0392b; font-weight: 700; }
.muted { color: #6c757d; font-size: .9rem; }
.flash { background: #d4edda; border: 1px solid #c3e6cb; border-radius: 6px; padding: 10px 14px; margin: 12px 0; }
.error { background: #f8d7da; border: 1px solid #f5c6cb; border-radius: 6px; padding: 10px 14px; margin: 12px 0; }
.badge { display: inline-block; background: #ffd700; border-radius: 10px; padding: 1px 8px; font-size: .8rem; }
.review { border-left: 4px solid #c9d1d9; } .review.right { border-left-color: #1e7e34; }
.review.wrong { border-left-color: #c0392b; }
.topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.topbar a { color: #1a6fd4; text-decoration: none; font-size: .9rem; }
code.mono { background: #eef2f5; padding: 1px 6px; border-radius: 4px; font-size: 1.05rem; letter-spacing: 1px; }