.app.classroom{background:#f9faf8;display:block}.classroom .sidebar{background:#fff;flex-direction:row;align-items:center;gap:36px;width:100%;padding:12px 28px;position:static}.classroom .brand-icon{border-radius:8px;width:36px;height:36px;font-size:22px}.classroom .side-caption,.classroom .side-bottom{display:none}.classroom .sidebar nav{flex-direction:row;gap:8px;margin:0}.classroom .sidebar nav a{padding:8px 14px;font-size:12px}.classroom .nav-num,.classroom .arrow{display:none}.classroom .main-shell{width:100%;margin:0}.classroom .topbar{background:#fff;height:40px;padding:0 28px}.classroom .lesson-heading{max-width:none;margin:12px 0 18px}.classroom .lesson-heading h1{font:600 28px/1.4 var(--body);letter-spacing:-.7px;margin:8px 0}.classroom .lesson-heading p{margin:8px 0;font-size:12px}.classroom .reading-grid,.classroom .practice-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}.classroom .reading,.classroom .problem{border-right:1px solid var(--line);max-width:none;padding-right:28px}.classroom .reading>.markdown>:first-child{margin-top:0}.classroom .workspace,.classroom .example-workspace{min-width:0;position:sticky;top:18px}.workspace-heading{justify-content:space-between;align-items:center;gap:16px;font-size:11px;display:flex}.classroom .example{background:0 0;border:0;margin:0;padding:0}.classroom .example>p{color:var(--muted);font-size:12px}.classroom .exercise-picker{flex-wrap:wrap;margin:12px 0 18px}.classroom .exercise-picker button{padding:7px 14px;font-size:12px}.classroom .editor-label{margin-top:0}.editor-body{min-width:0;display:flex}.line-numbers{text-align:right;color:#8ea399;height:310px;font:13px/1.8 var(--mono);-webkit-user-select:none;user-select:none;background:#142923;flex:0 0 44px;padding:20px 8px;overflow:hidden}.editor .editor-body textarea{white-space:pre;overflow-wrap:normal;min-width:0;padding-left:12px}.classroom .editor{border-radius:8px;box-shadow:0 5px 18px #173c3610}.classroom .result-panel{color:#e2eed7;background:#1c2925;border:1px solid #34483f;min-height:150px;margin:16px 0}.classroom .result-panel pre{max-height:280px;overflow:auto}.learning-details{border:1px solid var(--line);background:#fff;border-radius:6px;margin:18px 0}.learning-details summary{cursor:pointer;padding:14px 16px;font-size:12px;font-weight:600}.learning-details summary:focus-visible{outline-offset:3px;outline:3px solid #709c27}.learning-details[open] summary{border-bottom:1px solid var(--line)}.details-body{padding:0 16px 16px}.classroom .quiz-list{max-width:900px;margin:auto}@media (max-width:900px){.classroom .reading-grid,.classroom .practice-grid{grid-template-columns:minmax(0,1fr);gap:24px}.classroom .reading,.classroom .problem{border:0;padding:0}.classroom .workspace,.classroom .example-workspace{position:static}}@media (max-width:760px){.classroom .sidebar{flex-wrap:wrap;gap:12px;padding:14px 18px}.classroom .sidebar nav{flex-wrap:wrap;gap:4px}.classroom .sidebar nav a{padding:6px 10px;font-size:11px}.classroom .topbar{padding:0 18px}.classroom main{padding:20px 18px}.classroom .lesson-heading h1{font-size:24px}.classroom .tabs{gap:14px}.classroom .tabs button{font-size:11px}.line-numbers{font-size:12px}}.editor .editor-body textarea{resize:none;height:310px}.app.classroom{--paper:#fff;--ink:#292d32;--muted:#6b7078;--line:#dedfe3;--green:#eaf2ff;--forest:#3077ef;--body:Arial, "Be Vietnam Pro", sans-serif;--display:Arial, "Be Vietnam Pro", sans-serif;color:var(--ink);font-family:var(--body);background:#fff}.classroom .sidebar{background:#f8f9fa;gap:24px;min-height:50px;padding:6px 130px 6px 24px}.classroom .brand{font-size:16px}.classroom .brand small,.classroom .brand br{display:none}.classroom .brand-icon{background:#3077ef;border-radius:3px;width:30px;height:30px;font-size:18px}.classroom .brand-icon span{color:#fff}.classroom .sidebar nav a{color:#246bd3;padding:6px 10px;font-size:14px;font-weight:400}.classroom .topbar{background:0 0;border:0;height:36px;padding:0;position:absolute;top:6px;right:24px}.classroom .topbar>span{display:none}.classroom .topbar>a,.classroom .topbar>button{color:#fff;background:#3077ef;border-radius:3px;padding:7px 12px;font-size:13px}.classroom main{max-width:none;padding:16px 24px 28px}.classroom footer{display:none}.classroom .lesson-studio{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;column-gap:26px;display:grid}.classroom .lesson-studio>*{grid-column:1;min-width:0}.classroom .reading-grid,.classroom .practice-grid{display:contents}.classroom .reading,.classroom .problem{border:0;grid-column:1;padding:0}.classroom .workspace,.classroom .example-workspace{grid-area:1/2/span 12;top:12px}.classroom .back-link{color:#2871de;font-size:12px}.classroom .lesson-heading{margin:8px 0}.classroom .lesson-heading h1{font:500 28px/1.3 var(--body);margin:6px 0}.classroom .lesson-heading p{margin:8px 0;font-size:13px;line-height:1.6}.classroom .eyebrow{color:#747982;letter-spacing:1px;font-size:10px}.classroom .tabs{gap:18px;margin:4px 0 22px}.classroom .tabs button{padding:9px 2px;font-size:12px;font-weight:400}.classroom .tabs .selected{color:#2169d7;border-color:#3077ef}.classroom button{border-radius:3px}.classroom button:hover{background:#eaf2ff}.classroom .primary,.classroom .run-toolbar button{color:#fff;background:#3077ef;border-color:#3077ef;padding:8px 14px;font-weight:400}.classroom .primary:hover,.classroom .run-toolbar button:hover{background:#2161cc}.classroom .run-toolbar .primary{color:#286bd3;background:#fff}.classroom .run-toolbar{align-items:center;gap:10px;margin:0 0 10px;display:flex}.classroom .workspace-heading{display:none}.classroom .example-workspace>.exercise-picker{margin:0 0 8px}.classroom .exercise-picker{gap:6px;margin:0 0 16px}.classroom .exercise-picker button{background:#fff;padding:5px 12px}.classroom .exercise-picker .selected{color:#2268d3;background:#eaf2ff;border-color:#8bb2ef}.classroom .editor-label{color:#707680;margin:0;font-size:11px}.classroom .editor-label small{font-size:10px}.classroom .editor{box-shadow:none;background:#272822;border:1px solid #393a36;border-radius:2px;margin-top:6px}.classroom .editor-top{color:#b9bab2;background:#22231f;border-color:#3b3c35;padding:6px 12px}.classroom .line-numbers{color:#8c8e80;background:#23241f}.classroom .editor textarea{color:#f8f8f2;font:14px/1.8 Consolas, var(--mono)}.classroom .line-numbers{font:14px/1.8 Consolas, var(--mono)}.classroom .editor .editor-body textarea,.classroom .line-numbers{height:280px;min-height:280px}.classroom .example>p{margin:10px 0;font-size:12px}.classroom label{margin:10px 0}.classroom input,.classroom textarea{border-color:#cfd3da;border-radius:3px}.classroom .result-panel{color:#f8f8f2;background:#272822;border-color:#393a36;border-radius:3px;min-height:180px;margin:12px 0}.classroom .result-panel .eyebrow{color:#b5b8aa}.classroom .result-panel pre{font:14px/1.7 Consolas, var(--mono)}.classroom .markdown{font-size:15px;line-height:1.85}.classroom .markdown h2,.classroom .problem h2{font:500 24px/1.4 var(--body)}.classroom .markdown h3{font:500 19px/1.4 var(--body)}.classroom .markdown pre{color:#f8f8f2;background:#272822;border-radius:3px;padding:16px}.classroom .markdown :not(pre)>code{color:#333;background:#f0f1f3}.classroom .markdown blockquote{color:#555d69;background:#f7f9fc;border-color:#3077ef}.classroom .sample pre{background:#f4f5f7}.classroom .learning-details{border-color:#d4d6da;border-radius:3px}.classroom .learning-details summary{background:linear-gradient(#fff,#ebeced);padding:13px 18px;font-size:15px;font-weight:400}.classroom .hint,.classroom .notice{background:#eef4ff;border-color:#3077ef}.classroom .error{background:#fff0e9;border-color:#b26044}.classroom .quiz-list{grid-column:1/-1;width:100%}.classroom .quiz-card{background:#fff}.classroom :is(button,a,input,textarea,summary):focus-visible{outline-color:#3077ef}@media (max-width:900px){.classroom .lesson-studio{display:block}.classroom .reading-grid,.classroom .practice-grid{grid-template-columns:minmax(0,1fr);display:grid}.classroom .workspace,.classroom .example-workspace{grid-area:auto;position:static}}@media (max-width:600px){.classroom .sidebar{gap:12px;padding:10px 14px}.classroom .sidebar nav{width:100%}.classroom .sidebar nav a{font-size:13px}.classroom .topbar{top:8px;right:14px}.classroom main{padding:18px 14px}.classroom .lesson-heading h1{font-size:25px}.classroom .tabs{gap:12px}}.classroom .stdin-panel{background:#fafafa;border:1px solid #d4d6da;border-radius:3px;margin:10px 0}.classroom .stdin-panel summary{cursor:pointer;color:#505762;padding:9px 12px;font-size:12px}.classroom .stdin-panel label{margin:0 12px 12px}.classroom .example h2{margin:14px 0 8px;font-size:19px}.guided-lesson{gap:20px;display:grid}.guided-lesson>.example,.guided-lesson>.reading{width:100%;max-width:850px;margin-inline:auto}.guided-lesson>.example{border:1px solid #d4d6da;padding:20px}.classroom .lesson-studio>.guided-lesson{grid-column:1/-1}.classroom .guided-lesson>.guided-example{background:#fff;border:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;max-width:none;padding:0;display:grid}.guide-instructions,.guide-workspace{min-width:0}.guide-workspace{align-self:start;position:sticky;top:16px}.guide-workspace-title{color:var(--muted);border-bottom:1px solid var(--line);padding:10px 0;font-size:13px}.guide-workspace>button:not(.text-button){background:var(--accent);color:#fff;margin:8px 8px 8px 0}.guide-output{background:var(--code-bg);color:#f8f8f2;border-radius:3px;min-height:120px;padding:18px}.classroom .guided-lesson>.practice-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;display:grid}.classroom .guided-lesson .practice-grid>.workspace{grid-row:auto}.guide-header{border-left-color:var(--accent);background:#f5f8fe}@media (max-width:900px){.classroom .guided-lesson>.guided-example,.classroom .guided-lesson>.practice-grid{grid-template-columns:minmax(0,1fr)}.guide-workspace{position:static}}.guided-lesson textarea:not(.editor textarea){min-height:80px}.guide-header h2{margin:10px 0}.guide-navigation{border-top:1px solid #d4d6da;padding:20px 0}.classroom .example-explanation{margin:12px 0}.classroom .example-explanation-body,.classroom .reading-preparation>details>.markdown{padding:0 16px 16px}.classroom .example-explanation-body pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#20242b;background:#f1f4f8;padding:12px}.classroom .first-lesson{grid-column:1/-1}.first-lesson-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;display:grid}.first-lesson-grid>*{min-width:0}.first-lesson-grid h2{margin-top:12px}.first-lesson-grid p{line-height:1.65}.first-lesson-grid .primary{margin-top:12px}@media (max-width:900px){.first-lesson-grid{grid-template-columns:minmax(0,1fr)}}.first-lesson .error-sample{white-space:pre-wrap;overflow-wrap:anywhere;background:#f5f6f8;padding:12px;font-size:13px}
