.ds-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start;margin:24px 0 32px}.ds-workspace>*{min-width:0;margin:0!important}.ds-presets-box{background:var(--surface,#191c26);border:1px solid var(--border,#30354a);border-radius:12px;padding:16px;margin:20px 0}.ds-presets-box h3{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#8a8fb5);margin:0 0 10px}.ds-presets{display:flex;gap:8px;flex-wrap:wrap}.ds-preset,.ds-lang-tab{border:1px solid var(--border2,#3e4565);background:var(--surface2,#22263a);color:var(--text,#eef0fa);border-radius:9px;padding:8px 11px;cursor:pointer;font:600 12px var(--sans,system-ui)}.ds-preset:hover,.ds-lang-tab:hover{border-color:var(--accent,#7784c8);transform:translateY(-1px)}.ds-lang-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:13px;background:var(--surface2,#22263a);border-bottom:1px solid var(--border,#30354a)}.ds-lang-tab.active{border-color:var(--accent,#7784c8);background:#293052}.ds-lang-panel{display:none}.ds-lang-panel.active{display:block}.ds-lang-panel pre{margin:0!important;white-space:pre!important;overflow:auto!important;line-height:1.65!important}.ds-lang-panel code{white-space:pre!important}.ds-notes{background:var(--surface,#191c26);border:1px solid var(--border,#30354a);border-radius:12px;padding:18px;margin:28px 0}.ds-notes textarea{width:100%;min-height:150px;background:var(--bg,#0f1117);color:var(--text,#eef0fa);border:1px solid var(--border2,#3e4565);border-radius:9px;padding:12px;resize:vertical}.ds-notes-foot{display:flex;justify-content:space-between;margin-top:8px;color:var(--muted,#8a8fb5);font-size:12px}.ds-complete{position:fixed;right:20px;bottom:20px;z-index:450;width:min(360px,calc(100vw - 28px));padding:16px;background:var(--surface,#191c26);border:1px solid var(--border,#30354a);border-radius:16px;box-shadow:0 16px 45px rgba(0,0,0,.45)}.ds-complete button{width:100%;margin-top:10px;padding:10px;border:1px solid var(--border2,#3e4565);border-radius:8px;background:var(--surface2,#22263a);color:var(--text,#eef0fa)}#tree-canvas{width:100%!important;height:auto!important;max-height:480px}.walkthrough,.trav-panel{max-height:700px;overflow:auto}.design-ui-credit,.algo-bookmark,#bookmarkBtn,#markComplete{display:none!important}
@media(max-width:900px){.ds-workspace{grid-template-columns:1fr}.walkthrough,.trav-panel{max-height:460px}}
/* Force the upgraded workspace to override legacy grid coordinates. */
.ds-workspace{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;grid-template-areas:"animation iteration"!important;width:100%!important}
.ds-workspace>*{min-width:0!important;margin:0!important;position:relative!important;inset:auto!important;transform:none!important;width:100%!important;max-width:none!important;grid-row:1!important}
.ds-workspace>.anim-panel,.ds-workspace>.tree-panel{grid-area:animation!important;grid-column:1!important}
.ds-workspace>.walkthrough,.ds-workspace>.trav-panel{grid-area:iteration!important;grid-column:2!important}
@media(max-width:980px){.ds-workspace{grid-template-columns:1fr!important;grid-template-areas:"animation" "iteration"!important}.ds-workspace>.anim-panel,.ds-workspace>.tree-panel{grid-column:1!important;grid-row:1!important}.ds-workspace>.walkthrough,.ds-workspace>.trav-panel{grid-column:1!important;grid-row:2!important}}

.ds-workspace{grid-column:1/-1!important;grid-row:auto!important;align-self:start!important}
.ds-workspace>.anim-panel,.ds-workspace>.tree-panel,.ds-workspace>.walkthrough,.ds-workspace>.trav-panel{overflow-x:auto!important;box-sizing:border-box!important;min-height:520px}
.ds-workspace canvas,.ds-workspace svg{max-width:100%!important}
.anim-panel>.ds-presets-box,.tree-panel>.ds-presets-box{margin:18px 0 0!important;width:100%!important;box-sizing:border-box!important}
.code-section .ds-lang-panel pre{white-space:pre!important;overflow-x:auto!important;overflow-y:auto!important;word-break:normal!important;overflow-wrap:normal!important;tab-size:4!important;min-height:180px}
@media(max-width:980px){.ds-workspace>.anim-panel,.ds-workspace>.tree-panel,.ds-workspace>.walkthrough,.ds-workspace>.trav-panel{min-height:0}}