:root { --bg:#f6f7f9; --panel:#fff; --fg:#17191c; --muted:#626a76; --line:#dde1e6; --accent:#2b5cff; --accent-fg:#fff;
  --ok:#1b7f3b; --warn:#a46200; --bad:#c62828; --okbg:#e3f5e8; --warnbg:#fdf0d9; --badbg:#fde5e5; --neutbg:#eceff3; }
@media (prefers-color-scheme: dark) { :root { --bg:#0f1114; --panel:#181b20; --fg:#eceef1; --muted:#9aa2ae; --line:#2b3038;
  --accent:#6c8cff; --accent-fg:#0b1020; --ok:#6fd694; --warn:#e8b45a; --bad:#ef7a7a; --okbg:#173522; --warnbg:#3a2c12; --badbg:#3d1a1a; --neutbg:#23272e; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color: var(--accent); }
header.top { display:flex; align-items:center; gap:1rem; padding:.55rem 1.25rem; background:var(--panel); border-bottom:1px solid var(--line); }
header.top .brand { font-weight:700; color:var(--fg); text-decoration:none; }
header.top nav a { margin-right:.9rem; color:var(--muted); text-decoration:none; }
header.top nav a.active { color:var(--fg); font-weight:600; }
header.top .who { margin-left:auto; color:var(--muted); display:flex; gap:.6rem; align-items:center; }
main { max-width: 1100px; margin: 1.25rem auto; padding: 0 1.25rem 3rem; }
h1 { font-size:1.4rem; margin:.2rem 0 1rem; } h2 { font-size:1.05rem; margin:1.6rem 0 .6rem; }
.crumbs { color:var(--muted); margin-bottom:.4rem; } .crumbs a { color:var(--muted); }
.flash { padding:.55rem .8rem; border-radius:8px; margin-bottom:1rem; background:var(--okbg); color:var(--ok); }
.flash.err { background:var(--badbg); color:var(--bad); }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:1rem; margin-bottom:1rem; }
table { width:100%; border-collapse:collapse; background:var(--panel); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
th, td { text-align:left; padding:.45rem .7rem; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); background:var(--neutbg); }
tr:last-child td { border-bottom:0; }
td.num, th.num { text-align:right; font-variant-numeric: tabular-nums; }
.empty { color:var(--muted); padding:1rem; text-align:center; }
label { display:block; font-weight:600; margin:.6rem 0 .2rem; }
input[type=text], input[type=email], input[type=password], input[type=url], input[type=number], input[type=datetime-local], select, textarea, input[type=file] {
  width:100%; font:inherit; padding:.45rem .6rem; border:1px solid var(--line); border-radius:7px; background:var(--bg); color:var(--fg); }
textarea { min-height:7rem; resize:vertical; }
.hint { color:var(--muted); font-size:.85rem; font-weight:400; }
button, .btn { font:inherit; padding:.4rem .85rem; border:1px solid var(--line); background:var(--panel); color:var(--fg); border-radius:7px; cursor:pointer; text-decoration:none; display:inline-block; }
button:hover, .btn:hover { border-color:var(--accent); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--accent); outline-offset:1px; }
button.primary, .btn.primary { background:var(--accent); border-color:var(--accent); color:var(--accent-fg); font-weight:600; }
button.danger { color:var(--bad); } button:disabled { opacity:.5; cursor:default; }
.row { display:flex; gap:.6rem; flex-wrap:wrap; align-items:flex-end; } .row > * { flex:0 0 auto; } .row .grow { flex:1 1 14rem; }
form.inline { display:inline; }
.badge { display:inline-block; padding:.05rem .55rem; border-radius:999px; font-size:.78rem; background:var(--neutbg); color:var(--muted); white-space:nowrap; }
.badge.ok { background:var(--okbg); color:var(--ok); } .badge.warn { background:var(--warnbg); color:var(--warn); } .badge.bad { background:var(--badbg); color:var(--bad); }
.err-text { color:var(--bad); font-size:.85rem; }
.login { max-width:22rem; margin:12vh auto; }
.slide-card { display:grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.8fr) minmax(0,1.1fr); gap:1rem; background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:1rem; margin-bottom:1rem; }
.slide-card img { width:100%; border:1px solid var(--line); border-radius:6px; background:#000; display:block; }
.slide-card .idx { font-weight:700; margin-bottom:.4rem; }
.slide-card .notes { white-space:pre-wrap; color:var(--muted); font-size:.85rem; max-height:16rem; overflow:auto; }
.slide-card .actions { display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.5rem; }
.sticky { position:sticky; top:0; z-index:5; background:var(--bg); padding:.5rem 0; }
.transcript td.t { white-space:nowrap; color:var(--muted); }
pre.json { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:.7rem; overflow:auto; }
code.url { word-break:break-all; }
@media (max-width: 800px) { .slide-card { grid-template-columns: 1fr; } header.top { flex-wrap:wrap; } }