:root{
  --paper:#f4f1ea; --bar:#ece4d6; --panel:#fbf9f4; --panel2:#f5eee1;
  --line:#ddd5c5; --ink:#1c1a17; --muted:#6b655c;
  --accent:#b4452f; --accent-ink:#8f3422; --ok:#3f7a52; --warn:#8a6d1f; --err:#b4452f;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  background:var(--paper); color:var(--ink); min-height:100vh;
  font:14px/1.6 ui-monospace,SFMono-Regular,"JetBrains Mono",Menlo,monospace;
  display:flex; align-items:center; justify-content:center; padding:48px 18px;
  background-image:radial-gradient(circle at 1px 1px, rgba(28,26,23,.05) 1px, transparent 0);
  background-size:22px 22px;
}
.term{width:100%; max-width:580px; background:var(--panel); border:1px solid var(--line);
  border-radius:10px; overflow:hidden; box-shadow:0 24px 50px -24px rgba(60,40,20,.4)}
.bar{display:flex; align-items:center; gap:7px; padding:11px 14px; background:var(--bar);
  border-bottom:1px solid var(--line)}
.dot{width:11px; height:11px; border-radius:50%}
.dot.r{background:#e0635a}.dot.y{background:#e3b341}.dot.g{background:#5aa469}
.bar .t{margin-left:8px; color:var(--muted); font-size:12.5px}
.body{padding:26px 24px 30px}
.prompt{color:var(--accent); font-size:13px; margin-bottom:6px; font-weight:600}
.prompt::before{content:"$ "}
h1{font-size:25px; font-weight:700; letter-spacing:-.3px; margin-bottom:6px}
h1 .c{color:var(--accent)}
.lede{color:var(--muted); font-size:13px; margin-bottom:22px}
.lede b{color:var(--ink)}
.notice{display:flex; gap:11px; align-items:flex-start; background:var(--panel2);
  border-left:3px solid var(--accent); border-radius:0 7px 7px 0;
  padding:13px 15px; margin-bottom:22px; font-size:13px}
.notice b{color:var(--accent-ink)}
.drop{display:flex; flex-direction:column; align-items:center;
  border:1.5px dashed var(--line); border-radius:9px; background:var(--panel2);
  padding:36px 20px; text-align:center; cursor:pointer; color:var(--muted); transition:.16s}
.drop:hover{border-color:var(--accent)}
.drop.over{border-color:var(--accent); background:#f6ead9}
.drop.has{border-style:solid; border-color:var(--ok); color:var(--ink)}
.drop .ic{font-size:24px; color:var(--accent); display:block; margin-bottom:10px}
.drop .hint{font-size:11.5px; margin-top:6px; color:var(--muted)}
.consent{display:flex; gap:9px; align-items:center; margin:20px 0; font-size:13px; color:var(--ink)}
.consent input{width:16px; height:16px; accent-color:var(--accent)}
button{width:100%; padding:13px; border:1px solid var(--accent); border-radius:8px; cursor:pointer;
  background:transparent; color:var(--accent); font:700 14px ui-monospace,monospace;
  letter-spacing:.05em; transition:.15s}
button:hover:not(:disabled){background:var(--accent); color:#fff}
button:disabled{border-color:var(--line); color:#bcb4a4; cursor:not-allowed}
.msg{margin-top:15px; font-size:12.5px; white-space:pre}
.msg.ok{color:var(--ok)} .msg.err{color:var(--err)} .msg.run{color:var(--muted)}
.report{margin-top:24px; border-top:1px dashed var(--line); padding-top:20px; display:none}
.report.show{display:block; animation:fade .35s ease}
@keyframes fade{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
.report .h{color:var(--accent); font-size:12px; margin-bottom:14px; font-weight:600}
.report .h::before{content:"> "}
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:16px}
.stat{background:var(--panel2); border:1px solid var(--line); border-radius:7px; padding:13px 8px; text-align:center}
.stat .n{font-size:23px; font-weight:700; line-height:1}
.stat .k{font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:7px}
.stat.w .n{color:var(--warn)} .stat.d .n{color:var(--muted)} .stat.g .n{color:var(--ok)}
table{width:100%; border-collapse:collapse; font-size:12.5px}
th,td{text-align:left; padding:7px 9px; border-bottom:1px solid var(--line)}
th{color:var(--muted); font-weight:700; font-size:11px; letter-spacing:.05em}
td .badge{color:var(--warn)}