.tt-error-badge {
  position: fixed; right: max(14px, env(safe-area-inset-right)); bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 19998;
  border: 1px solid #333; border-radius: 999px; padding: 8px 12px; background: #fff; color: #242424;
  font: 600 12px/1.2 system-ui, sans-serif; box-shadow: 0 3px 14px #0002;
}
.tt-error-badge[hidden], .tt-error-backdrop[hidden] { display: none !important; }
.tt-diagnostic-trigger { position: fixed; top: 0; left: 0; right: auto; z-index: 19998; width: 30px; height: 30px; padding:0; display:grid; place-items:center; border: 1px solid #a32b2b; border-radius: 50%; background: #c84242; color: #fff; box-shadow: 0 3px 12px #0002; font: 800 19px/1 system-ui, sans-serif; cursor: grab; transition: left .18s ease, top .18s ease, box-shadow .18s ease; }
.tt-diagnostic-trigger[aria-expanded="true"] { background: #982727; }
.tt-diagnostic-trigger{touch-action:none;user-select:none;-webkit-user-select:none}
.tt-diagnostic-trigger.is-dragging { transition: none; cursor: grabbing; box-shadow: 0 7px 18px #0004; }
.tt-diagnostic-menu { position: fixed; top: calc(84px + env(safe-area-inset-top)); right: max(12px, calc((100vw - 430px) / 2 + 10px)); z-index: 19998; box-sizing: border-box; width: min(245px, calc(100vw - 24px)); padding: 12px; display: grid; gap: 8px; border: 1px solid #ddd; border-radius: 15px; background: #fff; box-shadow: 0 12px 34px #0003; color: #222; font: 12px/1.4 system-ui, sans-serif; }
.tt-diagnostic-menu[hidden], .tt-error-history[hidden] { display: none !important; }
.tt-diagnostic-menu strong { font-size: 13px; }
.tt-diagnostic-menu button { min-height: 36px; border: 1px solid #dedede; border-radius: 9px; background: #f8f8f8; text-align: left; padding: 7px 10px; color: #222; font: 600 12px/1.2 system-ui, sans-serif; }
.tt-diagnostic-menu button:first-of-type { border-color: #d1a7a7; color: #9e2828; }
.tt-diagnostic-menu small { color: #888; font-size: 10px; }
.tt-error-backdrop { position: fixed; inset: 0; z-index: 19999; display: grid; place-items: center; padding: 20px; background: #0009; }
.tt-error-backdrop.tt-error-public { background: #e9e9e8; }
.tt-error-panel { box-sizing: border-box; width: min(100%, 580px); max-height: min(82dvh, 760px); display: flex; flex-direction: column; gap: 14px; overflow: hidden; padding: 22px; border: 1px solid #333; border-radius: 22px; background: #f8f8f7; color: #202020; box-shadow: 0 20px 70px #0005; font: 14px/1.5 system-ui, sans-serif; }
.tt-error-header { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.tt-error-header small { color: #777; font-size: 10px; letter-spacing: .12em; }
.tt-error-header h2 { margin: 3px 0 0; font-size: 20px; line-height: 1.2; }
.tt-error-header button { flex: none; border: 0; background: transparent; color: #333; font-size: 28px; line-height: 1; }
.tt-error-explain { margin: 0; color: #666; font-size: 13px; }
.tt-error-history-toggle { align-self: flex-start; border: 1px solid #d3d3d3; border-radius: 9px; background: #fff; color: #303030; min-height: 32px; padding: 6px 11px; font: 600 12px/1.2 system-ui, sans-serif; }
.tt-error-history-toggle::after { content: '⌄'; margin-left: 7px; }
.tt-error-history-toggle[aria-expanded="true"]::after { content: '⌃'; }
.tt-error-history { flex: 0 1 auto; max-height: 134px; overflow: auto; display: grid; gap: 5px; padding: 5px; border: 1px solid #ddd; border-radius: 10px; background: #ededed; }
.tt-error-history-item { min-height: 32px; border: 1px solid transparent; border-radius: 7px; padding: 6px 9px; background: #fff; color: #333; text-align: left; font: 11px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; }
.tt-error-history-item[aria-current="true"] { border-color: #666; background: #f7f7f7; font-weight: 700; }
.tt-error-modes { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px; border: 1px solid #d8d8d8; border-radius: 12px; background: #eaeaea; }
.tt-error-mode { flex: 1 1 145px; min-height: 36px; border: 1px solid transparent; border-radius: 9px; padding: 7px 10px; background: transparent; color: #444; font: 600 12px/1.3 system-ui, sans-serif; cursor: pointer; }
.tt-error-mode[aria-pressed="true"] { border-color: #bcbcbc; background: #fff; color: #151515; box-shadow: 0 1px 3px #0002; }
.tt-error-mode:focus-visible, .tt-error-actions button:focus-visible, .tt-error-history button:focus-visible, .tt-error-history-toggle:focus-visible, .tt-diagnostic-trigger:focus-visible, .tt-diagnostic-menu button:focus-visible { outline: 2px solid #2962c8; outline-offset: 2px; }
.tt-error-details { min-height: 100px; margin: 0; padding: 14px; overflow: auto; border: 1px solid #ddd; border-radius: 12px; background: #fff; color: #222; white-space: pre-wrap; overflow-wrap: anywhere; user-select: text; -webkit-user-select: text; font: 12px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace; }
.tt-error-mask { display: inline-block; width: 102px; height: 11px; overflow: hidden; vertical-align: -1px; white-space: nowrap; background: repeating-linear-gradient(90deg, #111 0 11px, #fff 11px 13px); color: transparent; font-size: 0; line-height: 0; user-select: text; -webkit-user-select: text; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.tt-error-actions { display: flex; gap: 8px; }
.tt-error-actions button { min-height: 40px; border: 1px solid #333; border-radius: 10px; padding: 8px 14px; background: #fff; color: #222; font: 600 13px/1.2 system-ui, sans-serif; }
.tt-error-actions .tt-error-copy { background: #252525; color: #fff; }
@media (max-width: 480px) { .tt-error-panel { padding: 18px; max-height: 85dvh; gap: 11px; } .tt-error-mode { flex-basis: 120px; } .tt-error-actions button { flex: 1; } }
@media (min-width: 431px) { .tt-error-badge { right: max(24px, calc((100vw - 430px) / 2 + 14px)); } }