@import "https://fonts.googleapis.com/css2?family=Baloo+2:wght@400;600;700;800&family=Nunito:wght@400;600;700;800&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-height:100vh;margin:0}#root{min-height:100vh}:root{--bg:#fffaf2;--bg-accent:#fff3d6;--surface:#fff;--surface-soft:#fff8e8;--surface-strong:#ffe8c2;--text:#2d2118;--muted:#644c3b;--line:#f0d7b3;--brand:#ff7a59;--brand-strong:#f8663c;--brand-soft:#ffe1d6;--teal:#2ec4b6;--teal-soft:#d7f7f2;--green:#6bcf63;--green-soft:#e8f8e2;--purple:#9b5de5;--purple-soft:#efe2ff;--yellow:#ffc857;--yellow-soft:#fff2c7;--danger:#e76f51;--danger-bg:#ffe3da;--success:#2a9d5c;--success-bg:#e3f8ea;--info:#2ba3c2;--info-bg:#e2f6fc;--shadow:0 18px 42px #7458371f;--shadow-soft:0 10px 24px #74583714;--radius-lg:22px;--radius-md:16px;--radius-sm:12px;--font-display:"Baloo 2", "Trebuchet MS", "Segoe UI", sans-serif;--font-body:"Nunito", "Segoe UI", sans-serif;color:var(--text);background:var(--bg);font-family:var(--font-body);letter-spacing:0;font-size:17px}[data-theme=dark]{--bg:#171225;--bg-accent:#221b38;--surface:#25203d;--surface-soft:#2f2747;--surface-strong:#3b3156;--text:#f8efe6;--muted:#cbbeb0;--line:#493d66;--brand:#ff8d6b;--brand-strong:#ff7a59;--brand-soft:#4a2e2b;--teal:#48d1c2;--teal-soft:#23483f;--green:#84d96b;--green-soft:#2a4430;--purple:#c79cff;--purple-soft:#433055;--yellow:#ffcd5c;--yellow-soft:#4b3b20;--danger:#ff9b7d;--danger-bg:#4b2b25;--success:#7fde9a;--success-bg:#244734;--info:#7dd8f5;--info-bg:#203b45;--shadow:0 18px 42px #0808126b;--shadow-soft:0 10px 24px #08081242}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at top left, #ffc85738, transparent 22rem), radial-gradient(circle at top right, #2ec4b629, transparent 20rem), linear-gradient(180deg, #fffdf7 0%, var(--bg) 100%);min-height:100vh;color:var(--text);margin:0;transition:background-color .18s,color .18s}[data-theme=dark] body{background:radial-gradient(circle at top left, #ffc85729, transparent 22rem), radial-gradient(circle at top right, #48d1c229, transparent 20rem), linear-gradient(180deg, #171225 0%, var(--bg) 100%)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #ff7a5942}h1,h2,p{margin:0}h1{color:var(--text);font-family:var(--font-display);letter-spacing:-.02em;max-width:940px;margin-top:.4rem;font-size:clamp(2.35rem,4.2vw,4.1rem);font-weight:800;line-height:.95}h2{color:var(--text);font-family:var(--font-display);font-size:1.24rem;line-height:1.25}.app-shell{min-height:100vh;padding-bottom:2rem;position:relative}.intro-band{background:linear-gradient(135deg,#ff7a5929,#0000 45%),linear-gradient(145deg,#fffdf8 0%,#fff4e4 56%,#f8f5ff 100%);border:1px solid #f0d7b3cc;border-radius:0 0 32px 32px;padding:3.2rem clamp(1rem,4vw,4rem) 2.6rem;position:relative;overflow:hidden}.intro-band:before,.intro-band:after{content:"";filter:blur(4px);opacity:.8;border-radius:999px;position:absolute}.intro-band:before{background:#2ec4b629;width:180px;height:180px;top:-3rem;right:-2rem}.intro-band:after{background:#ffc85738;width:220px;height:220px;bottom:-3rem;left:-2rem}.intro-band>div,.lesson-band,.interactive-layout,.priority-section{max-width:1220px;margin:0 auto}.intro-band>div{text-align:center;z-index:1;position:relative}.theme-toggle{color:var(--text);box-shadow:var(--shadow-soft);background:#ffffffbd;border:1px solid #ff7a5933;border-radius:999px;justify-content:center;align-items:center;gap:.45rem;margin-bottom:1rem;padding:.55rem .8rem;transition:transform .18s,box-shadow .18s;display:inline-flex;position:absolute;top:0;right:0}.theme-toggle:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.theme-toggle__icon{fill:currentColor;width:1rem;height:1rem}.intro-title{text-align:center;margin-inline:auto}.eyebrow{background:var(--purple-soft);color:var(--purple);letter-spacing:.09em;text-transform:uppercase;border:1px solid #9b5de52e;border-radius:999px;padding:.4rem .75rem;font-size:.76rem;font-weight:800;display:inline-flex}.intro-text{color:var(--muted);max-width:860px;margin:1rem auto 0;font-size:1.12rem;line-height:1.8}[data-theme=dark] .intro-band{background:linear-gradient(135deg,#ff8d6b38,#0000 45%),linear-gradient(145deg,#231b3a 0%,#2f2747 56%,#1d2436 100%);border-color:#ffffff14}[data-theme=dark] .theme-toggle{color:var(--text);background:#25203df2;border-color:#ffffff1f}.section-note{color:var(--muted);max-width:680px;margin-top:.45rem;font-size:1rem;line-height:1.6}.lesson-band{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:1.3rem clamp(1rem,4vw,4rem) 0;display:grid}.lesson-band article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);min-height:152px;padding:1.2rem;transition:transform .18s,box-shadow .18s}.lesson-band article:hover{box-shadow:var(--shadow);transform:translateY(-3px)}.lesson-band article:nth-child(2){background:linear-gradient(135deg,#ffc85729,#fffffffa)}.lesson-band article:nth-child(3){background:linear-gradient(135deg,#2ec4b624,#fffffffa)}[data-theme=dark] .lesson-band article:nth-child(2){background:linear-gradient(135deg,#ffcd5c33,#25203dfa)}[data-theme=dark] .lesson-band article:nth-child(3){background:linear-gradient(135deg,#48d1c233,#25203dfa)}.lesson-band p{color:var(--muted);margin-top:.55rem;font-size:1rem;line-height:1.7}.interactive-layout{grid-template-columns:minmax(0,1fr) 380px;align-items:start;gap:1.3rem;padding:1.3rem clamp(1rem,4vw,4rem) 3rem;display:grid}.heap-area,.workbench,.priority-section{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow)}.heap-area{min-height:640px;padding:clamp(1rem,3vw,1.6rem)}.section-heading,.panel-heading,.action-row{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.section-heading{flex-wrap:wrap;align-items:flex-start;margin-bottom:1rem}.mode-chip,.step-counter{background:var(--yellow-soft);color:#8a5c00;white-space:nowrap;border:1px solid #ffc85766;border-radius:999px;padding:.4rem .72rem;font-size:.82rem;font-weight:800}.tree-shell{max-width:760px;min-height:430px;margin:1.6rem auto 1.4rem;position:relative}.heap-tree{z-index:1;grid-template-rows:repeat(3,120px);grid-template-columns:repeat(4,minmax(86px,1fr));display:grid;position:relative}.node-position{justify-content:center;align-items:center;display:flex}.node-0{grid-column:2/4}.node-1{grid-column:1/3}.node-2{grid-column:3/5}.node-3,.node-4,.node-5{grid-row:3}.node-3{grid-column:1}.node-4{grid-column:2}.node-5{grid-column:3}.tree-lines{pointer-events:none;position:absolute;inset:0}.edge{transform-origin:0;background:#b9c7d8;width:190px;height:3px;position:absolute;top:86px;left:50%}.edge-0-1{transform:rotate(147deg)}.edge-0-2{transform:rotate(33deg)}.edge-1-3{width:132px;top:205px;left:28%;transform:rotate(143deg)}.edge-1-4{width:132px;top:205px;left:28%;transform:rotate(37deg)}.edge-2-5{width:132px;top:205px;left:72%;transform:rotate(143deg)}.heap-node{background:var(--surface-soft);border:2px dashed var(--teal);color:var(--muted);cursor:pointer;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;width:86px;height:86px;transition:transform .16s,border-color .16s,background .16s;display:flex}.heap-node:hover{border-color:var(--brand);background:#2ec4b61f;transform:translateY(-2px)scale(1.02)}.heap-node span{color:var(--text);font-size:1.6rem;font-weight:800;line-height:1}.heap-node small{color:var(--muted);margin-top:.35rem;font-size:.72rem;font-weight:700}.heap-node.filled{background:var(--teal-soft);border-color:var(--teal);border-style:solid;box-shadow:0 10px 24px #2ec4b629}.heap-node.invalid{background:var(--danger-bg);border-color:var(--danger)}.feedback{border-radius:var(--radius-md);box-shadow:var(--shadow-soft);gap:.3rem;padding:1rem 1.1rem;line-height:1.45;display:grid}.feedback.neutral{background:var(--info-bg);color:var(--info)}.feedback.success{background:var(--success-bg);color:var(--success)}.feedback.error{background:var(--danger-bg);color:var(--danger)}.workbench{background:var(--line);gap:1px;display:grid;overflow:hidden}.tool-panel{background:var(--surface);border-bottom:1px solid var(--line);padding:1.1rem}.tool-panel:last-child{border-bottom:0}.value-bank,.ordered-list,.mini-list{flex-wrap:wrap;gap:.55rem;min-height:42px;margin-top:.8rem;display:flex}.value-pill,.ordered-list span,.mini-list span{border-radius:999px;justify-content:center;align-items:center;min-width:48px;min-height:40px;padding:.5rem .72rem;font-weight:800;display:inline-flex}.value-pill{background:var(--brand-soft);color:var(--brand-strong);cursor:grab;box-shadow:var(--shadow-soft);border:1px solid #f8663c33;transition:transform .18s,box-shadow .18s}.value-pill:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.value-pill.selected{background:var(--purple);border-color:var(--purple);color:#fff}.empty-state,.muted{color:var(--muted);font-size:.95rem}.segmented-control{background:var(--surface-soft);border:1px solid var(--line);border-radius:999px;grid-template-columns:1fr 1fr;gap:.25rem;margin-top:.8rem;padding:.25rem;display:grid}.segmented-control button,.primary-button,.secondary-button,.ghost-button{cursor:pointer;border-radius:999px;min-height:42px;padding:.6rem .95rem;font-weight:800;transition:transform .18s,box-shadow .18s,background .18s}.segmented-control button{color:var(--muted);background:0 0;border:0}.segmented-control button.active{background:var(--surface);box-shadow:var(--shadow-soft);color:var(--purple)}.action-row{flex-wrap:wrap;justify-content:flex-start;margin-top:.95rem}.primary-button{background:linear-gradient(135deg, var(--brand) 0%, var(--yellow) 100%);color:#fff;border:0;box-shadow:0 10px 22px #ff7a592e}.primary-button:hover,.secondary-button:hover,.ghost-button:hover{transform:translateY(-2px)}.secondary-button,.ghost-button{background:var(--surface-soft);border:1px solid var(--line);color:var(--text)}.secondary-button:disabled{cursor:not-allowed;opacity:.55;transform:none}.ghost-button{color:var(--purple);background:0 0;border-color:#9b5de538}.sort-stage{gap:.9rem;margin-top:.85rem;display:grid}.sort-stage strong,.step-text strong{color:var(--text)}.mini-list{margin-top:.45rem}.mini-list span{background:var(--surface-soft);border:1px solid var(--line);color:var(--muted);min-width:40px;min-height:34px}.mini-list span.active{background:var(--yellow-soft);color:#8a5c00;border-color:#ffc85773}.mini-list.sorted span,.ordered-list span{background:var(--green-soft);color:var(--success);border-color:#6bcf6333}.step-text{color:var(--muted);margin-top:.8rem;font-size:1rem;line-height:1.7}.priority-section{margin-bottom:3rem;padding:clamp(1rem,3vw,1.6rem);position:relative;overflow:hidden}.priority-section:before{background:linear-gradient(90deg, var(--brand), var(--teal), var(--yellow));content:"";height:5px;position:absolute;inset:0 0 auto}.priority-layout{grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:1rem;margin-top:1.2rem;display:grid}.priority-form{background:linear-gradient(135deg, var(--purple) 0%, var(--teal) 100%);border-radius:var(--radius-md);color:#fff;border:1px solid #ffffff3d;grid-template-columns:minmax(0,1fr) 160px auto;align-items:end;gap:.75rem;padding:1rem;display:grid}.priority-form label{color:#fffffff5;gap:.35rem;font-size:.9rem;font-weight:800;display:grid}.priority-form input{color:#fff;font:inherit;background:#ffffff2e;border:1px solid #ffffff4d;border-radius:999px;min-height:42px;padding:.65rem .8rem}.priority-form input::placeholder{color:#ffffffb3}[data-theme=dark] .priority-form{background:linear-gradient(135deg,#5a2f8f 0%,#1f5d62 100%);border-color:#ffffff24}[data-theme=dark] .priority-controls,[data-theme=dark] .tool-panel,[data-theme=dark] .heap-area,[data-theme=dark] .workbench,[data-theme=dark] .priority-section{background:var(--surface);color:var(--text)}[data-theme=dark] .value-pill,[data-theme=dark] .ordered-list span,[data-theme=dark] .mini-list span,[data-theme=dark] .secondary-button,[data-theme=dark] .ghost-button{background:var(--surface-soft);color:var(--text);border-color:var(--line)}[data-theme=dark] .segmented-control button.active{background:var(--surface-strong);color:var(--text)}[data-theme=dark] .mini-list span.active{background:var(--yellow-soft);color:var(--yellow)}[data-theme=dark] .feedback.neutral{background:var(--info-bg);color:var(--info)}[data-theme=dark] .feedback.success{background:var(--success-bg);color:var(--success)}[data-theme=dark] .feedback.error{background:var(--danger-bg);color:var(--danger)}[data-theme=dark] .priority-item{background:var(--surface-soft);color:var(--text);border-color:var(--line)}[data-theme=dark] .priority-item strong,[data-theme=dark] .priority-item small,[data-theme=dark] .priority-index{color:var(--text)}[data-theme=dark] .priority-item.high{background:var(--yellow-soft);color:#ffe6a3}[data-theme=dark] .priority-item.high small{color:#ffe6a3}[data-theme=dark] .priority-item.highest{background:var(--green-soft);color:#dfffe7}[data-theme=dark] .priority-item.highest small{color:#dfffe7}[data-theme=dark] .priority-badge,[data-theme=dark] .operation-summary span{color:var(--text)}.priority-form input:focus{border-color:#ffffffdb;outline:0;box-shadow:0 0 0 3px #ffffff29}.priority-controls{background:var(--surface-soft);border:1px solid var(--line);border-radius:var(--radius-md);padding:1rem}.priority-controls .secondary-button{width:100%;margin-top:.9rem}.priority-queue-view{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.8rem;min-height:76px;margin:1.2rem 0 1rem;display:grid}.priority-item{background:var(--surface-soft);border:1px solid var(--line);border-left:5px solid var(--teal);border-radius:var(--radius-md);color:#203049;gap:.25rem;min-height:118px;padding:.85rem;transition:transform .18s,box-shadow .18s;display:grid;position:relative}.priority-item:hover{box-shadow:var(--shadow-soft);transform:translateY(-3px)}.priority-index{color:#6b7c92;font-size:.75rem;font-weight:900}.priority-item strong{color:var(--text);overflow-wrap:anywhere}.priority-item small{font-weight:800}.priority-item.high{background:var(--yellow-soft);border-left-color:var(--yellow)}.priority-item.high small{color:#854d0e}.priority-item.highest{background:var(--green-soft);border-color:#6bcf633d;border-left-color:var(--success);box-shadow:0 12px 24px #2a9d5c29}.priority-item.highest:after{background:var(--success);content:"";border-radius:999px;width:10px;height:10px;position:absolute;top:.85rem;right:.85rem}.priority-item.highest small{color:#14532d}.priority-badge,.operation-summary span{border-radius:999px;align-items:center;min-height:28px;padding:.3rem .6rem;font-size:.76rem;font-weight:900;display:inline-flex}.priority-badge{background:var(--green-soft);color:var(--success);justify-self:start}.operation-summary{flex-wrap:wrap;gap:.45rem;margin-top:.85rem;display:flex}.operation-summary span{background:var(--surface);border:1px solid var(--line);color:var(--purple)}@media (width<=980px){.lesson-band,.interactive-layout,.priority-layout{grid-template-columns:1fr}.interactive-layout{padding-bottom:2rem}}@media (width<=620px){.intro-band{padding-top:2rem}.theme-toggle{margin-bottom:.9rem;position:static}.heap-area{min-height:auto}.section-heading,.panel-heading,.action-row,.priority-form{flex-direction:column;align-items:stretch}.priority-form{display:flex}.tree-shell{min-height:360px}.heap-tree{grid-template-rows:repeat(3,100px);grid-template-columns:repeat(4,minmax(58px,1fr))}.heap-node{width:68px;height:68px}.heap-node span{font-size:1.25rem}.tree-lines{display:none}}