.video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:36px 0}.video-card{min-width:0;border:1px solid var(--line);border-radius:20px;padding:24px;background:var(--surface,#fff);scroll-margin-top:110px}.video-card h3{font-size:22px;line-height:1.6;margin:8px 0 20px}.video-poster{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:linear-gradient(130deg,#c8e8df,#e7eff7);display:grid;place-items:center}.video-poster img{position:absolute;width:100%;height:100%;object-fit:cover}.video-play{position:relative;border:1px solid #ffffff88;border-radius:30px;background:#152c49ed;color:white;padding:13px 20px;font-size:16px;cursor:pointer;box-shadow:0 5px 24px #152c4933}.video-play:hover{background:#087e80}.video-select-label{display:block;font-size:13px;margin:20px 0 6px}.video-version,.video-filters select{width:100%;min-height:44px;background:var(--surface,#fff);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:10px;font:inherit}.video-roles{font-size:14px;line-height:1.85}.video-roles b{display:block;color:var(--ink);margin-top:16px}.video-roles p{color:var(--muted)}.video-watch{display:inline-block;margin:16px 0;min-height:44px}.video-all-links{font-size:13px}.video-all-links summary{cursor:pointer;min-height:44px}.video-all-links li{margin:12px 0}.video-filters{display:flex;align-items:end;gap:24px;margin:28px 0;padding:24px;border-radius:16px;background:#eaf3ef;color:#152c49}.video-filters label{flex:1}.video-filters p{font-size:14px}.video-category-links{display:flex;flex-wrap:wrap;gap:12px}.video-category-links b{width:100%}.video-category-links a{padding:10px 18px;border:1px solid var(--line);border-radius:24px}.video-section .video-grid:has(>article:only-child){grid-template-columns:minmax(0,620px)}.video-dialog{border:1px solid #b4cdc7;border-radius:20px;padding:24px;width:min(960px,94vw);max-height:94dvh;background:var(--paper,#fafbf9);color:var(--ink);overflow:auto}.video-dialog::backdrop{background:#092336c9}.video-close{display:block;margin-left:auto;min-height:44px;padding:8px 18px;border:1px solid var(--line);border-radius:30px;background:var(--surface,#fff);color:var(--ink);cursor:pointer}.video-dialog h2{font-size:20px;margin:10px 0 18px}.video-player{aspect-ratio:16/9;min-height:200px;background:#152c49}.video-player iframe{width:100%;height:100%;border:0}.video-dialog p{font-size:13px;line-height:1.7}.video-external{display:block;min-height:44px;font-size:14px}.video-modal-open{overflow:hidden}.hero-video-link{margin:12px 0;font-size:14px}.video-section{border-top:1px solid var(--line)}.video-card[hidden],.video-play[hidden],.video-filters[hidden]{display:none!important}#demo .workspace{position:relative;z-index:1}#demo .workspace::before,#demo .workspace::after{pointer-events:none}#demo .approval-buttons button{min-height:44px;cursor:pointer}#demo .approval[data-state=complete]{background:#e7f5ee;border-color:#48876c}#demo .approval[data-state=complete] #approval-result{font-size:17px;font-weight:700;color:#245f49}#demo #demo-status{white-space:normal}#demo .workspace-sidebar .room:not(.active){opacity:.55}.video-play:focus-visible,.video-close:focus-visible,.video-version:focus-visible{outline:3px solid #008e91;outline-offset:4px}
@media(max-width:1100px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-site .header nav{gap:10px}.service-site .header nav a{font-size:11px}}
@media(max-width:767px){.video-grid{grid-template-columns:1fr;gap:22px}.video-card{padding:20px}.video-card h3{font-size:23px}.video-filters{flex-direction:column;align-items:stretch;gap:12px}.video-filters p{margin:0}.video-dialog{padding:14px;width:96vw}.video-dialog h2{font-size:16px}.video-roles{font-size:15px}.hero-video-link{font-size:13px}}
[data-theme=dark] .video-card,[data-theme=dark] .video-version,[data-theme=dark] .video-dialog{background:#183042;color:#edf6f3}[data-theme=dark] .video-roles b{color:#edf6f3}

.video-dialog{box-sizing:border-box;max-height:calc(100dvh - 32px);margin:auto}.video-close{position:sticky;top:0;z-index:2;background:#fff;color:#152c49}.video-connection-note{font-size:12px;color:var(--muted);margin:8px 0}.video-card .video-select-label{margin-top:12px}
