.app-shell{min-height:100vh;display:grid;grid-template-columns:264px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;padding:24px 18px;border-right:1px solid var(--border);background:rgba(10,15,29,.86);backdrop-filter:blur(18px);display:flex;flex-direction:column;z-index:5}:root[data-theme=light] .sidebar{background:rgba(255,255,255,.86)}.brand-block{display:flex;align-items:center;gap:12px;padding:4px 8px 22px}.brand-mark{width:42px;height:42px;flex:none;display:grid;place-items:center;color:var(--cyan)}.brand-mark svg{width:100%;height:100%}.brand-block strong{display:block;font-size:14px;letter-spacing:-.02em}.brand-block small{display:block;color:var(--muted);margin-top:3px;font-size:11px}.course-chip{margin:0 6px 22px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;color:var(--muted);font-size:12px;display:flex;align-items:center;gap:8px;background:var(--surface)}.live-dot{width:7px;height:7px;border-radius:999px;background:var(--green);box-shadow:0 0 0 5px var(--green-soft)}.algorithm-nav{overflow-y:auto;padding:0 4px 20px;scrollbar-width:thin}.nav-group{margin-bottom:22px}.nav-group>p{margin:0 10px 8px;color:var(--subtle);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.nav-item{width:100%;border:0;background:transparent;padding:10px;border-radius:11px;display:flex;align-items:center;gap:11px;color:var(--muted);cursor:pointer;text-align:left;font-size:13px;transition:160ms ease}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{background:linear-gradient(90deg,var(--cyan-soft),transparent);color:var(--text);box-shadow:inset 2px 0 var(--cyan)}.nav-number{font-size:10px;font-variant-numeric:tabular-nums;color:var(--subtle);width:22px}.nav-item.active .nav-number{color:var(--cyan)}.sidebar-note{margin-top:auto;border:1px solid var(--border);background:linear-gradient(145deg,var(--surface-2),transparent);border-radius:14px;padding:14px;display:flex;align-items:flex-start;gap:10px;color:var(--muted)}.sidebar-note>span{color:var(--cyan);font-size:18px}.sidebar-note p{margin:0;font-size:11px;line-height:1.55}.sidebar-note strong{color:var(--text);display:block}
.main-content{min-width:0;padding:0 38px 30px}.topbar{min-height:72px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}.breadcrumb{color:var(--muted);font-size:12px}.breadcrumb b{padding:0 9px;color:var(--subtle);font-weight:400}.topbar-actions{display:flex;align-items:center;gap:14px}.keyboard-hint{color:var(--subtle);font-size:11px}kbd{background:var(--surface-2);border:1px solid var(--border-strong);border-bottom-width:2px;border-radius:5px;padding:2px 5px;margin-right:3px;color:var(--muted);font-family:inherit;font-size:10px}.theme-button{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--border);background:var(--surface);border-radius:11px;cursor:pointer;color:var(--muted)}.theme-button:hover{color:var(--text);border-color:var(--border-strong)}
.lesson-header{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding:36px 0 28px}.lesson-kicker{display:flex;align-items:center;gap:9px;color:var(--cyan);text-transform:uppercase;letter-spacing:.11em;font-weight:800;font-size:10px}.lesson-kicker span{width:28px;height:22px;display:grid;place-items:center;border:1px solid rgba(34,211,238,.32);border-radius:6px;background:var(--cyan-soft)}.lesson-header h1{margin:10px 0 8px;font-size:clamp(29px,4vw,46px);line-height:1;letter-spacing:-.045em}.lesson-header p{max-width:690px;margin:0;color:var(--muted);font-size:14px;line-height:1.7}.complexity-strip{display:flex;border:1px solid var(--border);background:var(--surface);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}.complexity-strip div{min-width:110px;padding:13px 17px}.complexity-strip div+div{border-left:1px solid var(--border)}.complexity-strip small{display:block;color:var(--subtle);font-size:9px;text-transform:uppercase;letter-spacing:.1em}.complexity-strip strong{display:block;color:var(--cyan);font-size:18px;margin-top:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.intro-stack{display:grid;grid-template-columns:minmax(0,1fr) 540px;gap:20px;align-items:start;margin-bottom:20px}.intro-main{min-width:0;display:grid;gap:20px}.intro-side{min-width:0;display:grid;gap:20px}.workspace-grid{display:grid;grid-template-columns:minmax(0,1fr) 540px;gap:20px;align-items:start}.workspace-main{min-width:0;display:grid;gap:20px}.workspace-side{min-width:0;display:grid;gap:20px;position:sticky;top:18px}.panel{border:1px solid var(--border);background:linear-gradient(145deg,var(--surface),var(--surface-2));border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.panel-heading{padding:20px 22px 17px;display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:1px solid var(--border)}.compact-heading{padding-bottom:14px;border-bottom:0}.panel-heading h2,.step-detail-grid h2,.learning-panel h2{margin:4px 0 0;font-size:15px;letter-spacing:-.02em}.eyebrow{display:block;color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.size-badge,.language-badge{font-size:10px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:6px 9px;background:var(--surface-2)}
.vector-editor{padding-bottom:18px}.field-label{display:block;color:var(--muted);font-size:11px;font-weight:700;margin:0 22px 7px}.input-action-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:0 22px}.text-input,.config-field input{width:100%;min-width:0;border:1px solid var(--border-strong);background:var(--bg);color:var(--text);border-radius:11px;padding:11px 13px;font-size:13px}.text-input.invalid{border-color:var(--rose)}.field-help{margin:7px 22px 0;color:var(--subtle);font-size:10px}.error-message{min-height:15px;margin:7px 22px 0;color:var(--rose);font-size:11px}.button{min-height:40px;border-radius:10px;border:1px solid transparent;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-size:11px;font-weight:800}.button.primary{background:linear-gradient(135deg,#22d3ee,#60a5fa);color:#06101d}.button.primary:hover{filter:brightness(1.08)}.button.secondary{background:var(--surface-3);border-color:var(--border);color:var(--text)}.button.secondary:hover{border-color:var(--border-strong)}.random-row{margin:4px 22px 0;padding-top:15px;border-top:1px solid var(--border);display:grid;grid-template-columns:auto minmax(90px,1fr) 28px auto;align-items:center;gap:11px}.random-row label{color:var(--muted);font-size:10px;font-weight:700}.random-row output{color:var(--cyan);font-size:11px;font-weight:800;text-align:center}input[type=range]{accent-color:var(--cyan)}
.config-panel{padding-bottom:19px}.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:0 22px}.config-field{display:grid;gap:7px;padding:0 22px}.config-grid .config-field{padding:0}.config-field>span{color:var(--muted);font-size:11px;font-weight:700}.config-field small{color:var(--subtle);font-size:9px}
.simulator-panel{min-height:408px}.simulator-heading{border-bottom:0}.status-pill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:7px 10px;font-size:9px;font-weight:800;color:var(--muted);background:var(--surface-3);border:1px solid var(--border);white-space:nowrap}.status-pill i{width:6px;height:6px;border-radius:999px;background:currentColor}.status-pill.reading,.status-pill.comparison{color:var(--cyan);background:var(--cyan-soft)}.status-pill.update{color:var(--violet);background:var(--violet-soft)}.status-pill.success,.status-pill.done{color:var(--green);background:var(--green-soft)}.status-pill.warning{color:var(--amber);background:var(--amber-soft)}
.array-stage{min-height:226px;display:flex;flex-direction:column;justify-content:center;padding:12px 22px 18px}.memory-label{display:flex;align-items:center;gap:10px;color:var(--subtle);text-transform:uppercase;letter-spacing:.1em;font-size:8px;margin-bottom:19px}.memory-line{width:36px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent)}.array-scroll{overflow-x:auto;padding:12px 2px 22px;scrollbar-width:thin}.array-row{display:flex;justify-content:center;min-width:max-content;margin:0 auto}.array-cell{position:relative;width:clamp(56px,6.3vw,78px);height:76px;border:1px solid var(--border-strong);border-right-width:0;background:var(--surface-2);color:var(--text);cursor:pointer;transition:180ms ease}.array-cell:first-child{border-radius:12px 0 0 12px}.array-cell:last-child{border-right-width:1px;border-radius:0 12px 12px 0}.array-cell:hover{z-index:2;transform:translateY(-3px);border-right-width:1px;border-color:var(--cyan)}.cell-value{display:grid;place-items:center;height:100%;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums}.cell-index{position:absolute;left:50%;bottom:-22px;transform:translateX(-50%);color:var(--subtle);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.array-cell.processed{background:rgba(100,116,139,.12);color:var(--muted)}.array-cell.compared{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber);z-index:2}.array-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 30px rgba(34,211,238,.10);color:var(--cyan);z-index:3;transform:translateY(-6px)}.array-cell.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green),0 0 28px rgba(52,211,153,.12);color:var(--green);z-index:4}.array-cell.sorted{background:var(--green-soft);color:var(--green)}.array-cell.changed{animation:pulse-cell 520ms ease}.array-cell.unused{cursor:default;border-style:dashed;background:transparent;color:var(--subtle)}.array-cell.unused .cell-value{font-size:10px;font-weight:600;letter-spacing:-.02em}.array-cell.unused:hover{transform:none;border-color:var(--border-strong)}.array-cell.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:15px;pointer-events:none}@keyframes pulse-cell{0%,100%{transform:translateY(-6px) scale(1)}50%{transform:translateY(-6px) scale(1.08)}}.array-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;color:var(--subtle);font-size:9px;margin-top:8px}.array-legend span{display:flex;align-items:center;gap:6px}.legend-dot{width:7px;height:7px;border-radius:2px;background:var(--subtle)}.legend-dot.current{background:var(--cyan)}.legend-dot.compared{background:var(--amber)}.legend-dot.processed{background:#64748b}.legend-dot.result{background:var(--green)}.inspection-card{margin:0 22px 14px;padding:10px 12px;border:1px dashed var(--border-strong);background:var(--violet-soft);border-radius:10px;display:flex;gap:9px;align-items:center;color:var(--muted);font-size:10px}.inspection-card svg{color:var(--violet)}.inspection-card strong{margin-left:auto;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.playback{border-top:1px solid var(--border);background:rgba(0,0,0,.05)}.progress-track{height:5px;display:flex;align-items:center;gap:3px;padding:0 10px}.progress-track .step-seg{flex:1;min-width:2px;height:4px;border-radius:999px;background:var(--surface-3);overflow:hidden;transition:height 160ms ease}.progress-track .step-seg i{display:block;width:0;height:100%;border-radius:inherit;background:var(--cyan);opacity:.55}.progress-track .step-seg.done i{width:100%}.progress-track .step-seg.current{height:5px;box-shadow:0 0 7px rgba(34,211,238,.55)}.progress-track .step-seg.current i{width:100%;opacity:1;background:linear-gradient(90deg,var(--cyan),var(--violet));animation:step-seg-fill 240ms ease}.progress-track.dense{gap:1.5px;padding:0 6px}.progress-track.dense .step-seg{border-radius:1px}@keyframes step-seg-fill{0%{width:0}100%{width:100%}}.playback-row{min-height:72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:15px;padding:12px 22px}.transport{display:flex;align-items:center;gap:7px}.icon-button{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;border:1px solid var(--border);background:var(--surface-2);color:var(--muted);cursor:pointer}.icon-button:hover:not(:disabled){color:var(--cyan);border-color:rgba(34,211,238,.35)}.icon-button:disabled{opacity:.3;cursor:default}.play-button{min-width:112px;height:40px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--cyan),#60a5fa);color:#06101d;display:flex;justify-content:center;align-items:center;gap:8px;font-size:11px;font-weight:900;cursor:pointer}.step-counter{text-align:center;color:var(--subtle);font-size:10px;white-space:nowrap}.step-counter strong{color:var(--text);font-size:15px;margin-right:3px}.speed-control{justify-self:end;display:grid;grid-template-columns:auto 90px 28px;align-items:center;gap:8px;color:var(--subtle);font-size:9px}.speed-control output{color:var(--cyan);font-weight:800}
.step-detail-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:20px}.step-detail-grid article{padding:20px;min-height:176px}.explanation-card p,.learning-panel p{color:var(--muted);font-size:15px;line-height:1.65;margin:11px 0 0}.mini-progress{height:3px;background:var(--surface-3);margin-top:24px;border-radius:999px;overflow:hidden}.mini-progress span{display:block;height:100%;background:var(--cyan)}.variables-card{padding:20px}.variables-card dl{margin:12px 0 0;display:grid;gap:7px}.variables-card dl div{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--border);padding-bottom:7px}.variables-card dt{color:var(--muted);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.variables-card dd{margin:0;color:var(--cyan);font-weight:800;font-size:12px}.empty-state{color:var(--subtle);font-size:10px;line-height:1.5}.console-output{margin-top:12px;min-height:150px;max-height:240px;overflow-y:auto;background:#050812;border:1px solid var(--border);border-radius:10px;padding:12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}:root[data-theme=light] .console-output{background:#172033}.console-output p{margin:0 0 6px;font-size:10px;color:#cbd5e1;line-height:1.6}.console-output p span{color:var(--green);margin-right:7px}.console-output .console-placeholder{color:#64748b}
.code-panel{min-width:0;border-color:rgba(34,211,238,.32);box-shadow:0 20px 70px rgba(0,0,0,.22),0 0 34px rgba(34,211,238,.09)}.code-heading{background:linear-gradient(90deg,var(--cyan-soft),transparent)}.code-lines{list-style:none;margin:0;padding:12px 0 16px;overflow-x:auto}.code-lines li{min-height:40px;display:grid;grid-template-columns:44px minmax(max-content,1fr);align-items:center;border-left:2px solid transparent;color:var(--muted);transition:150ms ease}.code-lines li.active{color:var(--text);background:linear-gradient(90deg,var(--cyan-soft),transparent);border-left-color:var(--cyan)}.line-number{text-align:right;padding-right:11px;color:var(--subtle);font-size:11px;user-select:none}.code-lines code{padding-right:18px;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:15px;white-space:pre}.code-lines li.active code{color:var(--cyan)}.learning-panel{padding:21px}.concept-note{margin-top:17px;padding:12px;display:flex;align-items:flex-start;gap:9px;background:var(--cyan-soft);border:1px solid rgba(34,211,238,.15);border-radius:11px;color:var(--muted);font-size:10px;line-height:1.5}.concept-note svg{flex:0 0 auto;color:var(--cyan)}.site-footer{margin-top:30px;padding:21px 0 4px;border-top:1px solid var(--border);display:flex;justify-content:space-between;color:var(--subtle);font-size:9px}
@media(max-width:1220px){.intro-stack{grid-template-columns:minmax(0,1fr) 440px}.workspace-grid{grid-template-columns:minmax(0,1fr) 440px}}@media(max-width:980px){.app-shell{display:block}.sidebar{position:static;width:100%;height:auto;padding:15px 20px 12px;border-right:0;border-bottom:1px solid var(--border)}.brand-block{padding:0 0 12px}.course-chip,.sidebar-note{display:none}.algorithm-nav{display:flex;overflow-x:auto;padding:0 0 4px;gap:18px}.nav-group{flex:0 0 auto;margin:0;display:flex;gap:5px;align-items:center}.nav-group>p{display:none}.nav-item{width:auto;white-space:nowrap;padding:8px 10px;border:1px solid transparent}.nav-item.active{box-shadow:none;border-color:rgba(34,211,238,.2)}.nav-number{display:none}.main-content{padding:0 22px 28px}.intro-stack{grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr)}.workspace-grid{grid-template-columns:1fr}.workspace-side{position:static;grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr)}}@media(max-width:720px){.main-content{padding:0 14px 24px}.topbar{min-height:58px}.keyboard-hint{display:none}.lesson-header{align-items:flex-start;flex-direction:column;padding:27px 0 22px}.complexity-strip{width:100%}.complexity-strip div{flex:1}.input-action-row{grid-template-columns:1fr}.random-row{grid-template-columns:auto 1fr 28px}.random-row .button{grid-column:1/-1}.config-grid{grid-template-columns:1fr}.array-stage{padding-inline:14px}.array-row{justify-content:flex-start}.playback-row{grid-template-columns:1fr auto}.step-counter{text-align:right}.speed-control{justify-self:stretch;grid-column:1/-1;grid-template-columns:auto 1fr 30px}.step-detail-grid{grid-template-columns:1fr}.intro-stack{grid-template-columns:1fr}.workspace-side{grid-template-columns:1fr}.inspection-card{align-items:flex-start;flex-wrap:wrap}.inspection-card strong{width:100%;margin-left:27px}.site-footer{flex-direction:column;gap:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.brand-block{text-decoration:none}.breadcrumb a{text-decoration:none}.breadcrumb a:hover{color:var(--cyan)}
.module-home-link{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-size:11px;text-decoration:none}.module-home-link:hover{color:var(--cyan)}

/* ===== Módulo de Matrizes ===== */
.matrix-editor{padding-bottom:18px}.matrix-textarea{width:100%;min-height:112px;resize:vertical;border:1px solid var(--border-strong);background:var(--bg);color:var(--text);border-radius:11px;padding:12px 13px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.55}.matrix-textarea.invalid{border-color:var(--rose)}.matrix-random-controls{margin:4px 22px 0;padding-top:15px;border-top:1px solid var(--border);display:grid;grid-template-columns:auto minmax(88px,1fr) 30px auto minmax(88px,1fr) 30px auto;align-items:center;gap:10px}.matrix-random-controls label{color:var(--muted);font-size:10px;font-weight:700}.matrix-random-controls output{color:var(--cyan);font-size:11px;font-weight:800;text-align:center}.matrix-stage{min-height:280px;padding:14px 20px 22px;display:flex;flex-direction:column;justify-content:center}.matrix-stage-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.matrix-stage-label{display:flex;align-items:center;gap:9px;color:var(--subtle);text-transform:uppercase;letter-spacing:.1em;font-size:8px}.matrix-stage-label:before{content:"";width:34px;height:1px;background:linear-gradient(90deg,var(--cyan),transparent)}.matrix-dimensions{color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.matrix-pair{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;align-items:center}.matrix-arrow{color:var(--cyan);font-size:24px}.matrix-block{min-width:0}.matrix-block-title{text-align:center;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:9px}.matrix-scroll{overflow:auto;padding:8px 8px 18px;scrollbar-width:thin}.matrix-grid{display:grid;gap:4px;width:max-content;min-width:max-content;margin:0 auto;align-items:center}.matrix-corner,.matrix-index{height:24px;display:grid;place-items:center;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.matrix-index.active{color:var(--cyan);font-weight:800}.matrix-cell{position:relative;width:clamp(48px,5vw,66px);height:54px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);color:var(--text);display:grid;place-items:center;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums;cursor:pointer;transition:160ms ease}.matrix-cell:hover{border-color:var(--cyan);transform:translateY(-2px)}.matrix-cell.processed{background:rgba(100,116,139,.12);color:var(--muted)}.matrix-cell.compared{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber)}.matrix-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan);transform:translateY(-3px)}.matrix-cell.result{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}.matrix-cell.changed{animation:matrix-pulse 520ms ease}.matrix-cell.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:11px;pointer-events:none}@keyframes matrix-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}.matrix-result-vector{margin:14px auto 0;width:max-content;max-width:100%;overflow:auto;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:rgba(0,0,0,.06)}.matrix-result-vector>span{display:block;color:var(--subtle);font-size:8px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}.matrix-vector-row{display:flex;gap:4px}.matrix-vector-cell{min-width:48px;padding:9px 10px;border:1px solid var(--border-strong);border-radius:7px;background:var(--surface-2);text-align:center;font-size:12px;font-weight:800;color:var(--green)}.matrix-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:15px;color:var(--subtle);font-size:9px;margin-top:8px}.matrix-legend span{display:flex;align-items:center;gap:6px}.matrix-jagged{display:grid;gap:9px;width:max-content;min-width:min(100%,max-content);margin:0 auto}.jagged-row{display:flex;align-items:center;gap:6px}.jagged-row-label{width:42px;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;text-align:right;margin-right:4px}.jagged-empty{min-width:150px;border:1px dashed var(--border-strong);border-radius:8px;padding:14px;color:var(--subtle);font-size:9px;text-align:center}.jagged-row.active .jagged-row-label{color:var(--cyan);font-weight:800}.matrix-inspection{margin:0 20px 14px}.matrix-config-note{margin:0 22px 12px;color:var(--subtle);font-size:10px;line-height:1.55}.matrix-config-wide{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0 22px}.matrix-config-wide .config-field{padding:0}.matrix-config-wide.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1220px){.matrix-pair{grid-template-columns:1fr}.matrix-arrow{transform:rotate(90deg);justify-self:center}.matrix-config-wide{grid-template-columns:1fr 1fr}}@media(max-width:720px){.matrix-random-controls{grid-template-columns:auto 1fr 30px}.matrix-random-controls .button{grid-column:1/-1}.matrix-config-wide,.matrix-config-wide.two{grid-template-columns:1fr}.matrix-cell{width:46px;height:48px;font-size:14px}.matrix-stage{padding-inline:10px}.matrix-inspection{margin-inline:10px}}
.matrix-vector-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 1px var(--cyan);color:var(--cyan)}.matrix-jagged .matrix-cell{cursor:default}

