.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.xtt-workbench{--xtt-accent:var(--primary,#2563eb);--xtt-accent-soft:color-mix(in srgb,var(--xtt-accent) 14%,transparent);--xtt-rail:var(--surface-muted,var(--surface,#f1f5f9));--xtt-edge:var(--border,1px solid rgba(15,23,42,.1));--xtt-radius:16px;--xtt-radius-sm:10px;margin:0 0 2.5rem;}
.xtt-tablist{display:flex;gap:0;border-radius:var(--xtt-radius-sm);overflow:hidden;border:var(--xtt-edge);margin-bottom:.85rem;background:var(--surface,#fff);}
@media (min-width:900px){
.xtt-tablist{display:none;}
}
.xtt-tab{flex:1;padding:.65rem .75rem;font-size:.82rem;font-weight:700;border:0;background:transparent;color:var(--text-muted);cursor:pointer;transition:background .15s,color .15s;}
.xtt-tab[aria-selected="true"]{background:var(--xtt-accent-soft);color:var(--text-main,#0f172a);}
.xtt-grid{display:grid;grid-template-columns:1fr;gap:1rem;align-items:stretch;}
@media (min-width:900px){
.xtt-grid{grid-template-columns:minmax(0,0.95fr) auto minmax(0,1.2fr);gap:0;align-items:stretch;border:var(--xtt-edge);border-radius:var(--xtt-radius);overflow:hidden;background:var(--surface,#fff);box-shadow:var(--shadow-soft,0 8px 30px rgba(15,23,42,.07));}
}
.xtt-pane{display:flex;flex-direction:column;gap:.5rem;min-width:0;padding:.9rem;background:var(--surface,#fff);border:var(--xtt-edge);border-radius:var(--xtt-radius);}
@media (min-width:900px){
.xtt-pane{border:0;border-radius:0;padding:1.1rem 1rem;}
.xtt-pane--src{border-right:var(--xtt-edge);}
.xtt-pane--out{border-left:var(--xtt-edge);}
}
.xtt-pane-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.35rem .75rem;justify-content:space-between;}
.xtt-pane-eyebrow{display:block;width:100%;font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);}
.xtt-pane-title{font-size:1.35rem;font-weight:800;margin:0;line-height:1.15;color:var(--text-main,#0f172a);letter-spacing:-.02em;}
.xtt-pane-hint{font-size:.78rem;color:var(--text-muted);margin:.15rem 0 0;width:100%;max-width:42ch;}
.xtt-pane-tools{display:flex;flex-wrap:wrap;gap:.4rem;}
.xtt-tooltext{display:inline-flex;align-items:center;justify-content:center;padding:.45rem .7rem;font-size:.76rem;font-weight:700;border-radius:var(--xtt-radius-sm);border:var(--xtt-edge);background:var(--surface,#fff);color:var(--text-main,#0f172a);cursor:pointer;transition:background .15s,border-color .15s;}
.xtt-tooltext:hover{border-color:var(--xtt-accent);background:var(--xtt-accent-soft);}
.xtt-editor{width:100%;min-height:min(48vh,380px);padding:.85rem .95rem;border-radius:var(--xtt-radius-sm);border:var(--xtt-edge);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem;line-height:1.55;background:var(--surface-muted,#f8fafc);color:var(--text-main,#0f172a);resize:vertical;transition:border-color .15s,box-shadow .15s,background .15s;}
.xtt-editor:focus{outline:none;border-color:var(--xtt-accent);box-shadow:0 0 0 3px var(--xtt-accent-soft);background:var(--surface,#fff);}
.xtt-editor--readonly{background:var(--surface,#fff);}
.xtt-editor--invalid{border-color:#dc2626;}
.xtt-alert{font-size:.8rem;padding:.55rem .7rem;border-radius:var(--xtt-radius-sm);background:#fef2f2;color:#991b1b;border:1px solid #fecaca;display:none;}
.xtt-alert--show{display:block;}
.xtt-rail{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem .65rem;padding:.85rem;background:var(--xtt-rail);border:var(--xtt-edge);border-radius:var(--xtt-radius);}
@media (min-width:900px){
.xtt-rail{flex-direction:column;flex-wrap:nowrap;justify-content:center;gap:.65rem;padding:.85rem .65rem;border:0;border-radius:0;background:linear-gradient(180deg,var(--xtt-rail),var(--surface,#fff));min-width:5.5rem;}
}
.xtt-btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.68rem 1rem;font-size:.85rem;font-weight:700;border-radius:var(--xtt-radius-sm);border:0;cursor:pointer;transition:transform .12s,box-shadow .15s,background .15s;}
.xtt-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.xtt-btn--main{width:100%;background:var(--xtt-accent);color:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--xtt-accent) 35%,transparent);}
@media (min-width:900px){
.xtt-btn--main{width:100%;min-width:7rem;padding:.72rem .85rem;}
}
.xtt-btn--main:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px);}
.xtt-btn--minor{flex:1;background:var(--surface,#fff);color:var(--text-main,#0f172a);border:var(--xtt-edge);font-weight:600;font-size:.8rem;padding:.55rem .75rem;}
@media (min-width:900px){
.xtt-btn--minor{flex:0;width:100%;}
}
.xtt-btn--minor:hover{background:var(--xtt-accent-soft);border-color:var(--xtt-accent);}
.xtt-btn--ok{animation:xtt-pulse .5s ease;}
@keyframes xtt-pulse{0%{filter:brightness(1);}50%{filter:brightness(1.12);}100%{filter:brightness(1);}}
.xtt-spinner{width:1.25rem;height:1.25rem;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:xtt-spin .7s linear infinite;}
@media (min-width:900px){
.xtt-spinner{border-color:rgba(15,23,42,.12);border-top-color:var(--xtt-accent);}
}
@keyframes xtt-spin{to{transform:rotate(360deg);}}
.xtt-ico-check{display:inline-block;width:.65em;height:.65em;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translateY(-.05em);margin-right:.15em;}
.xtt-article{margin-top:2.5rem;padding-top:2rem;border-top:var(--xtt-edge);color:var(--text-main,#0f172a);}
.xtt-article h2{font-size:clamp(1.25rem,2.5vw,1.55rem);font-weight:800;margin:2rem 0 .65rem;letter-spacing:-.02em;line-height:1.25;}
.xtt-article h2:first-child{margin-top:0;}
.xtt-article h3{font-size:1.05rem;font-weight:700;margin:1.5rem 0 .5rem;color:var(--text-main,#0f172a);}
.xtt-article p{font-size:.95rem;line-height:1.65;margin:0 0 .85rem;color:var(--text-main,#1e293b);}
.xtt-article ul{margin:0 0 1rem 1.1rem;padding:0;}
.xtt-article li{margin-bottom:.45rem;line-height:1.55;font-size:.95rem;}
.xtt-callout{margin:1rem 0;padding:1rem 1.1rem;border-radius:var(--xtt-radius-sm);border-left:4px solid var(--xtt-accent);background:var(--surface-muted,#f8fafc);font-size:.92rem;line-height:1.6;}
.xtt-table-wrap{overflow-x:auto;margin:1rem 0;border-radius:var(--xtt-radius-sm);border:var(--xtt-edge);}
.xtt-table{width:100%;border-collapse:collapse;font-size:.85rem;}
.xtt-table th,.xtt-table td{padding:.65rem .75rem;text-align:left;border-bottom:var(--xtt-edge);}
.xtt-table th{background:var(--surface-muted,#f1f5f9);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);}
.xtt-table code{font-size:.8em;}
.xtt-pregrid{display:grid;gap:1rem;margin:1rem 0;}
@media (min-width:768px){
.xtt-pregrid{grid-template-columns:1fr 1fr;}
}
.xtt-pre{margin:0;padding:.85rem 1rem;border-radius:var(--xtt-radius-sm);background:#0f172a;color:#e2e8f0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.72rem;line-height:1.5;overflow-x:auto;border:var(--xtt-edge);}
.xtt-pre-label{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin:0 0 .35rem;}
.xtt-dl{margin:1rem 0;display:grid;gap:.85rem;}
.xtt-dl div{margin:0;padding:.75rem .9rem;border-radius:var(--xtt-radius-sm);border:var(--xtt-edge);background:var(--surface,#fff);}
.xtt-dl dt{font-weight:700;font-size:.88rem;margin:0 0 .25rem;}
.xtt-dl dd{margin:0;font-size:.88rem;line-height:1.55;color:var(--text-main,#334155);}