/* LVL V1.16.0 — JavaScript Core + Advanced. Native LVL visual language. */
.visual-course-card[data-course-id="js"]{--lvl-course-bg:url("../assets/course-backgrounds/js-core-v1160.webp")!important;--lvl-course-bg-position:center center!important}
.visual-course-card[data-course-id="js-advanced"]{--lvl-course-bg:url("../assets/course-backgrounds/js-advanced-v1160.webp")!important;--lvl-course-bg-position:center center!important}
.visual-course-card[data-course-id="js"] .course-icon,
.visual-course-card[data-course-id="js-advanced"] .course-icon{background-image:none!important}

.js-activity-head{margin-bottom:16px}.js-activity-head .eyebrow{color:#b975ff}.js-flow-strip{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:10px;font-size:7px;font-weight:900;letter-spacing:.08em;color:#697082}.js-flow-strip span,.js-flow-strip b{border:1px solid #292f3d;border-radius:999px;padding:4px 7px;background:#10141c}.js-flow-strip b{border-color:rgba(171,82,255,.36);color:#c898ff;background:rgba(133,57,213,.10)}.js-flow-strip i{font-style:normal;color:#4c5260}
.js-lab-shell{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);border:1px solid #292f3d;border-radius:16px;overflow:hidden;background:#0b0e14;min-height:390px}.js-editor-pane,.js-result-pane{min-width:0}.js-editor-pane{border-right:1px solid #292f3d}.js-pane-head,.js-result-tabs{height:40px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 11px;border-bottom:1px solid #252b38;background:#10141c;color:#8f96a7;font-size:8px;font-weight:850;letter-spacing:.05em}.js-pane-head>div{display:flex;gap:6px}.js-pane-head button{border:1px solid #303746;background:#161b25;color:#aeb4c2;border-radius:7px;padding:5px 8px;font:inherit;cursor:pointer}.js-pane-head .js-run-mini{border-color:rgba(74,205,155,.32);color:#83dfba;background:rgba(34,110,82,.12)}.js-editor-pane textarea{display:block;width:100%;min-height:350px;resize:vertical;border:0;outline:0;padding:15px;background:#0b0e14;color:#e5e9f2;font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;font-size:12px;line-height:1.62;tab-size:2;white-space:pre;overflow:auto}.js-result-pane{display:grid;grid-template-rows:40px minmax(190px,1fr) minmax(120px,.7fr);background:#0d1017}.js-result-tabs{justify-content:flex-start;gap:16px}.js-result-tabs .active{color:#e3d6ff}.js-result-pane iframe{width:100%;height:100%;border:0;background:#0d1017}.js-console-output{margin:0;min-height:108px;max-height:190px;overflow:auto;border-top:1px solid #272d39;background:#080b10;color:#8fe6b8;padding:12px;font:10px/1.55 "SFMono-Regular",Consolas,monospace;white-space:pre-wrap;word-break:break-word}.js-console-output.error{color:#ff9aad}.js-test-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:10px}.js-test-list span{display:flex;align-items:center;gap:7px;border:1px solid #282e3b;border-radius:10px;background:#10141c;color:#8c93a2;padding:8px 9px;font-size:8px}.js-test-list span i{font-style:normal;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#181d27;color:#717888}.js-test-list span.ok{border-color:rgba(73,201,154,.30);color:#9bdfc4;background:rgba(35,104,78,.09)}.js-test-list span.ok i{background:rgba(73,201,154,.15);color:#63d7ab}.js-test-list span.bad{border-color:rgba(255,104,125,.28);color:#ffabb8;background:rgba(128,45,59,.09)}.js-test-list span.bad i{background:rgba(255,104,125,.12);color:#ff7d92}.js-hint-panel{display:flex;align-items:flex-start;gap:7px;flex-wrap:wrap;margin-top:11px}.js-hint-panel .btn{font-size:8px;padding:7px 9px}.js-hint-panel p{flex:1 0 100%;margin:2px 0 0;border-left:2px solid #8c43ed;padding:8px 10px;color:#aaa2bf;background:rgba(116,57,184,.07);font-size:9px;line-height:1.5}.js-build-actions{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px;margin-top:11px}.js-build-actions .activity-feedback{margin:0}.js-build-actions .btn{min-width:118px}

.js-code-readonly{margin:0 0 13px;border:1px solid #2a303d;border-radius:13px;background:#0a0d12;overflow:auto;padding:14px;color:#d8dde8;font:11px/1.65 "SFMono-Regular",Consolas,monospace;white-space:pre;max-width:100%}.js-code-readonly code{font:inherit}.js-predict-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.js-predict-options button{min-height:42px;border:1px solid #2c3240;border-radius:11px;background:#11151e;color:#bec3cf;text-align:left;padding:10px 12px;font-size:10px;font-weight:750;cursor:pointer}.js-predict-options button.selected{border-color:#8451d7;background:rgba(124,71,207,.12);color:#e5d7ff}.js-predict-options button.correct{border-color:rgba(73,201,154,.42);background:rgba(73,201,154,.10);color:#9ee4c8}.js-predict-options button.wrong{border-color:rgba(255,104,125,.4);background:rgba(255,104,125,.08);color:#ffabb8}.js-predict-run{display:flex;justify-content:flex-end;margin:10px 0}.js-predict-run .btn{min-width:142px}

.js-trace-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);gap:12px}.js-trace-panel{border:1px solid #292f3d;border-radius:13px;background:#0f131b;padding:12px}.js-trace-head{display:flex;justify-content:space-between;color:#777f90;font-size:8px;font-weight:900}.js-trace-head strong{color:#c99cff}.js-trace-label{font-size:13px;font-weight:900;color:#ece7f7;margin:11px 0}.js-trace-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.js-trace-grid>div{min-height:110px;border:1px solid #282f3d;border-radius:10px;background:#0b0e14;padding:9px;display:flex;flex-direction:column;gap:6px}.js-trace-grid small{color:#686f80;font-size:6px;font-weight:900;letter-spacing:.08em}.js-trace-grid span{border:1px solid #32394a;border-radius:7px;padding:6px 7px;color:#b9bfd0;background:#121721;font-size:8px}.js-trace-grid em{font-style:normal;color:#535a69;font-size:8px}.js-trace-panel>p{color:#82899a;font-size:9px;line-height:1.5}.js-trace-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px}.js-trace-actions .btn{font-size:8px;padding:7px 10px}

.event-loop-board{border:1px solid #302b43;border-radius:15px;padding:12px;background:radial-gradient(circle at 85% 15%,rgba(142,66,224,.11),transparent 34%),#0d1017}.event-loop-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.event-loop-flow section{min-height:135px;border:1px solid #2a3040;border-radius:11px;background:#0a0e14;padding:9px}.event-loop-flow section.micro{border-color:rgba(160,80,255,.35);background:rgba(103,43,160,.07)}.event-loop-flow small,.event-loop-output small{display:block;color:#747b8c;font-size:6px;font-weight:950;letter-spacing:.08em;margin-bottom:8px}.event-loop-flow section div{display:flex;flex-direction:column;gap:6px}.event-loop-flow span{border:1px solid #343b4c;border-radius:7px;padding:7px;color:#c5cad6;background:#141924;font-size:8px}.event-loop-flow .micro span{border-color:rgba(168,85,255,.35);color:#d3adff}.event-loop-flow em{font-style:normal;color:#555d6c;font-size:8px}.event-loop-output{margin-top:8px;border:1px solid #282e3b;border-radius:10px;background:#080b10;padding:9px}.event-loop-output pre{margin:0;color:#79dda9;font:9px/1.55 monospace}.event-loop-board .js-trace-actions strong{font-size:8px;color:#a78acb}

.js-brief-card{border:1px solid #312b45;border-radius:14px;background:linear-gradient(145deg,rgba(102,47,161,.12),#0f131a);padding:14px;display:grid;gap:8px;margin-bottom:12px}.js-brief-card>small{font-size:7px;font-weight:950;letter-spacing:.10em;color:#be79ff}.js-brief-card>div{display:grid;grid-template-columns:20px 1fr;gap:7px;align-items:flex-start;border-top:1px solid #252b37;padding-top:8px;color:#adb3bf;font-size:9px;line-height:1.45}.js-brief-card i{font-style:normal;color:#a965f1}.js-research-card{display:flex;justify-content:space-between;align-items:center;gap:14px;border:1px solid #29303d;border-radius:13px;background:#10141c;padding:13px}.js-research-card small{display:block;color:#6e7687;font-size:6px;letter-spacing:.09em}.js-research-card strong{display:block;margin:3px 0;color:#e7e9ef;font-size:12px}.js-research-card p{margin:0;color:#7e8595;font-size:8px;line-height:1.5}.js-task-checklist{display:grid;gap:7px;margin:10px 0}.js-task-checklist label{display:flex;align-items:center;gap:8px;border:1px solid #272d3a;border-radius:9px;background:#0f131a;padding:9px;color:#9da4b4;font-size:9px}.js-task-checklist input{accent-color:#8c49e9}

@media(max-width:900px){.js-lab-shell{grid-template-columns:1fr}.js-editor-pane{border-right:0;border-bottom:1px solid #292f3d}.js-editor-pane textarea{min-height:300px}.js-result-pane{min-height:330px}.event-loop-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.js-trace-shell{grid-template-columns:1fr}}
@media(max-width:620px){.js-activity-head{margin-bottom:11px}.js-activity-head h3{font-size:16px!important}.js-activity-head p{font-size:9px!important;line-height:1.45!important}.js-lab-shell{border-radius:12px;min-height:0}.js-pane-head,.js-result-tabs{height:35px;padding:0 8px}.js-editor-pane textarea{min-height:250px;font-size:10px;line-height:1.55;padding:11px;max-width:100%;overflow-x:auto}.js-result-pane{grid-template-rows:35px 170px 120px;min-height:325px}.js-console-output{font-size:8px;max-height:145px}.js-test-list{grid-template-columns:1fr}.js-test-list span{font-size:7px;padding:7px}.js-build-actions{grid-template-columns:1fr}.js-build-actions .btn{width:100%}.js-predict-options{grid-template-columns:1fr}.js-predict-options button{min-height:38px;font-size:8px}.js-code-readonly{font-size:8px;padding:10px}.js-trace-grid{grid-template-columns:1fr}.event-loop-flow{grid-template-columns:1fr 1fr;gap:6px}.event-loop-flow section{min-height:105px;padding:7px}.event-loop-flow span{font-size:7px;padding:6px}.js-research-card{align-items:flex-start;flex-direction:column}.js-research-card .btn{width:100%}.js-flow-strip{gap:4px}.js-flow-strip span,.js-flow-strip b{padding:3px 5px;font-size:6px}}
@media(max-width:390px){.event-loop-flow{grid-template-columns:1fr}.js-result-pane{grid-template-rows:35px 150px 110px}.js-editor-pane textarea{min-height:220px}}
