:root { --bg:#f6f7f9; --card:#fff; --ink:#1c2430; --mute:#667085; --line:#dfe3ea; --accent:#1f6feb;
          --ok:#1a7f4b; --warn:#a15c00; --bad:#b42318; --okbg:#e7f6ee; --warnbg:#fff4e0; --badbg:#fdeceb; }
  @media (prefers-color-scheme: dark) {
    :root { --bg:#12161c; --card:#1b2129; --ink:#e6e9ee; --mute:#98a2b3; --line:#2c343f; --accent:#5b9bff;
            --ok:#4cc38a; --warn:#f0b24b; --bad:#ff7b72; --okbg:#173326; --warnbg:#3a2c12; --badbg:#3c1a18; }
  }
  * { box-sizing: border-box; }
  body { margin:0; background:var(--bg); color:var(--ink); font:15px/1.45 system-ui,-apple-system,Segoe UI,sans-serif; }
  main { max-width: 1100px; margin: 0 auto; padding: 24px 16px 80px; }
  h1 { font-size: 22px; margin: 0 0 4px; } .sub { color: var(--mute); margin: 0 0 20px; }
  .card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:18px; margin-bottom:16px; }
  label.lbl { display:block; font-weight:600; margin-bottom:6px; }
  input[type=file], textarea, input[type=text], select { width:100%; padding:8px 10px; border:1px solid var(--line);
    border-radius:8px; background:var(--bg); color:var(--ink); font:inherit; }
  textarea { min-height: 90px; resize: vertical; }
  .grid { display:grid; grid-template-columns: 1fr 1fr; gap:16px; } @media (max-width:760px){ .grid{grid-template-columns:1fr;} }
  button { background:var(--accent); color:#fff; border:0; border-radius:8px; padding:10px 18px; font:inherit; font-weight:600; cursor:pointer; }
  button.ghost { background:transparent; color:var(--ink); border:1px solid var(--line); }
  button:disabled { opacity:.5; cursor:default; }
  .row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
  .hint { color:var(--mute); font-size:13px; }
  .bar { height:8px; background:var(--line); border-radius:99px; overflow:hidden; margin:10px 0 4px; }
  .bar > div { height:100%; background:var(--accent); width:0; transition:width .4s; }
  table { width:100%; border-collapse:collapse; } th,td { text-align:left; vertical-align:top; padding:8px 8px; border-bottom:1px solid var(--line); }
  th { font-size:12px; text-transform:uppercase; letter-spacing:.04em; color:var(--mute); }
  td.lab { width:28%; font-weight:600; } td.val { width:30%; } td.ev { color:var(--mute); font-size:13px; }
  tr.blank td.lab { color: var(--mute); }
  .chip { display:inline-block; font-size:12px; font-weight:600; padding:2px 8px; border-radius:99px; white-space:nowrap; }
  .c-ok { background:var(--okbg); color:var(--ok); } .c-warn { background:var(--warnbg); color:var(--warn); }
  .c-bad { background:var(--badbg); color:var(--bad); } .c-none { background:var(--line); color:var(--mute); }
  .err { background:var(--badbg); color:var(--bad); padding:10px 12px; border-radius:8px; margin-top:12px; }
  iframe { width:100%; height: 80vh; border:1px solid var(--line); border-radius:8px; background:#fff; }
  .hidden { display:none; } details summary { cursor:pointer; color:var(--mute); }
  pre { white-space:pre-wrap; max-height:300px; overflow:auto; background:var(--bg); padding:10px; border-radius:8px; font-size:13px; }

  .topbar { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; flex-wrap:wrap; margin-bottom:4px; }
  .login { max-width:380px; margin:12vh auto 0; }
  .login input { margin-bottom:12px; }
  .ok { background:var(--okbg); color:var(--ok); padding:10px 12px; border-radius:8px; margin-top:12px; }
  details.card > summary { font-weight:600; color:var(--ink); }
  .lib-item { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line); }
  button.small { padding:4px 10px; font-size:13px; }
  .narrow { max-width:240px; } .mt { margin-top:12px; } .mt2 { margin-top:14px; } .gap { margin:0 0 14px; }

  a.btnlink { text-decoration:none; }