/* RC180: accessible, responsive personal review and local STEM activities. */
.sk180-plan,.sk180-lab,.sk180-result{--sk180-paper:#f3f8fe;--sk180-ink:#19354e;--sk180-muted:#4b6680;--sk180-edge:#b7d2e6;--sk180-link:#095d98;box-sizing:border-box;max-width:100%;overflow-wrap:anywhere;color:var(--sk180-ink)}
.sk180-plan{margin:18px 0 25px;padding:clamp(14px,2.8vw,24px);border:1px solid var(--sk180-edge);border-radius:18px;background:var(--sk180-paper)}
.sk180-plan-heading span,.sk180-lab header span{font-size:.73rem;letter-spacing:.08em;font-weight:800;color:var(--sk180-muted)}
.sk180-plan-heading h2{font-size:clamp(1.18rem,3vw,1.6rem);margin:6px 0 8px;line-height:1.3;color:var(--sk180-ink)}
.sk180-plan-heading p,.sk180-empty{line-height:1.6;color:var(--sk180-muted);margin:0 0 14px}
.sk180-plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,248px),1fr));gap:12px}
.sk180-plan-item{padding:15px;min-width:0;border:1px solid var(--sk180-edge);border-radius:13px;background:var(--sk180-paper);box-shadow:0 4px 14px #183c5c0a}
.sk180-plan-pill{display:inline-block;font-size:.72rem;line-height:1.4;font-weight:800;padding:5px 9px;border-radius:99px;background:#e4eef7;border:1px solid var(--sk180-edge);color:#235371;margin-bottom:11px}
.sk180-plan-pill.is-due{background:#fff1d9;border-color:#b77b26;color:#79510a}
.sk180-plan-item small{display:block;color:var(--sk180-muted);font-weight:700}
.sk180-plan-item h3{color:var(--sk180-ink);font-size:1rem;line-height:1.4;margin:7px 0}
.sk180-plan-item p{color:var(--sk180-muted);font-size:.84rem;margin:7px 0 12px;line-height:1.5}
.sk180-plan-item nav{display:flex;gap:8px;flex-wrap:wrap}
.sk180-plan-item nav a,.sk180-result a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 12px;border-radius:9px;border:1px solid var(--sk180-edge);font-size:.83rem;font-weight:800;text-align:center;color:var(--sk180-link)!important;text-decoration:none!important;background:var(--sk180-paper)}
.sk180-plan-item nav a:hover,.sk180-plan-item nav a:focus-visible,.sk180-result a:hover,.sk180-result a:focus-visible{outline:2px solid var(--sk180-link);outline-offset:2px}
.sk180-clear{margin:17px 0 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.sk180-clear button{min-height:44px;padding:9px 12px;border:1px solid var(--sk180-edge);border-radius:9px;background:transparent;color:var(--sk180-ink);cursor:pointer;font-weight:750}
.sk180-clear span{font-size:.79rem;color:var(--sk180-muted)}
.sk180-result{border:1px solid var(--sk180-edge);border-radius:12px;background:var(--sk180-paper);padding:13px;margin:14px 0}
.sk180-result strong{color:var(--sk180-ink)}.sk180-result p{color:var(--sk180-muted);margin:8px 0}
.sk180-lab{margin:22px 0;border-radius:17px;border:1px solid var(--sk180-edge);background:var(--sk180-paper);padding:clamp(13px,3vw,22px)}
.sk180-lab header h3{font-size:1.13rem;color:var(--sk180-ink);line-height:1.35;margin:6px 0}
.sk180-lab header p{line-height:1.6;color:var(--sk180-muted);margin:6px 0 18px}
.sk180-lab-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(210px,1fr);gap:16px;align-items:start}
.sk180-stage{width:100%;min-width:0;overflow:hidden;background:#10233d;border-radius:12px}
.sk180-stage svg{width:100%;height:auto;display:block;aspect-ratio:540 / 260}
.sk180-controls label{display:block;font-weight:800;color:var(--sk180-ink);margin:0 0 14px}
.sk180-controls input[type=range]{display:block;width:100%;min-height:44px;accent-color:#176ca9}
.sk180-controls output{display:block;border:1px solid var(--sk180-edge);padding:10px;border-radius:10px;line-height:1.5;font-weight:650;color:var(--sk180-ink)}
.sk180-caution{color:var(--sk180-muted);font-size:.79rem;line-height:1.55;margin-top:10px}
.sk180-task{border-top:1px solid var(--sk180-edge);margin-top:17px;padding-top:14px}
.sk180-task strong{font-size:.75rem;letter-spacing:.04em;color:var(--sk180-muted)}
.sk180-task p{color:var(--sk180-ink);font-weight:700;line-height:1.5;margin:5px 0 12px}
.sk180-task-actions{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.sk180-task button{min-height:44px;padding:10px 15px;background:#196ab2;color:#fff;border:1px solid #185b96;border-radius:9px;font-weight:800;cursor:pointer}
.sk180-task button:hover,.sk180-task button:focus-visible{outline:2px solid #6bb9e8;outline-offset:2px;background:#0e518e}
.sk180-task output{display:block;flex:1 1 210px;padding:10px;min-height:44px;border:1px solid var(--sk180-edge);border-radius:9px;color:var(--sk180-ink);line-height:1.5}
.sk180-task output[data-result=correct]{border-color:#20815a}.sk180-task output[data-result=review]{border-color:#be803a}
html.lessonsky-dark .sk180-plan,body.lessonsky-dark .sk180-plan,html[data-lessonsky-effective-mode=dark] .sk180-plan,
html.lessonsky-dark .sk180-lab,body.lessonsky-dark .sk180-lab,html[data-lessonsky-effective-mode=dark] .sk180-lab,
html.lessonsky-dark .sk180-result,body.lessonsky-dark .sk180-result,html[data-lessonsky-effective-mode=dark] .sk180-result{--sk180-paper:#1c3450;--sk180-ink:#eef5ff;--sk180-muted:#c5d8e9;--sk180-edge:#53728f;--sk180-link:#a9defc}
html.lessonsky-dim .sk180-plan,body.lessonsky-dim .sk180-plan,html[data-lessonsky-effective-mode=dim] .sk180-plan,
html.lessonsky-dim .sk180-lab,body.lessonsky-dim .sk180-lab,html[data-lessonsky-effective-mode=dim] .sk180-lab,
html.lessonsky-dim .sk180-result,body.lessonsky-dim .sk180-result,html[data-lessonsky-effective-mode=dim] .sk180-result{--sk180-paper:#273d53;--sk180-ink:#f1f7ff;--sk180-muted:#cbdbe9;--sk180-edge:#6d879d;--sk180-link:#b5e7ff}
html.lessonsky-dark .sk180-plan-pill:not(.is-due),html[data-lessonsky-effective-mode=dark] .sk180-plan-pill:not(.is-due){background:#2a506e;color:#eef5ff}
html.lessonsky-dim .sk180-plan-pill:not(.is-due),html[data-lessonsky-effective-mode=dim] .sk180-plan-pill:not(.is-due){background:#38596e;color:#eef5ff}
@media(max-width:760px){.sk180-lab-grid{grid-template-columns:1fr}.sk180-plan-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,215px),1fr))}}
@media(max-width:450px){.sk180-plan-item nav{flex-direction:column}.sk180-plan-item nav a{width:100%;box-sizing:border-box}.sk180-task-actions{flex-direction:column}.sk180-task output{flex:auto;width:100%;box-sizing:border-box}}
@media(prefers-reduced-motion:reduce){.sk180-plan *,.sk180-lab *{animation:none!important;transition:none!important}}
