:root { --bg:#0b0f14; --card:#121924; --line:#1f2a3a; --fg:#e6edf3; --muted:#8b9bb4; --accent:#3fb950; --accent2:#58a6ff; --warn:#d29922; --bad:#f85149; }
* { box-sizing:border-box }
body { margin:0 auto; width:1200px; background:var(--bg); color:var(--fg); font:15px/1.45 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; padding:0 20px 40px }
html { background:var(--bg) }
header { display:flex; justify-content:space-between; align-items:center; padding:22px 0 10px; flex-wrap:wrap; gap:12px }
.brand { display:flex; gap:14px; align-items:center }
.logo { font-size:34px; width:52px; height:52px; display:grid; place-items:center; background:linear-gradient(135deg,#1f6feb,#3fb950); border-radius:14px }
h1 { margin:0; font-size:26px; letter-spacing:.3px }
.sub { color:var(--muted); font-size:13px }
.pill { display:flex; gap:8px; align-items:center; border:1px solid var(--line); border-radius:999px; padding:6px 12px; font-size:13px; color:var(--muted) }
.pill .dot { width:9px; height:9px; border-radius:50%; background:var(--warn); box-shadow:0 0 8px var(--warn) }
.pill.ok .dot { background:var(--accent); box-shadow:0 0 10px var(--accent); animation:pulse 2s infinite }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.45} }
.counters { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin:14px 0 18px }
.counter { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:14px 16px }
.counter .n { font-size:clamp(18px,2.2vw,28px); font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap }
.counter .l { color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.6px }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:14px }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:16px }
.card.wide { grid-column:1 / -1 }
h2 { margin:0 0 10px; font-size:16px }
.muted { color:var(--muted); font-weight:400 } .small { font-size:12px }
.snap { border-top:1px solid var(--line); padding:12px 0 }
.snap:first-child { border-top:0 }
.snap .head { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; align-items:baseline }
.snap .h { font-size:18px; font-weight:700 } .snap .h small { color:var(--muted); font-weight:400; font-size:13px; margin-left:8px }
.tag { display:inline-block; font-size:11px; padding:2px 8px; border-radius:999px; border:1px solid var(--line); color:var(--muted); margin-left:6px }
.tag.done { color:var(--accent); border-color:var(--accent) } .tag.failed { color:var(--bad); border-color:var(--bad) } .tag.pruned { color:var(--muted) } .tag.uploading,.tag.downloading,.tag.splitting { color:var(--warn); border-color:var(--warn) }
.kv { display:grid; grid-template-columns:130px 1fr; gap:3px 10px; font-size:13px; margin-top:6px }
.kv .k { color:var(--muted) }
code, .cmd { font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px }
.cid { word-break:break-all }
a { color:var(--accent2); text-decoration:none } a:hover { text-decoration:underline }
details summary { cursor:pointer; color:var(--muted); font-size:13px }
table { width:100%; border-collapse:collapse; font-size:12.5px; margin-top:6px }
th, td { text-align:left; padding:4px 6px; border-bottom:1px solid var(--line); vertical-align:top }
th { color:var(--muted); font-weight:500 }
.ds { border-top:1px solid var(--line); padding:10px 0 }
.ds:first-child { border-top:0 }
.ds .t { display:flex; justify-content:space-between; align-items:baseline }
.bar { height:6px; background:#0e1520; border-radius:3px; overflow:hidden; margin:6px 0 }
.bar > i { display:block; height:100%; background:linear-gradient(90deg,var(--accent2),var(--accent)) }
.ok { color:var(--accent) } .bad { color:var(--bad) } .warn { color:var(--warn) }
.chainlist { display:flex; flex-direction:column; gap:0; margin-top:8px }
.link { padding:6px 10px; border:1px solid var(--line); border-radius:8px; background:#0e1520; font-size:12px }
.arrow { text-align:center; color:var(--muted); font-size:12px; line-height:1 }
.row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px }
input { background:#0e1520; border:1px solid var(--line); color:var(--fg); padding:8px 10px; border-radius:8px; min-width:220px }
button { background:var(--accent2); color:#04101e; border:0; padding:9px 14px; border-radius:8px; font-weight:600; cursor:pointer }
button:disabled { opacity:.5; cursor:default }
.log { background:#05080c; border:1px solid var(--line); border-radius:8px; padding:12px; height:280px; overflow:auto; margin:0 0 8px; white-space:pre-wrap; font-size:12.5px }
.cmd { background:#05080c; border:1px solid var(--line); border-radius:8px; padding:10px; white-space:pre-wrap; margin:6px 0 0 }
footer { display:flex; justify-content:space-between; color:var(--muted); font-size:12px; margin-top:18px; flex-wrap:wrap; gap:8px }