/* crash-common.css — shared look for the crash-log viewers (IPS + tombstone) */
:root{
  --bg:#F3F5F7; --surface:#FFFFFF; --surface2:#EAEEF2; --surface3:#E2E8ED;
  --ink:#16212B; --muted:#5C6C79; --faint:#5F7280; --line:#D9E1E8; --line2:#C7D2DA;
  --accent:#0E7490; --accent-ink:#0B5E75; --accent-bg:#E3F1F5;
  --crash:#C22F2F; --crash-ink:#A32323; --crash-bg:#F9E9E9;
  --warn:#9A5B00; --warn-bg:#F8EFDD;
  --chip:#EDF1F4; --code-bg:#F0F3F6; --flash:#FFE9A8;
  --shadow:0 1px 2px rgba(22,33,43,.06),0 4px 14px rgba(22,33,43,.05);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0D1317; --surface:#141C22; --surface2:#1B242C; --surface3:#212C35;
    --ink:#E3EBF1; --muted:#8DA0AE; --faint:#8296A4; --line:#263340; --line2:#31414F;
    --accent:#52C5DF; --accent-ink:#7DD6E9; --accent-bg:#12333D;
    --crash:#F17B7B; --crash-ink:#F49B9B; --crash-bg:#3A1D1D;
    --warn:#E8A33D; --warn-bg:#332813;
    --chip:#1D2831; --code-bg:#101820; --flash:#5C4A14;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 4px 14px rgba(0,0,0,.3);
  }
}
:root[data-theme="dark"]{
  --bg:#0D1317; --surface:#141C22; --surface2:#1B242C; --surface3:#212C35;
  --ink:#E3EBF1; --muted:#8DA0AE; --faint:#8296A4; --line:#263340; --line2:#31414F;
  --accent:#52C5DF; --accent-ink:#7DD6E9; --accent-bg:#12333D;
  --crash:#F17B7B; --crash-ink:#F49B9B; --crash-bg:#3A1D1D;
  --warn:#E8A33D; --warn-bg:#332813;
  --chip:#1D2831; --code-bg:#101820; --flash:#5C4A14;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 4px 14px rgba(0,0,0,.3);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.55 "IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased}
.mono{font-family:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace}
button{font:inherit;color:inherit}
h1,h2,h3{margin:0;text-wrap:balance}

/* ---------- chrome ---------- */
#topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;
  padding:9px 20px;background:var(--surface);border-bottom:1px solid var(--line)}
#topbar .brand{font-weight:700;font-size:15px;letter-spacing:.01em;white-space:nowrap}
#topbar .brand .dot{color:var(--accent)}
#topbar .homelink{display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--muted);
  font-size:13px;font-weight:500;padding:5px 10px;border:1px solid var(--line2);border-radius:7px;
  background:var(--surface2);white-space:nowrap;flex-shrink:0}
#topbar .homelink:hover{background:var(--surface3);color:var(--ink)}
#topbar .homelink:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#fileMeta{display:flex;align-items:center;gap:8px;min-width:0;flex:1;font-size:13px;color:var(--muted)}
#fileMeta .fname{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12.5px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#topbar .controls{display:flex;align-items:center;gap:8px;flex-shrink:0}
.btn{border:1px solid var(--line2);background:var(--surface2);border-radius:7px;
  padding:5px 11px;font-size:13px;font-weight:500;cursor:pointer}
