:is(.dl-lab,.pr-lab) { margin:28px 0; border:1px solid #dce6f3; border-radius:16px; background:#fff; color:#42597a; overflow:hidden; scroll-margin-top:160px; }
.dl-header { padding:22px 24px; background:#f7faff; border-bottom:1px solid #e4ebf5; }
.dl-kicker { margin:0 0 7px!important; color:#1b6ef3; font-size:12px!important; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.dl-header h3 { margin:0 0 8px; font-size:22px; color:#123e7c; line-height:1.35; }
.dl-header p { margin:0; font-size:15px; line-height:1.6; }
.dl-body { padding:24px; }.dl-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; padding:5px; background:#f0f4fa; border-radius:10px; margin-bottom:20px; }
:is(.dl-lab,.pr-lab) button,:is(.dl-lab,.pr-lab) input,:is(.dl-lab,.pr-lab) select { font:inherit; }.dl-tabs button { padding:11px 8px; border:0; border-radius:7px; color:#526b8b; background:transparent; font-size:14px; font-weight:750; cursor:pointer; }
.dl-tabs button[aria-selected="true"] { background:#fff; color:#1557c7; }.dl-settings { display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin:0 0 18px; }.dl-settings label { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:650; }.dl-settings select { max-width:100%; padding:7px 9px; border:1px solid #c7d7ec; border-radius:7px; color:#234b78; background:white; font-size:14px; }.dl-check input { width:17px; height:17px; accent-color:#1b6ef3; }
.dl-step { margin:0 0 18px; padding:12px 14px; border-left:3px solid #1b6ef3; background:#f2f7fe; border-radius:5px; font-size:15px; font-weight:750; line-height:1.6; }
.dl-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(250px,1fr); gap:22px; }.dl-grid>div { min-width:0; }.dl-apparatus { border:1px solid #e0e8f3; border-radius:10px; background:#f8fbff; }.dl-apparatus svg { display:block; width:100%; height:auto; }.dl-caption { margin:9px 0 15px; color:#71859e; font-size:12px; line-height:1.6; }:is(.dl-lab,.pr-lab) h4 { margin:0 0 13px; font-size:16px; color:#123e7c; }
.dl-table-hint { display:none; margin:0 0 8px; color:#71859e; font-size:12px; }
.dl-actions { display:flex; flex-wrap:wrap; gap:8px; }:is(.dl-lab,.pr-lab) button[data-action] { padding:10px 12px; border:1px solid #c7d7ec; border-radius:7px; background:#fff; color:#1557c7; font-size:13px; font-weight:750; cursor:pointer; }:is(.dl-lab,.pr-lab) button[data-action]:hover:not(:disabled) { background:#f0f6ff; border-color:#8fb1e4; }:is(.dl-lab,.pr-lab) button[data-action]:active:not(:disabled) { transform:translateY(1px); }:is(.dl-lab,.pr-lab) button:disabled { opacity:.46; cursor:default; }:is(.dl-lab,.pr-lab) button[data-action="calculate"],:is(.dl-lab,.pr-lab) button[data-action="zero"]:not(:disabled) { background:#1b6ef3; color:#fff; border-color:#1b6ef3; }:is(.dl-lab,.pr-lab) :is(button,input,select,summary):focus-visible { outline:3px solid #8db8ff; outline-offset:3px; }
.dl-readings { margin:0; }.dl-readings>div { display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:8px 0; border-bottom:1px solid #edf1f7; font-size:14px; line-height:1.5; }.dl-readings dd { margin:0; font-weight:750; color:#123e7c; white-space:nowrap; }.dl-formula { margin:16px 0; font:27px Georgia,serif; color:#123e7c; }.dl-answer { display:block; font-size:13px; line-height:1.6; margin-bottom:12px; }.dl-answer span { color:#7c8ea6; }.dl-answer input { display:block; width:100%; box-sizing:border-box; margin-top:5px; padding:9px 10px; border:1px solid #c7d7ec; border-radius:6px; color:#123e7c; background:#fff; }.dl-feedback { min-height:42px; margin:14px 0; font-size:14px; line-height:1.7; }.dl-result { border-left:3px solid #27814a; background:#f2faf5; padding:12px; margin:12px 0; color:#21643d; font-size:16px; line-height:1.7; }
.dl-bottom { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:24px 0; padding-top:20px; border-top:1px solid #e4ebf5; }.dl-bottom p { flex:1 1 220px; margin:0; color:#71859e; font-size:12px; line-height:1.6; }.dl-table-wrap { overflow-x:auto; }.dl-trials table { border-collapse:collapse; width:100%; min-width:420px; font-size:13px; line-height:1.6; }.dl-trials th,.dl-trials td { padding:10px 8px; text-align:left; border-bottom:1px solid #e4ebf5; vertical-align:top; }.dl-trials th { color:#234b78; }.dl-trials button { margin-top:12px; }.dl-teacher { margin-top:22px; padding-top:15px; border-top:1px solid #e4ebf5; font-size:14px; line-height:1.7; }.dl-teacher summary { cursor:pointer; color:#315e91; font-weight:750; }.dl-teacher li { margin:8px 0; }.pl-lab-link { display:inline-block; margin-top:6px; color:#1557c7; font-weight:750; text-underline-offset:3px; }
@container(max-width:760px) { .dl-grid { grid-template-columns:minmax(0,1fr); }:is(.dl-lab,.pr-lab) { margin-top:24px; } }
@media(max-width:640px) { .dl-header,.dl-body { padding:18px 15px; }.dl-header h3 { font-size:20px; }.dl-tabs button { font-size:12px; padding:10px 4px; }.dl-settings { gap:12px; }.dl-settings label { flex-wrap:wrap; }.dl-actions button { flex:1 1 130px; }:is(.dl-lab,.pr-lab) .dl-apparatus svg { min-height:160px; }.dl-grid { grid-template-columns:minmax(0,1fr); }.dl-readings>div { font-size:14px; }.dl-table-hint { display:block; } }
@media(prefers-reduced-motion:reduce) { :is(.dl-lab,.pr-lab) button { transition:none; } }