:root{--bg:#101513;--sidebar:#141a17;--panel:#19201c;--panel-deep:#131a16;--border:#2b342e;--text:#e6eae5;--muted:#92a095;--faint:#65766a;--accent:#b4eb7c;--teal:#71c7b2;--accent-soft:#b4eb7c12;--danger:#f29b91;--code-size:14px;--shadow:0 20px 60px #0005;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;font-size:13px;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button{color:inherit}button:disabled{cursor:default;opacity:.35}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button{border:0;background:none}svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.app-shell{display:flex;min-height:100vh}.sidebar{width:232px;flex-shrink:0;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--border);background:var(--sidebar);display:flex;flex-direction:column;padding:29px 20px 16px;z-index:30}.brand{display:flex;align-items:center;gap:12px;font-size:19px;line-height:1.2;letter-spacing:2.3px;font-weight:800}.brand-mark{width:42px;height:42px;background:var(--accent-soft);border:1px solid #b4eb7c2a;border-radius:12px;display:grid;place-items:center;color:var(--accent)}.brand-mark svg{width:34px;height:34px;stroke:none}.brand-sub{display:block;font-size:10px;letter-spacing:4px;color:var(--muted);margin-top:5px;font-weight:500}.workspace-label{margin:36px 8px 14px;color:var(--faint);font-size:10px;display:flex;justify-content:space-between}.workspace-label span{color:var(--muted)}.nav-list{display:grid;gap:6px}.nav-item{height:43px;display:flex;align-items:center;gap:12px;padding:0 13px;border-radius:7px;color:var(--muted);text-align:left;transition:.18s}.nav-item:hover{background:var(--accent-soft);color:var(--text)}.nav-item.active{color:var(--accent);background:var(--accent-soft);font-weight:600}.nav-dot{height:6px;width:6px;background:var(--accent);border-radius:50%;margin-left:auto}.nav-count{font-size:10px;margin-left:auto;color:var(--faint);background:var(--bg);padding:2px 5px;border-radius:4px}.sidebar-divider{height:1px;background:var(--border);margin:24px 0}.section-label{font-size:10px;letter-spacing:1px;color:var(--faint);display:flex;justify-content:space-between;padding:0 8px;margin-bottom:16px}.section-label span{color:var(--muted)}.path-list{position:relative;display:grid;gap:2px}.path-list:before{content:"";position:absolute;left:19px;top:20px;bottom:20px;width:1px;background:var(--border)}.path-item{position:relative;display:flex;align-items:center;gap:13px;text-align:left;padding:10px 8px;color:var(--muted);border-radius:6px}.path-item:hover{background:var(--accent-soft)}.path-item.active{color:var(--text)}.path-node{height:23px;width:23px;display:grid;place-items:center;border:1px solid var(--border);background:var(--sidebar);border-radius:50%;font-size:10px;z-index:1;color:var(--faint)}.path-item.active .path-node{color:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.path-item.complete .path-node{color:var(--accent);background:var(--accent-soft)}.path-item small{display:block;font-size:10px;color:var(--faint);margin-top:4px}.sidebar-bottom{margin-top:auto;padding-top:28px}.journey-card{padding:15px;border:1px solid var(--border);border-radius:9px;background:linear-gradient(130deg,var(--accent-soft),transparent)}.eyebrow{font-size:10px;font-weight:600;letter-spacing:1.6px;color:var(--faint)}.journey-card strong{display:block;font-size:11px;font-weight:500;margin-top:10px}.journey-card>span:last-child{font-size:10px;color:var(--muted)}.journey-progress{height:4px;background:var(--border);border-radius:4px;margin:15px 0 9px;overflow:hidden}.journey-progress i{display:block;width:0;background:var(--accent);height:100%;transition:width .4s}.profile{display:flex;align-items:center;width:100%;gap:10px;margin-top:20px;text-align:left;padding:0 2px}.avatar{width:32px;height:32px;border-radius:50%;background:#334435;color:#cee8c5;display:grid;place-items:center;font-family:Georgia,serif;font-size:16px}.profile strong{font-size:11px;font-weight:500}.profile small{display:block;font-size:10px;color:var(--faint);margin-top:4px}.profile-status{width:5px;height:5px;border-radius:50%;background:var(--teal);margin-left:auto}.main{margin-left:232px;width:calc(100% - 232px)}.topbar{height:66px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 32px;gap:16px}.breadcrumb{color:var(--faint);font-size:11px;white-space:nowrap}.breadcrumb span{padding:0 12px;color:var(--border)}.breadcrumb strong{font-weight:400;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:16px}.local-badge{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:7px}.local-badge i{background:var(--teal);height:5px;width:5px;border-radius:50%}.icon-button{height:30px;min-width:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:5px;color:var(--muted);font-size:11px}.icon-button:hover{background:var(--accent-soft);color:var(--text)}.shortcut-button{display:flex;align-items:center;gap:9px;border:1px solid var(--border);border-radius:6px;padding:7px 9px;font-size:10px;color:var(--muted)}.shortcut-button svg{width:13px;height:13px}kbd{font:10px "Segoe UI",sans-serif;border-radius:3px;background:#ffffff09;padding:2px 5px;color:var(--muted)}.view{max-width:1536px;margin:0 auto;padding:31px 32px 0}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:26px}.page-heading>.eyebrow,.page-heading .eyebrow{color:var(--teal);font-size:9px;letter-spacing:2.2px}h1{font-size:25px;font-weight:600;letter-spacing:-.8px;line-height:1.5;margin:8px 0 7px}h1>span{color:var(--accent)}.page-heading p{color:var(--muted);font-size:12px;margin:0}.language-badge{display:flex;align-items:center;gap:9px;white-space:nowrap;font-size:11px;border:1px solid var(--border);border-radius:6px;padding:9px 12px;background:var(--panel)}.language-badge>span:last-child{color:var(--faint);margin-left:8px}.python-icon{font-family:monospace;color:#e7c777;background:#e7c77712;border-radius:4px;font-size:11px;padding:3px}.lesson-banner{display:flex;align-items:center;gap:18px;padding:19px 22px;border:1px solid var(--border);border-radius:10px;background:linear-gradient(100deg,#b4eb7c08,transparent 65%),var(--panel);margin-bottom:22px}.lesson-number{font-size:26px;font-family:Georgia,serif;color:var(--accent);padding-right:20px;border-right:1px solid var(--border)}.lesson-summary{flex:1}.lesson-meta{display:flex;align-items:center;gap:11px;font-size:10px;color:var(--faint)}.lesson-meta>span:first-child{color:var(--teal)}.difficulty{font-size:9px;border:1px solid var(--border);padding:1px 5px;border-radius:3px}h2{font-size:16px;font-weight:600;margin:7px 0}p{line-height:1.8}.lesson-summary p{color:var(--muted);font-size:11px;margin:0}.text-button{display:flex;align-items:center;gap:9px;color:var(--accent);font-size:11px;padding:8px 0;white-space:nowrap}.text-button svg{width:14px;height:14px}.text-button:hover{filter:brightness(1.3)}.muted{color:var(--muted)}.workbench{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:22px;align-items:start}.editor-column{min-width:0;display:grid;gap:18px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:9px;overflow:hidden}.editor-toolbar{height:44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);background:var(--panel-deep)}.file-tab{display:flex;align-items:center;gap:9px;height:44px;padding:0 17px;border-bottom:2px solid var(--accent);background:var(--panel);font-size:11px}.file-tab svg{width:13px;height:13px;color:var(--teal)}.dirty-dot{height:5px;width:5px;border-radius:50%;background:var(--accent)}.dirty-dot.saved{opacity:0}.editor-actions{display:flex;align-items:center;gap:3px;padding-right:11px}.quiet-button{font-size:11px;padding:8px 10px;color:var(--muted);border-radius:5px}.quiet-button:hover{background:var(--accent-soft);color:var(--text)}.quiet-button kbd{margin-left:5px;font-size:9px}.editor-body{display:flex;height:285px;background:var(--panel-deep);padding-top:20px;overflow:hidden;--line-height:26px;font-family:Consolas,"Cascadia Code",monospace;font-size:var(--code-size)}.line-numbers{width:48px;flex-shrink:0;text-align:right;padding-right:15px;line-height:var(--line-height);color:var(--faint);overflow:hidden;white-space:pre;font-size:12px}.code-surface{flex:1;min-width:0;position:relative;overflow:hidden}.code-highlight,#code-editor{font-family:Consolas,"Cascadia Code",monospace;font-size:var(--code-size);line-height:var(--line-height);letter-spacing:0;tab-size:4;white-space:pre;margin:0;padding:0 20px 30px 0;box-sizing:border-box;border:0;background:none}.code-highlight{position:absolute;inset:0;pointer-events:none;overflow:hidden;color:var(--text)}#code-editor{position:relative;display:block;width:100%;height:100%;resize:none;outline:none;color:transparent;caret-color:var(--accent);-webkit-text-fill-color:transparent;overflow:auto}#code-editor::selection{background:#71c7b240}.token-comment{color:#6c8475}.token-string{color:#b4d993}.token-keyword{color:#c6a6e1}.token-function{color:#82c9b7}.token-number{color:#d9b985}.token-error{background:#f29b9120;text-decoration:underline wavy var(--danger);text-underline-offset:5px}.editor-footer{display:flex;justify-content:space-between;gap:10px;padding:9px 16px;font-size:9px;color:var(--faint);background:var(--panel-deep)}.footer-separator{padding:0 7px}.run-toolbar{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding:12px 16px}.run-toolbar>div{display:flex;gap:8px}.run-button{display:flex;align-items:center;justify-content:center;gap:9px;background:var(--accent);color:#213018;border-radius:6px;padding:10px 14px;font-size:11px;font-weight:600;transition:transform .15s,filter .15s}.run-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.run-button>span{font-size:9px}.run-button kbd{color:#36542a;background:#21301810;font-size:9px;margin-left:8px}.stop-button{width:34px;border:1px solid var(--border);border-radius:5px;color:var(--danger);font-size:10px}.output-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid var(--border);padding:0 15px;height:44px}.output-tabs{display:flex;height:100%;gap:23px}.output-tab{height:100%;border-bottom:2px solid transparent;color:var(--muted);font-size:11px;padding:0 0}.output-tab.active{color:var(--text);border-color:var(--teal)}.output-tab span{font-size:9px;background:var(--border);border-radius:4px;padding:2px 5px;margin-left:5px}.output-actions{display:flex;gap:8px;align-items:center}.simulation-tag{font-size:9px;color:var(--faint)}.console-content,.problem-content{min-height:151px;padding:20px;font-family:Consolas,"Microsoft YaHei",monospace;font-size:12px}.console-empty{display:flex;align-items:center;justify-content:center;gap:15px;padding:21px 0}.terminal-symbol{font-family:monospace;font-size:24px;color:var(--faint)}.console-empty strong{font-size:12px;font-weight:400;color:var(--muted)}.console-empty p{font-size:10px;color:var(--faint);margin:7px 0 0}.log-row{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8}.log-meta{color:var(--faint);font-size:10px;margin-bottom:12px}.log-success{color:var(--accent)}.log-error{color:var(--danger)}.log-input{color:var(--teal)}.terminal-input{display:flex;align-items:center;gap:8px;margin-top:15px;flex-wrap:wrap}.terminal-input label{color:var(--teal);font-size:11px}.terminal-input input{min-width:80px;flex:1;background:var(--panel-deep);border:1px solid var(--border);border-radius:4px;padding:9px;color:var(--text);width:100%}.terminal-input button{color:var(--accent);font-size:11px}.output-footer{border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:12px;padding:10px 16px;color:var(--faint);font-size:9px}.output-footer>span:first-child{display:flex;align-items:center;gap:6px}.output-footer i{height:5px;width:5px;border-radius:50%;background:var(--faint)}.output-footer i.running{background:var(--teal);animation:pulse 1s infinite}.output-footer i.success{background:var(--accent)}.output-footer i.error{background:var(--danger)}.learning-column{display:grid;gap:16px}.task-panel,.mentor-panel{padding:19px}.panel-title{display:flex;align-items:center;gap:9px}.title-icon{color:var(--accent);display:flex}.title-icon svg{width:16px;height:16px}.title-icon.teal{color:var(--teal)}h3{margin:0;font-size:12px;font-weight:600}.panel-title>span:last-child:not(:first-child){margin-left:auto;color:var(--faint);font-size:10px}.task-intro{font-size:10px;color:var(--faint);margin:12px 0 16px}.goal-list{display:grid;gap:15px;margin-bottom:19px}.goal{display:flex;gap:10px;align-items:flex-start;font-size:11px;line-height:1.7;color:var(--muted)}.goal-marker{width:15px;height:15px;border-radius:50%;border:1px solid var(--faint);flex-shrink:0;margin-top:2px;display:grid;place-items:center;font-size:10px}.goal.done .goal-marker{background:var(--accent);border-color:var(--accent);color:#213018}.goal.done{color:var(--text)}.expected-output{padding:13px;background:var(--panel-deep);border:1px dashed var(--border);border-radius:6px}.expected-output .eyebrow{font-size:9px;letter-spacing:.5px}.expected-output pre{font-size:11px;font-family:Consolas,"Microsoft YaHei",monospace;color:var(--teal);white-space:pre-wrap;line-height:1.8;margin:9px 0 0}.check-button{border:1px solid var(--border);width:100%;padding:10px 13px;border-radius:5px;font-size:11px;margin-top:17px;display:flex;justify-content:space-between;align-items:center;color:var(--muted)}.check-button:hover{border-color:var(--accent);color:var(--accent)}.check-button svg{width:13px;height:13px}.check-feedback{color:var(--teal);font-size:10px;margin:10px 0 0}.check-feedback:empty{display:none}.mentor-panel{background:linear-gradient(130deg,#71c7b20a,transparent),var(--panel)}.tiny-badge{font-family:monospace;font-size:8px!important;border:1px solid var(--border);padding:2px 5px;border-radius:3px}.mentor-panel>p{font-size:11px;color:var(--muted);margin:15px 0}.hint-button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-top:1px solid var(--border);color:var(--teal);font-size:11px}.hint-button>span{font-size:17px}.hint-content{font-size:11px;color:var(--text);line-height:1.8;margin:12px 0}.hint-content code{color:var(--accent);font-family:Consolas,monospace}.hint-step{margin:8px 0;padding-left:11px;border-left:2px solid var(--teal)}.mentor-footnote{display:flex;gap:7px;align-items:center;border-top:1px solid var(--border);padding-top:11px;color:var(--faint);font-size:9px}.mentor-footnote svg{width:17px;height:17px;fill:currentColor;stroke:none}.knowledge-peek{display:flex;align-items:center;gap:8px;padding:6px 6px 4px}.knowledge-peek>div{flex:1}.knowledge-peek .eyebrow{font-size:9px;letter-spacing:1px}.knowledge-peek h3{margin:9px 0;font-weight:500;font-size:11px}.knowledge-peek p{font-size:10px;color:var(--faint);margin:0}.knowledge-peek>.icon-button{border:1px solid var(--border);border-radius:50%;height:30px;width:30px}.knowledge-peek svg{width:13px;height:13px}.small-note{font-size:9px;color:var(--faint);display:flex;gap:7px;align-items:center;justify-content:center;margin-top:1px}.small-note>span{color:var(--accent)}.page-footer{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:25px;padding:17px 0 19px;border-top:1px solid var(--border);font-size:9px;color:var(--faint)}.page-footer>span:first-child{display:flex;align-items:center;gap:7px;font-size:8px;letter-spacing:1.2px}.page-footer svg{width:16px;height:16px;stroke:none;fill:currentColor}.secondary-view{padding-top:38px}.secondary-view h1{margin-bottom:12px}.secondary-view>.intro{color:var(--muted)}.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:26px 0}.content-card{border:1px solid var(--border);background:var(--panel);border-radius:10px;padding:24px;display:flex;flex-direction:column;align-items:start;text-align:left}.content-card:hover{border-color:var(--teal)}.content-card .card-index{font:26px Georgia,serif;color:var(--accent);margin-bottom:20px}.content-card h3{font-size:15px;margin:6px 0}.content-card p{font-size:12px;color:var(--muted);margin-bottom:20px}.card-meta{font-size:10px;color:var(--teal);margin-top:auto}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:25px}.stat{background:var(--panel);padding:22px;border:1px solid var(--border);border-radius:8px}.stat strong{display:block;font:30px Georgia,serif;color:var(--accent);margin:12px 0}.stat span{color:var(--muted);font-size:11px}.empty-files{border:1px dashed var(--border);border-radius:10px;text-align:center;padding:65px 20px;color:var(--muted);margin:28px 0}.empty-files .run-button{margin:20px auto;width:max-content}.file-actions{display:flex;gap:10px;margin-top:12px}.file-actions button{font-size:11px;color:var(--teal);border:1px solid var(--border);border-radius:5px;padding:8px 11px}.file-preview{font:11px/1.8 Consolas,monospace;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere;width:100%;max-height:100px;overflow:hidden}.library-search{margin-top:20px;max-width:500px}.search-input{width:100%;background:var(--panel-deep);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:13px;font-size:12px}dialog{color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:13px;width:min(650px,calc(100vw - 32px));max-height:80vh;padding:26px;box-shadow:var(--shadow)}dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dialog-heading h2{font-size:20px;margin:9px 0 0}.knowledge-entry{padding:20px 0;border-bottom:1px solid var(--border)}.knowledge-entry h3{color:var(--accent);font-family:Consolas,"Microsoft YaHei",monospace;font-size:14px}.knowledge-entry p{font-size:12px;color:var(--muted)}.knowledge-entry pre{padding:13px;background:var(--panel-deep);border-radius:5px;white-space:pre-wrap;line-height:1.8;color:var(--teal);font-family:Consolas,monospace;font-size:12px}.confirm-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:25px;flex-wrap:wrap}#confirm-dialog p{color:var(--muted)}.toast{position:fixed;left:calc(50% + 116px);bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--text);color:var(--bg);padding:13px 20px;border-radius:8px;font-size:12px;box-shadow:var(--shadow);transition:.2s;z-index:80;max-width:calc(100vw - 40px)}.toast.visible{opacity:1;transform:translate(-50%,0)}.problem-card{font-family:"Segoe UI","Microsoft YaHei",sans-serif}.problem-card h3{color:var(--danger);font-size:12px}.problem-card p{color:var(--muted);font-size:11px;margin:10px 0}.problem-card button{color:var(--teal);font-size:11px;padding:0}.mobile-menu,.scrim{display:none}@keyframes pulse{50%{opacity:.25}}
[data-theme="light"]{--bg:#f4f6f0;--sidebar:#eef2e9;--panel:#fff;--panel-deep:#f8faf5;--border:#dce3d5;--text:#243126;--muted:#5d705e;--faint:#71816d;--accent:#4d7628;--teal:#21765e;--accent-soft:#638d2910;--danger:#b54138;color-scheme:light}[data-theme="light"] .run-button{background:#b4eb7c;color:#213018}[data-theme="light"] .token-comment{color:#7a8a71}[data-theme="light"] .token-string{color:#508226}[data-theme="light"] .token-keyword{color:#9255a4}[data-theme="light"] .token-function{color:#1d7a65}[data-theme="light"] .token-number{color:#9e692e}
@media(min-width:1550px){.view{padding-left:46px;padding-right:46px}.topbar{padding:0 46px}.workbench{grid-template-columns:minmax(0,1fr) 330px}.editor-body{height:340px}.console-content,.problem-content{min-height:180px}h1{font-size:29px}}
@media(max-width:1200px){.sidebar{width:204px;padding-left:15px;padding-right:15px}.main{margin-left:204px;width:calc(100% - 204px)}.view{padding:25px 22px 0}.topbar{padding:0 22px}.workbench{grid-template-columns:minmax(0,1fr) 260px;gap:16px}.task-panel,.mentor-panel{padding:16px}.page-heading h1{font-size:22px}.toast{left:calc(50% + 102px)}.language-badge{display:none}.editor-actions kbd{display:none}}
@media(max-width:1000px){.workbench{grid-template-columns:minmax(0,1fr)}.learning-column{grid-template-columns:1fr 1fr}.knowledge-peek,.small-note{display:none}.editor-body{height:300px}.local-badge{display:none}.page-footer>span:last-child{display:none}.sidebar-bottom{padding-top:16px}.journey-card{padding:12px}}
@media(max-width:720px){.sidebar{transform:translateX(-100%);transition:transform .2s;width:232px}.sidebar.open{transform:translateX(0)}.main{width:100%;margin-left:0}.mobile-menu{display:flex}.topbar{height:58px;padding:0 16px;justify-content:flex-start}.top-actions{margin-left:auto;gap:6px}.shortcut-button span,.shortcut-button kbd{display:none}.shortcut-button{border:0}.breadcrumb{font-size:10px}.breadcrumb span{padding:0 7px}.view{padding:24px 16px 0}.page-heading{margin-bottom:20px}.page-heading h1{font-size:21px}.page-heading p{font-size:11px}.lesson-banner{padding:15px;gap:12px;margin-bottom:16px}.lesson-number{font-size:23px;padding-right:13px}.lesson-summary h2{font-size:14px}.lesson-summary p{font-size:10px}.lesson-banner>.text-button{font-size:0}.lesson-banner>.text-button svg{width:20px;height:20px}.learning-column{grid-template-columns:1fr}.workbench{gap:18px}.editor-body{height:270px}.editor-actions{gap:0;padding-right:6px}.file-tab{padding:0 12px;font-size:10px;gap:6px}.file-tab svg{display:none}.editor-actions .icon-button{min-width:25px;font-size:10px}.quiet-button{padding:8px}.run-toolbar{padding:11px 12px}.console-content,.problem-content{padding:16px;min-height:140px}.console-empty{gap:10px;justify-content:start;padding:17px 0}.console-empty p{line-height:1.9}.output-footer{font-size:8px;padding:10px 12px}.page-footer{font-size:8px}.toast{left:50%;width:max-content}.scrim.open{display:block;position:fixed;inset:0;background:#0008;z-index:25}.cards-grid{grid-template-columns:1fr}.stats-row{grid-template-columns:1fr}.secondary-view{padding-top:28px}.panel-title h3{font-size:13px}dialog{padding:20px}.confirm-actions .run-button{width:100%;margin-top:6px}.sidebar-bottom{padding-top:26px}.journey-card{padding:15px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Dragon Code Lab v0.2 — presentation layer only */
:root{--bg:#0b101d;--sidebar:#0d1321;--panel:#111a2a;--panel-deep:#0d1524;--border:#233148;--text:#e2eaf6;--muted:#9aaac1;--faint:#73859e;--accent:#77cfff;--teal:#7cb9ef;--accent-soft:#77cfff0c;--danger:#f39499;--violet:#b6a0ec;--warm:#e4ba82;--shadow:0 20px 60px #02071270;color-scheme:dark}
body{background:radial-gradient(ellipse at 70% 0%,#18325c18,transparent 48%),var(--bg);font-size:14px}
button,a,summary{transition:background-color .16s,border-color .16s,color .16s,box-shadow .16s,transform .16s}
.sidebar{background:linear-gradient(180deg,#111c302b,transparent 40%),var(--sidebar);padding-top:25px;overflow-y:auto;scrollbar-width:thin}
.brand{font-weight:700;font-size:18px;letter-spacing:2px}.brand-mark{border-color:#77cfff30;background:linear-gradient(145deg,#77cfff14,#b6a0ec09);border-radius:10px;color:var(--accent)}
.brand-sub{letter-spacing:3.8px;color:var(--muted)}.workspace-label{font-size:11px;letter-spacing:.5px;margin-top:35px}.workspace-label>span{font-size:8px;letter-spacing:1px;color:var(--faint)}
.nav-item{font-size:13px;border-radius:7px;height:44px}.nav-item.active{background:linear-gradient(90deg,#77cfff12,#77cfff04);box-shadow:inset 2px 0 var(--accent);color:#c1e7ff}.nav-dot{background:var(--accent);box-shadow:0 0 8px #77cfff40;width:4px;height:4px}
.nav-count{background:transparent;font-size:10px}.section-label{font-size:10px;letter-spacing:.6px}.path-item{font-size:12px}.path-item small{font-size:10px;line-height:1.5}.path-item.active .path-node{box-shadow:0 0 0 3px #77cfff0b}.path-item.complete .path-node{color:var(--teal)}
.journey-card{border:0;border-top:1px solid var(--border);border-radius:0;padding:18px 6px 6px;background:none}.journey-card strong{font-size:12px;line-height:1.8}.journey-progress{height:3px}.journey-progress i{background:linear-gradient(90deg,var(--accent),var(--violet))}.profile{margin-top:22px}.avatar{background:linear-gradient(145deg,#203957,#29243e);color:#b6d7f2}.profile strong{font-size:12px}.profile small{font-size:9px}.profile-status{background:var(--accent)}
.topbar{height:60px;background:#0b101d85;border-color:#2331489c}.breadcrumb{font-size:11px}.top-actions{gap:14px}.shortcut-button{background:#0d1524;border-color:#233148;font-size:11px}.local-badge{font-size:10px}.local-badge i{background:var(--accent);box-shadow:0 0 7px #77cfff35}
.view{padding-top:25px}.page-heading{margin-bottom:20px}.page-heading .eyebrow{color:var(--faint);font-size:9px;letter-spacing:2px}h1{font-size:25px;line-height:1.45;letter-spacing:-.5px;margin-top:8px}.page-heading p{font-size:12px;color:var(--muted)}.language-badge{background:#10192b;border-color:var(--border);font-size:11px;border-radius:7px}.python-icon{background:#e4ba820b;color:var(--warm)}
.lesson-banner{border:0;border-left:2px solid #77cfff40;background:linear-gradient(90deg,#77cfff05,transparent 75%);padding:13px 18px;border-radius:0 7px 7px 0;margin-bottom:21px;gap:16px}.lesson-number{color:var(--faint);font-size:23px;border-right-color:#23314880;padding-right:18px}.lesson-meta{font-size:10px;gap:10px}.lesson-meta>span:first-child{color:var(--teal)}.difficulty{border:0;background:#b6a0ec12;color:var(--violet);padding:2px 5px}.lesson-summary h2{font-size:15px;margin:5px 0}.lesson-summary p{font-size:11px}.text-button{font-size:12px}.lesson-banner>.text-button{font-size:11px;color:var(--muted)}
.workbench{grid-template-columns:minmax(0,1fr) 282px;gap:24px}.editor-column{gap:19px}.panel{border-radius:10px;border-color:var(--border);transition:border-color .18s,box-shadow .18s}.panel:hover{border-color:#334967}
.editor-panel{background:var(--panel-deep);border-color:#354d6c;box-shadow:0 10px 30px #02071235,0 0 0 1px #77cfff05}.editor-panel:hover{border-color:#436184}.editor-panel:focus-within{border-color:#52799b;box-shadow:0 0 0 1px #77cfff10,0 12px 36px #02071240}
.editor-toolbar{height:47px;background:#101a2c;border-color:#24334b}.file-tab{height:47px;border-bottom:2px solid #77cfff;border-right:1px solid #233148;background:linear-gradient(180deg,#15263b,#102033);font-family:"Cascadia Code",Consolas,monospace;font-size:12px;padding:0 17px;gap:11px;color:#d2e9fb}.file-tab svg{color:var(--warm);width:14px;height:14px}.dirty-dot{background:var(--warm);width:5px;height:5px}.editor-actions{gap:5px;padding-right:12px}.editor-actions .quiet-button{font-size:11px}.editor-actions .icon-button{font-size:11px}
.editor-body{height:305px;background:radial-gradient(ellipse at top right,#11264120,transparent 70%),#0c1423;padding-top:20px;--line-height:27px;--code-font:"Cascadia Code","JetBrains Mono","SFMono-Regular",Consolas,"Microsoft YaHei",monospace}
.code-highlight,#code-editor{font-family:var(--code-font);line-height:var(--line-height);font-size:var(--code-size);font-weight:400;font-variant-ligatures:none;padding-right:20px}.code-surface{isolation:isolate}.active-code-line{position:absolute;top:var(--active-line-y,0px);left:0;right:0;height:var(--line-height);background:#7cb9ef09;border-left:2px solid #77cfff3d;pointer-events:none;opacity:.55;z-index:-1}.editor-panel:focus-within .active-code-line{background:#7cb9ef0e;opacity:1}.line-numbers{width:52px;padding-right:17px;color:#516985;font-family:var(--code-font);font-size:11px;line-height:var(--line-height);background:linear-gradient(#7cb9ef06,#7cb9ef06) 0 var(--active-line-y,0px)/100% var(--line-height) no-repeat}
.token-comment{color:#7a8da6}.token-string{color:#c6b3e7}.token-keyword{color:#e0aa8e}.token-function{color:#78cfff}.token-number{color:#e4ba82}
.editor-footer{background:#0c1423;border-top:1px solid #23314855;font-size:10px;color:#6d83a1;padding:8px 17px}.run-toolbar{background:#101b2c;padding:12px 16px;border-top-color:#293b54}.run-button{border-radius:6px;border:1px solid #8fd8ff60;background:linear-gradient(180deg,#3b8bba,#2e6e99);box-shadow:inset 0 1px #ffffff15,0 3px 8px #0002;color:#edf8ff;padding:10px 15px;font-size:12px;font-weight:500;gap:10px}.run-button:hover{background:linear-gradient(180deg,#4596c4,#357dab);filter:none;transform:none;box-shadow:inset 0 1px #ffffff20,0 0 12px #77cfff10}.run-button:active{background:#2e6e99;box-shadow:inset 0 2px 5px #0003}.run-button kbd{color:#c6e8ff;background:#05213a45;font-size:9px;border:1px solid #a0d9ff15}.run-button>span{font-size:9px}.stop-button{background:#152139;border-color:#2b3c55}.stop-button:not(:disabled):hover{background:#f394990d;border-color:#f3949945}.editor-panel[data-running="true"] .run-button{opacity:.6}.run-toolbar .muted{font-size:11px}
.output-panel{background:#0f1828;border-color:#2a3e59;box-shadow:none;position:relative;transition:border-color .2s}.output-toolbar{height:45px;background:#131d2e;border-color:#24324a}.output-tab{font-size:12px}.output-tab.active{border-color:var(--accent)}.output-tab span{background:#233148;color:var(--muted)}.simulation-tag{font-size:9px;color:#8b9eb8;border:1px solid #2a3b54;padding:2px 5px;border-radius:4px}.console-content,.problem-content{min-height:146px;max-height:290px;overflow:auto;font-family:"Cascadia Code",Consolas,"Microsoft YaHei",monospace;padding:20px;font-size:13px;line-height:1.8}.console-empty{justify-content:start;gap:17px;padding:17px 4px}.terminal-symbol{border:1px solid #2b405d;width:43px;height:43px;display:flex;align-items:center;justify-content:center;border-radius:8px;color:#6b96ba;font-size:22px;background:#77cfff03}.console-empty strong{font-size:13px;color:#a6bbd3}.console-empty p{font-size:11px;line-height:1.8;color:#768ca7;margin-top:7px}.log-row{animation:result-in .22s ease-out}.log-meta{font-size:10px;color:#758ba6}.log-success{color:#91d2c5}.log-error{color:var(--danger)}.log-input{color:#bca9e8}.output-footer{font-size:10px;border-color:#24324a;padding:10px 16px;background:#101b2b}.output-footer i.success{background:#91d2c5}.output-panel[data-state="success"]{border-color:#4b8b8555}.output-panel[data-state="success"] .output-footer{background:#102225}.output-panel[data-state="error"]{border-color:#b4637055}.output-panel[data-state="error"] .output-footer{background:#231b2a}.output-panel[data-state="running"]{border-color:#4d88b7}.output-panel[data-state="waiting"]{border-color:#8572ae55}.execution-indicator{display:none;align-items:center;gap:10px;padding:12px 18px;border-bottom:1px solid #77cfff15;background:#77cfff05;color:#c2e3fb;font-size:11px}.execution-indicator small{margin-left:auto;color:var(--faint);font-size:9px}.output-panel[data-state="running"] .execution-indicator{display:flex}.execution-bars{display:flex;gap:3px;align-items:center;height:14px}.execution-bars i{display:block;background:var(--accent);width:2px;height:9px;border-radius:1px;animation:execute-bar .75s ease-in-out infinite}.execution-bars i:nth-child(2){animation-delay:.12s}.execution-bars i:nth-child(3){animation-delay:.24s}.terminal-input input{border-color:#385571;background:#0c1423;padding:10px}.terminal-input button{padding:10px;color:var(--accent)}
.learning-column{gap:14px}.task-panel{background:linear-gradient(140deg,#77cfff04,transparent 65%),#111b2b;border-color:#2a3e57;box-shadow:none;padding:20px}.panel-title h3{font-size:13px}.title-icon{color:var(--teal)}.panel-title>span:last-child:not(:first-child){font-size:10px}.task-intro{font-size:11px;color:var(--muted);line-height:1.8;margin:13px 0 20px}.goal-list{gap:18px;margin-bottom:23px}.goal{font-size:12px;line-height:1.9;color:#c0cee0}.goal-marker{border-color:#52718d;width:15px;height:15px;margin-top:4px}.goal.done .goal-marker{background:#87c8b6;border-color:#87c8b6;color:#0d2430}.expected-output{background:#0c1524;border-color:#2a3b55;border-style:solid;border-radius:7px;padding:14px}.expected-output .eyebrow{font-size:10px;color:var(--faint)}.expected-output pre{font-size:12px;color:#a8c9e5;margin-top:11px}.check-button{font-size:12px;border-color:#344d6a;padding:11px 13px;color:#c0d2e6;background:#77cfff04;border-radius:6px}.check-button:hover{border-color:#77cfff65;background:#77cfff09}.check-feedback{font-size:11px;color:#91d2c5;line-height:1.9}
.assistant-fold{border:1px solid #26354c;border-radius:8px;background:transparent;overflow:hidden;padding:0;transition:border-color .16s}.assistant-fold:hover{border-color:#3b506b}.assistant-fold[open]{background:#111a2a}.assistant-fold>summary{display:flex;align-items:center;gap:9px;cursor:pointer;padding:16px;list-style:none;font-size:12px;color:var(--muted)}.assistant-fold>summary::-webkit-details-marker{display:none}.assistant-fold>summary:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;border-radius:8px}.assistant-fold .panel-title h3{font-size:12px;font-weight:400}.assistant-fold .title-icon{color:var(--violet)}.fold-chevron{margin-left:auto;font-size:14px!important;color:var(--faint);transition:transform .16s}.assistant-fold[open] .fold-chevron{transform:rotate(180deg)}.fold-body{padding:0 17px 15px;border-top:1px solid #23314870}.fold-body>p{font-size:11px;color:var(--muted);line-height:1.9;margin:15px 0}.hint-button{font-size:11px;color:#bca9e8}.hint-content{color:#bbcbdf;font-size:12px;line-height:1.9}.hint-step{border-left-color:#a693d8}.hint-content code{color:#9edbff}.mentor-footnote{font-size:10px;line-height:1.8;gap:8px}.knowledge-peek{display:block;padding:0;background:none;border:1px solid #26354c}.knowledge-peek h3{font-size:12px;color:#b9d1e9;margin:15px 0 9px}.knowledge-peek p{font-size:11px;color:var(--muted)}.knowledge-peek>.fold-body>.icon-button{display:flex;width:100%;border:1px solid #30445f;border-radius:6px;margin-top:12px;justify-content:flex-end;padding-right:12px;color:var(--accent)}.knowledge-peek>.fold-body>.icon-button:before{content:"查看知识卡";margin-right:auto;font-size:11px;padding-left:10px}.knowledge-label{font-size:12px}.small-note{font-size:10px;line-height:1.9;color:var(--faint);margin:3px 0}.small-note>span{color:var(--violet)}.page-footer{margin-top:25px;font-size:9px;border-color:#23314880;padding-top:15px}.page-footer>span:first-child{font-size:9px}.page-footer>span:last-child{font-size:9px}
.content-card{border-radius:10px;transition:border-color .18s,background-color .18s}.content-card:hover{background:#142138;border-color:#456381}.content-card .card-index{color:var(--accent)}.content-card p{font-size:13px}.stats-row .stat{border-radius:10px;background:var(--panel)}.stat strong{color:var(--accent)}dialog{border-radius:12px;background:#131e30;border-color:#3a526f}.search-input{border-radius:7px;background:#0c1524;border-color:#30445e;font-size:13px}.knowledge-entry h3{color:#b3dfff}.knowledge-entry p{font-size:13px;color:var(--muted)}.knowledge-entry pre{background:#0c1524;color:#c0b0e8}.toast{background:#20344f;border:1px solid #4a6e96;color:#e3effc;border-radius:8px}.icon-button{border-radius:6px}.profile:hover{background:#77cfff05;border-radius:7px}
@keyframes result-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes execute-bar{0%,100%{transform:scaleY(.45);opacity:.4}50%{transform:scaleY(1.3);opacity:1}}
[data-theme="light"]{--bg:#eef3fa;--sidebar:#e8eef7;--panel:#f9fbff;--panel-deep:#f3f7fc;--border:#ced9e8;--text:#22334a;--muted:#526983;--faint:#647b96;--accent:#216b9f;--teal:#3a78aa;--accent-soft:#3a78aa0b;--danger:#b1495a;--violet:#75549c;--warm:#88612e;color-scheme:light}
[data-theme="light"] .topbar{background:#eef3fa;border-color:var(--border)}[data-theme="light"] .shortcut-button,[data-theme="light"] .language-badge,[data-theme="light"] .task-panel,[data-theme="light"] .assistant-fold[open],[data-theme="light"] dialog{background:var(--panel);border-color:var(--border)}[data-theme="light"] .editor-body,[data-theme="light"] .editor-footer,[data-theme="light"] .expected-output,[data-theme="light"] .terminal-input input,[data-theme="light"] .search-input,[data-theme="light"] .knowledge-entry pre{background:#f6f9fe}[data-theme="light"] .editor-toolbar,[data-theme="light"] .run-toolbar,[data-theme="light"] .output-toolbar,[data-theme="light"] .output-footer{background:#e9f0fa;border-color:var(--border)}[data-theme="light"] .file-tab{background:#f4f8fd;color:#294663;border-right-color:var(--border)}[data-theme="light"] .output-panel{background:#f9fbff;border-color:#c0d1e3}[data-theme="light"] .run-button{background:linear-gradient(#3b8bba,#2e6e99);color:#fff}[data-theme="light"] .run-button kbd{color:#d6efff;background:#1d527a}[data-theme="light"] .goal,[data-theme="light"] .check-button{color:#405c77}[data-theme="light"] .token-comment{color:#7386a0}[data-theme="light"] .token-string{color:#815299}[data-theme="light"] .token-function{color:#246d9f}[data-theme="light"] .token-keyword{color:#9b6242}[data-theme="light"] .token-number{color:#936722}[data-theme="light"] .nav-item.active{color:#216b9f}[data-theme="light"] .console-empty strong,[data-theme="light"] .console-empty p,[data-theme="light"] .expected-output pre,[data-theme="light"] .knowledge-peek h3{color:var(--muted)}[data-theme="light"] .output-panel[data-state="success"] .output-footer{background:#e7f3ee}[data-theme="light"] .output-panel[data-state="error"] .output-footer{background:#f9eaee}[data-theme="light"] .stop-button{background:#f3f7fc;border-color:var(--border)}[data-theme="light"] .content-card:hover{background:#eaf2fb}[data-theme="light"] .hint-content,[data-theme="light"] .hint-button{color:#75549c}[data-theme="light"] .log-success,[data-theme="light"] .check-feedback{color:#327f70}[data-theme="light"] .log-input{color:#75549c}[data-theme="light"] .knowledge-entry pre{color:#75549c}[data-theme="light"] .knowledge-entry h3{color:#216b9f}[data-theme="light"] .terminal-symbol{color:#3a78aa}[data-theme="light"] .assistant-fold{border-color:var(--border)}[data-theme="light"] .fold-body{border-color:var(--border)}[data-theme="light"] .execution-indicator{color:#246d9f}
@media(min-width:1550px){.workbench{grid-template-columns:minmax(0,1fr) 310px}.editor-body{height:350px}.console-content,.problem-content{min-height:165px}}
@media(max-width:1200px){.workbench{grid-template-columns:minmax(0,1fr) 260px;gap:18px}.view{padding-top:24px}.task-panel{padding:17px}.editor-body{height:310px}.page-heading h1{font-size:23px}}
@media(max-width:1000px){.workbench{grid-template-columns:minmax(0,1fr)}.learning-column{display:grid;grid-template-columns:1fr 1fr;gap:14px}.task-panel{grid-row:span 2}.knowledge-peek{display:block}.small-note{display:none}.editor-body{height:285px}.console-content,.problem-content{min-height:138px}.page-heading{margin-bottom:17px}}
@media(max-width:720px){body{font-size:14px}.view{padding:20px 14px 0}.topbar{height:54px;padding:0 14px}.topbar .local-badge{display:none}.page-heading{margin-bottom:15px}.page-heading h1{font-size:21px;margin:6px 0}.page-heading p{font-size:11px}.page-heading .eyebrow{font-size:8px;letter-spacing:1.8px}.lesson-banner{padding:10px 12px;margin-bottom:16px;gap:12px}.lesson-number{font-size:21px;padding-right:13px}.lesson-summary h2{font-size:13px}.lesson-summary p{display:none}.lesson-meta{font-size:9px}.lesson-banner>.text-button{font-size:0}.editor-column{gap:15px}.editor-body{height:250px;padding-top:17px;--line-height:26px}.editor-toolbar,.file-tab{height:44px}.file-tab{font-size:11px;padding:0 10px;gap:7px}.editor-actions{padding-right:5px;gap:0}.editor-actions .quiet-button{font-size:11px}.editor-footer{font-size:9px;padding:8px 11px}.line-numbers{width:39px;padding-right:12px}.run-toolbar{padding:11px 12px}.run-button{font-size:12px;min-height:38px;padding:9px 13px}.stop-button{width:38px}.console-content,.problem-content{min-height:135px;padding:17px 14px;max-height:250px}.console-empty{gap:11px;padding:9px 0}.console-empty strong{font-size:12px}.console-empty p{font-size:10px}.terminal-symbol{width:35px;height:35px;flex-shrink:0;font-size:18px}.output-footer{font-size:9px;padding:10px 12px}.output-footer>span:last-child{max-width:55%;text-align:right;line-height:1.7}.learning-column{grid-template-columns:1fr;gap:11px}.task-panel{grid-row:auto;padding:18px}.goal{font-size:12px}.goal-list{gap:13px;margin-bottom:18px}.task-intro{margin:11px 0 16px}.assistant-fold>summary{padding:15px 16px}.page-footer{margin-top:20px;font-size:8px}.page-footer>span:first-child{font-size:8px}.page-footer>span:last-child{display:none}.sidebar .journey-card{padding:17px 6px 6px}.sidebar{padding-top:24px}.file-tab svg{display:block;width:12px;height:12px}.small-note{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(min-width:1001px) and (max-height:850px){.view{padding-top:16px}.page-heading{margin-bottom:12px}.page-heading h1{font-size:22px;margin:5px 0}.page-heading .eyebrow{font-size:8px}.page-heading p{font-size:11px}.lesson-banner{padding:9px 16px;margin-bottom:16px}.lesson-summary p{display:none}.lesson-summary h2{font-size:14px;margin:4px 0}.lesson-number{font-size:21px}.editor-body{height:205px}.run-toolbar{padding:10px 16px}.console-content,.problem-content{min-height:110px;max-height:220px;padding-top:15px;padding-bottom:15px}.console-empty{padding:8px 0}.output-footer{font-size:9px}.page-footer{margin-top:17px;padding:12px 0}.sidebar-bottom{padding-top:16px}.sidebar .journey-card{padding-top:13px}}

/* v0.3 — only the Hero title; no cursor or blinking effects. */
.page-heading>div:first-child{min-width:0;flex:1}
.page-heading .hero-welcome{display:grid;grid-template-columns:minmax(0,1fr);isolation:isolate;max-width:100%;overflow-wrap:anywhere}
.hero-welcome>.hero-live,.hero-welcome>.hero-sizing{grid-area:1/1;display:block;min-width:0;color:var(--text)}
.hero-sizing{visibility:hidden;pointer-events:none;user-select:none}
.hero-character{display:inline-block;color:inherit;opacity:0;transform:translateY(4px);transition:opacity 200ms ease,transform 240ms cubic-bezier(.2,.65,.3,1)}
.hero-character.visible{opacity:1;transform:translateY(0)}
.hero-character.hero-punctuation{color:var(--accent)}
.hero-welcome[data-phase="exit"] .hero-character{transition:opacity 190ms ease,transform 200ms ease}
.hero-welcome[data-phase="exit"] .hero-character:not(.visible){transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){.hero-character{transition:none!important;transform:none!important}.hero-live .hero-character{opacity:1}}