/* ===== Módulo de Pilhas ===== */
.stack-editor{padding-bottom:18px}
.stack-stage{min-height:340px;padding:16px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.stack-dimensions{display:flex;gap:14px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.stack-frame{display:flex;flex-direction:column;width:100%;max-width:260px;border-bottom:3px solid var(--border-strong);border-radius:0 0 10px 10px;padding-bottom:2px}
.stack-row{display:flex;align-items:center;gap:12px;padding:3px 0}
.stack-index{width:20px;text-align:right;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;flex:0 0 auto}
.stack-cell{position:relative;flex:1 1 auto;min-width:0;height:48px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--text);display:grid;place-items:center;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums;cursor:pointer;transition:160ms ease}
.stack-cell:hover{border-color:var(--cyan);transform:translateX(2px)}
.stack-cell.empty{cursor:default;border-style:dashed;color:var(--subtle);font-size:10px;font-weight:600;background:transparent}
.stack-cell.empty:hover{transform:none;border-color:var(--border-strong)}
.stack-cell.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.stack-cell.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber);animation:stack-pulse 520ms ease}
.stack-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.stack-cell.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.stack-cell.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:14px;pointer-events:none}
@keyframes stack-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
.stack-pointer{flex:0 0 auto;display:flex;align-items:center;gap:5px;color:var(--cyan);font-size:10px;font-weight:800;white-space:nowrap}
.stack-pointer:before{content:"←"}
.stack-row-floor{padding-top:8px}
.stack-floor-note{flex:1 1 auto;color:var(--subtle);font-size:9px;font-style:italic}
.stack-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;color:var(--subtle);font-size:9px}
.stack-legend span{display:flex;align-items:center;gap:6px}
@media(max-width:720px){.stack-frame{max-width:100%}.stack-stage{padding-inline:14px}}

