/* Connected investigations: readable task controls around the existing teaching model. */
.computer-connected{--cw-ink:#153d40;--cw-teal:#176b61;--cw-paper:#fffef7;--cw-line:#d2dfd0;--cw-muted:#4d665e}
.computer-connected .computer-titlebar{margin-bottom:16px}.computer-connected .computer-titlebar h1{font-size:clamp(1.9rem,3vw,2.8rem);margin-bottom:6px}.computer-connected .back-link{margin-bottom:10px}.computer-connected .computer-main{padding-top:18px}.computer-connected .computer-layout{grid-template-columns:minmax(0,1fr) minmax(280px,330px);gap:18px}.computer-connected .computer-stage{height:clamp(230px,34vh,350px)}
.cw-workshop{padding:16px 20px 12px;background:#fffef7;border-bottom:1px solid var(--cw-line)}.cw-nav{display:flex;gap:6px;flex-wrap:wrap}.cw-nav button,.cw-build-stages button{min-height:44px;background:#edf2e5;border:1px solid #d1ddca;border-radius:11px;padding:9px 14px;font-weight:750;font-size:.88rem}.cw-nav button[aria-pressed=true],.cw-build-stages button[aria-pressed=true]{background:#153d40;color:#fffef1;border-color:#153d40}.cw-taskline{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 10px}.cw-taskline label{font-size:.81rem;font-weight:700;color:var(--cw-muted)}.cw-taskline select{flex:1;max-width:100%;min-width:140px}.cw-taskline button{font-size:.78rem}.cw-workshop h2{font-size:clamp(1.1rem,1.7vw,1.55rem);margin:10px 0 7px;line-height:1.3}.cw-workshop #cwPrompt{font-size:.85rem;line-height:1.5;color:var(--cw-muted);margin:0 0 12px}
.cw-workshop button,.cw-inspector button,.cw-detail button{border:1px solid #bed1c3;min-height:44px;border-radius:9px;background:#edf2e5;padding:10px 12px;font-size:.85rem;font-weight:750;line-height:1.4;white-space:normal}.cw-workshop button:hover,.cw-inspector button:hover,.cw-detail button:hover{border-color:#176b61;background:#e0eee2}.cw-workshop button:disabled,.cw-inspector button:disabled,.cw-detail button:disabled{opacity:.6;cursor:default}
.cw-workshop select,.cw-workshop input,.cw-inspector select,.cw-inspector input,.cw-detail select,.cw-detail input,.cw-detail textarea{border:1px solid #adc5b8;background:#fffef8;color:#153d40;border-radius:9px;min-height:44px;font:inherit;font-size:.9rem;padding:10px;min-width:0;max-width:100%}.cw-workshop label,.cw-inspector label,.cw-detail label{font-size:.83rem;font-weight:650;color:#355d52;line-height:1.45}.cw-quick{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:10px;background:#f3f5e9;border:1px solid #d7e0cc;border-radius:12px}.cw-quick select{max-width:200px;flex:1}.cw-quick input{width:92px}.cw-quick input[type=text]{width:160px;flex:1}.cw-quick [data-cw-action=transform],.cw-quick [data-cw-action=robot],.cw-quick [data-cw-action=number]{background:#176b61;color:#fffef7;border-color:#176b61}.cw-quick p{margin:0;font-size:.83rem;flex:1;line-height:1.5}
.cw-results{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:8px;margin-top:10px}.cw-results>div{min-width:0;padding:10px 12px;border-radius:10px;background:#f0f4e5;border:1px solid #d9e2ce}.cw-results small{display:block;color:#526f61;font-size:.75rem;font-weight:650;line-height:1.4}.cw-results strong{display:block;font-size:1.1rem;margin-top:3px;line-height:1.4;overflow-wrap:anywhere}.cw-results>div:last-child{background:#fff4c7;border-color:#e8d582}.cw-status{font-size:.83rem;line-height:1.55;margin:9px 0 0;min-height:0;color:#346758}.cw-status:empty{display:none}
.cw-inspector{position:sticky;top:12px;align-self:start;padding:19px;background:#fffef6;border:1px solid #cbdcc9;border-radius:16px;min-width:0;max-height:calc(100dvh - 24px);overflow-y:auto;scrollbar-width:thin}.cw-inspector h3{font-size:1.05rem;line-height:1.35;margin:0 0 12px}.cw-inspector label{display:block;margin:9px 0 5px}.cw-inspector select,.cw-inspector input{width:100%}.cw-inspector button{margin-top:8px}.cw-inspector details{margin:14px 0;padding:12px;background:#f2f5e8;border-radius:10px;border:1px solid #d2dec9}.cw-inspector summary{cursor:pointer;font-size:.88rem;font-weight:700;min-height:32px;line-height:1.5}.cw-inspector p{font-size:.84rem;line-height:1.6}.cw-note{font-size:.78rem!important;line-height:1.6!important;color:#536a59}.cw-microscope{border-top:1px solid #d2dfce;margin-top:16px;padding-top:16px}.cw-badge{font-size:.7rem!important;font-weight:800;letter-spacing:.04em;background:#e4f0e1;padding:8px;border-radius:7px;color:#285947}#cwLayers{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:10px}#cwLayers button[aria-pressed=true]{background:#ffdc71;color:#153d40;border-color:#cfb253}.cw-bit-evidence{display:grid;gap:4px;background:#173d40;color:#fffce5;padding:14px;border-radius:10px;font-variant-numeric:tabular-nums}.cw-bit-evidence strong{border-top:1px solid #6e9d8c;padding-top:6px;color:#ffdc71}.cw-bit-evidence code{font-size:1rem}.cw-route{padding:11px;border:1px dashed #749a83;border-radius:8px;overflow-wrap:anywhere}#cwOriginal>.computer-lesson-panel{position:static;border:0;padding:10px 0;background:transparent;max-height:none}
.cw-detail{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,1fr);gap:18px;margin:20px 0}.cw-detail>div,.cw-notebook{border:1px solid #cbdcc9;background:#fffef7;border-radius:15px;padding:22px;min-width:0}.cw-detail h2{font-size:1.35rem;margin:0 0 12px;line-height:1.3}.cw-detail p{font-size:.91rem;line-height:1.65}.cw-notebook label{display:block;margin:12px 0 7px}.cw-notebook textarea{width:100%;resize:vertical;min-height:75px}.cw-notebook select{width:100%}.cw-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.cw-notebook .cw-buttons button:first-child{background:#176b61;color:white;border-color:#176b61}.cw-notebook #cwNotebookPrivacy{font-size:.8rem;color:#566e60}.cw-build-stages{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.cw-build-stages button{font-size:.78rem;flex:1 1 110px}.cw-circuit-table{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin:12px 0}.cw-circuit-table fieldset{border:1px solid #c5d9ca;border-radius:12px;margin:0;min-width:0;padding:12px;background:#eef5e9}.cw-circuit-table legend{font-size:.85rem;font-weight:800;padding:0 7px}.cw-circuit-table select{width:100%}.cw-circuit-table label{display:block;margin:6px 0 4px}.cw-detail table{border-collapse:collapse;width:100%;font-size:.85rem;margin:12px 0;table-layout:fixed}.cw-detail th,.cw-detail td{padding:8px 5px;border:1px solid #d3dfcc;text-align:center;overflow-wrap:anywhere}.cw-detail th{background:#e5efdc}.cw-detail caption{text-align:left;padding:8px 0;font-size:.81rem;color:#4d6c58}.cw-control-chain{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:.85rem}.cw-control-chain>span{padding:10px;background:#edf3df;border:1px solid #d2dfc6;border-radius:9px}.cw-encoding{display:flex;flex-wrap:wrap;gap:10px}.cw-encoding article{padding:14px;display:grid;gap:7px;border:1px solid #d1ddc7;border-radius:11px;max-width:100%;min-width:130px;flex:1}.cw-encoding strong{font-size:1.5rem}.cw-encoding code{white-space:normal;overflow-wrap:anywhere;font-size:.85rem}.cw-unicode-summary{display:flex;gap:10px;flex-wrap:wrap}.cw-unicode-summary span{background:#eef3e2;padding:12px;border-radius:10px;font-size:.84rem}.cw-unicode-summary strong{margin-left:8px;font-size:1.25rem}.cw-shaped{font-size:2.3rem!important;padding:18px;background:#fff4c9;border-radius:12px;overflow-wrap:anywhere}.cw-glyph{display:grid;grid-template-columns:repeat(5,18px);gap:4px;width:max-content;background:#173d40;padding:18px;margin-top:15px;border-radius:12px}.cw-glyph i{height:18px;background:#305b55;border-radius:2px}.cw-glyph i.on{background:#ffdf72}#cwRobotDiagram{width:100%;max-height:180px;margin:10px 0}#cwRobotCode{white-space:pre-wrap;overflow-wrap:anywhere;background:#f0f4e7;padding:14px;border-radius:10px;font-size:.85rem;max-height:230px;overflow:auto}
.computer-connected:not(.cw-manual)[data-computer-mode=discover] .workbench-bar,.computer-connected:not(.cw-manual)[data-computer-mode=build] .workbench-bar{display:none}.computer-connected .workbench-bar-heading h2{font-size:1rem}.computer-connected .scene-scale{font-size:.73rem}.computer-connected .scene-tools{font-size:.8rem;gap:12px;flex-wrap:wrap}.computer-connected .scene-tools select{font-size:.8rem;min-height:44px}.computer-connected .toggle-control{font-size:.8rem}.computer-connected .model-description{font-size:.8rem;color:#54685c}.computer-connected .scene-status{font-size:.85rem}.computer-connected .computer-tabs button{font-size:.85rem}.computer-connected .computer-table{font-size:.84rem}.computer-connected .computer-table th,.computer-connected .computer-table td{font-size:.82rem}.computer-connected .cpu-register>code,.computer-connected #pixelCaption{font-size:.77rem}.computer-connected .computer-progress button{min-width:30px;height:32px}.computer-connected .stage-instruction,.computer-connected .stage-discovery{font-size:.87rem}.computer-connected .workbench-evidence{font-size:.85rem}.computer-connected .workbench-evidence small{font-size:.76rem}.computer-connected .workbench-evidence strong{font-size:.95rem}
@media(max-width:1000px){.computer-connected .computer-layout{grid-template-columns:minmax(0,1fr) 275px;gap:12px}.cw-inspector{padding:14px}.cw-workshop{padding:14px}.cw-detail{grid-template-columns:1fr 1fr;gap:12px}.cw-results{grid-template-columns:1fr 1.1fr 1fr}.cw-results>div{padding:8px}.cw-results strong{font-size:.95rem}}
@media(max-width:760px){.computer-connected .computer-layout{display:block}.computer-connected .computer-main{padding:12px 12px 100px}.computer-connected .computer-titlebar{margin-bottom:12px}.computer-connected .computer-titlebar h1{font-size:1.9rem}.computer-connected .title-aside{display:none}.cw-workshop{padding:12px}.cw-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}.cw-nav button{font-size:.8rem;padding:9px 6px}.cw-taskline{gap:7px;margin:9px 0}.cw-taskline label{display:none}.cw-taskline select{flex-basis:65%;font-size:.85rem}.cw-taskline button{flex:1;padding:7px;font-size:.76rem}.cw-workshop h2{font-size:1.17rem}.cw-workshop #cwPrompt{font-size:.82rem;margin-bottom:9px}.cw-quick{gap:6px}.cw-quick label{font-size:.79rem}.cw-quick select{max-width:none}.cw-quick [data-cw-action]{flex:1 1 110px}.cw-results{grid-template-columns:1fr 1fr 1fr;gap:5px}.cw-results small{font-size:.72rem}.cw-results strong{font-size:.95rem}.cw-status{font-size:.81rem;line-height:1.5}.computer-connected .computer-stage{height:clamp(170px,26vh,245px)}.computer-connected .scene-heading{flex-wrap:wrap}.computer-connected .scene-live{font-size:.74rem}.computer-connected .scene-heading button{font-size:.76rem;min-height:44px}.computer-connected .scene-tools{padding:8px 12px;font-size:.8rem}.computer-connected .scene-tools .toggle-control{font-size:.8rem}.computer-connected .view-choices button{font-size:.82rem;min-height:44px}.computer-connected .scene-bottom{flex-wrap:wrap}.computer-connected .view-choices{width:100%;flex-basis:100%}.cw-inspector{position:static;max-height:none;margin-top:12px;padding:16px}.cw-detail{grid-template-columns:1fr;margin-top:12px;gap:12px}.cw-detail>div,.cw-notebook{padding:17px}.computer-connected .computer-tabs{position:static;left:auto;right:auto;bottom:auto;background:#eaf0de;box-shadow:none;border-color:#c9dbc8;flex-wrap:wrap}.computer-connected .computer-tabs button{font-size:.82rem;color:#264f45;flex:1 1 100px;min-width:90px;min-height:44px}.cw-keyboard-open .computer-stage{height:130px}.cw-keyboard-open .scene-tools{display:none}.cw-keyboard-open .computer-titlebar{display:none}}
@media(max-width:370px){.computer-connected .computer-main{padding-inline:8px}.cw-workshop{padding:9px}.cw-nav button{font-size:.77rem}.cw-taskline select{flex-basis:100%}.cw-taskline button{flex-basis:100%}.cw-quick{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cw-quick label{font-size:.8rem}.cw-quick input,.cw-quick select{width:100%;max-width:100%}.cw-results strong{font-size:.85rem}.computer-connected .scene-tools{display:grid;grid-template-columns:1fr}.computer-connected .transparency-control{min-width:0}.computer-connected .component-picker select{min-width:0}.cw-circuit-table{grid-template-columns:1fr}.cw-detail th,.cw-detail td{font-size:.78rem;padding:7px 3px}}
@media(prefers-reduced-motion:reduce){.computer-connected *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.cw-detail{align-items:start}.cw-advanced{border:1px solid #cbdcc9;border-radius:14px;background:#fffef7;margin-top:16px;overflow:hidden}.cw-advanced>summary{font-size:.95rem;font-weight:750;padding:17px;cursor:pointer;min-height:48px;line-height:1.5}.cw-advanced>.computer-workspace{margin-top:0;border:0;border-radius:0}

/* Keep actions, result and the model together on a phone without shrinking text. */
.cw-quick [data-cw-action=transform]:hover,.cw-quick [data-cw-action=robot]:hover,.cw-quick [data-cw-action=number]:hover,.cw-notebook .cw-buttons button:first-child:hover{background:#10574f;color:#fffef7}
@media(max-width:760px){
 .computer-connected .computer-titlebar .back-link,.computer-connected .computer-titlebar .eyebrow,.computer-connected .computer-titlebar .computer-subtitle{display:none}
 .computer-connected .computer-titlebar h1{font-size:1.5rem;margin:0}.computer-connected .computer-titlebar{margin:3px 0 10px}
 .computer-connected .scene-heading{display:flex;flex-wrap:nowrap;justify-content:space-between;gap:6px;padding:4px 8px}
 .computer-connected .scene-heading .scene-live{display:none}.computer-connected .scene-heading button{margin:0;padding:6px 10px;min-height:44px}
 .computer-connected .workbench-mobile-question{display:none}.cw-workshop #cwPrompt{display:none}.cw-workshop h2{font-size:1.1rem;margin:8px 0}
 .cw-taskline{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;margin:8px 0}.cw-taskline select{width:100%;min-width:0}.cw-taskline button{max-width:80px;font-size:.75rem;padding:6px}
 .cw-quick{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1fr);gap:5px;padding:8px}
 .cw-quick label:first-child{grid-area:1/1}.cw-quick select:nth-child(2),.cw-quick input:nth-child(2){grid-area:2/1;width:100%;max-width:none}
 .cw-quick label:nth-child(3){grid-area:1/2}.cw-quick select:nth-child(4),.cw-quick input:nth-child(4){grid-area:2/2;width:100%;max-width:none}
 .cw-quick button{padding:8px;font-size:.82rem;min-height:44px;min-width:0}.cw-quick button:nth-child(5){grid-area:3/1}.cw-quick button:nth-child(6){grid-area:3/2}
 .cw-quick select{font-size:.85rem;padding:9px 5px}.cw-results{gap:5px;margin-top:7px}.cw-results small{font-size:.72rem}.cw-results strong{font-size:.9rem}
 .computer-connected .computer-stage{height:180px}
}