.btn:hover{background:var(--surface3)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
:root[data-theme="dark"] .btn.primary{color:#08222B}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .btn.primary{color:#08222B}}
.seg{display:flex;border:1px solid var(--line2);border-radius:7px;overflow:hidden}
.seg button{border:0;background:var(--surface2);padding:5px 11px;font-size:12.5px;cursor:pointer;
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace}
.seg button.on{background:var(--accent);color:#fff;font-weight:600}
:root[data-theme="dark"] .seg button.on{color:#08222B}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .seg button.on{color:#08222B}}
.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
#sectionNav{position:sticky;top:var(--topbar-h,52px);z-index:29;display:flex;gap:6px;flex-wrap:wrap;
  padding:8px 20px;background:var(--bg);border-bottom:1px solid var(--line)}
#sectionNav a{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;
  font-size:13px;font-weight:500;color:var(--muted);text-decoration:none;border:1px solid transparent}
#sectionNav a:hover{color:var(--ink);background:var(--chip)}
#sectionNav a.active{color:var(--accent-ink);background:var(--accent-bg);border-color:var(--accent);font-weight:600}
#sectionNav a .n{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:11px;color:var(--faint)}
#sectionNav a.active .n{color:var(--accent-ink)}

main{max-width:1160px;margin:0 auto;padding:22px 20px 90px;display:flex;flex-direction:column;gap:16px}
section{scroll-margin-top:calc(var(--chrome-h,108px) + 10px)}

/* ---------- panels ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
details.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
details.panel>summary{display:flex;align-items:center;gap:10px;padding:13px 18px;cursor:pointer;
  list-style:none;user-select:none;border-radius:12px}
details.panel>summary::-webkit-details-marker{display:none}
details.panel>summary::before{content:"";width:8px;height:8px;flex-shrink:0;
  border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);
  transform:rotate(-45deg);transition:transform .15s;margin-right:2px}
details.panel[open]>summary::before{transform:rotate(45deg)}
details.panel>summary h2{font-size:16px;font-weight:600}
details.panel>.body{padding:4px 18px 18px;border-top:1px solid var(--line)}
.count{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12px;color:var(--muted);
  background:var(--chip);border-radius:999px;padding:1px 9px}
.label{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--faint)}

/* ---------- badges & chips ---------- */
.badge{display:inline-flex;align-items:center;gap:5px;padding:1px 9px;border-radius:999px;
  font-size:11.5px;font-weight:600;letter-spacing:.03em;white-space:nowrap}
.b-crash{background:var(--crash-bg);color:var(--crash-ink)}
.b-warn{background:var(--warn-bg);color:var(--warn)}
.b-accent{background:var(--accent-bg);color:var(--accent-ink)}
.b-dim{background:var(--chip);color:var(--muted)}
.chip{display:inline-flex;align-items:center;padding:1px 8px;border-radius:6px;background:var(--chip);
  font-size:12px;color:var(--muted);border:0;cursor:pointer;
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace}
button.chip:hover{background:var(--surface3);color:var(--ink)}

/* ---------- hero ---------- */
#hero{padding:20px 22px;display:flex;flex-direction:column;gap:14px}
#hero .toprow{display:flex;flex-wrap:wrap;gap:14px;align-items:baseline}
#hero .appname{font-size:23px;font-weight:700}
#hero .bundle{font-size:13px;color:var(--muted)}
#hero .chips{display:flex;flex-wrap:wrap;gap:7px}
#hero .chips .chip{cursor:default}
.verdict{display:flex;flex-direction:column;gap:6px;padding:13px 16px;border-radius:9px;
  background:var(--crash-bg);border-left:4px solid var(--crash)}
.verdict .vline1{font-weight:600;font-size:15px;color:var(--crash-ink)}
.verdict .vline2{font-size:13.5px;color:var(--ink)}
.verdict .vline2 a,.linklike{color:var(--accent-ink);text-decoration:underline;text-decoration-style:dotted;
  cursor:pointer;background:none;border:0;padding:0;font:inherit}
.banner{display:flex;gap:10px;align-items:baseline;padding:10px 16px;border-radius:9px;
  background:var(--warn-bg);border-left:4px solid var(--warn);font-size:13.5px}
.banner b{color:var(--warn)}
.samplenote{font-size:13px;color:var(--muted);display:flex;gap:8px;align-items:baseline}
.errcard{padding:16px 20px;border-left:4px solid var(--crash);display:flex;flex-direction:column;gap:6px}
.errcard .et{font-weight:600;color:var(--crash-ink)}

/* ---------- key/value ---------- */
.kvgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:14px;padding-top:12px}
.kvblock{background:var(--surface2);border-radius:9px;padding:12px 14px}
.kvblock .label{display:block;margin-bottom:8px}
.kv{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:3px 14px;font-size:13px}
.kv dt{color:var(--muted);margin:0}
.kv dd{margin:0;overflow-wrap:anywhere;font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12.5px}

/* ---------- copyable ---------- */
[data-copy]{cursor:pointer;border-bottom:1px dotted var(--line2)}
[data-copy]:hover{border-bottom-color:var(--accent);color:var(--accent-ink)}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:60;
  background:var(--ink);color:var(--bg);padding:7px 16px;border-radius:8px;font-size:13px;
  opacity:0;pointer-events:none;transition:opacity .2s}
