.tutorial-main{--sort-red:#dc2626;--sort-orange:#ea580c}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tutorial-main{--sort-red:#f87171;--sort-orange:#fb923c}}:root[data-theme=dark] .tutorial-main{--sort-red:#f87171;--sort-orange:#fb923c}.plate-t code{font-family:var(--mono);text-transform:none}.sort-module{display:flex;flex-direction:column;gap:16px}.sort-segmented{display:inline-flex;gap:4px;padding:4px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-control);align-self:flex-start;flex-wrap:wrap}.sort-seg{padding:7px 16px;font-size:14px;font-weight:600;border:none;border-radius:7px;background:none;color:var(--graphite);cursor:pointer;transition:background .15s,color .15s}.sort-seg:hover{color:var(--ink)}.sort-seg.active{background:var(--panel);color:var(--accent);box-shadow:var(--shadow-sm)}.sort-note{font-size:13px;line-height:1.7;color:var(--graphite);max-width:74ch}.sort-hint{font-size:12px;color:var(--faint);margin-top:-8px}.sort-hint-error{color:var(--sort-red)}.sort-explain{padding:14px 16px;border-radius:var(--r-control);border:1px solid var(--line);border-left:4px solid var(--accent);background:color-mix(in srgb,var(--ink-sort) 10%,transparent)}.sort-explain strong{font-size:15px}.sort-explain p{font-size:13px;line-height:1.6;color:var(--graphite);margin-top:6px}.sort-toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px}.sort-field{display:flex;flex-direction:column;gap:6px}.sort-field-grow{flex:1 1;min-width:220px}.sort-field-label{font-size:12px;color:var(--graphite);text-transform:uppercase;letter-spacing:.05em}.sort-input,.sort-select{padding:9px 12px;font-size:15px;font-family:var(--mono);border:1px solid var(--line-strong);border-radius:var(--r-control);background:var(--paper);color:var(--ink);min-height:42px}.sort-select{cursor:pointer;min-width:200px}.sort-input:focus,.sort-select:focus{outline:2px solid var(--accent);outline-offset:1px}.sort-custom{display:flex;gap:8px}.sort-custom .sort-input{flex:1 1;min-width:0}.sort-slider{width:100%;accent-color:var(--accent)}.sort-btn-ghost{padding:9px 16px;min-height:42px;font-size:13px;font-weight:600;border:1px solid var(--line-strong);border-radius:var(--r-control);background:var(--paper);color:var(--graphite);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}.sort-btn-ghost:hover{background:var(--panel-2);color:var(--ink)}.sort-arena{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-control);padding:16px}.sort-bars{display:flex;align-items:flex-end;justify-content:center;gap:10px;height:240px}.sort-bar-col{display:flex;flex-direction:column;align-items:center;gap:6px;flex:1 1;max-width:64px;height:100%}.sort-bar-track{flex:1 1;width:100%;display:flex;align-items:flex-end}.sort-bar{width:100%;border-radius:6px 6px 2px 2px;min-height:4px}.sort-bar,.sort-bar-default{background:var(--ink-walk)}.sort-bar-compare{background:var(--accent)}.sort-bar-swap{background:var(--sort-red)}.sort-bar-key{background:var(--ink-rec)}.sort-bar-min{background:var(--sort-orange)}.sort-bar-sorted{background:var(--ink-ll)}.sort-bar-label{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--graphite)}.sort-bar-label-compare{color:var(--accent)}.sort-bar-label-swap{color:var(--sort-red)}.sort-bar-label-key{color:var(--ink-rec)}.sort-bar-label-min{color:var(--sort-orange)}.sort-bar-label-sorted{color:var(--ink-ll)}.sort-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.sort-legend-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--graphite)}.sort-dot{width:12px;height:12px;border-radius:3px;display:inline-block}.sort-trace{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-control);padding:16px;min-height:96px;overflow-x:auto}.sort-stage,.sort-trace{display:flex;align-items:center}.sort-stage{gap:8px;flex-wrap:wrap}.sort-stage-tag{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;padding:3px 10px;border-radius:6px}.sort-stage-tag-base{background:var(--panel);color:var(--graphite);border:1px solid var(--line)}.sort-stage-arrow,.sort-stage-plus{font-family:var(--mono);font-size:16px;color:var(--faint);font-weight:700}.sort-pills{display:inline-flex;gap:5px}.sort-pill{font-family:var(--mono);font-size:14px;font-weight:600;padding:4px 9px;border-radius:7px;border:1.5px solid}.sort-pill-pivot{border-color:var(--sort-red);color:#fff;background:var(--sort-red)}.sort-pill-empty{font-family:var(--mono);font-size:12px;color:var(--faint);font-style:italic}.sort-stats{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:10px;gap:10px}.sort-stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 10px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-control)}.sort-stat-num{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--accent);text-transform:capitalize}.sort-stat-label{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--faint)}.sort-result{font-size:14px;color:var(--graphite)}.sort-result strong{font-family:var(--mono);color:var(--ink-ll)}.sort-code-toggle{border-top:1px solid var(--line);padding-top:12px}.sort-code-toggle summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent);margin-bottom:10px}.sort-cmp-bars{display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-control)}.sort-cmp-row{display:grid;grid-template-columns:92px 1fr auto;align-items:center;grid-gap:12px;gap:12px}.sort-cmp-name{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--graphite)}.sort-cmp-track{height:22px;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden}.sort-cmp-bar{height:100%;border-radius:6px;min-width:4px}.sort-cmp-slow{background:var(--sort-red)}.sort-cmp-ok{background:var(--accent)}.sort-cmp-fast{background:var(--ink-ll)}.sort-cmp-val{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px;white-space:nowrap}.sort-cmp-cx{font-size:11px;font-weight:500;color:var(--faint)}.sort-key-cols{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;grid-gap:14px;gap:14px}@media (max-width:560px){.sort-key-cols{grid-template-columns:1fr}.sort-key-arrow{transform:rotate(90deg)}}.sort-key-col{display:flex;flex-direction:column;gap:8px}.sort-key-label{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint)}.sort-key-list{display:flex;flex-wrap:wrap;gap:6px}.sort-key-pill{font-family:var(--mono);font-size:13px;padding:5px 10px;border-radius:7px;background:var(--panel-2);border:1px solid var(--line);color:var(--graphite)}.sort-key-pill-after{background:color-mix(in srgb,var(--ink-sort) 14%,transparent);border-color:var(--accent);color:var(--accent);font-weight:600}.sort-key-arrow{font-size:22px;color:var(--faint);text-align:center}.sort-builtin{margin-top:8px;display:flex;flex-direction:column;gap:8px}.sort-builtin-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:600}.sort-props{display:flex;flex-direction:column;gap:18px}.sort-concept-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));grid-gap:12px;gap:12px}.sort-concept{padding:14px 16px;border-radius:var(--r-control);border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--panel);box-shadow:var(--shadow-sm)}.sort-concept-term{font-size:15px;font-weight:700;color:var(--accent)}.sort-concept-def{font-size:13px;line-height:1.5;color:var(--ink);margin-top:6px}.sort-concept-why{font-size:12.5px;line-height:1.55;color:var(--graphite);margin-top:6px}.sort-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-control)}.sort-table{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}.sort-table td,.sort-table th{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}.sort-table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);font-weight:600;background:var(--panel-2)}.sort-table td code{font-family:var(--mono);font-size:12px;color:var(--graphite)}.sort-table-row{cursor:pointer;transition:background .12s}.sort-table-row:hover{background:var(--panel-2)}.sort-table-row.open{background:color-mix(in srgb,var(--accent) 12%,transparent)}.sort-table-algo{font-weight:600;color:var(--ink)}.sort-mark-yes{color:var(--ink-ll);font-weight:700}.sort-mark-no,.sort-table-chev{color:var(--faint)}.sort-table-chev{font-family:var(--mono);font-size:16px;text-align:center}.sort-table-detail-row td{padding:0 12px;border-bottom:1px solid var(--line)}.sort-table-detail{font-size:13px;line-height:1.6;color:var(--graphite);padding:10px 0}.sort-why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-gap:12px;gap:12px}.sort-why{padding:16px;border-radius:var(--r-control);border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow-sm)}.sort-why h3{font-size:14px;font-weight:600;margin-bottom:6px}.sort-why p{font-size:13px;line-height:1.6;color:var(--graphite)}.sort-decide{margin-top:18px;display:flex;flex-direction:column;gap:10px}.sort-decide-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--faint);font-weight:600}.sort-decide-table{width:100%;border-collapse:collapse;font-size:13px;border:1px solid var(--line);border-radius:var(--r-control);overflow:hidden}.sort-decide-table td,.sort-decide-table th{padding:10px 14px;text-align:left;border-bottom:1px solid var(--line);line-height:1.5}.sort-decide-table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--faint);font-weight:600;background:var(--panel-2)}.sort-decide-table td:first-child{color:var(--ink)}.sort-decide-table td:last-child{color:var(--graphite)}.sort-decide-table tr:last-child td{border-bottom:none}@media (prefers-reduced-motion:reduce){.sort-bar,.sort-cmp-bar,.sort-table-detail{transition:none!important;animation:none!important}}