.source-code-compare{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}.source-code-compare.has-reference[data-layout=side]{grid-template-columns:repeat(2,minmax(0,1fr))}.source-code-mine{min-width:0}.source-code-compare #sourceReferenceBox{min-width:0;margin:0;padding:12px;border-top:0}.source-code-compare #sourceReferenceBox>pre{height:500px;max-height:500px}.source-compare-control{display:block;padding:0 14px;font-size:12px;color:var(--ui-dim)}.source-compare-control select{font:12px system-ui;padding:5px;background:var(--ui-raised);color:var(--ui-text);border:1px solid var(--ui-line);border-radius:5px}.source-integration-start{font-size:12px;align-self:center;padding:6px}
.integration-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;align-items:start}.integration-task{padding:18px;line-height:1.7}.integration-task h2{font-size:16px;margin:0}.integration-task ol{padding-left:21px;font-size:13px}.integration-task>p,.integration-task details{font-size:13px}.integration-task>button{padding:8px 10px;border:1px solid var(--ui-line);border-radius:7px;background:var(--ui-raised);color:var(--ui-text);cursor:pointer;font:12px/1.5 system-ui}.integration-editor{min-width:0;overflow:hidden}.integration-editor .practice-writing-toolbar{flex-wrap:wrap;gap:8px}.integration-editor .practice-writing-toolbar>label{display:flex;align-items:center;gap:5px;font-size:12px}.integration-editor :is(select,#integrationToggleReference){font:12px/1.5 system-ui;background:var(--ui-raised);color:var(--ui-text);border:1px solid var(--ui-line);border-radius:6px;padding:6px 9px}
#integrationTabs{display:flex;gap:4px;overflow:auto;padding:10px 12px;border-block:1px solid var(--ui-line);background:var(--ui-raised)}#integrationTabs button{flex:0 0 auto;white-space:nowrap;font:12px/1.4 Consolas,monospace;color:var(--ui-dim);background:transparent;border:1px solid transparent;border-radius:7px;padding:8px;cursor:pointer}#integrationTabs button[aria-selected=true]{color:var(--ui-accent);background:var(--ui-panel);border-color:var(--ui-line)}#integrationRole,#integrationSave{padding:0 14px}.integration-compare{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:0 10px}.integration-compare.has-reference[data-layout=side]{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-compare>section{min-width:0;overflow:hidden}.integration-compare .editor-header{min-height:48px}.integration-compare .editor-wrap,.integration-reference-body{height:540px;min-width:0}.integration-reference-body{display:flex;overflow:hidden;background:var(--code-bg)}.integration-reference[hidden]{display:none}
.integration-reference-body pre{margin:0;white-space:pre;border-radius:0;font:13px/1.6 Consolas,monospace;padding:14px 10px;tab-size:4}.integration-reference-body #integrationReferenceLines{flex:0 0 3.6em;min-width:3.6em;overflow:hidden;text-align:right;user-select:none;background:var(--code-gutter);color:var(--code-dim);border-right:1px solid var(--ui-line)}.integration-reference-body #integrationReference{flex:1;min-width:0;overflow:auto;color:var(--code-text);background:var(--code-bg)}.integration-editor #integrationEditor{white-space:pre;font:13px/1.6 Consolas,monospace;background:var(--code-bg);color:var(--code-text)}.integration-editor .practice-line-numbers{padding:14px 8px;font:13px/1.6 Consolas,monospace;max-height:none}.integration-editor [aria-pressed=true]{border-color:var(--ui-accent);color:var(--ui-accent)}
@media(max-width:1000px){.integration-layout{grid-template-columns:minmax(0,1fr)}.integration-task{display:block}.integration-task .learning-coach{margin-top:12px}.integration-compare .editor-wrap,.integration-reference-body{height:430px}}@media(max-width:500px){.integration-compare{padding:0 5px;gap:5px}.integration-compare .editor-wrap,.integration-reference-body{height:380px}.integration-editor .practice-writing-toolbar{padding:10px}.integration-editor .editor-header{font-size:11px}.integration-editor .ca-font-controls{flex-wrap:wrap}}