:root{--bg:#f7f8fc;--surface:#fff;--surface-2:#f7f8fc;--ink:#263046;--ink2:#36415a;--muted:#5f697e;--line:#e9ecf4;--violet:#7653e3;--violet2:#a99af3;--violet-pale:#f1edff;--teal:#20ad9e;--orange:#eb9f62;--shadow:0 6px 30px rgba(45,49,97,.035);--chart-bg:#fff;--chart-ink:#46536d;--chart-muted:#8996a9;--chart-grid:#e8ecf4;--chart-axis:#d9dfec;--chart-soft:#f4f0ff;--radius:17px;--font:'Segoe UI',system-ui,-apple-system,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--ink);margin:0;font:15.6px/1.55 var(--font);-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{text-decoration:none;color:inherit}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #a99af3;outline-offset:2px}.symbols{position:absolute;overflow:hidden;width:0;height:0}.hidden{display:none!important}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.app-shell{display:flex;min-height:100vh}.rail{width:282px;background:#171a2a;color:#e8ebf7;flex:none;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;z-index:30}.brand-row{height:91px;padding:25px 22px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #ffffff0c}.brand-glyph{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#7653e3;color:#fff;font-size:23.4px;font-weight:700;box-shadow:0 8px 23px #8468ec35}.brand-glyph span{color:#b9ffdf}.brand-name{font-size:22.3px;line-height:1;font-weight:700;letter-spacing:-.075em}.brand-name span{font-weight:550;color:#c5b5ff;letter-spacing:-.045em}.brand-name small{display:block;color:#7d839d;font-size:11.2px;font-weight:650;letter-spacing:.13em;margin-top:9px}.rail-close{display:none}.rail-group{padding:24px 12px 9px}.rail-caption,.rail-section-title,.section-kicker{font-size:11.2px;letter-spacing:.13em;font-weight:700;color:#9095b1}.rail-caption{margin:0 11px 12px}.rail-link{width:100%;height:44px;background:transparent;border:0;color:#a5adc6;display:flex;align-items:center;gap:11px;text-align:left;border-radius:10px;padding:0 13px;margin:3px 0;font-weight:650;font-size:13.4px;transition:background .15s,color .15s}.rail-link svg{width:17px;height:17px}.rail-link:hover{background:#252a40;color:#f5f6ff}.rail-link.active{background:#6e53d92a;color:#ddcffd}.rail-link.active svg{color:#b9a6ff}.rail-count,.rail-new{margin-left:auto;background:#34364a;border-radius:5px;padding:2px 7px;font-size:11.2px;color:#a9b0c8;font-weight:650}.rail-new{background:#233f3b;color:#77e0b7;font-size:10px;text-transform:uppercase}.rail-divider{margin:14px 24px 0;height:1px;background:#303349}.rail-lessons{padding-top:20px;min-height:0;display:flex;flex:1;flex-direction:column}.rail-section-title{display:flex;justify-content:space-between;align-items:center;margin:0 12px 10px}.rail-section-title strong{color:#d1c4ff;letter-spacing:0;font-size:11.2px}.rail-progress{height:5px;background:#36364d;border-radius:4px;margin:0 12px 11px;overflow:hidden}.rail-progress div{background:linear-gradient(90deg,#7c5df3,#68cbb8);height:100%;width:0;transition:width .25s}.mission-list{overflow:auto;padding-bottom:12px;scrollbar-color:#47455f transparent;scrollbar-width:thin}.mission-stage{color:#737b99;font-weight:650;font-size:11.2px;text-transform:uppercase;letter-spacing:.08em;margin:19px 10px 7px}.mission-link{border:0;background:transparent;display:flex;align-items:center;text-align:left;width:100%;color:#939db8;padding:9px 9px;gap:10px;border-radius:10px;margin:1px 0}.mission-link:hover{background:#222738;color:#fff}.mission-link.selected{background:#32284e;color:#f5efff}.mission-index{width:29px;height:29px;border:1px solid #383d51;border-radius:8px;display:grid;place-items:center;font:700 11.2px ui-monospace,SFMono-Regular,monospace;color:#7f87a6}.mission-link.selected .mission-index{background:#8064e7;border-color:#8064e7;color:#fff}.mission-link.done .mission-index{background:#20463c;color:#80dfc4;border-color:#20463c}.mission-copy{min-width:0}.mission-copy strong{display:block;font-weight:640;font-size:12.3px;line-height:1.35}.mission-copy small{display:block;margin-top:3px;color:#686f8b;font-size:11.2px}.rail-bottom{padding:12px 15px 20px;margin-top:auto;background:#171a2a;border-top:1px solid #ffffff12}.rail-tip{display:flex;gap:9px;padding:11px 10px;background:#23263b;border:1px solid #35344f;border-radius:11px}.tip-icon{width:23px;color:#c5afff;font-size:19px}.rail-tip p{margin:0;color:#8d97b2;font-size:11.2px;line-height:1.5}.rail-tip b{color:#d7d4f3}.rail-course{display:flex;align-items:center;justify-content:space-between;color:#d2c9fd;font-size:12.3px;font-weight:650;padding:16px 6px 0}.rail-course svg{width:14px}.rail-course:hover{color:#fff}
.main-shell{flex:1;min-width:0}.masthead{height:73px;background:var(--surface);border-bottom:1px solid var(--line);padding:0 clamp(20px,3.2vw,52px);display:flex;align-items:center;justify-content:space-between;gap:20px}.mast-left,.mast-right{display:flex;align-items:center;gap:15px}.mast-right{gap:17px}.breadcrumbs{font-size:12.3px;font-weight:700;color:var(--muted);letter-spacing:.08em}.breadcrumbs span{color:#c4c8d4;padding:0 9px}.breadcrumbs strong{color:var(--ink2)}.engine-state{display:flex;gap:9px;align-items:center;border:1px solid var(--line);border-radius:25px;background:var(--surface-2);color:var(--muted);padding:7px 12px;font-weight:660;font-size:12.3px;white-space:nowrap}.status-pulse{width:7px;height:7px;border-radius:50%;background:#e4b76d;box-shadow:0 0 0 3px #e4b76d26}.engine-state.ready .status-pulse{background:#35b99b;box-shadow:0 0 0 3px #35b99b1b}.engine-state.ready{color:var(--teal)}.engine-state.error .status-pulse{background:#e86e73}.engine-state.error{color:#d26876}.icon-btn{border:0;background:transparent;color:var(--muted);width:34px;height:34px;display:grid;place-items:center;border-radius:9px}.icon-btn:hover{background:var(--surface-2);color:var(--ink)}.mast-stepik{color:var(--violet);font-size:13.4px;font-weight:650;display:flex;align-items:center;gap:9px;white-space:nowrap}.mast-stepik svg{width:14px}.nav-open{display:none}.content-area{max-width:1660px;margin:auto;padding:32px clamp(20px,3.2vw,52px) 25px}.welcome{height:208px;border-radius:22px;background:linear-gradient(105deg,#f0e9ff,#f2efff 45%,#eafaf5 100%);display:flex;overflow:hidden;position:relative;justify-content:space-between;align-items:center;padding:26px 36px 26px 33px;border:1px solid #eae6fa}.welcome-copy{position:relative;z-index:2}.welcome-eyebrow{font-size:11.2px;color:#8b65ca;font-weight:700;letter-spacing:.14em;display:flex;gap:8px;align-items:center}.eyebrow-orb{width:7px;height:7px;background:#8c6ce5;border-radius:50%;box-shadow:0 0 0 4px #8c6ce523}.welcome h1{font-size:clamp(26.8px,3.2vw,43.5px);letter-spacing:-.065em;line-height:1.1;margin:11px 0 10px;font-weight:700;color:#292640}.welcome h1 em{font-style:normal;color:#7755dc}.welcome p{color:#77768e;font-size:13.4px;line-height:1.6;margin:0;max-width:545px}.welcome-pills{display:flex;gap:9px;margin-top:15px;flex-wrap:wrap}.welcome-pills span{background:#ffffffad;border:1px solid #ffffffc0;color:#695e85;padding:5px 9px;border-radius:15px;font-size:11.2px;font-weight:650;display:flex;align-items:center;gap:5px}.welcome-pills svg{width:13px;height:13px;color:#856bd7}.welcome-visual{position:relative;height:100%;width:340px;flex:none}.graph-grid{position:absolute;inset:-60px -80px;background:linear-gradient(#9f8ce00f 1px,transparent 1px),linear-gradient(90deg,#9f8ce00f 1px,transparent 1px);background-size:27px 27px;transform:rotate(-12deg)}.visual-card{position:absolute;top:4px;right:35px;background:#ffffffd9;border:1px solid #fff;border-radius:16px;padding:16px 17px 6px;width:275px;height:172px;box-shadow:0 16px 37px #7d6ab41f;transform:rotate(-4deg)}.visual-overline{font-size:11.2px;letter-spacing:.12em;color:#978da6;font-weight:650;display:flex;justify-content:space-between}.visual-overline span{color:#d0c6e2}.visual-value{font-size:32.4px;letter-spacing:-.05em;color:#352b52;font-weight:700;margin-top:8px;line-height:1}.visual-value small{font-size:16.7px;color:#29b89a}.visual-sub{font-size:11.2px;color:#9b96a5}.visual-card svg{width:100%;height:74px;margin-top:-1px;stroke:none}.float-chip{position:absolute;z-index:2;bottom:14px;right:3px;transform:rotate(6deg);border-radius:8px;background:#29233c;color:#e6dff7;padding:9px 12px;font-size:11.2px;box-shadow:0 13px 28px #34305b3b;font-weight:650;letter-spacing:.045em}.metric-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin:20px 0}.metric{display:flex;align-items:center;gap:13px;padding:15px 18px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:14px}.metric-icon{width:41px;height:41px;border-radius:12px;display:grid;place-items:center}.metric-icon.purple{background:#f0ebff;color:#8d6ce7}.metric-icon.blue{background:#e8f4fd;color:#5499d5}.metric-icon.peach{background:#fff1e7;color:#de945b}.metric small{font-size:11.2px;color:var(--muted);display:block;font-weight:660}.metric strong{display:block;font-size:21.2px;letter-spacing:-.04em;font-weight:700;line-height:1.3}.metric strong span{font-size:13.4px;color:var(--muted);font-weight:560;letter-spacing:0}
.work-layout{display:grid;grid-template-columns:minmax(440px,1fr) 280px;gap:19px;align-items:start}.work-column{display:flex;flex-direction:column;gap:17px;min-width:0}.task-card,.query-panel,.results-panel,.inspector,.dashboard-page{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:16px}.task-card{padding:20px 23px 15px;position:relative;overflow:hidden}.task-top,.task-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px}.section-kicker{color:#998bb7;font-size:11.2px;font-weight:700}.task-difficulty{font-size:11.2px;font-weight:700;color:#8b70e3;background:var(--violet-pale);padding:4px 9px;border-radius:14px}.task-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.task-card h2{font-size:21.2px;letter-spacing:-.04em;margin:11px 0 7px;line-height:1.3}.task-card p{margin:0;color:var(--muted);font-size:13.4px;line-height:1.65;max-width:850px}.task-illustration{font-size:53.6px;line-height:1;color:#e5dcff;user-select:none;font-weight:700}.task-bottom{margin-top:17px;padding-top:12px;border-top:1px solid var(--line)}.task-bottom span{font-size:11.2px;color:var(--muted)}.link-btn,.quiet-link{color:var(--violet);background:transparent;border:0;padding:4px 0;display:inline-flex;align-items:center;gap:4px;font-size:12.3px;font-weight:650}.link-btn svg{width:12px;height:12px}.link-btn:hover,.quiet-link:hover{text-decoration:underline}
.query-panel{overflow:visible}.panel-toolbar{height:56px;display:flex;align-items:center;justify-content:space-between;padding:0 19px;border-bottom:1px solid var(--line);gap:15px}.panel-title,.panel-small-actions{display:flex;align-items:center;gap:10px}.square-mark{display:grid;place-items:center;background:#252a3d;color:#ccbbff;border-radius:7px;font:800 11.2px ui-monospace,SFMono-Regular,monospace;width:29px;height:28px}.panel-title h3{font-size:14.5px;margin:0;letter-spacing:-.01em}.panel-desc{font-size:11.2px;color:var(--muted);background:var(--surface-2);border-radius:6px;padding:3px 7px;white-space:nowrap}.keyboard-hint{font-size:11.2px;color:#a5acba;white-space:nowrap}.mini-button{border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--muted);width:29px;height:29px;font-weight:700}.mini-button:hover{background:var(--violet-pale);color:var(--violet)}.editor-wrap{padding:0;background:var(--surface)}.CodeMirror{height:235px!important;font:14.5px/1.85 ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace!important;background:var(--surface)!important;color:var(--ink2)!important}.CodeMirror-gutters{background:var(--surface-2)!important;border-right:1px solid var(--line)!important}.CodeMirror-linenumber{color:#b7bdc9!important;padding-right:12px!important}.CodeMirror-lines{padding:15px 0!important}.CodeMirror-cursor{border-left:2px solid #7a60df!important}.CodeMirror-selected{background:#e7e0ff!important}.cm-s-default .cm-keyword{color:#8360d7;font-weight:650}.cm-s-default .cm-string{color:#c8803f}.cm-s-default .cm-number{color:#23a892}.cm-s-default .cm-comment{color:#a8b1c1}.cm-s-default .cm-variable,.cm-s-default .cm-variable-2{color:#536681}.cm-s-default .cm-operator{color:#8a79a1}.CodeMirror-hints{z-index:99!important;border:1px solid var(--line)!important;box-shadow:0 12px 36px #1b193c24!important;border-radius:10px!important;overflow:hidden}.CodeMirror-hint-active{background:#f0edff!important;color:#6655cb!important}.query-actions{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:12px 15px;gap:12px}.example-wrap{position:relative}.example-trigger{border:0;background:transparent;color:var(--muted);font-size:12.3px;font-weight:650;padding:7px 4px}.example-trigger:hover{color:var(--violet)}.example-trigger span{margin-left:5px}.examples-pop{z-index:19;position:absolute;top:37px;left:0;min-width:220px;background:var(--surface);border:1px solid var(--line);box-shadow:0 13px 33px #1d20313a;border-radius:12px;padding:7px}.example-item{display:block;border:0;background:transparent;width:100%;padding:10px;border-radius:7px;text-align:left;font-size:12.3px;color:var(--ink2)}.example-item:hover{background:var(--violet-pale);color:var(--violet)}.run-actions{display:flex;gap:9px}.button-primary,.button-outline,.button-secondary,.button-ghost{border-radius:9px;padding:10px 13px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12.3px;font-weight:700;white-space:nowrap}.button-primary{background:#7555e6;color:#fff;border:1px solid #7555e6;box-shadow:0 3px 9px #6c55d12e}.button-primary:hover{background:#6244cf}.button-primary svg,.button-secondary svg,.button-ghost svg{width:14px;height:14px}.run-arrow{color:#c6b9ff;margin-left:6px}.button-outline{background:var(--surface);color:var(--violet);border:1px solid #d5ccfa}.button-outline:hover{background:var(--violet-pale)}.button-secondary{background:#eae4ff;color:#6a4acb;border:1px solid #e2d9ff}.button-secondary:hover{background:#dfd5ff}.button-ghost{background:var(--surface);border:1px solid var(--line);color:var(--ink2)}
.results-panel{overflow:hidden}.results-head{padding:16px 19px;display:flex;align-items:center;justify-content:space-between;gap:12px}.results-head-left,.results-tools{display:flex;align-items:center;gap:12px}.results-head h3{margin:0;font-size:15.6px;letter-spacing:-.025em}.results-status{font-size:11.2px;color:var(--teal);font-weight:650;background:#eafaf5;border-radius:15px;padding:5px 9px;white-space:nowrap}.results-tools{gap:11px}.icon-text{border:0;background:transparent;display:flex;align-items:center;gap:6px;font-size:12.3px;color:var(--muted);font-weight:650;padding:4px}.icon-text svg{width:14px;height:14px}.icon-text:hover{color:var(--violet)}.results-tab-row{padding:0 19px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:10px}.results-tabs{display:flex;gap:20px}.result-tab{display:flex;align-items:center;gap:7px;background:none;border:0;position:relative;color:var(--muted);padding:12px 0;font-size:12.3px;font-weight:650}.result-tab svg{width:15px;height:15px}.result-tab.active{color:var(--violet)}.result-tab.active:after{content:'';position:absolute;bottom:0;left:0;right:0;background:var(--violet);height:2px;border-radius:3px}.new-feature{background:#def7ef;color:#2da789;padding:1px 5px;border-radius:4px;font-size:8.9px;font-weight:700;letter-spacing:.035em}.result-caption{font-size:11.2px;color:#a1abb9;white-space:nowrap}.table-region{min-height:152px;max-height:325px;overflow:auto;scrollbar-color:#e1dced transparent}.results-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:175px;padding:25px;color:var(--ink2);text-align:center}.results-empty b{font-size:13.4px}.results-empty p{font-size:12.3px;color:var(--muted);margin:0}.empty-squiggle{width:40px;height:40px;border-radius:12px;background:#f2edff;color:#8b72e6;display:grid;place-items:center;font:800 19px ui-monospace,SFMono-Regular,monospace;margin-bottom:3px}.table-scroll{overflow:auto;max-height:320px}.data-table{border-collapse:collapse;min-width:100%;font:12.3px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:nowrap}.data-table th{background:var(--surface-2);font:730 12.3px var(--font);text-align:left;color:#7f8aa3;padding:12px 16px;position:sticky;top:0;border-right:1px solid var(--line)}.data-table td{padding:10px 16px;color:var(--ink2);border-top:1px solid var(--line);border-right:1px solid var(--line)}.data-table tr:nth-child(2n){background:#fbfbfd}.data-table tr:hover{background:#f4f0ff}.data-table .data-null{color:#aab2c4;font-style:italic}.truncation-note{padding:9px 14px;font-size:12.3px;color:var(--muted)}.results-foot{padding:12px 19px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px}.results-foot span{font-size:11.2px;color:var(--muted);display:flex;align-items:center;gap:5px}.results-foot span svg{width:12px;height:12px}.foot-button{border:0;background:none;color:var(--muted);font-size:11.2px;display:flex;gap:5px;align-items:center}.foot-button svg{width:12px;height:12px}.foot-button:hover{color:var(--violet)}.notice-card{padding:17px 20px;display:flex;align-items:flex-start;gap:10px;line-height:1.7;color:var(--muted);white-space:pre-wrap;font-size:12.3px}.notice-card svg{color:var(--violet);width:17px;height:17px}.notice-card.error{color:#c4626a;background:#fff6f6}.notice-card.error svg{color:#cf6473}.notice-card.ok{color:#23a18b;background:#f0fcf8}.notice-card p{margin:0}.feedback{display:flex;gap:10px;align-items:flex-start;padding:13px 17px;border-bottom:1px solid var(--line)}.feedback svg{width:18px;height:18px}.feedback strong{font-size:13.4px}.feedback p{margin:3px 0 4px;font-size:12.3px;color:var(--ink2)}.feedback.success{background:#f0fbf6;color:#1a9b77}.feedback.warning{background:#fff9ec;color:#b58236}.feedback-next{border:0;background:transparent;color:var(--violet);font-size:12.3px;font-weight:700;padding:5px 0}
.inspector{padding:18px 16px 0;overflow:hidden}.inspector-head .section-kicker{font-size:11.2px}.inspector-tabs{display:flex;gap:2px;background:var(--surface-2);padding:4px;border-radius:10px;margin-top:14px}.inspector-tab{flex:1;background:transparent;border:0;color:var(--muted);font-size:11.2px;font-weight:650;border-radius:7px;padding:8px 2px;white-space:nowrap}.inspector-tab.active{background:var(--surface);color:var(--violet);box-shadow:0 2px 6px #202b4811}.inspect-section{margin:20px 0 0;max-height:745px;overflow:auto;padding-bottom:17px;scrollbar-width:thin}.insight-head{display:flex;gap:10px;align-items:center;margin-bottom:14px}.insight-icon{height:33px;width:33px;border-radius:10px;background:var(--violet-pale);display:grid;place-items:center;color:var(--violet)}.insight-icon svg{width:17px}.insight-head strong{font-size:12.3px;display:block;line-height:1.4}.insight-head small{font-size:10px;display:block;color:var(--muted);margin-top:2px}.hint-level{border-top:1px solid var(--line)}.hint-level summary,.guide summary{list-style:none;cursor:pointer;font-size:12.3px;padding:11px 0;color:var(--ink2);font-weight:650;display:flex;align-items:center;justify-content:space-between;gap:7px}.hint-level summary::-webkit-details-marker,.guide summary::-webkit-details-marker{display:none}.hint-level summary:after,.guide summary:after{content:'+';color:var(--violet);font-size:17.9px}.hint-level[open] summary:after,.guide[open] summary:after{content:'−'}.hint-level p,.guide p,.inspect-description{font-size:12.3px;line-height:1.75;color:var(--muted);margin:4px 0 12px}.hint-level pre,.guide pre{font:11.2px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink2);padding:10px;border-radius:8px;white-space:pre-wrap;overflow:auto;background:var(--surface-2)}.insert-hint{border:0;background:var(--violet-pale);border-radius:7px;color:var(--violet);font-size:11.2px;padding:7px 10px;font-weight:700;margin:0 0 12px}.subsection-rule{height:1px;background:var(--line);margin:21px 0 16px}.inspector h4{font-size:12.3px;margin:0 0 10px}.guide{border-top:1px solid var(--line)}.guide-sub{padding:2px 7px 7px;border-top:1px dashed var(--line)}.guide-sub summary{font-size:11.2px;padding:8px 0;color:var(--muted)}.guide-sub summary:after{font-size:14.5px}.guide-sub pre{margin:6px 0}.inspector-bottom{background:linear-gradient(125deg,#f6f2ff,#f2fcf9);margin:0 -16px;padding:16px;display:flex;gap:11px;border-top:1px solid var(--line)}.small-bulb{font-size:22.3px;color:#946ddd}.inspector-bottom b{font-size:11.2px}.inspector-bottom p{font-size:11.2px;color:#8c91a7;line-height:1.6;margin:3px 0 0}.schema-item{border:1px solid var(--line);border-radius:9px;margin-bottom:8px;overflow:hidden}.schema-item>summary{list-style:none;display:flex;gap:7px;align-items:center;cursor:pointer;padding:9px}.schema-item summary::-webkit-details-marker{display:none}.schema-item svg{width:14px;height:14px;color:var(--violet)}.schema-item strong{font-size:11.2px;word-break:break-all}.schema-item summary span{font-size:10px;color:var(--muted);margin-left:auto;white-space:nowrap}.schema-inside{border-top:1px solid var(--line);padding:9px}.schema-inside p{font-size:11.2px;color:var(--muted);margin:0 0 10px;line-height:1.6}.schema-field{display:flex;justify-content:space-between;align-items:center;gap:4px;padding:6px 0;border-bottom:1px solid var(--line)}.schema-field code{font-size:11.2px;color:var(--ink2)}.schema-field span{font-size:10px;color:var(--muted);text-align:right}.history-item{display:flex;align-items:flex-start;flex-wrap:wrap;gap:5px;border:0;border-bottom:1px solid var(--line);padding:12px 0;width:100%;background:none;text-align:left}.history-item svg{height:13px;width:13px;color:var(--violet)}.history-item code{font:11.2px ui-monospace,SFMono-Regular,monospace;color:var(--ink2);max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-item small{font-size:10px;width:100%;color:var(--muted);margin-left:19px}
/* Interactive chart builder */
.chart-region{background:var(--surface)}.chart-builder{padding:15px 18px 12px;background:var(--surface-2);border-bottom:1px solid var(--line)}.chart-builder-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.chart-builder label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:11.2px;font-weight:650}.chart-builder select{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 25px 8px 9px;color:var(--ink2);font-size:12.3px;min-width:0;width:100%;text-overflow:ellipsis}.chart-tip{font-size:11.2px;color:var(--muted);margin:12px 0 0}.chart-visual{padding:11px 12px;min-height:330px;background:var(--chart-bg)}.rendered-chart{width:100%;min-width:0}.chart-canvas-heading{display:flex;align-items:center;justify-content:space-between;padding:7px 18px 0}.chart-canvas-heading>div{display:flex;flex-direction:column;gap:2px}.chart-label{font-size:10px;letter-spacing:.13em;font-weight:700;color:#a49ab2}.chart-canvas-heading strong{font-size:15.6px;color:var(--chart-ink);letter-spacing:-.02em}.chart-canvas-heading small{color:var(--chart-muted);font-size:11.2px}.analytics-svg{height:auto;display:block;max-height:360px;width:100%;margin:0 auto}.chart-failure,.chart-alert{padding:45px 20px;text-align:center;color:var(--muted);font-size:13.4px}.chart-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:12px 18px}.chart-footer span{font-size:11.2px;color:var(--muted)}.chart-actions{display:flex;gap:7px}.chart-actions button{padding:8px 10px}.chart-actions button svg{width:12px;height:12px}
/* Dashboard */
.dashboard-page{padding:27px 26px;min-height:430px}.dashboard-title{display:flex;justify-content:space-between;align-items:center;gap:20px}.dashboard-title h2{font-size:31.2px;letter-spacing:-.055em;margin:5px 0}.dashboard-title h2 span{color:#9873e7}.dashboard-title p{color:var(--muted);font-size:13.4px;margin:0}.dash-top-actions{display:flex;gap:9px}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;margin-top:23px}.dashboard-empty{grid-column:1/-1;min-height:310px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;border:1px dashed #d8d4e5;background:var(--surface-2);border-radius:15px;padding:25px}.dashboard-empty-icon{height:60px;width:60px;border-radius:17px;background:#efe9ff;color:#886cda;display:grid;place-items:center;font-size:36.8px}.dashboard-empty h3{font-size:20.1px;margin:0}.dashboard-empty p{color:var(--muted);font-size:13.4px;max-width:450px;margin:0 0 7px}.dash-card{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--surface)}.dash-card-head,.dash-card-foot{padding:12px 15px;display:flex;justify-content:space-between;gap:10px;align-items:center}.dash-card-head{border-bottom:1px solid var(--line)}.dash-chart-title{font-size:13.4px;font-weight:700;color:var(--ink);border:none;background:transparent;min-width:0;flex:1;outline:none}.delete-chart{color:#b1a8b8}.delete-chart:hover{color:#cf616b}.delete-chart svg{width:15px;height:15px}.dash-card .rendered-chart{padding:5px 7px}.dash-card .chart-canvas-heading{padding-top:8px}.dash-card .analytics-svg{height:auto}.dash-card-foot{border-top:1px solid var(--line);color:var(--muted);font-size:11.2px}.dashboard-footnote{margin-top:21px;color:var(--muted);font-size:11.2px}
.bottom-banner{display:flex;align-items:center;gap:14px;border:1px solid #e8e3fc;background:linear-gradient(96deg,#f2edff,#f7f6ff);border-radius:13px;margin-top:20px;padding:16px 20px}.banner-icon{height:37px;width:37px;border-radius:12px;display:grid;place-items:center;background:#ddd2ff;color:#7554d9}.bottom-banner div:nth-child(2){flex:1}.bottom-banner b{font-size:13.4px;color:#42395e}.bottom-banner p{margin:3px 0 0;font-size:12.3px;color:#827a97}.bottom-banner a{font-size:12.3px;color:#7653d6;font-weight:700;display:flex;align-items:center;gap:7px;white-space:nowrap}.bottom-banner svg{width:15px}.site-footer{padding:17px 50px 27px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:11.2px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,15px);background:#28243d;color:#f2efff;border:1px solid #564987;border-radius:12px;padding:12px 17px;box-shadow:0 13px 43px #20183e50;pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;z-index:99;font-size:12.3px;max-width:90vw;text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#59323b;border-color:#be757a}.chart-tooltip{position:fixed;z-index:99;background:#292841;color:#fff;padding:6px 9px;border-radius:8px;pointer-events:none;font-size:12.3px}
/* Dark mode theme, including chart plot surfaces */
body.dark{--bg:#121525;--surface:#1c2233;--surface-2:#252b40;--ink:#e9ecf7;--ink2:#c9d2e5;--muted:#98a4ba;--line:#31384e;--violet:#b3a0ff;--violet-pale:#373052;--teal:#5dd5b9;--chart-bg:#1c2233;--chart-ink:#e5e8f6;--chart-muted:#9daac0;--chart-grid:#333d55;--chart-axis:#44516a;--chart-soft:#2c2843;--shadow:none}.dark .mast-stepik{color:#bfaaff}.dark .welcome{background:linear-gradient(105deg,#30294f,#28324b 65%,#284f49);border-color:#3e3a60}.dark .welcome h1{color:#fff}.dark .welcome h1 em{color:#c0abff}.dark .welcome p{color:#bdc1d4}.dark .welcome-eyebrow{color:#bba4fa}.dark .welcome-pills span{background:#ffffff13;border-color:#ffffff15;color:#d2cbe6}.dark .welcome-pills svg{color:#c4aaff}.dark .visual-card{background:#3c3858;border-color:#554e72}.dark .visual-value{color:#efecff}.dark .visual-overline,.dark .visual-sub{color:#b7aec5}.dark .metric-icon.purple{background:#42355d}.dark .metric-icon.blue{background:#2b4156}.dark .metric-icon.peach{background:#483b39}.dark .task-illustration{color:#413956}.dark .CodeMirror,.dark .editor-wrap{background:var(--surface)!important;color:#dce2f5!important}.dark .CodeMirror-gutters{background:var(--surface-2)!important}.dark .CodeMirror-linenumber{color:#606e8a!important}.dark .cm-s-default .cm-variable{color:#d4d8e8}.dark .cm-s-default .cm-keyword{color:#ba9cff}.dark .cm-s-default .cm-string{color:#f2ba7c}.dark .cm-s-default .cm-number{color:#73ddbf}.dark .results-status{background:#254b42;color:#92e2ce}.dark .new-feature{background:#2c594b;color:#79dcbb}.dark .data-table tr:nth-child(2n){background:#20263a}.dark .data-table tr:hover{background:#2b2b49}.dark .feedback.success{background:#203e34;color:#8fe3bb}.dark .feedback.warning{background:#453927;color:#e4c17e}.dark .notice-card.error{background:#4c2c38;color:#ffb8c3}.dark .notice-card.ok{background:#294b3c;color:#97d9bb}.dark .button-secondary{background:#453967;color:#e1d5ff;border-color:#67558f}.dark .button-outline{border-color:#63517d}.dark .inspector-bottom{background:linear-gradient(120deg,#302d49,#293f40)}.dark .inspector-bottom p{color:#a5aac0}.dark .chart-visual{background:var(--chart-bg)}.dark .chart-label{color:#9b97ac}.dark .dashboard-empty{border-color:#47445c}.dark .bottom-banner{background:linear-gradient(100deg,#322a49,#293049);border-color:#433958}.dark .bottom-banner b{color:#e5dffa}.dark .bottom-banner p{color:#abb0c5}.dark .bottom-banner a{color:#c1adff}.dark .banner-icon{background:#423666;color:#c0adff}.dark .results-empty .empty-squiggle{background:#37304f}
/* Responsive */
@media(max-width:1390px){.work-layout{grid-template-columns:minmax(400px,1fr) 262px}.content-area{padding-left:26px;padding-right:26px}.masthead{padding-left:26px;padding-right:26px}.welcome-visual{width:260px}.visual-card{right:5px}}
@media(max-width:1220px){.work-layout{grid-template-columns:minmax(0,1fr)}.inspector{display:block}.inspector-head{display:flex;align-items:center;justify-content:space-between}.inspector-tabs{margin:0}.inspect-section{max-height:360px}.inspector-bottom{display:none}.insight-head{margin-top:4px}.welcome-visual{width:250px}.welcome p{max-width:470px}}
@media(max-width:900px){.rail{position:fixed;transform:translateX(-103%);width:min(300px,calc(100vw - 20px));transition:transform .2s}.rail.open{transform:translateX(0)}.nav-open,.rail-close{display:grid}.rail-close{margin-left:auto;color:#9f96c9}.brand-row{padding-right:10px}body.nav-open:after{content:'';position:fixed;inset:0;background:#1515288a;z-index:23}.masthead{height:65px}.content-area{padding:22px 20px}.welcome{height:auto;min-height:196px}.site-footer{padding:15px 20px 24px}}
@media(max-width:680px){.content-area{padding:15px 12px 20px}.masthead{padding:0 12px}.mast-stepik{display:none}.mast-right{gap:8px}.engine-state{font-size:11.2px;padding:6px 9px}.breadcrumbs{font-size:11.2px}.welcome{padding:23px 19px;min-height:0}.welcome h1{font-size:33.5px}.welcome p{font-size:12.3px}.welcome-visual{display:none}.metric-row{gap:8px;margin:12px 0}.metric{padding:11px 10px;gap:8px}.metric-icon{height:29px;width:29px;border-radius:9px}.metric-icon svg{width:15px;height:15px}.metric small{font-size:10px;line-height:1.3}.metric strong{font-size:17.9px}.metric strong span{font-size:11.2px}.task-card{padding:16px}.task-card h2{font-size:20.1px}.task-illustration{font-size:33.5px}.task-card p{font-size:12.3px}.panel-toolbar{padding:0 12px}.panel-title h3{font-size:13.4px}.panel-desc,.keyboard-hint{display:none}.CodeMirror{height:245px!important;font-size:13.4px!important}.query-actions{flex-wrap:wrap;padding:10px}.run-actions{margin-left:auto}.button-primary,.button-outline{padding:9px 10px}.results-head{padding:13px 11px}.results-head h3{font-size:14.5px}.results-head-left{gap:5px;flex-wrap:wrap}.results-status{font-size:10px}.results-tools{gap:5px}.icon-text{font-size:11.2px}.icon-text span{display:none}.results-tab-row{padding:0 11px}.result-caption{display:none}.results-foot{padding:11px;align-items:flex-start;gap:9px}.results-foot>span{max-width:170px}.results-foot .foot-button{white-space:nowrap}.chart-builder-row{grid-template-columns:repeat(2,minmax(0,1fr))}.chart-visual{padding:0 3px;min-height:250px}.analytics-svg{height:auto;min-height:200px}.chart-canvas-heading{padding:12px 10px 0}.chart-footer{padding:10px;flex-wrap:wrap}.chart-actions{margin-left:auto}.dashboard-title{display:block}.dash-top-actions{margin-top:15px;flex-wrap:wrap}.dashboard-page{padding:17px 12px}.dashboard-grid{grid-template-columns:1fr}.bottom-banner{flex-wrap:wrap;gap:11px;padding:14px}.bottom-banner a{width:100%;margin-left:46px}.site-footer{padding:12px}}
@media(max-width:400px){.metric-icon{display:none}.metric{padding:10px}.welcome h1{font-size:29px}.query-actions{display:block}.run-actions{justify-content:flex-end;margin-top:7px}.example-trigger{padding:4px}.chart-actions .button-secondary{font-size:11.2px}.inspector-tabs{gap:0}.inspector-tab{font-size:10px}.results-foot>span{font-size:10px}}
@media print{.rail,.masthead,.welcome,.metric-row,.work-layout,.site-footer,.dash-top-actions,.delete-chart,.dash-card-foot{display:none!important}.content-area{padding:0!important}.main-shell{width:100%}.dashboard-page{display:block!important;border:0;padding:0}.dashboard-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.dash-card{break-inside:avoid;border:1px solid #ddd}.dash-chart-title{color:#222}.rendered-chart svg{max-height:250px}.dashboard-footnote{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* v3: scalable navigation for 135 lessons, phone-friendly */
.mission-tools{display:flex;gap:6px;margin:8px 2px 11px;align-items:center}
.mission-tools input{width:100%;min-width:0;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:9px 10px;font-size:12.3px;outline:none}
.mission-tools input:focus{border-color:var(--violet);box-shadow:0 0 0 2px rgba(118,83,227,.1)}
.mission-tools button{flex:0 0 32px;width:32px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--violet);cursor:pointer}
.mission-group{border-top:1px solid var(--line)}
.mission-group summary.mission-stage{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:6px;margin:0;padding:11px 6px;color:var(--muted);font-size:11.2px;letter-spacing:.03em;font-weight:700;list-style:none}
.mission-group summary.mission-stage::-webkit-details-marker{display:none}
.mission-group summary.mission-stage small{color:var(--muted);background:var(--surface-2);border-radius:7px;padding:2px 6px;white-space:nowrap;font-size:11.2px}
.mission-group summary.mission-stage:before{content:'›';font-size:16.7px;transform:rotate(0);transition:transform .15s}
.mission-group[open] summary.mission-stage:before{transform:rotate(90deg)}
.mission-group-body{padding-bottom:7px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.backup-controls{display:flex;gap:6px;margin:10px 2px 4px}
.backup-controls button{flex:1;min-width:0;cursor:pointer;border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:8px 5px;font-size:11.2px;color:var(--muted);white-space:nowrap}
.backup-controls button:hover{color:var(--violet);border-color:var(--violet2)}

#engine-retry[hidden]{display:none!important}#engine-retry:not([hidden]){color:var(--violet);font-size:21.2px;font-weight:700}

/* SQL Studio 3.2 · optional query-plan inspector */
.query-plan{display:grid;gap:10px}
.plan-legend{display:flex;flex-direction:column;gap:4px;color:var(--muted,#8a94a6);font-size:12.3px;line-height:1.45;margin-bottom:4px}
.plan-step{border:1px solid var(--border,#e6eaf2);background:var(--surface,#fff);border-radius:12px;padding:11px 12px;min-width:0}
.plan-step-head{margin-bottom:8px}
.plan-tag{display:inline-flex;border-radius:6px;padding:3px 7px;font-size:11.2px;font-weight:700;letter-spacing:.4px;background:#eeeaff;color:#6447b5}
.plan-search .plan-tag{background:#d5f8ec;color:#116c50}
.plan-temp .plan-tag{background:#fff0d5;color:#935d16}
.plan-sql{white-space:pre-wrap;word-break:break-word;font-size:12.3px;display:block;line-height:1.45}
.plan-help{display:block;font-size:12.3px;line-height:1.5;margin-top:8px;color:var(--muted,#8a94a6)}
.plan-disclaimer,.plan-message{font-size:13.4px;color:var(--muted,#8a94a6);line-height:1.6}
.plan-error{color:#ba3b3b}
#explain-btn{font-size:12.3px;min-width:54px;white-space:nowrap}

/* SQL Studio 3.4 — isolated writable lab */
.lab-card{padding:22px 24px 18px;background:linear-gradient(120deg,rgba(123,87,255,.10),rgba(98,193,183,.06));border:1px solid var(--border,#e0dfee);border-radius:18px;margin-bottom:16px}
.lab-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.lab-heading h2{font-size:clamp(22.3px,2.4vw,32.4px);line-height:1.2;letter-spacing:-.025em;margin:5px 0 9px}.lab-heading h2 span{color:#9678e9}.lab-heading p{font-size:14.5px;color:var(--muted,#727383);line-height:1.55;max-width:700px}
.lab-bubble{flex:0 0 auto;border:1px solid rgba(136,103,237,.22);border-radius:16px;color:#8665d9;font-size:13.4px;line-height:1.45;text-align:center;padding:14px 13px;font-weight:700;letter-spacing:.04em;background:rgba(255,255,255,.48)}
.lab-actions,.lab-examples{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.lab-actions{margin-top:18px}.lab-actions button{font-size:13.4px;padding:10px 12px;min-height:38px}
.lab-examples{margin-top:14px}.lab-examples>span:first-child{font-size:13.4px;color:var(--muted,#737488)}.lab-snippet{border:1px solid rgba(138,103,230,.28);color:inherit;background:rgba(255,255,255,.52);border-radius:100px;padding:6px 11px;font-size:13.4px;cursor:pointer}.lab-snippet:hover{background:rgba(138,103,230,.16)}.lab-save-state{font-size:12.3px;color:var(--muted,#777);margin-left:auto}
body.dark .lab-card{background:linear-gradient(120deg,rgba(123,87,255,.15),rgba(98,193,183,.06))}body.dark .lab-bubble,body.dark .lab-snippet{background:rgba(29,30,42,.5)}
@media(max-width:800px){.lab-card{padding:17px}.lab-bubble{display:none}.lab-actions{gap:7px}.lab-actions button{flex:1 1 42%}.lab-save-state{flex:1 0 100%;margin:3px 0 0}}

/* v3.5 — guided SQL diagnostics and interactive foreign-key map */
.sql-diff{margin:12px 0 4px;border:1px solid rgba(123,99,199,.24);border-radius:12px;background:var(--surface,#fff);overflow:hidden}
.sql-diff>summary{cursor:pointer;list-style:none;padding:11px 13px;font-size:13.4px;font-weight:700;color:var(--violet,#7653e3);display:flex;align-items:center;gap:6px}
.sql-diff>summary:before{content:'+';display:grid;place-items:center;width:21px;height:21px;border-radius:7px;background:rgba(119,83,227,.10);font-size:16.7px}
.sql-diff[open]>summary:before{content:'−'}
.sql-diff>summary::-webkit-details-marker{display:none}
.sql-diff-hint{font-size:13.4px;line-height:1.6;padding:0 13px 11px;margin:0;color:var(--muted,#69728b)}
.sql-diff-index{display:block;margin:0 13px 6px;font-size:12.3px;letter-spacing:.025em;font-weight:700;color:var(--muted,#69728b)}
.sql-diff-entry{border-top:1px solid var(--line,#eceaf1);padding:10px 0 8px}
.sql-diff-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0 12px 10px}
.sql-diff-side{background:var(--surface-2,#f7f6fa);border:1px solid var(--line,#eceaf1);border-radius:9px;padding:9px 10px;min-width:0}
.sql-diff-side>small{font-weight:700;display:block;font-size:11.2px;margin-bottom:4px;color:var(--muted,#69728b)}
.sql-diff-side>code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12.3px;line-height:1.5;color:var(--ink,#252537)}
.sql-diff-foot{font-size:11.2px;line-height:1.45;margin:1px 13px 12px;color:var(--muted,#69728b)}
.relation-map{margin-top:18px;padding-top:14px;border-top:1px solid var(--line,#eceaf1);display:grid;gap:9px}
.relation-title{font-size:14.5px;font-weight:700;margin:0;color:var(--ink,#282943)}
.relation-intro{font-size:12.3px;line-height:1.5;margin:0 0 3px;color:var(--muted,#69728b)}
.relation-card{background:var(--surface,#fff);border:1px solid var(--line,#eceaf1);border-radius:11px;padding:10px;box-shadow:0 1px 4px rgba(25,25,60,.025)}
.relation-pair{display:flex;align-items:center;gap:6px;min-width:0}
.relation-node{background:var(--surface-2,#f8f6fc);border-radius:8px;min-width:0;padding:7px;flex:1;overflow-wrap:anywhere}
.relation-node strong,.relation-node code{display:block;line-height:1.38}
.relation-node strong{font-size:11.2px;font-weight:700;color:var(--ink,#29293c)}
.relation-node code{font-size:11.2px;color:var(--violet,#7653e3);margin-top:3px}
.relation-arrow{font-size:16.7px;color:var(--violet,#7653e3);font-weight:700}
.relation-foot{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-top:9px}
.relation-foot small{font-size:11.2px;color:var(--muted,#69728b);line-height:1.4}
.relation-join{flex:none;cursor:pointer;border:1px solid rgba(122,95,206,.28);border-radius:7px;background:rgba(122,95,206,.09);color:var(--violet,#7653e3);font-size:11.2px;font-weight:700;padding:6px 9px}
.relation-join:hover{background:rgba(122,95,206,.18)}
.dark .sql-diff,.dark .relation-card{background:var(--surface)}
.dark .sql-diff-side,.dark .relation-node{background:var(--surface-2)}
@media(max-width:480px){.sql-diff-cols{grid-template-columns:1fr}.relation-card{padding:9px}}

/* Keep the relationship explorer discoverable without pushing fields below the fold. */
.relation-map{display:block;margin:0 0 12px;padding:0;border:1px solid rgba(123,99,199,.22);border-radius:11px;background:var(--surface,#fff);overflow:hidden}
.relation-map>summary{cursor:pointer;list-style:none;font-weight:700;font-size:13.4px;padding:11px 13px;color:var(--violet,#7653e3);background:rgba(123,99,199,.06)}
.relation-map>summary::-webkit-details-marker{display:none}
.relation-map .relation-intro{padding:10px 12px 0}
.relation-map .relation-card{margin:8px 10px}
.relation-map .relation-card:last-child{margin-bottom:10px}

/* SQL Studio 3.6 — selective review, bookmarks, actionable local SQL guidance */
.mission-filter{display:flex;align-items:center;gap:7px;margin:1px 2px 6px}
.mission-filter select{flex:1;min-width:0;appearance:none;background:#25283d;color:#e5e0fa;border:1px solid #454258;border-radius:9px;font-size:12.3px;font-weight:650;padding:9px 24px 9px 10px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b6a8f9' stroke-width='3'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center}
.mission-filter-count{color:#aaa4c3;font-weight:700;font-size:12.3px;min-width:24px;text-align:right}
.mission-link{position:relative}.mission-link .mission-save{font-size:14.5px;color:#bc9efa;flex:none;margin-left:auto}
.mission-link .mission-review{display:block;color:#dcba76;font-size:10px;font-weight:650;margin-top:3px}
.bookmark-btn{margin-left:auto;white-space:nowrap;font-size:12.3px;font-weight:650;color:var(--violet);background:var(--violet-pale);border:1px solid rgba(118,83,227,.17);border-radius:8px;padding:7px 10px;min-height:34px}
.bookmark-btn[aria-pressed="true"]{color:#8155c5;background:#ece5ff;border-color:#c7afea}
.dialect-notes{font-size:12.3px;color:var(--muted);padding:6px 17px 4px;border-top:1px solid var(--line)}
.dialect-notes>summary{cursor:pointer;list-style:none;font-weight:650;display:inline-block}
.dialect-notes>summary::-webkit-details-marker{display:none}.dialect-notes[open]>summary{color:var(--violet)}
.dialect-notes>div{padding:7px 0 6px}.dialect-notes span{display:block;line-height:1.7}
.dialect-notes p{margin:6px 0 0}.dialect-notes code{background:var(--surface-2);border-radius:4px;padding:2px 4px;color:var(--ink)}
.coach-card{margin:13px 0 0;border:1px solid rgba(118,83,227,.24);background:var(--surface);border-radius:12px;padding:13px 15px;line-height:1.55}
.coach-title{font-size:13.4px;font-weight:700;color:var(--violet);margin:0 0 7px}
.coach-steps{margin:0;padding-left:19px;color:var(--ink2);font-size:13.4px}
.coach-steps li+li{margin-top:5px}
.coach-note{display:block;margin-top:8px;font-size:11.2px;color:var(--muted)}
@media(max-width:480px){.bookmark-btn{padding:7px 8px;font-size:11.2px}.dialect-notes{padding:8px 12px}.mission-filter{margin-bottom:2px}}

/* Keep the three-character logomark on one line (grid children previously stacked). */
.brand-glyph .brand-symbol{display:inline;white-space:nowrap;color:#fff;line-height:1;font-size:22.3px}
.brand-glyph .brand-symbol b{color:#b9ffdf;font-weight:700}
.review-schedule{display:block;color:var(--muted);font-size:12.3px;margin-top:9px}

#site-update[hidden]{display:none!important}
.update-button{background:var(--violet-pale);color:var(--violet);border:1px solid rgba(118,83,227,.3);border-radius:8px;padding:7px 10px;font-size:12.3px;font-weight:650}
@media(max-width:650px){.update-button{position:absolute;top:62px;right:12px;z-index:16;box-shadow:0 5px 15px rgba(0,0,0,.10)}}

/* v3.7 · Personal SQL library: compact, touch-friendly, no extra UI framework. */
#save-query-btn{width:auto;min-width:29px;padding-inline:7px;display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;flex-shrink:0;font-weight:700;color:var(--violet);border-color:var(--line)}
.saved-queries-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:7px}
.saved-queries-head h4{margin:0}.saved-queries-head small{font-size:11.2px;color:var(--muted);font-variant-numeric:tabular-nums}
.saved-query-search{display:block;box-sizing:border-box;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink2);font-size:13.4px;margin:8px 0 12px;outline-offset:2px}
.saved-query-search:focus{outline:2px solid var(--violet)}
.saved-query-card{padding:12px;background:var(--surface);border:1px solid var(--line);border-radius:10px;margin:0 0 9px}
.saved-query-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.saved-query-card-head strong{color:var(--ink);font-size:12.3px;line-height:1.45;overflow-wrap:anywhere}
.saved-query-card-head small{color:var(--muted);font-size:10px;white-space:nowrap}
.saved-query-code{display:block;color:var(--ink2);font:11.2px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:8px 0}
.saved-query-actions{display:flex;gap:7px;align-items:center}.saved-query-actions button{border-radius:7px;cursor:pointer;padding:7px 9px;font-size:11.2px;font-weight:650;border:1px solid var(--line);background:var(--surface-2);color:var(--ink2)}
.saved-query-actions .saved-query-open{background:var(--violet-pale);color:var(--violet);border-color:transparent;flex:1}
.saved-query-actions .saved-query-delete{padding:7px 10px}.saved-query-actions button:hover{filter:brightness(.95)}
.saved-query-empty{font-size:12.3px;line-height:1.65;color:var(--muted);margin:8px 0 12px}
.save-query-dialog{color:var(--ink);width:min(calc(100vw - 30px),440px);box-sizing:border-box;border:1px solid var(--line);border-radius:17px;padding:23px 24px;background:var(--surface);box-shadow:0 25px 70px #14142f44}
.save-query-dialog::backdrop{background:#10132488;backdrop-filter:blur(3px)}
.save-query-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.save-query-head h2{font-size:21.2px;margin:0;font-weight:700}
.save-query-dialog p{font-size:13.4px;color:var(--muted);line-height:1.7;margin:12px 0 18px}
.save-query-dialog label{display:block;font-size:12.3px;font-weight:700;margin-bottom:7px}
.save-query-dialog input{box-sizing:border-box;display:block;width:100%;padding:12px 13px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink);border-radius:9px;font:14.5px ui-sans-serif,system-ui,sans-serif}
.save-query-dialog input:focus{outline:2px solid var(--violet);outline-offset:1px}
.save-query-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}
@media(max-width:680px){#save-query-btn .save-query-label{display:none}}
@media(max-width:480px){#save-query-btn{font-size:13.4px;padding:6px 8px}.save-query-dialog{padding:18px}.saved-query-actions button{min-height:35px}}

@media(min-width:901px){.icon-btn.rail-close{display:none}}
@media(max-width:900px){
 .rail:not(.open){visibility:hidden}
 .masthead{position:sticky;top:0;z-index:21}
 #work-layout{scroll-margin-top:70px}
}

.welcome{height:auto;min-height:208px}
.welcome-visual{height:154px}
.welcome p{font-size:15.6px;color:#5d5672}
.dark .welcome p{color:#d2cbe6}
.welcome-start{display:inline-flex;align-items:center;min-height:40px;margin-top:12px;padding:0 12px;border-radius:8px;background:#684ac7;color:#fff;font-size:14.5px;font-weight:700}
.welcome-start:hover{background:#5538af}
#task-card{scroll-margin-top:76px}

.rail-link,.mission-tools input,.mission-filter select{font-size:14.5px}
.mission-copy strong{font-size:13.4px}
.mission-copy small{font-size:12.3px;color:#b0a8c2}
.backup-controls button{font-size:12.3px}
.metric small,.task-bottom span,.bookmark-btn,.inspector-tab{font-size:13.4px}
.task-heading p,.lab-heading p,.editor-guide,.hint-level p,.guide p,.inspect-description,.notice-card,.feedback p{font-size:15.6px}
.editor-guide{margin:0;padding:9px 16px;border-bottom:1px solid var(--line);color:var(--muted);line-height:1.5}
.CodeMirror{font-size:16.7px!important}
.button-primary,.button-outline,.example-trigger,.result-tab,.hint-level summary,.guide summary,.data-table,.data-table th{font-size:14.5px}
.panel-title h3,.results-head h3,.insight-head strong{font-size:16.7px}
.task-bottom,.panel-toolbar,.panel-small-actions,.inspector-tabs,.run-actions{flex-wrap:wrap}
.panel-toolbar{height:auto;min-height:56px;padding-block:8px;gap:8px}
.panel-small-actions{gap:6px}
.inspector-tab{min-height:36px}

@media(max-width:900px){
 .welcome{min-height:0}
}
@media(max-width:680px){
 .metric{min-width:0}
 .metric small{font-size:12.3px}
 .metric-icon{display:none}
 .task-bottom{gap:8px}
 .task-bottom span{flex-basis:100%}
 .bookmark-btn{margin-left:0}
 .query-actions button,.panel-small-actions button,.results-tools button{min-height:40px}
}
@media(max-width:480px){
 .query-actions,.run-actions{justify-content:flex-start}
 .run-actions{margin-left:0}
 .results-tools .icon-text{min-width:40px;justify-content:center}
}


/* Keep navigation usable when larger text meets a short viewport. */
.rail{overflow-y:auto;height:100dvh}
.rail-lessons{min-height:250px}
.rail-link{height:auto;min-height:44px;padding-block:8px}
.rail-bottom{flex-shrink:0}
.rail-course{padding:13px 14px;gap:10px;background:#312751;border:1px solid #7464a3;border-radius:12px;color:#f2eaff}
.rail-course strong,.rail-course small{display:block}
.rail-course strong{font-size:15.8px}
.rail-course small{font-size:12.1px;color:#d0c6e6;margin-top:3px}
.rail-course:hover{background:#403367}

.bottom-banner{display:block;padding:26px 30px;margin-top:26px;border:1px solid #8467c5;background:#f1ebff;border-radius:16px}
.bottom-banner h2{margin:0 0 6px;color:#3c2a64;font-size:22.3px;line-height:1.2}
.bottom-banner p{color:#554666;font-size:14.9px}
.bottom-banner .stepik-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:16px}
.bottom-banner a{width:auto;margin:0;white-space:normal;font-size:14px;color:#563b9d}
.bottom-banner .stepik-primary{background:#5e409f;color:#fff;border-radius:9px;padding:10px 14px}
.bottom-banner .stepik-primary:hover{background:#4c307f}
.bottom-banner .stepik-example:hover{text-decoration:underline}
.dark .bottom-banner h2{color:#f1eaff}
.dark .bottom-banner p{color:#d7cde5}
.dark .bottom-banner .stepik-example{color:#d6c5ff}

@media(max-width:680px){
 .bottom-banner{padding:20px 16px}
 .bottom-banner h2{font-size:19.5px}
 .results-head{flex-wrap:wrap}
}
@media(max-width:360px){
 .masthead,.mast-left,.mast-right{gap:6px}
 .breadcrumbs span{padding-inline:2px}
 .backup-controls button{white-space:normal}
}


/* Keep the editor and the current task visually ahead of navigation. */
.rail{
 --rail-bg:#eef0f6;--rail-ink:#34394e;--rail-muted:#565e75;
 --rail-line:#d8dce7;--rail-hover:#e5e8f0;--rail-current:#e5e0f3;
 --rail-accent:#534285;
 background:var(--rail-bg);color:var(--rail-ink);border-right:1px solid var(--rail-line);
}
.dark .rail{
 --rail-bg:#202432;--rail-ink:#e1e4ef;--rail-muted:#b2bbd0;
 --rail-line:#383e51;--rail-hover:#292f41;--rail-current:#35304a;
 --rail-accent:#d2c4f5;
}
.brand-row,.rail-bottom,.mission-group{border-color:var(--rail-line)}
.brand-row{height:auto;padding-block:18px}
.brand-glyph{background:#65538f;box-shadow:none}
.brand-name{letter-spacing:-.035em}
.brand-name span{color:var(--rail-accent);letter-spacing:-.025em}
.brand-name small,.rail-caption,.rail-section-title,.rail-section-title strong,.mission-group summary.mission-stage,.mission-copy small{color:var(--rail-muted)}
.rail-caption,.rail-section-title{letter-spacing:.06em}
.rail-group{padding-top:14px}
.rail-divider,.rail-progress{background:var(--rail-line)}
.rail-link,.mission-link{color:var(--rail-ink)}
.rail-link:hover,.mission-link:hover{background:var(--rail-hover);color:var(--rail-ink)}
.rail-link.active,.mission-link.selected{background:var(--rail-current);color:var(--rail-accent)}
.rail-link.active svg,.mission-link .mission-save,.rail-close{color:var(--rail-accent)}
.rail-count,.mission-group summary.mission-stage small,.mission-index{
 background:transparent;color:var(--rail-muted);border-color:var(--rail-line);
}
.mission-link.selected .mission-index{background:transparent;color:var(--rail-accent);border-color:var(--rail-line)}
.rail .mission-filter select,.rail .mission-tools input,.rail .mission-tools button,.rail .backup-controls button{
 background:var(--rail-bg);color:var(--rail-ink);border-color:var(--rail-line);box-shadow:none;
}
.rail .mission-filter select{appearance:auto;background-image:none;padding-right:8px}
.rail .mission-tools input::placeholder{color:var(--rail-muted)}
.rail .backup-controls button{white-space:normal}
.rail-bottom{background:var(--rail-bg)}
.rail-course{background:var(--rail-current);border-color:var(--rail-line);color:var(--rail-accent)}
.rail-course small{color:var(--rail-muted)}
.rail-course:hover{background:var(--rail-hover);color:var(--rail-accent)}
.mission-list{scrollbar-color:var(--rail-muted) transparent}

.welcome,.dark .welcome{background:var(--surface);border-color:var(--line);min-height:0}
.welcome h1{font-size:clamp(26px,2.7vw,37px);letter-spacing:-.025em;line-height:1.16;margin-top:0}
.welcome h1 em{color:inherit}
.welcome p{max-width:65ch;color:var(--muted)}
.welcome-pills span,.dark .welcome-pills span{
 border:0;background:transparent;color:var(--muted);padding:0 8px 0 0;
}
.welcome-pills svg,.dark .welcome-pills svg{color:var(--muted)}
.metric-row{gap:0;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.metric{border:0;border-radius:0;box-shadow:none;background:transparent;padding-block:11px}
.metric+.metric{border-left:1px solid var(--line)}
.metric-icon{display:none}
.query-panel,.task-card,.results-panel,.inspector,.dashboard-page,.lab-card{box-shadow:none}
.button-primary{background:#665095;border-color:#665095;box-shadow:none}
.button-primary:hover{background:#554079}
.button-outline,.bookmark-btn,#save-query-btn{color:var(--ink2);border-color:var(--line);background:var(--surface)}
#save-query-btn:hover,.bookmark-btn:hover{background:var(--surface-2)}
.inspector-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px}
.inspector-tab.active{box-shadow:none}
.bottom-banner,.dark .bottom-banner{background:var(--surface);border-color:var(--line)}
.bottom-banner h2,.dark .bottom-banner h2{color:var(--ink)}
.bottom-banner p,.dark .bottom-banner p{color:var(--muted)}
.bottom-banner .stepik-primary{background:var(--violet-pale);color:var(--violet);border:1px solid var(--line)}
.bottom-banner .stepik-primary:hover{background:var(--surface-2)}