#toast.show{opacity:1}

/* ---------- toolbars & thread cards ---------- */
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 0 10px}
.toolbar input[type=search],.toolbar select{border:1px solid var(--line2);background:var(--surface2);
  color:var(--ink);border-radius:7px;padding:5px 10px;font:13px "IBM Plex Sans",system-ui,sans-serif;min-width:220px}
.toolbar select{min-width:0}
.toolbar .hint{font-size:12px;color:var(--faint)}
details.thread{border:1px solid var(--line);border-radius:10px;background:var(--surface);margin-bottom:10px}
details.thread>summary{display:flex;align-items:center;gap:10px;padding:9px 14px;cursor:pointer;
  list-style:none;flex-wrap:wrap;border-radius:10px}
details.thread>summary::-webkit-details-marker{display:none}
details.thread>summary::before{content:"";width:7px;height:7px;flex-shrink:0;
  border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);transform:rotate(-45deg);transition:transform .15s}
details.thread[open]>summary::before{transform:rotate(45deg)}
details.thread.crashed{border-color:var(--crash);border-width:1px}
details.thread.crashed>summary{background:var(--crash-bg);border-radius:10px 10px 0 0}
details.thread:not([open]).crashed>summary{border-radius:10px}
.tidx{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-weight:600;font-size:13px;min-width:72px}
.tlabel{font-size:13.5px;font-weight:500;overflow-wrap:anywhere}
.tid{font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12px;color:var(--faint)}
.tchips{display:flex;gap:5px;flex-wrap:wrap;margin-left:auto}
details.thread>.tbody{padding:12px 14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px}

/* ---------- frames ---------- */
.scrollwrap{overflow-x:auto}
.frames{min-width:880px;display:flex;flex-direction:column;
  font-family:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:12.5px}
.fhead,.frame{display:grid;grid-template-columns:4ch 24ch 19ch minmax(30ch,1fr) 12ch;gap:0 14px;
  padding:3px 8px;align-items:baseline}
