.coverage-with-demo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:stretch}.coverage-with-demo .connection-panel{padding:27px 22px 20px}.coverage-with-demo .connection-body{display:block;padding-top:25px}.coverage-with-demo .focus-ability{margin-bottom:28px}.coverage-with-demo .focus-icon{margin-inline:auto}.coverage-with-demo .connections{display:none}.coverage-with-demo .body-row{margin-bottom:6px}.coverage-with-demo .connection-footer{align-items:flex-start;flex-direction:column;gap:6px}.coverage-with-demo .connection-heading .mono{font-size:8px;letter-spacing:.5px}#skill-demo{min-width:0;background:white;border:1px solid #e4deec;border-radius:28px;padding:25px;box-shadow:0 8px 24px #30223804}.demo-heading{display:flex;justify-content:space-between;align-items:center}.demo-kicker{font:10px Consolas,monospace;letter-spacing:2px;color:#83718e}.demo-title{display:flex;justify-content:space-between;align-items:center;margin:16px 0 22px}.demo-title h3{font-size:21px;font-weight:500;letter-spacing:-.5px}.demo-title>span{font:13px Consolas,monospace;color:#afa3b8}.demo-controls{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:16px}.demo-mode{display:flex;background:#f3f0f6;padding:4px;border-radius:22px}.demo-mode button{font-size:11px;padding:8px 12px;border-radius:20px;white-space:nowrap;color:#8e7e9c}.demo-mode button[aria-pressed=true]{background:#3c3148;color:white}.demo-controls select{font-size:10px;padding:8px 12px;max-width:125px}#demo-stage video{display:block;width:100%;aspect-ratio:4/3;object-fit:contain;background:#d7e3eb;border-radius:17px}.demo-caption{display:flex;justify-content:space-between;align-items:center;margin:17px 0}.demo-caption h4{margin:0 0 7px;font-size:17px;font-weight:500}.demo-caption span{font-size:10px;color:#9684a2}.demo-caption .demo-selected{font:10px Consolas,monospace;letter-spacing:1px}.demo-chapters{display:flex;gap:7px}.demo-chapters button{flex:1;padding:10px 8px;text-align:left;background:#f4f0f8;border-radius:10px;font-size:10px}.demo-chapters button:hover{background:#e8deef}.demo-chapters small{display:block;font:9px Consolas,monospace;color:#aa99b5;margin-top:5px}.demo-note,.demo-error{font-size:10px;color:#897794;line-height:1.7;margin:12px 0 18px}.demo-list{display:flex;flex-direction:column;gap:7px;max-height:225px;overflow:auto;scrollbar-width:thin;scrollbar-color:#c9bbd4 transparent}.demo-list button{display:flex;gap:12px;align-items:center;border:1px solid transparent;padding:7px;border-radius:13px;text-align:left;flex-shrink:0}.demo-list button[aria-pressed=true]{background:#f0eaf6;border-color:#e3d9ed}.demo-list button:hover{background:#f6f3f9}.demo-list img{width:64px;aspect-ratio:4/3;object-fit:cover;border-radius:7px}.demo-list button>span{font-size:12px}.demo-list small{display:block;font-size:9px;color:#9f8dab;margin-top:7px}.demo-list .demo-duration{margin-left:auto;font:10px Consolas,monospace;color:#9c8aa8;padding-right:7px}.demo-empty{min-height:340px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#f6f3f9;border-radius:17px;padding:22px}.demo-empty>span{font-size:35px;color:#beafcc}.demo-empty h4{font-size:18px;font-weight:500;margin:20px 0 10px}.demo-empty p{font-size:12px;color:#9d8daa}.demo-empty button{margin-top:25px;border:1px solid #d8cce1;border-radius:22px;padding:12px 17px;font-size:11px}@media(max-width:900px){.coverage-with-demo{grid-template-columns:1fr}.coverage-with-demo .connection-body{display:grid;grid-template-columns:1fr 1.5fr;gap:25px}.coverage-with-demo .focus-ability{margin-bottom:0}}@media(max-width:600px){.coverage-with-demo .connection-body{display:block}.coverage-with-demo .focus-ability{margin-bottom:25px}#skill-demo{padding:20px;border-radius:22px}.demo-title h3{font-size:19px}.demo-controls{gap:6px}.demo-mode button{padding:8px 9px;font-size:10px}.demo-controls select{max-width:105px;font-size:9px}.demo-list{max-height:220px}}

@media(min-width:901px){
 .coverage-with-demo .connection-panel{display:flex;flex-direction:column;padding:25px;min-width:0}
 .coverage-with-demo .connection-heading,.demo-heading{min-height:18px}
 .coverage-with-demo .connection-body{display:flex;flex-direction:column;justify-content:space-between;gap:0;flex:1 0 auto;min-height:auto;padding:25px 0 0}
 .coverage-with-demo .focus-ability{width:100%;margin:0 0 28px}
 .coverage-with-demo #body-bars{width:100%;flex-shrink:0}
 #skill-demo{display:flex;flex-direction:column}
 .coverage-with-demo .connection-footer,.demo-explore-link{box-sizing:border-box;min-height:58px;margin-top:18px;padding-top:16px}
 .demo-explore-link{margin-top:auto}
 .demo-list{margin-bottom:18px}
}
