:root {
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#202924;
  background:#fbfcfa;
  font-size:14px;
  line-height:1.55;
}
* {
  box-sizing:border-box;
}
body {
  margin:0;
}
a {
  color:#235e43;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}
header {
  display:flex;
  align-items:center;
  gap:28px;
  padding:18px 32px;
  border-bottom:1px solid #dce3dd;
  background:#fff;
}
.brand {
  font-size:18px;
  color:#26372c;
  white-space:nowrap;
}
nav {
  display:flex;
  gap:8px;
  flex:1;
  flex-wrap:wrap;
}
nav a {
  padding:5px 10px;
  border-radius:4px;
  color:#526158;
}
nav a[aria-current] {
  background:#e7f1e9;
  color:#18452d;
}
main {
  max-width:1250px;
  margin:38px auto;
  padding:0 32px;
  min-height:70vh;
}
h1 {
  font-size:30px;
  line-height:1.25;
  letter-spacing:-.7px;
  font-weight:600;
  margin:8px 0 18px;
}
h2 {
  font-size:17px;
  margin:28px 0 12px;
}
h3 {
  font-size:14px;
}
.eyebrow {
  font-size:11px;
  letter-spacing:1.6px;
  font-weight:650;
  color:#68746b;
}
.muted,small {
  color:#647068;
}
small {
  display:block;
  font-size:12px;
  overflow-wrap:anywhere;
}
.heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
}
.error-title {
  font-size:25px;
  overflow-wrap:anywhere;
}
.filters,.inline {
  display:flex;
  gap:12px;
  align-items:end;
  flex-wrap:wrap;
  margin:24px 0;
}
.filters label {
  flex:1;
}
label {
  display:block;
  font-size:12px;
  color:#57635b;
}
input,select,textarea {
  display:block;
  border:1px solid #c9d3cb;
  background:#fff;
  border-radius:5px;
  min-height:38px;
  padding:8px 10px;
  font:inherit;
  color:#27362b;
  margin-top:5px;
  width:100%;
}
input:focus,select:focus,textarea:focus,button:focus {
  outline:2px solid #65a580;
  outline-offset:2px;
}
button {
  background:#285d40;
  border:1px solid #285d40;
  color:white;
  border-radius:5px;
  padding:8px 16px;
  min-height:38px;
  cursor:pointer;
  font:inherit;
}
button:hover {
  filter:brightness(.95);
}
button.secondary {
  background:#fff;
  color:#31573c;
  border-color:#c3cec6;
}
.quiet {
  background:transparent;
  color:#5a695f;
  border:none;
}
.table-wrap {
  overflow-x:auto;
}
table {
  width:100%;
  border-collapse:collapse;
  background:#fff;
}
th {
  text-align:left;
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.7px;
  color:#6b766f;
  padding:12px 14px;
  border-bottom:1px solid #cfd8d1;
}
td {
  padding:18px 14px;
  border-bottom:1px solid #e1e7e2;
  vertical-align:top;
}
td:first-child {
  width:60%;
  min-width:240px;
  max-width:650px;
}
.issue-title {
  display:block;
  font-weight:550;
  color:#2d3c30;
  overflow-wrap:anywhere;
  margin-bottom:5px;
}
.date {
  font-size:12px;
  white-space:nowrap;
}
.badge {
  font-size:11px;
  border-radius:4px;
  padding:4px 9px;
  white-space:nowrap;
  background:#ecefed;
}
.badge.open {
  color:#a63a2d;
  background:#fff0ea;
}
.badge.resolved {
  color:#28613b;
  background:#e6f2e9;
}
.badge.muted {
  color:#665a35;
  background:#f4efdf;
}
.empty {
  padding:44px 20px;
  text-align:center;
  color:#6b776e;
  background:#f1f5f0;
  border-radius:5px;
}
.notice {
  background:#ecf2e6;
  border-left:3px solid #829565;
  padding:12px 16px;
}
.facts {
  display:flex;
  gap:40px;
  padding:20px 0;
  margin:18px 0;
  border-top:1px solid #dbe3dc;
  border-bottom:1px solid #dbe3dc;
}
.facts strong {
  font-size:22px;
}
.facts span {
  display:block;
  margin-top:6px;
}
.detail-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:36px;
}
.detail-grid h2 {
  margin-top:10px;
}
aside {
  border-left:1px solid #dce3dd;
  padding-left:24px;
}
.frame {
  border:1px solid #dae2db;
  margin-bottom:6px;
  background:#fff;
  border-radius:4px;
}
.frame summary {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:12px;
  cursor:pointer;
  overflow-wrap:anywhere;
}
.frame summary code {
  font-size:11px;
  color:#6b766e;
}
.frame[open] summary {
  border-bottom:1px solid #e1e8e2;
  background:#f1f6f0;
}
.context {
  margin:0;
  padding:2px 12px;
  border:0;
  border-radius:0;
}
.current {
  background:#f4efce;
}
.dim {
  color:#869084;
}
.locals {
  margin:12px;
}
.exception {
  overflow-wrap:anywhere;
}
pre {
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font-size:12px;
  background:#f0f4ef;
  padding:16px;
  border:1px solid #dee6df;
  border-radius:5px;
  max-height:600px;
  overflow:auto;
}
code {
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
details {
  margin:12px 0;
}
summary {
  cursor:pointer;
}
.event-list {
  list-style:none;
  padding:0;
  font-size:12px;
}
.event-list li {
  padding:10px 0;
  border-bottom:1px solid #e0e6df;
}
.event-list small {
  font-size:10px;
}
.project-list {
  max-width:800px;
  margin:28px 0;
}
.project-row {
  display:flex;
  justify-content:space-between;
  padding:20px 0;
  border-bottom:1px solid #dbe3dd;
}
.project-row span {
  color:#718076;
}
.create {
  border-top:1px solid #d5dfd6;
  margin-top:40px;
  padding-top:10px;
}
.create form {
  max-width:650px;
}
.check {
  display:flex;
  align-items:center;
  gap:10px;
  margin:18px 0;
}
.check input {
  width:auto;
  min-height:initial;
}
.login {
  max-width:450px;
  margin-top:100px;
}
.login form {
  margin-top:32px;
}
.login label {
  margin-bottom:16px;
}
.login button {
  width:100%;
  margin-top:10px;
}
[role=alert] {
  color:#a5372a;
}
.pagination {
  display:inline-block;
  margin-top:24px;
}
footer {
  padding:24px 32px;
  color:#89948c;
  font-size:11px;
  border-top:1px solid #e0e7e0;
}
.actions form {
  display:flex;
  gap:8px;
}
@media(max-width:800px) {
  header {
    padding:14px 18px;
    gap:12px;
    flex-wrap:wrap;
  }
  nav {
    order:3;
    width:100%;
    flex-basis:100%;
  }
  main {
    padding:0 18px;
    margin-top:26px;
  }
  .detail-grid {
    grid-template-columns:1fr;
  }
  aside {
    border-left:0;
    border-top:1px solid #dce3dd;
    padding-left:0;
    padding-top:18px;
  }
  .facts {
    gap:18px;
    flex-wrap:wrap;
  }
  .frame summary {
    display:block;
  }
  .frame summary code {
    display:block;
  }
  .heading {
    align-items:start;
  }
  h1 {
    font-size:25px;
  }
  .login {
    margin-top:50px;
  }
}

textarea { resize:vertical; min-height:80px; }
.create form label { margin:12px 0; }

.menu { position:relative; margin:0; }
.menu summary { padding:5px 10px; color:#526158; font-size:12px; }
.menu-options { position:absolute; top:100%; right:0; z-index:10; background:#fff; border:1px solid #c9d3cb; border-radius:5px; padding:8px; width:200px; box-shadow:0 6px 18px #26372c12; }
.menu-options a { display:block; padding:8px; }
.issues-page .heading { margin-bottom:22px; }
.issues-page h1 { margin:0; }
.search-row { display:flex; align-items:end; gap:12px; }
.project-field { flex:0 1 260px; min-width:0; }
.query-field { flex:1; min-width:0; }
.search-row input,.search-row select { height:42px; font-size:14px; }
.search-row button { min-height:42px; }
.filter-bar { display:flex; align-items:start; gap:20px; margin:14px 0 20px; }
.issue-filters { margin:0; flex:1; }
.issue-filters summary { width:fit-content; font-size:12px; color:#526158; padding:4px 0; }
.issue-filters .filters { margin:12px 0 0; max-width:650px; }
.clear-filters { font-size:12px; padding:4px 0; }
.issues-page .table-wrap { border:1px solid #dce3dd; border-radius:6px; }
.issues-page th { background:#f3f6f2; }
.issues-page tbody tr:last-child td { border-bottom:0; }
@media(max-width:600px) {
  .search-row { flex-wrap:wrap; gap:10px; }
  .project-field { flex:1 1 100%; }
  .query-field { flex:1 1 170px; }
  .issue-filters .filters { align-items:stretch; }
  .issue-filters .filters label { flex:1 1 100%; }
}

.issues-page td:first-child { width:52%; }
.issues-page th { white-space:nowrap; }
.numeric { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.issues-page time { text-decoration:underline dotted #b1bcb4; text-underline-offset:4px; }
.metrics-note { font-size:11px; color:#6b766f; margin:12px 0; }

.occurrence-browser { border:1px solid #dce3dd; border-radius:6px; background:#fff; padding:16px; margin:22px 0; }
.occurrence-browser > summary { font-weight:600; }
.occurrence-browser > summary span { font-weight:400; font-size:12px; }
.occurrence-search { display:flex; flex-wrap:wrap; align-items:end; gap:12px; margin-top:18px; }
.occurrence-search > label { flex:1 1 260px; }
.occurrence-options { flex-basis:100%; margin:0; font-size:12px; }
.occurrence-options .filters { margin:12px 0; }
.occurrence-scroll { max-height:340px; overflow:auto; border:1px solid #dce3dd; border-radius:4px; }
.occurrence-scroll th { position:sticky; top:0; background:#f3f6f2; white-space:nowrap; }
.occurrence-scroll td { padding:10px 12px; }
.occurrence-scroll td:first-child { width:auto; min-width:240px; }
.occurrence-scroll td:last-child { overflow-wrap:anywhere; min-width:120px; }
.selected-occurrence { background:#edf5ee; }
.occurrence-pagination { display:flex; flex-wrap:wrap; gap:20px; margin-top:14px; font-size:12px; }
#selected-occurrence { scroll-margin-top:18px; }

.event-navigation { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 16px; padding:12px 0; border-bottom:1px solid #dce3dd; }
.event-navigation strong { font-size:12px; }
.event-navigation > div { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.event-navigation a,.event-navigation span { font-size:12px; padding:5px 8px; border:1px solid #dce3dd; border-radius:4px; }
.event-navigation span { color:#929b95; }

.stack-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; scroll-margin-top:16px; }
.stack-heading h2 { margin:0; }
.stack-toggle { display:flex; border:1px solid #c9d3cb; border-radius:5px; overflow:hidden; }
.stack-toggle a { padding:6px 12px; font-size:12px; background:#fff; }
.stack-toggle a + a { border-left:1px solid #c9d3cb; }
.stack-toggle a[aria-current] { background:#e7f1e9; font-weight:600; }
.stack-help,.stack-count { color:#6b766f; font-size:11px; margin:12px 0; }
.stack-event { margin:12px 0; }
.stack-frames { border:1px solid #d5dfd7; border-radius:6px; overflow:hidden; margin:12px 0 24px; }
.stack-frame { border:0; border-bottom:1px solid #dce3dd; margin:0; border-radius:0; }
.stack-frame:last-child { border-bottom:0; }
.stack-frame summary { background:#f5f7f4; font-size:12px; align-items:center; }
.stack-frame summary code { color:#4f5c53; }
.stack-frame .frame-labels { display:flex; gap:5px; flex-shrink:0; }
.focus-frame > summary { background:#eaf3eb; }
.frame-group { margin:0; border-bottom:1px solid #dce3dd; }
.frame-group > summary { padding:12px; font-size:12px; background:#f0f2f0; color:#68736b; }
.frame-group > summary small { font-size:11px; margin-top:4px; }
.source-code { padding:8px 0; overflow-x:auto; background:#fff; }
.source-row { display:flex; min-width:100%; width:max-content; font:12px/1.8 ui-monospace,monospace; }
.source-row pre { margin:0; padding:0 14px 0 0; border:0; border-radius:0; white-space:pre; background:none; font:inherit; overflow:visible; max-height:none; }
.line-number { flex:0 0 54px; text-align:right; padding-right:16px; color:#859088; user-select:none; }
.no-source { padding:0 12px; font-size:12px; color:#6b766f; }
@media(max-width:600px) { .stack-frame summary { display:block; } .stack-frame .frame-labels { margin-top:8px; } }
/* Long source lines scroll within the frame instead of widening mobile grids. */
.detail-grid > section { min-width:0; }
.stack-frames,.source-code { max-width:100%; min-width:0; }