.fhead{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:11px;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;color:var(--faint);border-bottom:1px solid var(--line)}
.frame{border-left:3px solid transparent;border-radius:3px}
.frame:nth-child(even){background:var(--surface2)}
.frame.o-app{border-left-color:var(--accent)}
.frame.o-bundled{border-left-color:var(--line2)}
.frame.o-injected{border-left-color:var(--warn);background:var(--warn-bg)}
.frame .fnum{text-align:right;color:var(--faint)}
.frame .fimg{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.frame .fimg button{background:none;border:0;padding:0;font:inherit;cursor:pointer;color:var(--accent-ink)}
.frame .fimg button:hover{text-decoration:underline}
.frame .fimg .unk{color:var(--faint)}
.frame .faddr{white-space:nowrap}
.frame .fdet{overflow-wrap:anywhere;padding-left:2ch;text-indent:-2ch}
.frame .fdet .noSym{color:var(--faint)}
.frame .foff{text-align:right;color:var(--muted);white-space:nowrap}
.frame.crashframe{background:var(--crash-bg);border-left-color:var(--crash)}
.frame.dim{opacity:.35}
.frame.flash,.imgrow.flash{animation:flashbg 1.6s ease-out}
@keyframes flashbg{0%,40%{background-color:var(--flash)}100%{}}

/* ---------- registers & sub-panels ---------- */
details.sub{border:1px solid var(--line);border-radius:9px;background:var(--surface)}
details.sub>summary{display:flex;align-items:center;gap:8px;padding:7px 12px;cursor:pointer;list-style:none;
  font-size:13px;font-weight:600}
details.sub>summary::-webkit-details-marker{display:none}
details.sub>summary::before{content:"";width:6px;height:6px;border-right:2px solid var(--faint);
  border-bottom:2px solid var(--faint);transform:rotate(-45deg);transition:transform .15s;flex-shrink:0}
details.sub[open]>summary::before{transform:rotate(45deg)}
details.sub>.body{padding:10px 12px;border-top:1px solid var(--line)}
.reggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:7px}
.reg{background:var(--code-bg);border-radius:7px;padding:6px 9px;
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12px}
.reg .rname{color:var(--faint);font-weight:600;margin-right:8px}
.reg .rann{display:block;font-size:11px;color:var(--muted);margin-top:2px;overflow-wrap:anywhere}
.reg.pcreg{outline:1.5px solid var(--crash)}
.regcaption{font-size:11.5px;color:var(--faint);margin:0 0 8px}
pre.hexdump,pre.blob{background:var(--code-bg);border-radius:8px;padding:12px 14px;overflow-x:auto;
  font:12px/1.6 "IBM Plex Mono",ui-monospace,Menlo,monospace;margin:0;white-space:pre}

/* ---------- data tables ---------- */
table.imgs{border-collapse:collapse;width:100%;min-width:1020px;font-size:12.5px}
table.imgs th{font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--faint);
  text-align:left;padding:6px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
table.imgs td{padding:4px 10px;border-bottom:1px solid var(--line);vertical-align:baseline;
  font-family:"IBM Plex Mono",ui-monospace,Menlo,monospace;font-size:12px}
table.imgs td.sans{font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:12.5px}
table.imgs tr:hover td{background:var(--surface2)}
table.imgs td.path{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
table.imgs td.num{text-align:right}
.imgname{font-weight:600}
tr.faultrow td{background:var(--crash-bg)}

/* ---------- misc ---------- */
.subhead{font-size:13px;font-weight:600;margin:10px 0 6px}
ul.plain{margin:4px 0;padding-left:20px;font-size:13px}
ul.plain li{margin:2px 0}
.note{font-size:13px;color:var(--muted)}
#dropOverlay{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--bg) 75%,transparent);backdrop-filter:blur(2px);
  border:3px dashed var(--accent);font-size:20px;font-weight:600;color:var(--accent-ink)}
#dropOverlay.on{display:flex}

/* empty state — shown before any file is opened */
.emptystate{min-height:55vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:12px;color:var(--muted);padding:48px 24px}
.emptystate .es-ic{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;
  background:var(--surface2);border:1px solid var(--line);color:var(--accent-ink)}
.emptystate .es-ic svg{width:26px;height:26px;display:block}
.emptystate .es-t{font-size:17px;font-weight:600;color:var(--ink)}
.emptystate .es-h{font-size:13.5px;max-width:52ch;line-height:1.55}
.emptystate .es-h b{color:var(--ink);font-weight:600}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion: reduce){
  *{scroll-behavior:auto!important;transition:none!important}
  .frame.flash,.imgrow.flash{animation:none;background-color:var(--flash)}
  .imgrow.flash td{background-color:var(--flash)}
}
@media (max-width:760px){
  #topbar{flex-wrap:wrap}
  #topbar .controls{flex-wrap:wrap}
  #fileMeta{order:3;width:100%}
  #hero .appname{font-size:19px}
}