/* ===== Módulo de Filas ===== */
.queue-editor{padding-bottom:18px}
.queue-stage{min-height:260px;padding:16px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.queue-dimensions{display:flex;gap:14px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.queue-scroll{overflow-x:auto;max-width:100%;padding:6px 2px 4px;scrollbar-width:thin}
.queue-row{display:flex;gap:6px;min-width:max-content;margin:0 auto}
.queue-slot{display:flex;flex-direction:column;align-items:center;gap:6px}
.queue-marker{height:14px;color:var(--cyan);font-size:10px;font-weight:800;white-space:nowrap}
.queue-cell{position:relative;width:clamp(56px,6.3vw,72px);height:64px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--text);display:grid;place-items:center;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums;cursor:pointer;transition:160ms ease}
.queue-cell:hover{border-color:var(--cyan);transform:translateY(-2px)}
.queue-cell.empty{cursor:default;border-style:dashed;color:var(--subtle);font-size:10px;font-weight:600;background:transparent}
.queue-cell.empty:hover{transform:none;border-color:var(--border-strong)}
.queue-cell.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.queue-cell.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber);animation:queue-pulse 520ms ease}
.queue-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.queue-cell.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.queue-cell.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:14px;pointer-events:none}
@keyframes queue-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
.queue-index{color:var(--subtle);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.queue-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;color:var(--subtle);font-size:9px}
.queue-legend span{display:flex;align-items:center;gap:6px}
@media(max-width:720px){.queue-stage{padding-inline:14px}.queue-row{justify-content:flex-start}}

