.ht{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:1.5rem;align-items:start}@media(max-width:64rem){.ht{grid-template-columns:1fr}}.ht-side{background:var(--color-brand-surface);border:1px solid var(--color-brand-border);border-radius:1rem;padding:1.25rem}.ht-side--outline{position:sticky;top:4.5rem}.ht-side__head{margin-bottom:1rem}.ht-side__title{font-size:1.05rem;font-weight:700;margin:0 0 .25rem}.ht-side__desc{font-size:.85rem;color:var(--color-brand-muted);margin:0;line-height:1.45}.ht-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}.ht-item{display:flex;gap:.75rem;padding:.75rem;border:1px solid var(--color-brand-border);border-radius:.6rem;background:#f6f9fc;transition:border-color .15s,background-color .15s}.ht-item--correct{border-color:oklch(from var(--color-brand-success) l c h / .4);background:oklch(from var(--color-brand-success) l c h / .05)}.ht-item--wrong{border-color:oklch(from var(--color-brand-destructive) l c h / .4);background:oklch(from var(--color-brand-destructive) l c h / .05)}.ht-item__pos{flex-shrink:0;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#f0f2f5;border:1px solid var(--color-brand-border);font-size:.7rem;font-weight:700;color:var(--color-brand-muted)}.ht-item__body{flex:1;min-width:0}.ht-item__text{margin:0 0 .5rem;font-size:.95rem;font-weight:500}.ht-item__levels{display:inline-flex;gap:.15rem;padding:.15rem;background:var(--color-brand-surface);border:1px solid var(--color-brand-border);border-radius:.4rem}.ht-level{position:relative;cursor:pointer}.ht-level input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0}.ht-level span{display:inline-flex;align-items:center;justify-content:center;min-width:2rem;padding:.25rem .45rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;font-weight:600;color:var(--color-brand-muted);border-radius:.3rem;transition:background-color .12s,color .12s}.ht-level:hover span{background:#f0f2f5;color:var(--color-brand-foreground)}.ht-level input:checked+span{background:oklch(from var(--color-brand-primary) 50% c h);color:#fff}.ht-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-brand-border)}.ht-feedback{margin-top:1rem;padding:.8rem .95rem;border-radius:.5rem;font-size:.88rem;line-height:1.5}.ht-feedback--good{background:oklch(from var(--color-brand-success) l c h / .1);color:oklch(from var(--color-brand-success) 35% c h);border:1px solid oklch(from var(--color-brand-success) l c h / .3)}.ht-feedback--bad{background:oklch(from var(--color-brand-destructive) l c h / .08);color:oklch(from var(--color-brand-destructive) 38% c h);border:1px solid oklch(from var(--color-brand-destructive) l c h / .25)}.ht-feedback--info{background:oklch(from var(--color-brand-warning) l c h / .1);color:oklch(from var(--color-brand-warning) 35% c h);border:1px solid oklch(from var(--color-brand-warning) l c h / .3)}.ht-feedback ul{margin:.4rem 0 0;padding-left:1.2rem}.ht-tabs{display:flex;gap:.2rem;margin-bottom:.75rem;background:#f0f2f5;padding:.2rem;border-radius:.5rem}.ht-tab{flex:1;padding:.4rem .75rem;background:transparent;border:none;border-radius:.3rem;color:var(--color-brand-muted);font-size:.82rem;font-family:inherit;cursor:pointer;transition:all .12s}.ht-tab:hover{color:var(--color-brand-foreground)}.ht-tab--active{background:var(--color-brand-surface);color:var(--color-brand-foreground);box-shadow:0 0 0 1px oklch(from var(--color-brand-primary) l c h / .25)}.ht-pane{background:#f6f9fc;border:1px solid var(--color-brand-border);border-radius:.5rem;padding:1rem;min-height:18rem}.ht-tree{display:flex;flex-direction:column;gap:.35rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem}.ht-tree__empty{color:var(--color-brand-muted);font-style:italic;text-align:center;padding:2rem 1rem}.ht-tree__row{display:flex;align-items:center;gap:.5rem;padding:.35rem .55rem;border-radius:.3rem;background:var(--color-brand-surface);border:1px solid var(--color-brand-border);margin-left:calc(var(--depth, 0) * 1.1rem);color:oklch(from var(--color-brand-primary) 38% c h)}.ht-tree__row--issue{background:oklch(from var(--color-brand-destructive) l c h / .07);color:oklch(from var(--color-brand-destructive) 35% c h);border-color:oklch(from var(--color-brand-destructive) l c h / .3)}.ht-tree__lvl{flex-shrink:0;font-weight:700;padding:.05rem .3rem;background:oklch(from var(--color-brand-primary) l c h / .15);color:oklch(from var(--color-brand-primary) 40% c h);border-radius:.2rem;font-size:.7rem}.ht-tree__row--issue .ht-tree__lvl{background:oklch(from var(--color-brand-destructive) l c h / .18);color:oklch(from var(--color-brand-destructive) 40% c h)}.ht-tree__warn{margin-left:auto;font-size:.7rem;color:oklch(from var(--color-brand-destructive) 40% c h)}.ht-sr-desc{font-size:.85rem;color:var(--color-brand-muted);margin:0 0 .7rem;line-height:1.4}.ht-sr-list{list-style:none;margin:.8rem 0 0;padding:0;display:flex;flex-direction:column;gap:.3rem}.ht-sr-list li{display:flex;align-items:center;gap:.5rem;padding:.45rem .6rem;background:var(--color-brand-surface);border:1px solid var(--color-brand-border);border-radius:.4rem;font-size:.82rem}.ht-sr-list li.ht-sr-list__active{background:oklch(from var(--color-brand-primary) l c h / .12);border-color:oklch(from var(--color-brand-primary) l c h / .4)}.ht-sr-list__icon{font-size:.95rem;flex-shrink:0}.ht-rules{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.8rem}.ht-rules li{display:flex;gap:.8rem;align-items:flex-start;line-height:1.5}