.cot{--w:min(1400px, calc(100vw - 2.5rem));width:var(--w);margin:2em 0 0 calc(50% - var(--w)/2);overflow-wrap:anywhere}.cot .controls{display:flex;flex-wrap:wrap;gap:.5em 1.5ch;align-items:center;margin-bottom:.6em}.cot .controls label{color:var(--muted)}.cot #search{font:inherit;width:24ch;max-width:100%;padding:.1em .8ch;background:var(--code-bg);color:var(--fg);border:1px solid var(--muted);border-radius:0}.cot button.plain{font:inherit;padding:.1em 1ch;cursor:pointer;background:0 0;color:var(--fg);border:1px solid var(--muted);border-radius:0}.cot button.plain:hover{color:var(--accent);border-color:var(--accent)}.cot #matchCount{color:var(--muted);min-height:1.75em}.cot #crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:0 1ch;margin:0 0 .6em;min-height:1.75em;font-size:.9em}.cot #crumbs button{font:inherit;border:0;background:0 0;padding:0;cursor:pointer;text-align:left;color:var(--fg);text-decoration:underline;text-decoration-color:var(--muted);text-underline-offset:2px}.cot #crumbs button:hover{color:var(--accent);text-decoration-color:var(--accent)}.cot #crumbs button[aria-current=true]{color:var(--fg);font-weight:700;text-decoration:none;cursor:default}.cot #crumbs .sep{color:var(--muted)}.cot #graph{position:relative;width:100%;overflow:hidden}.cot .frame{position:absolute;margin:0;padding:0 3px;height:28px;font:inherit;font-size:12px;line-height:26px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1px solid var(--bg);border-radius:0;cursor:pointer;transition:left 180ms ease,width 180ms ease}.cot .frame.untrusted{background:var(--bg);color:var(--fg);border:1px dashed var(--muted)}.cot .frame.dim{background:var(--code-bg)!important;color:#9a9a9a!important;border-color:var(--rule)}.cot .frame.untrusted.dim{background:var(--bg)!important;border:1px dashed var(--muted)}.cot .frame.hidden{visibility:hidden;pointer-events:none}.cot .frame.selected{font-weight:700;text-decoration:underline}.cot .frame.match{box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px var(--bg)}.cot .frame:hover{filter:brightness(1.15)}.cot .frame:focus-visible{outline:3px solid #fff;outline-offset:-3px;box-shadow:inset 0 0 0 5px var(--bg);z-index:2}.cot button.plain:focus-visible,.cot #crumbs button:focus-visible,.cot #search:focus-visible{outline:2px solid #fff;outline-offset:2px}@media(prefers-reduced-motion:reduce){.cot .frame{transition:none}}#tooltip{position:fixed;z-index:10;display:none;pointer-events:none;max-width:min(92vw,110ch);padding:0 1ch;background:var(--fg);color:var(--bg);font-size:12px;line-height:1.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cot #legend{display:flex;flex-wrap:wrap;gap:.3em 3ch;margin:.8em 0 2em;padding:0;list-style:none;font-size:.8em;color:var(--muted)}.cot #legend li{display:flex;align-items:center;gap:1ch;margin:0}.cot .swatch{display:inline-block;width:22px;height:14px;flex:none}.cot .ramp{display:inline-flex;flex:none}.cot .ramp span{display:inline-block;width:9px;height:14px}.cot .swatch.untrusted{background:var(--bg);border:1px dashed var(--muted)}.cot .swatch.dim{background:var(--code-bg);border:1px solid var(--rule)}.cot .swatch.match{background:#9d3b3b;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px var(--bg)}.cot #details{border-top:1px dashed var(--rule);padding-top:1.2em}.cot #details h2{margin:0 0 .8em}.cot #details dl{display:grid;grid-template-columns:max-content minmax(0,100ch);gap:.4em 2ch;margin:0}.cot #details dd.tbc{font-style:italic;color:var(--muted)}.cot #details .tag{display:inline-block;margin-left:1.5ch;padding:0 1ch;font-size:.8em;font-weight:400;border:1px dashed var(--muted);color:var(--muted)}@media(max-width:600px){.cot #details dl{grid-template-columns:1fr;gap:0}.cot #details dd{margin-bottom:.8em}}