/* ===== Módulos de Pilhas/Filas Dinâmicas (nós encadeados) ===== */
.node-editor{padding-bottom:18px}
.node-stage{min-height:220px;padding:16px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.node-dimensions{color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.node-scroll{overflow-x:auto;max-width:100%;padding:22px 2px 10px;scrollbar-width:thin}
.node-chain{display:flex;align-items:center;gap:2px;min-width:max-content;margin:0 auto}
.node-wrap{position:relative;flex:0 0 auto;display:inline-flex}
.node-marker{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:800;color:var(--cyan);white-space:nowrap}
.node-topo-badge{flex:0 0 auto;padding:7px 11px;border:1px solid rgba(34,211,238,.32);border-radius:999px;background:var(--cyan-soft);color:var(--cyan);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.node-arrow{flex:0 0 auto;color:var(--cyan);font-size:18px;padding:0 4px}
.node{position:relative;flex:0 0 auto;width:56px;height:56px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--text);display:grid;place-items:center;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums;cursor:pointer;transition:160ms ease}
.node:hover{border-color:var(--cyan);transform:translateY(-2px)}
.node.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.node.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber);animation:node-pulse 520ms ease}
.node.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.node.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.node.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:14px;pointer-events:none}
@keyframes node-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
.node-null{flex:0 0 auto;padding:8px 14px;border:1px dashed var(--border-strong);border-radius:999px;color:var(--subtle);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.node-loop{flex:0 0 auto;padding:8px 14px;border:1px dashed rgba(139,92,246,.4);border-radius:999px;color:var(--violet);font-size:10px;font-weight:800;white-space:nowrap;background:var(--violet-soft)}
.node-links{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:0 6px}
.node-link{display:flex;align-items:center;gap:4px;line-height:1;white-space:nowrap;color:var(--subtle)}
.node-link-arrow{font-size:15px;line-height:1}
.node-link-label{font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.node-link-next.linked{color:var(--cyan)}
.node-link-prev.linked{color:var(--violet)}
.node-link.pending{opacity:.4}
.node-link.pending .node-link-arrow{color:var(--subtle)}
.node-link.just-linked{animation:node-link-fade-in 480ms ease-out}
.node-link-next.just-linked .node-link-arrow{animation:node-link-arrow-right 480ms ease-out}
.node-link-prev.just-linked .node-link-arrow{animation:node-link-arrow-left 480ms ease-out}
@keyframes node-link-fade-in{0%{opacity:0}60%{opacity:1}100%{opacity:1}}
@keyframes node-link-arrow-right{0%{opacity:0;transform:translateX(-10px)}100%{opacity:1;transform:translateX(0)}}
@keyframes node-link-arrow-left{0%{opacity:0;transform:translateX(10px)}100%{opacity:1;transform:translateX(0)}}
.node-staging{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;border:1px dashed var(--border-strong);border-radius:16px;background:rgba(139,92,246,.06);align-self:center}
.node-staging.start{align-self:flex-start}
.node-staging.end{align-self:flex-end}
.node-staging-tag{font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--subtle);white-space:nowrap}
.node-staging-body{display:flex;align-items:center;gap:12px}
.node-staging .node{cursor:default}
.node-staging .node:hover{transform:none;border-color:var(--border-strong)}
.node-staging-status{display:flex;flex-direction:column;gap:5px}
.node-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:16px;color:var(--subtle);font-size:9px}
.node-legend span{display:flex;align-items:center;gap:6px}
@media(max-width:720px){.node-stage{padding-inline:14px}.node-chain{justify-content:flex-start}.node-links{padding:0 3px;gap:3px}.node-link-label{display:none}}
/* Módulo de Alocação Dinâmica (variáveis, referências e nós) */
.mem-stage{min-height:260px;padding:16px 22px 22px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.mem-board{display:flex;align-items:center;justify-content:center;gap:22px;flex-wrap:wrap;width:100%}
.mem-zone{display:flex;flex-direction:column;gap:10px;min-width:170px}
.mem-zone-label{color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.mem-var{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface-2);transition:160ms ease}
.mem-var-name{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--muted)}
.mem-var-value{color:var(--text);font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.mem-var.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan)}
.mem-var.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.mem-ref{padding:4px 10px;border:1px solid rgba(34,211,238,.4);border-radius:999px;background:var(--cyan-soft);color:var(--cyan);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:800}
.mem-ref.null,.mem-ref.pending{border-style:dashed;border-color:var(--border-strong);background:transparent;color:var(--subtle)}
.mem-arrow{color:var(--cyan);font-size:24px;opacity:0;transition:opacity 200ms ease}
.mem-arrow.on{opacity:1}
.mem-object{min-width:190px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-2);overflow:hidden}
.mem-object.born{animation:mem-born 480ms ease-out}
.mem-object-head{display:flex;justify-content:space-between;gap:16px;padding:8px 12px;background:var(--cyan-soft);color:var(--cyan);font-size:12px;font-weight:800}
.mem-object-address{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}
.mem-object-field{display:flex;justify-content:space-between;gap:16px;padding:7px 12px;border-top:1px solid var(--border);color:var(--muted);font-size:12px}
.mem-object-field strong{color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.mem-object-field.changed{background:var(--amber-soft);animation:node-pulse 520ms ease}
.mem-empty{padding:18px 22px;border:1px dashed var(--border-strong);border-radius:12px;color:var(--subtle);font-size:11px;text-align:center}
.mem-error{padding:9px 16px;border:1px solid rgba(251,113,133,.5);border-radius:11px;background:rgba(251,113,133,.1);color:var(--rose);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:800;animation:mem-shake 420ms ease}
.mem-row{display:flex;align-items:flex-start;min-width:max-content;margin:0 auto}
.mem-node-line{display:flex;align-items:flex-start}
.mem-node-box{display:flex;flex-direction:column;align-items:center;gap:6px}
.mem-chips{display:flex;gap:4px;min-height:24px;align-items:flex-end}
.mem-chip{padding:3px 8px;border:1px solid rgba(34,211,238,.4);border-radius:999px;background:var(--cyan-soft);color:var(--cyan);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:800}
.mem-chip.cursor{border-color:rgba(139,92,246,.45);background:var(--violet-soft);color:var(--violet)}
.mem-node{display:flex;align-items:stretch;padding:0;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-2);color:var(--text);overflow:hidden;cursor:pointer;transition:160ms ease}
.mem-node:hover{border-color:var(--cyan);transform:translateY(-2px)}
.mem-node-value{display:grid;place-items:center;width:50px;height:50px;font-size:clamp(16px,2vw,22px);font-weight:800;font-variant-numeric:tabular-nums}
.mem-node-next{display:grid;place-items:center;width:50px;height:50px;border-left:1px solid var(--border-strong);color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}
.mem-node-next.linked{color:var(--cyan);font-size:18px;background:var(--cyan-soft)}
.mem-node-caption{display:grid;grid-template-columns:50px 50px;color:var(--subtle);font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;text-align:center}
.mem-node.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.mem-node.changed{box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.mem-node.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.mem-node.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.mem-node.inspected{outline:1px dashed var(--violet);outline-offset:4px}
.mem-node.born{animation:mem-born 480ms ease-out}
.mem-node.lost{border-style:dashed;border-color:var(--rose);color:var(--muted);opacity:.7}
.mem-node.freed{border-style:dashed;border-color:var(--rose);animation:mem-vanish 900ms ease forwards}
.mem-node-tag{color:var(--rose);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.mem-link{flex:0 0 auto;display:grid;place-items:center;width:30px;height:50px;margin-top:30px;color:var(--cyan);font-size:24px;opacity:0}
.mem-link.on{opacity:1}
.mem-link.on.just-linked{animation:node-link-arrow-right 480ms ease-out}
.mem-null{display:grid;place-items:center;height:50px;padding:0 14px;border:1px dashed var(--border-strong);border-radius:999px;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.random-row.single{grid-template-columns:1fr}
@keyframes mem-born{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}
@keyframes mem-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-6px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
@keyframes mem-vanish{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}
@media(max-width:720px){.mem-stage{padding-inline:14px}.mem-board{gap:14px}.mem-zone{min-width:140px}}
/* Módulo de Tabelas Hash (endereçamento aberto e encadeamento separado) */
.hash-open-row{display:flex;align-items:flex-start;gap:3px;min-width:max-content;margin:0 auto;padding:30px 0}
.hash-slot{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:42px}
.hash-slot-chip{position:absolute;left:50%;display:flex;transform:translateX(-50%)}
.hash-slot-chip.top{bottom:100%;margin-bottom:6px}
.hash-slot-chip.bottom{top:100%;margin-top:6px}
.hash-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:42px;height:52px;padding:0;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--text);font:inherit;transition:160ms ease}
button.hash-cell{cursor:pointer}
button.hash-cell:hover{border-color:var(--cyan);transform:translateY(-2px)}
.hash-cell strong{font-size:14px;font-variant-numeric:tabular-nums;line-height:1}
.hash-cell small{max-width:38px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:9px}
.hash-null{color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.hash-del{color:var(--rose);font-size:10px;font-weight:800;letter-spacing:.06em}
.hash-cell.empty{border-style:dashed;background:transparent}
.hash-cell.deleted{border-style:dashed;border-color:rgba(251,113,133,.55);background:rgba(251,113,133,.07)}
.hash-cell.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.hash-cell.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.hash-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10)}
.hash-cell.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green)}
.hash-cell.collision{background:rgba(251,113,133,.1);box-shadow:inset 0 0 0 2px var(--rose);animation:mem-shake 420ms ease}
.hash-cell.born{animation:mem-born 480ms ease-out}
.hash-index{color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}
.hash-info{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.hash-info strong{color:var(--text)}
.legend-dot.collision{background:var(--rose)}
.hash-chain-rows{display:flex;flex-direction:column;gap:2px;min-width:max-content;margin:0 auto}
.hash-bucket{display:flex;align-items:center;gap:8px;min-height:34px;padding:2px 8px;border:1px solid transparent;border-radius:10px;transition:160ms ease}
.hash-bucket.active{background:var(--cyan-soft);border-color:rgba(34,211,238,.3)}
.hash-bucket.processed{opacity:.7}
.hash-bucket.changed{border-color:var(--amber)}
.hash-bucket.born{animation:mem-born 480ms ease-out}
.hash-bucket-mark{display:flex;justify-content:flex-end;width:54px}
.hash-bucket-head{padding:5px 12px;border:1px solid rgba(34,211,238,.35);border-radius:8px;background:var(--cyan-soft);color:var(--cyan);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.hash-bucket-head.null{border-style:dashed;border-color:var(--border-strong);background:transparent;color:var(--subtle)}
.hash-bucket-head.born{animation:mem-born 480ms ease-out}
.hash-chain-arrow{color:var(--cyan);font-size:16px}
.hash-entry{display:flex;align-items:baseline;gap:6px;padding:5px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2);color:var(--text);font:inherit;cursor:pointer;transition:160ms ease}
.hash-entry strong{font-size:13px;font-variant-numeric:tabular-nums}
.hash-entry small{color:var(--muted);font-size:10px}
.hash-entry:hover{border-color:var(--cyan)}
.hash-entry.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan)}
.hash-entry.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green)}
.hash-entry.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.hash-empty-list{color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
/* Módulo de Selection Sort (varredura, troca e análise do algoritmo) */
.sort-stage{min-height:300px;padding:14px 22px 22px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.sort-phase{display:flex;align-items:center;gap:10px;min-height:26px;color:var(--muted);font-size:12px}
.sort-phase-badge{padding:5px 10px;border:1px solid rgba(34,211,238,.32);border-radius:999px;background:var(--cyan-soft);color:var(--cyan);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.sort-phase-badge.code{text-transform:none;letter-spacing:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-scroll{overflow-x:auto;max-width:100%;padding:4px 6px 6px;scrollbar-width:thin}
.sort-row{display:flex;justify-content:center;gap:5px;width:100%;min-width:min-content}
.sort-slot{flex:1 1 0;min-width:38px;max-width:66px;display:flex;flex-direction:column;align-items:center;gap:6px}
.sort-chips{position:relative;width:100%;height:22px}
.sort-chips>span{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:flex;gap:3px;white-space:nowrap}
.sort-chip{padding:2px 7px;border:1px solid;border-radius:999px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-weight:800;line-height:1.5}
.sort-chip.i{border-color:rgba(139,92,246,.45);background:var(--violet-soft);color:var(--violet)}
.sort-chip.j{border-color:rgba(34,211,238,.4);background:var(--cyan-soft);color:var(--cyan)}
.sort-chip.min{border-color:rgba(52,211,153,.45);background:var(--green-soft);color:var(--green)}
.sort-cell{position:relative;width:100%;height:60px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-2);color:var(--text);display:grid;place-items:center;font-size:clamp(15px,1.8vw,21px);font-weight:800;font-variant-numeric:tabular-nums;transition:160ms ease}
button.sort-cell{cursor:pointer}
button.sort-cell:hover{border-color:var(--cyan);transform:translateY(-2px)}
.sort-cell.sorted{background:var(--green-soft);color:var(--green)}
.sort-cell.outside{opacity:.42}
.sort-cell.dup{box-shadow:inset 0 0 0 1px var(--violet)}
.sort-cell.compared{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);color:var(--amber)}
.sort-cell.warn{background:rgba(251,113,133,.1);box-shadow:inset 0 0 0 2px var(--rose);color:var(--rose);animation:mem-shake 420ms ease}
.sort-cell.min{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.sort-cell.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan);transform:translateY(-4px)}
.sort-cell.changed{animation:node-pulse 520ms ease}
.sort-cell.inspected:after{content:"";position:absolute;inset:-5px;border:1px dashed var(--violet);border-radius:14px;pointer-events:none}
.sort-cell-tag{position:absolute;top:-7px;right:-5px;min-width:16px;height:16px;padding:0 4px;display:grid;place-items:center;border-radius:999px;background:var(--violet);color:#fff;font-size:10px;font-weight:800;line-height:1}
.sort-index{color:var(--subtle);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-rail{height:3px;width:calc(100% + 5px);border-radius:2px;background:var(--surface-3);transition:160ms ease}
.sort-rail.sorted{background:var(--green)}
.sort-rail.open{background:var(--cyan);opacity:.45}
.sort-rail.outside{opacity:.25}
.sort-compare-slot{min-height:68px;display:flex;align-items:center;justify-content:center}
.sort-compare{display:flex;align-items:center;justify-content:center;gap:14px;padding:10px 18px;border:1px solid var(--border-strong);border-radius:14px;background:var(--surface-2)}
.sort-compare-side{display:grid;gap:2px;text-align:center}
.sort-compare-side small{color:var(--subtle);font-size:9px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-compare-side strong{font-size:20px;font-variant-numeric:tabular-nums}
.sort-compare-op{color:var(--muted);font-size:22px;font-weight:800}
.sort-compare-result{min-width:48px;padding:6px 12px;border-radius:999px;text-align:center;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.sort-compare.yes{border-color:rgba(52,211,153,.5)}
.sort-compare.yes .sort-compare-result{background:var(--green-soft);color:var(--green)}
.sort-compare.no .sort-compare-result{background:var(--amber-soft);color:var(--amber)}
.sort-compare-hint{color:var(--subtle);font-size:11px;text-align:center}
.sort-stats{display:flex;justify-content:center;gap:22px;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.sort-stats strong{color:var(--text)}
.sort-chart{display:grid;gap:12px;padding-top:6px;border-top:1px solid var(--border)}
.sort-chart-title{display:flex;justify-content:space-between;color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.sort-bars{display:grid;gap:6px}
.sort-bar-row{display:grid;grid-template-columns:70px minmax(0,1fr) 24px 36px;align-items:center;gap:10px;color:var(--muted);font-size:11px}
.sort-bar-track{height:11px;border-radius:999px;background:var(--surface-3);overflow:hidden}
.sort-bar-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),#60a5fa);transition:width 260ms ease}
.sort-bar-row.current .sort-bar-track i{background:linear-gradient(90deg,var(--violet),var(--cyan))}
.sort-bar-row.current{color:var(--text)}
.sort-bar-value{text-align:right;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.sort-bar-swap{color:var(--violet);font-weight:800;text-align:center}
.sort-totals{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sort-total{display:grid;gap:3px;padding:10px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
.sort-total small{color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.sort-total strong{color:var(--cyan);font-size:22px;font-variant-numeric:tabular-nums}
.sort-total span{color:var(--muted);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-total.final{border-color:rgba(52,211,153,.5)}
.sort-total.final strong{color:var(--green)}
.sort-lockstep{display:grid;gap:10px}
.sort-scenario{display:grid;gap:8px;padding:11px 14px 8px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
.sort-scenario-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.sort-scenario-label{color:var(--text);font-size:12px;font-weight:800}
.sort-counters{color:var(--muted);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-counters strong{color:var(--cyan);font-size:12px}
.sort-scenario .sort-row{gap:4px}
.sort-cell.mini{height:38px;border-radius:8px;font-size:14px}
.sort-chip.next{border-color:rgba(34,211,238,.4);background:var(--cyan-soft);color:var(--cyan)}
.sort-chip.prev{border-color:rgba(34,211,238,.4);border-style:dashed;background:transparent;color:var(--cyan)}
.sort-compare.bad{border-color:rgba(251,113,133,.55)}
.sort-compare.bad .sort-compare-result{background:rgba(251,113,133,.12);color:var(--rose)}
.sort-compare.good{border-color:rgba(52,211,153,.5)}
.sort-compare.good .sort-compare-result{background:var(--green-soft);color:var(--green)}
.config-buttons{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;flex:0 0 auto}
.sort-odds{display:grid;gap:12px;justify-items:center;padding:6px 0}
.sort-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;max-width:460px}
.sort-dot{width:9px;height:9px;border-radius:50%;background:var(--surface-3);border:1px solid var(--border-strong)}
.sort-dot.hit{background:var(--green);border-color:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.sort-odds-bar{position:relative;width:min(100%,420px);height:12px;border-radius:999px;background:var(--surface-3);border:1px solid var(--border-strong)}
.sort-odds-bar i{position:absolute;left:37%;top:-3px;width:4px;height:16px;border-radius:2px;background:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.sort-odds-caption{margin:0;color:var(--muted);font-size:12px;text-align:center}
.sort-odds-caption strong{color:var(--text)}
.sort-odds-caption .hit{color:var(--green);font-weight:800}
.sort-table{display:grid;gap:4px;padding-top:6px;border-top:1px solid var(--border)}
.sort-table-head,.sort-table-row{display:grid;grid-template-columns:minmax(80px,.8fr) 1fr 1.2fr 1.1fr;gap:10px;align-items:center;padding:7px 10px}
.sort-table-head{color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.sort-table-head small{display:block;margin-top:2px;font-size:9px;font-weight:600;text-transform:none;letter-spacing:0}
.sort-table-row{border:1px solid var(--border);border-radius:10px;background:var(--surface-2);font-size:12px;font-variant-numeric:tabular-nums}
.sort-table-row span:first-child{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:800}
.sort-table-row span:nth-child(3){color:var(--rose);font-weight:800}
.sort-table-row.mine{border-color:rgba(34,211,238,.4);background:var(--cyan-soft)}
.sort-table-row em{display:block;color:var(--cyan);font-size:9px;font-style:normal;font-weight:700}
.sort-table-note{margin:4px 0 0;color:var(--subtle);font-size:10px}
.config-note-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 22px}
.config-note-row p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}
.legend-dot.pointer-i{background:var(--violet)}
.legend-dot.sorted{background:var(--green);opacity:.5}
.legend-dot.outside{background:var(--subtle);opacity:.5}
.legend-dot.dup{background:transparent;box-shadow:inset 0 0 0 1px var(--violet)}
.legend-dot.warn{background:var(--rose)}
@media(max-width:720px){.sort-stage{padding-inline:14px}.sort-compare{gap:10px;padding:9px 12px}.config-note-row{flex-direction:column;align-items:stretch}.config-buttons{justify-content:flex-start}.sort-table-head,.sort-table-row{grid-template-columns:.9fr 1fr 1.2fr 1fr;gap:6px;padding-inline:8px;font-size:11px}.sort-bar-row{grid-template-columns:62px minmax(0,1fr) 22px 16px;gap:8px}}
/* Módulo de Listas Circulares (nós com ponteiros, fichas das variáveis e nó solto) */
.circ-board{position:relative;flex:0 0 auto;margin:0 auto;overflow:hidden}
.circ-slot{position:absolute;z-index:1;width:var(--w);height:46px}
.circ-slot.glide{animation:circ-glide 360ms ease}
.circ-slot.born,.circ-pos.born{animation:mem-born 420ms ease-out}
.circ-pos.glide{animation:circ-glide 360ms ease}
@keyframes circ-glide{from{transform:translate(var(--dx),var(--dy))}to{transform:translate(0,0)}}
.circ-node{display:flex;align-items:stretch;width:var(--w);height:46px;padding:0;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface-2);color:var(--text);overflow:hidden;cursor:pointer;transition:160ms ease}
.circ-node:hover{border-color:var(--cyan);transform:translateY(-2px)}
.circ-value{flex:0 0 var(--vw);display:grid;place-items:center;font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.circ-next,.circ-prev{flex:1;display:grid;place-items:center;border-left:1px solid var(--border-strong);color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px}
.circ-prev{flex:0 0 var(--pw);border-left:0;border-right:1px solid var(--border-strong)}
.circ-board.doubly .circ-next,.circ-board.doubly .circ-prev{font-size:8px}
.circ-node.detached{border-style:dashed;border-color:rgba(139,92,246,.6);background:var(--violet-soft)}
.circ-node.lost{border-style:dashed;border-color:var(--rose);color:var(--muted);opacity:.75}
.circ-node.processed{background:rgba(100,116,139,.12);color:var(--muted)}
.circ-node.changed{box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.circ-node.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.circ-node.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.circ-node.inspected{outline:1px dashed var(--violet);outline-offset:4px}
.circ-null{position:absolute;z-index:1;display:grid;place-items:center;width:56px;height:28px;border:1px dashed var(--border-strong);border-radius:999px;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}
.circ-wires{position:absolute;left:0;top:0;z-index:2;pointer-events:none;overflow:visible}
.circ-link{color:var(--cyan)}
.circ-link.prev{color:var(--violet)}
.circ-link.fresh{color:var(--amber)}
.circ-link.lost{color:var(--subtle)}
.circ-wire{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.circ-head,.circ-dot{fill:currentColor;stroke:none}
.circ-link.lost .circ-wire{stroke-dasharray:4 4}
.circ-link.fresh .circ-wire{stroke-dasharray:1;animation:circ-draw 420ms ease-out}
.circ-link.fresh .circ-head{animation:circ-fade 420ms ease-out both}
.circ-link.fade{animation:circ-fade 360ms ease-out}
@keyframes circ-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes circ-fade{from{opacity:0}to{opacity:1}}
.circ-pos{position:absolute;z-index:3;width:70px;height:20px;pointer-events:none}
.circ-chip{position:relative;display:block;height:20px;border:1px solid;border-radius:999px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:800;line-height:18px;text-align:center}
.circ-chip.inicio{border-color:rgba(34,211,238,.45);background:var(--surface);color:var(--cyan)}
.circ-chip.cursor{border-color:rgba(139,92,246,.5);background:var(--surface);color:var(--violet)}
.circ-chip.novo{border-color:rgba(52,211,153,.5);background:var(--surface);color:var(--green)}
.circ-chip.alvo{border-color:rgba(251,113,133,.55);background:var(--surface);color:var(--rose)}
.circ-chip.near:after{content:"";position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);border:4px solid transparent;border-bottom-width:0;border-top-color:currentColor}
.circ-chip.below.near:after{bottom:auto;top:-5px;border-top-width:0;border-top-color:transparent;border-bottom-width:4px;border-bottom-color:currentColor}
.legend-dot.lost{background:var(--rose);opacity:.7}
.legend-dot.next{background:var(--cyan)}
.legend-dot.prev{background:var(--violet)}

/* Barra de variáveis das listas (sempre visível, fora da área rolada) */
.circ-vars{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:100%}
.circ-var{display:inline-flex;align-items:center;gap:7px;padding:4px 12px;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface-2);color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:700}
.circ-var b{font-weight:800}
.circ-var i{font-style:normal;color:var(--subtle)}
.circ-var.inicio{border-color:rgba(34,211,238,.45)}.circ-var.inicio b{color:var(--cyan)}
.circ-var.cursor{border-color:rgba(139,92,246,.5)}.circ-var.cursor b{color:var(--violet)}
.circ-var.novo{border-color:rgba(52,211,153,.5)}.circ-var.novo b{color:var(--green)}
.circ-var.alvo{border-color:rgba(251,113,133,.55)}.circ-var.alvo b{color:var(--rose)}
.circ-var.param b{color:var(--muted)}
.circ-var.unset,.circ-var.null{color:var(--subtle)}
.circ-var.unset{border-style:dashed}
.circ-var.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 1px var(--amber);animation:node-pulse 520ms ease}
.circ-var.gone span{color:var(--subtle)}
/* Páginas com a cena de nós: a lista precisa de largura, então a coluna do pseudocódigo desce já em 1220px (antes, só em 980px, sobravam ~200px para a lista) e fica mais estreita até 1500px */
@media(max-width:1220px){.workspace-grid:has(.circ-board){grid-template-columns:1fr}.workspace-grid:has(.circ-board) .workspace-side{position:static;grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr)}}
@media(max-width:720px){.workspace-grid:has(.circ-board) .workspace-side{grid-template-columns:1fr}}
@media(min-width:1221px) and (max-width:1500px){.workspace-grid:has(.circ-board){grid-template-columns:minmax(0,1fr) 420px}}

/* Árvore binária de busca: a cena reaproveita o quadro, as fichas, as setas e a barra de variáveis das listas */
.tree-slot{position:absolute;z-index:1;width:42px;height:42px}
.tree-slot.glide{animation:circ-glide 360ms ease}
.tree-slot.born{animation:mem-born 420ms ease-out}
.tree-node{display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface-2);color:var(--text);font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em;cursor:pointer;transition:160ms ease}
.tree-node:hover{border-color:var(--cyan);transform:translateY(-2px)}
.tree-node.visited,.tree-node.processed{background:rgba(100,116,139,.14);color:var(--muted)}
.tree-node.zone-left{background:rgba(96,165,250,.16);box-shadow:inset 0 0 0 1px #60a5fa;color:var(--text)}
.tree-node.zone-right{background:var(--violet-soft);box-shadow:inset 0 0 0 1px var(--violet);color:var(--text)}
.tree-node.changed{background:var(--amber-soft);box-shadow:inset 0 0 0 2px var(--amber);color:var(--amber);animation:node-pulse 520ms ease}
.tree-node.active{background:var(--cyan-soft);box-shadow:inset 0 0 0 2px var(--cyan),0 0 26px rgba(34,211,238,.10);color:var(--cyan)}
.tree-node.found{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--green);color:var(--green)}
.tree-node.error{background:rgba(251,113,133,.16);box-shadow:inset 0 0 0 2px var(--rose);color:var(--rose)}
.tree-node.detached{border-style:dashed;border-color:rgba(139,92,246,.6);background:var(--violet-soft)}
.tree-node.lost{border-style:dashed;border-color:var(--rose);color:var(--muted);opacity:.7}
.tree-node.dim{opacity:.32}
.tree-node.inspected{outline:1px dashed var(--violet);outline-offset:4px}
.tree-tag{position:absolute;left:50%;top:100%;margin-top:4px;transform:translateX(-50%);white-space:nowrap;color:var(--violet);font-size:9px;font-style:normal;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.tree-null{position:absolute;z-index:1;display:grid;place-items:center;width:38px;height:18px;border:1px dashed var(--border-strong);border-radius:999px;color:var(--subtle);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px}
.tree-null.glide{animation:circ-glide 360ms ease}
.tree-null.born{animation:mem-born 420ms ease-out}
.tree-board .circ-pos{width:54px}
.tree-edge{color:var(--subtle)}
.tree-edge.hot,.tree-edge.fresh{color:var(--amber)}
.tree-edge.fresh .circ-wire{stroke-dasharray:1;animation:circ-draw 420ms ease-out}
.tree-edge.fresh .circ-head{animation:circ-fade 420ms ease-out both}
.tree-edge.dim{opacity:.25}
.tree-edge.null{color:var(--border-strong)}
.tree-edge.null .circ-wire{stroke-width:1.5;stroke-dasharray:3 3}
.tree-edge.null .circ-head,.tree-edge.null .circ-dot{display:none}
.circ-chip.atual{border-color:rgba(251,191,36,.6);background:var(--surface);color:var(--amber)}
.circ-chip.filho{border-color:rgba(52,211,153,.5);border-style:dashed;background:var(--surface);color:var(--green)}
.circ-var.atual{border-color:rgba(251,191,36,.6)}.circ-var.atual b{color:var(--amber)}
.circ-var.filho{border-color:rgba(52,211,153,.5)}.circ-var.filho b{color:var(--green)}
.legend-dot.detached{background:transparent;box-shadow:inset 0 0 0 1px var(--violet)}
.legend-dot.left{background:#60a5fa}
.legend-dot.right{background:var(--violet)}
.legend-dot.error{background:var(--rose)}
.preset-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 22px 0}
.preset-row>span{color:var(--muted);font-size:10px;font-weight:700;margin-right:2px}
.button.compact{min-height:32px;padding:0 11px}
.button.secondary[aria-pressed=true]{border-color:var(--cyan);background:var(--cyan-soft);color:var(--cyan)}
.button:disabled{opacity:.45}
.config-note{margin:12px 22px 0;color:var(--muted);font-size:11px;line-height:1.6}
.config-note strong{color:var(--text)}
/* Módulos de Merge Sort e Quick Sort (trecho da recursão, vetor auxiliar B, pilha de chamadas e níveis) */
.sort-chips.stacked{height:60px}
.sort-chips.stacked>span{flex-direction:column-reverse;align-items:center;gap:2px}
.sort-chips.stacked .sort-chip{padding:0 6px;font-size:9px;line-height:1.6}
.sort-chip.inicio,.sort-chip.fim{border-color:rgba(251,113,133,.5);background:rgba(251,113,133,.12);color:var(--rose)}
.sort-chip.meio{border-color:rgba(251,191,36,.5);background:var(--amber-soft);color:var(--amber)}
.sort-chip.k{border-color:rgba(52,211,153,.45);background:var(--green-soft);color:var(--green)}
.sort-cell.pivot{box-shadow:inset 0 0 0 2px var(--violet);background:var(--violet-soft);color:var(--violet)}
.sort-cell.pivot.sorted{background:var(--green-soft);box-shadow:inset 0 0 0 2px var(--violet);color:var(--green)}
.sort-aux{display:grid;gap:4px;margin-inline:-11px;padding:8px 10px 0;border:1px dashed var(--border-strong);border-radius:12px}
.sort-scroll.roomy{padding-inline:12px}
@media(max-width:720px){.sort-scroll.roomy .sort-slot{min-width:34px}}
.sort-aux-title{display:flex;align-items:baseline;gap:8px;color:var(--text);font-size:12px;font-weight:800;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-aux-title small{color:var(--subtle);font-size:9px;font-weight:700;font-family:inherit;text-transform:uppercase;letter-spacing:.1em}
.sort-cell.aux{height:42px;border-radius:9px;font-size:clamp(13px,1.5vw,17px);background:var(--surface-2)}
.sort-cell.aux.empty{border-style:dashed;background:transparent}
.sort-cell.aux.off{border-color:transparent;background:transparent}
.sort-cell.aux.dup{box-shadow:inset 0 0 0 1px var(--violet)}
.sort-cell.aux.active{transform:none}
.sort-chips.below{height:22px}
.sort-chips.below>span{top:0;bottom:auto}
.sort-stack{display:flex;align-items:flex-start;gap:12px;min-height:48px;padding:8px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
.sort-stack-title{flex:0 0 auto;padding-top:3px;color:var(--subtle);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}
.sort-stack-frames{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.sort-frame{padding:3px 9px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface);color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;font-weight:700;white-space:nowrap}
.sort-frame.top{border-color:rgba(34,211,238,.5);background:var(--cyan-soft);color:var(--cyan)}
.sort-frame-sep{color:var(--subtle);font-style:normal;font-size:12px}
.sort-stack-empty{color:var(--subtle);font-size:11px;padding-top:2px}
.sort-levels{display:grid;gap:6px}
.sort-level{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:36px;padding:4px 8px;border:1px solid transparent;border-radius:10px}
.sort-level.current{border-color:rgba(34,211,238,.4);background:var(--cyan-soft)}
.sort-level.pending{opacity:.35}
.sort-level.pending .sort-level-segments:before{content:"";flex:1;height:0;margin:16px 0;border-top:1px dashed var(--border-strong)}
.sort-level-label{color:var(--subtle);font-size:10px;font-weight:800;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.sort-level.current .sort-level-label{color:var(--cyan)}
.sort-level-segments{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.sort-seg{display:flex;gap:2px;padding:3px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface-2)}
.sort-seg b{position:relative;min-width:24px;padding:3px 2px;border-radius:5px;background:var(--surface-3);text-align:center;font-size:12px;font-variant-numeric:tabular-nums}
.sort-seg b sup{position:absolute;top:-6px;right:-3px;min-width:12px;height:12px;display:grid;place-items:center;border-radius:999px;background:var(--violet);color:#fff;font-size:8px;font-weight:800}
.sort-seg.active{border-color:rgba(34,211,238,.55)}
.sort-seg.active b{color:var(--cyan)}
.sort-seg.done{border-color:rgba(52,211,153,.5)}
.sort-seg.done b{background:var(--green-soft);color:var(--green)}
.sort-level-note{min-width:88px;color:var(--muted);font-size:10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-align:right}
.sort-level.current .sort-level-note{color:var(--text)}
.legend-dot.range{background:transparent;box-shadow:inset 0 0 0 1px var(--rose)}
.legend-dot.pivot{background:transparent;box-shadow:inset 0 0 0 2px var(--violet)}
.legend-dot.aux{background:transparent;border:1px dashed var(--subtle)}
@media(max-width:720px){.sort-level{grid-template-columns:44px minmax(0,1fr);}.sort-level-note{grid-column:2;text-align:left}.sort-stack{flex-direction:column;gap:6px}}
.sort-slot.split{position:relative;margin-left:14px}
.sort-slot.split:before{content:"";position:absolute;left:-11px;top:2px;bottom:2px;width:4px;border-radius:2px;background:var(--border-strong)}
.tree-badge{position:absolute;left:50%;top:100%;min-width:18px;height:15px;margin-top:3px;padding:0 5px;transform:translateX(-50%);border:1px solid rgba(52,211,153,.55);border-radius:999px;background:var(--surface);color:var(--green);font-size:9px;font-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:13px;text-align:center;white-space:nowrap;pointer-events:none}
.tree-meta{position:absolute;left:50%;top:100%;min-width:30px;height:14px;margin-top:3px;padding:0 6px;transform:translateX(-50%);border:1px solid var(--border-strong);border-radius:999px;background:var(--surface);color:var(--muted);font-size:9px;font-style:normal;font-weight:800;font-variant-numeric:tabular-nums;line-height:12px;text-align:center;white-space:nowrap;pointer-events:none}
.tree-meta.fb{margin-top:19px;border-color:rgba(96,165,250,.6);color:#60a5fa}
.tree-meta.fb.bad{border-color:var(--rose);background:rgba(251,113,133,.14);color:var(--rose)}
.tree-meta~.tree-tag{margin-top:21px}
.tree-extra{align-self:stretch}
.tree-extra .sort-stack{width:100%}
.rec-stack{width:min(100%,380px);display:flex;flex-direction:column;gap:8px}
.rec-stack-title{display:flex;align-items:baseline;gap:8px;color:var(--text);font-size:12px;font-weight:800}
.rec-stack-title small{color:var(--subtle);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.rec-frames{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}
.rec-frame{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;gap:12px;padding:5px 10px;border:1px solid var(--border-strong);border-radius:8px;background:var(--surface);color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px}
.rec-frame b{font-weight:800}
.rec-frame em{color:var(--amber);font-style:normal;font-weight:700;text-align:right}
.rec-frame.top{border-color:rgba(34,211,238,.5);background:var(--cyan-soft);color:var(--cyan)}
.rec-empty{color:var(--subtle);font-size:11px;text-align:center}
.rec-returned{min-width:200px;padding:6px 14px;border:1px dashed transparent;border-radius:10px;color:transparent;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;font-weight:800;text-align:center}
.rec-returned.show{border-color:rgba(52,211,153,.5);background:var(--green-soft);color:var(--green)}
/* Módulo de Heap Sort (o heap como árvore, marcadores pai, raiz, filho e trocar, lista de código que rola) */
.sort-chip.pai,.sort-chip.raiz{border-color:rgba(139,92,246,.45);background:var(--violet-soft);color:var(--violet)}
.sort-chip.filho{border-color:rgba(251,191,36,.5);background:var(--amber-soft);color:var(--amber)}
.sort-chip.trocar{border-color:rgba(52,211,153,.45);background:var(--green-soft);color:var(--green)}
.heap-scroll{overflow-x:auto;padding:0 6px;scrollbar-width:thin}
.heap-svg{display:block;width:100%;height:auto;margin:0 auto}
.heap-svg text{stroke:none}
.heap-edge{stroke:var(--border-strong);stroke-width:1.5}
.heap-edge.hot{stroke:var(--cyan);stroke-width:2;opacity:.8}
.heap-edge.out{stroke-dasharray:3 4;opacity:.3}
.heap-node circle{fill:var(--surface-2);stroke:var(--border-strong);stroke-width:1.5;transition:fill 160ms ease,stroke 160ms ease}
.heap-value{fill:var(--text);font-size:15px;font-weight:800;text-anchor:middle;dominant-baseline:central;font-variant-numeric:tabular-nums}
.heap-index{fill:var(--subtle);font-size:10px;font-weight:700;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-anchor:end}
.heap-role{fill:var(--muted);font-size:10.5px;font-weight:800;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-anchor:middle}
.heap-role.kin{fill:var(--violet)}
.heap-node.out circle{fill:var(--green-soft);stroke:rgba(52,211,153,.35)}
.heap-node.out .heap-value{fill:var(--green);opacity:.7}
.heap-node.pivot circle{fill:var(--violet-soft);stroke:var(--violet);stroke-width:2.5}
.heap-node.pivot .heap-value,.heap-node.pivot .heap-role{fill:var(--violet)}
.heap-node.compared circle{fill:var(--amber-soft);stroke:var(--amber);stroke-width:2}
.heap-node.compared .heap-value,.heap-node.compared .heap-role{fill:var(--amber)}
.heap-node.found circle{fill:var(--green-soft);stroke:var(--green);stroke-width:2.5}
.heap-node.found .heap-value,.heap-node.found .heap-role{fill:var(--green)}
.heap-node.warn circle{fill:rgba(251,113,133,.12);stroke:var(--rose);stroke-width:2.5}
.heap-node.warn .heap-value,.heap-node.warn .heap-role{fill:var(--rose)}
.heap-node.changed circle{animation:heap-pulse 520ms ease}
.heap-node.inspected circle{stroke:var(--violet);stroke-width:2;stroke-dasharray:4 3}
.heap-node.kin circle{stroke:var(--violet);stroke-dasharray:2 3}
@keyframes heap-pulse{0%,100%{stroke-width:2}50%{stroke-width:5}}
.heap-inspection{flex-wrap:wrap}
.heap-inspection strong{margin-left:0;font-size:10px;font-weight:700;line-height:1.6}
.code-lines.scrolls{position:relative;max-height:min(62vh,560px);overflow-y:auto}