:root{--hx-ink: #11151c;--hx-muted: #596274;--hx-surface: #ffffff;--hx-panel: #f4f7fb;--hx-line: #dde3ed;--hx-accent: #0f766e;--hx-accent-dark: #0b544e;--hx-accent-soft: #dcf2ef;--hx-warn: #92400e;--hx-warn-soft: #fdf3d7;--hx-bad: #a8231a;--hx-bad-soft: #fde8e6;--hx-radius: 12px;--hx-shadow: 0 10px 30px rgba(17,21,28,0.07);--hx-focus: 0 0 0 3px rgba(15,118,110,0.28);--hx-mono: ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;--primary: var(--hx-accent);--primary-dark: var(--hx-accent-dark);--border: var(--hx-line);--surface: var(--hx-surface);--shadow-soft: var(--hx-shadow);--surface-muted: var(--hx-panel);--text-main: var(--hx-ink);--text-muted: var(--hx-muted);}
.hxt-tool{background: var(--hx-surface);border: 1px solid var(--hx-line);border-radius: var(--hx-radius);box-shadow: var(--hx-shadow);color: var(--hx-ink);overflow: hidden;}
.hxt-tool [hidden]{display: none !important;}
.hxt-byline{display: flex;flex-wrap: wrap;justify-content: space-between;gap: 0.3rem 1rem;padding: 0.6rem 1.1rem;background: var(--hx-panel);border-bottom: 1px solid var(--hx-line);font-size: 0.85rem;color: var(--hx-muted);}
.hxt-byline-author{font-weight: 600;color: var(--hx-ink);}
.hxt-byline .author-link{color: var(--hx-accent);text-decoration: none;}
.hxt-byline .author-link:hover{text-decoration: underline;}
.hxt-rail{display: flex;flex-wrap: wrap;align-items: flex-end;gap: 0.85rem 1.1rem;padding: 1rem 1.1rem;border-bottom: 1px solid var(--hx-line);}
.hxt-field{display: flex;flex-direction: column;gap: 0.3rem;min-width: 0;flex: 1 1 190px;}
.hxt-field > span{font-size: 0.78rem;font-weight: 700;letter-spacing: 0.04em;text-transform: uppercase;color: var(--hx-muted);}
.hxt-select,.hxt-input{width: 100%;padding: 0.5rem 0.6rem;border: 1px solid var(--hx-line);border-radius: 8px;background: var(--hx-surface);color: var(--hx-ink);font: inherit;font-size: 0.93rem;}
.hxt-select:focus,.hxt-input:focus,.hxt-box:focus,.hxt-btn:focus-visible{outline: none;box-shadow: var(--hx-focus);}
.hxt-toggles{display: flex;flex-wrap: wrap;gap: 0.4rem 1rem;flex: 1 1 100%;}
.hxt-check{display: inline-flex;align-items: center;gap: 0.4rem;font-size: 0.9rem;color: var(--hx-ink);cursor: pointer;}
.hxt-check input{accent-color: var(--hx-accent);width: 1rem;height: 1rem;}
.hxt-check code{font-family: var(--hx-mono);font-size: 0.84rem;background: var(--hx-panel);border: 1px solid var(--hx-line);border-radius: 5px;padding: 0 0.3rem;color: var(--hx-accent-dark);}
.hxt-stage{padding: 1.1rem;display: grid;gap: 0.9rem;}
.hxt-head{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;gap: 0.5rem 0.75rem;}
.hxt-label{font-size: 0.95rem;font-weight: 700;margin: 0;color: var(--hx-ink);}
.hxt-row{display: flex;flex-wrap: wrap;gap: 0.5rem;}
.hxt-btn{appearance: none;border: 1px solid var(--hx-line);background: var(--hx-surface);color: var(--hx-ink);border-radius: 8px;padding: 0.4rem 0.8rem;font-size: 0.88rem;font-weight: 600;cursor: pointer;transition: background 0.15s ease,border-color 0.15s ease,color 0.15s ease;}
.hxt-btn:hover:not(:disabled){border-color: var(--hx-accent);color: var(--hx-accent-dark);}
.hxt-btn:disabled{opacity: 0.5;cursor: not-allowed;}
.hxt-btn.is-main{background: var(--hx-accent);border-color: var(--hx-accent);color: #ffffff;}
.hxt-btn.is-main:hover:not(:disabled){background: var(--hx-accent-dark);border-color: var(--hx-accent-dark);color: #ffffff;}
.hxt-box{width: 100%;min-height: 150px;padding: 0.75rem 0.85rem;border: 1px solid var(--hx-line);border-radius: 10px;background: var(--hx-panel);color: var(--hx-ink);font-family: var(--hx-mono);font-size: 0.92rem;line-height: 1.6;resize: vertical;}
.hxt-box.is-text{font-family: inherit;font-size: 0.98rem;}
.hxt-readout{display: flex;flex-wrap: wrap;gap: 0.5rem;align-items: center;padding: 0.7rem 0.85rem;background: var(--hx-accent-soft);border: 1px solid var(--hx-line);border-radius: 10px;}
.hxt-tag{display: inline-flex;align-items: baseline;gap: 0.35rem;font-size: 0.86rem;color: var(--hx-ink);background: var(--hx-surface);border: 1px solid var(--hx-line);border-radius: 999px;padding: 0.2rem 0.65rem;}
.hxt-tag b{font-family: var(--hx-mono);font-size: 0.9rem;}
.hxt-note{margin: 0;font-size: 0.88rem;line-height: 1.55;padding: 0.6rem 0.8rem;border-radius: 10px;border: 1px solid var(--hx-line);background: var(--hx-warn-soft);color: var(--hx-warn);}
.hxt-note.is-bad{background: var(--hx-bad-soft);color: var(--hx-bad);}
.hxt-note code{font-family: var(--hx-mono);background: rgba(255,255,255,0.65);border-radius: 4px;padding: 0 0.25rem;}
.hxt-status{margin: 0;min-height: 1.2rem;font-size: 0.86rem;color: var(--hx-accent-dark);}
.hxt-insp{border: 1px solid var(--hx-line);border-radius: 10px;background: var(--hx-surface);}
.hxt-insp > summary{cursor: pointer;padding: 0.6rem 0.85rem;font-weight: 700;font-size: 0.92rem;color: var(--hx-ink);}
.hxt-insp > summary:focus-visible{outline: none;box-shadow: var(--hx-focus);border-radius: 10px;}
.hxt-insp-body{padding: 0 0.85rem 0.85rem;}
.hxt-scroll{overflow-x: auto;max-height: 320px;overflow-y: auto;border: 1px solid var(--hx-line);border-radius: 8px;}
.hxt-grid-table{width: 100%;border-collapse: collapse;font-family: var(--hx-mono);font-size: 0.85rem;}
.hxt-grid-table th,.hxt-grid-table td{padding: 0.35rem 0.55rem;border-bottom: 1px solid var(--hx-line);text-align: left;white-space: nowrap;}
.hxt-grid-table thead th{position: sticky;top: 0;background: var(--hx-panel);font-size: 0.78rem;letter-spacing: 0.03em;text-transform: uppercase;z-index: 1;}
.hxt-grid-table tbody tr:hover{background: var(--hx-accent-soft);}
.hxt-grid-table .is-ctrl{color: var(--hx-warn);}
.hxt-grid-table .is-bad{color: var(--hx-bad);background: var(--hx-bad-soft);}
.hxt-glyph{font-family: inherit;font-size: 1rem;}
.hxt-article{margin: 2.5rem 0 1rem;color: var(--hx-ink);}
.hxt-article h2{font-size: 1.55rem;font-weight: 700;margin: 2.2rem 0 0.75rem;line-height: 1.3;}
.hxt-article h3{font-size: 1.15rem;font-weight: 700;margin: 1.5rem 0 0.5rem;}
.hxt-article p,.hxt-article li{font-size: 1rem;line-height: 1.72;color: #2b3443;}
.hxt-article ul,.hxt-article ol{padding-left: 1.3rem;}
.hxt-article li{margin-bottom: 0.45rem;}
.hxt-article code{font-family: var(--hx-mono);font-size: 0.9em;background: var(--hx-panel);border: 1px solid var(--hx-line);border-radius: 5px;padding: 0.05rem 0.32rem;color: var(--hx-accent-dark);}
.hxt-article a{color: var(--hx-accent-dark);font-weight: 600;}
.hxt-code{background: #0f172a;color: #e2e8f0;border-radius: 10px;padding: 0.9rem 1rem;overflow-x: auto;font-family: var(--hx-mono);font-size: 0.88rem;line-height: 1.6;margin: 0.6rem 0 0.9rem;}
.hxt-code code{background: none;border: none;color: inherit;padding: 0;}
.hxt-table{width: 100%;border-collapse: collapse;font-size: 0.94rem;}
.hxt-table caption{caption-side: bottom;padding-top: 0.5rem;font-size: 0.85rem;color: var(--hx-muted);text-align: left;}
.hxt-table th,.hxt-table td{padding: 0.55rem 0.7rem;border: 1px solid var(--hx-line);text-align: left;vertical-align: top;}
.hxt-table thead th{background: var(--hx-panel);font-weight: 700;}
.hxt-table .is-bad{color: var(--hx-bad);}
.hxt-table .is-good{color: var(--hx-accent-dark);}
.hxt-wrap{overflow-x: auto;margin: 0.6rem 0 1rem;}
.hxt-callout{border-left: 4px solid var(--hx-accent);background: var(--hx-panel);border-radius: 0 10px 10px 0;padding: 0.85rem 1rem;margin: 1rem 0;}
.hxt-callout p{margin: 0;}
@media (max-width: 860px){.hxt-article h2{font-size: 1.35rem;}}
@media (max-width: 640px){.hxt-rail{padding: 0.85rem;}.hxt-stage{padding: 0.85rem;}.hxt-field{flex: 1 1 100%;}.hxt-box{min-height: 128px;font-size: 0.88rem;}.hxt-btn{flex: 1 1 auto;}}
@media (prefers-color-scheme: dark){:root{--hx-ink: #e8edf5;--hx-muted: #9aa5b8;--hx-surface: #10151d;--hx-panel: #171e28;--hx-line: #2a3442;--hx-accent: #2dd4bf;--hx-accent-dark: #5eead4;--hx-accent-soft: #14282a;--hx-warn: #fcd34d;--hx-warn-soft: #2a2416;--hx-bad: #fda4a2;--hx-bad-soft: #2d1a19;--hx-shadow: 0 10px 30px rgba(0,0,0,0.4);}.hxt-btn.is-main{color: #06241f;}.hxt-btn.is-main:hover:not(:disabled){color: #06241f;}.hxt-article p,.hxt-article li{color: #c4cddd;}.hxt-note code{background: rgba(0,0,0,0.35);}}