/* Scoped to the video library; existing learning pages remain independent. */
#video-library{--vn-ink:#07133b;--vn-blue:#0755f8;--vn-line:#d4d6db;background:#faf9f5;color:var(--vn-ink);max-width:1240px;margin:12px auto 0;padding:0 32px 36px;border-radius:22px;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;scroll-margin-top:20px;overflow:hidden}#video-library *{box-sizing:border-box}#video-library button,#video-library a{-webkit-tap-highlight-color:transparent}#video-library button{font:inherit;cursor:pointer}#video-library a{color:inherit}#video-library .vn-hero{display:grid;grid-template-columns:1.08fr 1fr;align-items:center;min-height:340px;position:relative;border-bottom:1px solid var(--vn-line)}#video-library .vn-copy{z-index:1;padding:30px 0}#video-library .vn-kicker{font-size:11px;font-weight:800;letter-spacing:.16em;color:#495477;margin:0 0 15px}#video-library h2{font-size:clamp(30px,3.5vw,49px);font-weight:900;line-height:1.45;letter-spacing:-.045em;border:0;padding:0;color:var(--vn-ink);margin:0}#video-library h2 em{font-style:normal;text-decoration:underline;text-decoration-color:#dfff57;text-decoration-thickness:7px;text-underline-offset:8px}#video-library .vn-lead{font-size:14px;line-height:1.9;margin:25px 0 0;font-weight:600}#video-library .vn-art{width:100%;height:340px;object-fit:cover;mix-blend-mode:multiply}#video-library .vn-grade-row{display:flex;gap:28px;align-items:center;padding:22px 0;border-bottom:1px solid var(--vn-line)}#video-library .vn-step{font-size:14px;font-weight:800;white-space:nowrap;margin:0}#video-library .vn-step span{font-size:12px;margin-right:12px;color:#586587}#video-library .vn-grades{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:1}#video-library .vn-grade{border:1px solid #15234a;background:transparent;color:var(--vn-ink);border-radius:8px;min-height:45px;font-weight:750}#video-library .vn-grade[aria-pressed=true]{background:var(--vn-blue);border-color:var(--vn-blue);color:white}#video-library .vn-content{display:grid;grid-template-columns:230px minmax(0,1fr);gap:26px;padding-top:25px}#video-library .vn-units{margin-top:18px;display:grid;gap:5px}#video-library .vn-unit{display:grid;grid-template-columns:24px 1fr 12px;gap:10px;align-items:center;text-align:left;border:0;border-bottom:1px solid var(--vn-line);padding:14px 9px;background:transparent;color:var(--vn-ink);line-height:1.6;min-height:78px}#video-library .vn-unit[aria-pressed=true]{background:#e4ff69;border-radius:8px;border-bottom-color:transparent}#video-library .vn-unit small{font-size:11px;display:block;font-weight:500}#video-library .vn-unit b{font-size:13px}#video-library .vn-unit-number{font-size:12px}#video-library .vn-panel{border-left:1px solid var(--vn-line);padding-left:26px;min-width:0}#video-library .vn-breadcrumb{font-size:11px;letter-spacing:.1em;margin:0 0 8px;color:#53617b}#video-library h3{font-size:clamp(20px,2.2vw,27px);line-height:1.5;margin:0 0 10px;font-weight:850}#video-library .vn-unit-note{font-size:12px;line-height:1.7;color:#566179;margin:0 0 18px;min-height:20px}#video-library .vn-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}#video-library .vn-card{display:flex;flex-direction:column;text-decoration:none;min-width:0;transition:transform .18s}#video-library .vn-card:hover{transform:translateY(-4px)}#video-library .vn-thumb{aspect-ratio:1.34;position:relative;border-radius:9px;background-image:url('study-modes.jpg');background-size:200% 200%;background-position:0 0;overflow:hidden}#video-library .vn-mode-1 .vn-thumb{background-position:100% 0}#video-library .vn-mode-2 .vn-thumb{background-position:0 100%}#video-library .vn-mode-3 .vn-thumb{background-position:100% 100%}#video-library .vn-play{position:absolute;left:9px;bottom:9px;background:white;color:var(--vn-blue);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;border:1px solid #bdc9ed}#video-library h4{font-size:clamp(14px,1.5vw,19px);margin:13px 0 5px;line-height:1.5;letter-spacing:-.04em}#video-library .vn-description{font-size:11px;line-height:1.7;margin:0 0 16px;min-height:38px;color:#364360}#video-library .vn-cta{display:block;background:var(--vn-blue);color:white;text-align:center;border-radius:30px;padding:11px 5px;font-size:12px;font-weight:700;margin-top:auto}#video-library .vn-unavailable{opacity:.65}#video-library .vn-unavailable .vn-thumb{filter:grayscale(.75)}#video-library .vn-unavailable .vn-cta{background:#e6e7eb;color:#404b60}#video-library .vn-footnote{font-size:11px;color:#617087;line-height:1.8;margin:25px 0 0;text-align:right}#video-library :is(a,button):focus-visible{outline:3px solid #ed9745;outline-offset:4px}#video-library .vn-fallback{padding:18px;background:#fff;border:1px solid var(--vn-line)}
@media(max-width:1000px){#video-library{margin:12px 16px 0;padding:0 24px 28px}#video-library .vn-content{grid-template-columns:190px minmax(0,1fr);gap:18px}#video-library .vn-panel{padding-left:18px}#video-library .vn-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 14px}#video-library h4{font-size:19px}#video-library .vn-thumb{aspect-ratio:1.7}#video-library .vn-description{min-height:0}#video-library .vn-art{height:310px}}
@media(max-width:600px){#video-library{padding:0 18px 24px;border-radius:16px;margin:0 12px}#video-library .vn-hero{grid-template-columns:1fr}#video-library .vn-copy{padding:28px 0 0}#video-library h2{font-size:32px}#video-library .vn-lead{font-size:12px;margin-top:18px}#video-library .vn-art{height:210px;object-fit:contain}#video-library .vn-grade-row{display:block;padding:18px 0}#video-library .vn-grades{gap:8px;margin-top:13px}#video-library .vn-grade{font-size:13px}#video-library .vn-content{display:block;padding-top:20px}#video-library .vn-units{grid-template-columns:1fr 1fr;margin-top:12px;gap:8px}#video-library .vn-unit{grid-template-columns:1fr;padding:10px;min-height:82px;border:1px solid var(--vn-line);border-radius:8px}#video-library .vn-unit-number,#video-library .vn-chevron{display:none}#video-library .vn-unit b{font-size:12px}#video-library .vn-panel{border-left:0;padding:24px 0 0;margin-top:20px;border-top:1px solid var(--vn-line)}#video-library h3{font-size:20px}#video-library h4{font-size:17px}#video-library .vn-cards{gap:20px 10px}#video-library .vn-description{font-size:11px;min-height:38px}#video-library .vn-footnote{text-align:left}#video-library .vn-thumb{aspect-ratio:1.34}}
@media(prefers-reduced-motion:reduce){#video-library .vn-card{transition:none}}

/* Friendly, pop edition: soft colors, rounded labels, tactile controls. */
#video-library{--vn-ink:#203453;--vn-blue:#3061dc;--vn-line:#dedfd7;background:#fffbee;border:2px solid #e9dfc6;border-radius:30px;box-shadow:0 8px 0 #e8e3d5;font-family:"Hiragino Maru Gothic ProN","Yu Gothic",sans-serif}
#video-library .vn-hero{gap:18px;border-bottom:2px dashed #d7cfb7;padding-bottom:20px}
#video-library .vn-kicker{display:inline-block;background:#ffda76;color:#523b20;letter-spacing:.06em;border:2px solid #eac058;border-radius:14px 14px 14px 3px;padding:9px 16px;transform:rotate(-3deg);margin-bottom:23px;box-shadow:3px 3px 0 #f2e5c5;font-size:13px}
#video-library h2{font-size:clamp(30px,3.6vw,48px);line-height:1.55;letter-spacing:-.035em;color:#244b83;text-shadow:2px 3px 0 #fff}
#video-library h2 em{text-decoration-color:#ffd46b;text-decoration-thickness:10px;text-underline-offset:4px}
#video-library .vn-lead{color:#4d5b70;line-height:1.9;font-size:15px}
#video-library .vn-art{height:310px;border-radius:48% 45% 30% 35%;mix-blend-mode:multiply}
#video-library .vn-grade-row{border-bottom:0;padding:22px 0 12px;gap:24px}
#video-library .vn-step{font-size:15px;color:#344764}
#video-library .vn-step span{display:inline-grid;place-items:center;width:29px;height:29px;background:#ffdf83;color:#55421d;border-radius:50%;font-size:12px;margin-right:9px}
#video-library .vn-grade{min-height:51px;background:white;border:2px solid #c6d5ea;border-radius:16px;box-shadow:0 4px 0 #dce5f1;color:#375176;transition:transform .15s,box-shadow .15s}
#video-library .vn-grade[data-grade="1"]{--grade:#2e775a;--grade-light:#def3df;--grade-shadow:#b8d9bf}
#video-library .vn-grade[data-grade="2"]{--grade:#245da4;--grade-light:#e0edff;--grade-shadow:#c0d3ec}
#video-library .vn-grade[data-grade="3"]{--grade:#854ba6;--grade-light:#f0e4fb;--grade-shadow:#d9c4e9}
#video-library .vn-grade[aria-pressed=true]{background:var(--grade-light);color:var(--grade);border-color:var(--grade);box-shadow:0 4px 0 var(--grade-shadow);font-weight:900}
#video-library .vn-grade:hover{transform:translateY(-2px)}
#video-library .vn-content{padding-top:24px}
#video-library .vn-unit{background:#fffdf7;border:1px solid #e1decd;border-radius:13px;padding:13px 10px;margin-bottom:6px;box-shadow:0 3px 0 #e9e4d4}
#video-library .vn-unit[aria-pressed=true]{background:#e8f4c8;border:2px solid #90ae5b;border-radius:13px;box-shadow:0 3px 0 #cfdda8}
#video-library .vn-unit small{font-weight:700;color:#627456;margin-bottom:3px}
#video-library .vn-panel{border-left:0;padding:20px;background:#fff;border:1px solid #e4e7ed;border-radius:22px;box-shadow:0 5px 0 #eee7d5}
#video-library .vn-breadcrumb{display:inline-block;background:#e9f3e6;border-radius:20px;padding:6px 12px;color:#3d6a47;letter-spacing:0;font-weight:700}
#video-library h3{margin-top:6px;font-size:clamp(19px,2.1vw,26px);color:#284973}
#video-library .vn-unit-note{font-size:12px;line-height:1.9}
#video-library .vn-cards{gap:12px;margin-top:18px}
#video-library .vn-card{--mode:#a84030;--mode-bg:#fff1e9;--mode-line:#f0bc9c;--mode-shadow:#f4d7c5;background:var(--mode-bg);border:2px solid var(--mode-line);border-radius:17px;padding:8px 8px 12px;box-shadow:0 5px 0 var(--mode-shadow);transition:transform .18s,box-shadow .18s}
#video-library .vn-mode-1{--mode:#285baf;--mode-bg:#ecf3ff;--mode-line:#b5cdf4;--mode-shadow:#d6e4f9}
#video-library .vn-mode-2{--mode:#286a58;--mode-bg:#eaf7f0;--mode-line:#acd9c5;--mode-shadow:#d0eadd}
#video-library .vn-mode-3{--mode:#785b19;--mode-bg:#fff8df;--mode-line:#e8d184;--mode-shadow:#f1e6b9}
#video-library .vn-card:hover{transform:translateY(-4px);box-shadow:0 9px 0 var(--mode-shadow)}
#video-library .vn-thumb{border-radius:10px;aspect-ratio:1.35}
#video-library .vn-play{color:var(--mode);border:0;box-shadow:0 2px 0 #0002}
#video-library h4{font-size:clamp(14px,1.35vw,18px);color:var(--mode);margin:12px 2px 5px;letter-spacing:-.04em}
#video-library .vn-description{margin-left:2px;margin-right:2px;color:#4d5d71}
#video-library .vn-cta{background:white;color:var(--mode);border:1px solid var(--mode-line);border-radius:12px;font-size:12px;padding:10px 3px;box-shadow:0 2px 0 var(--mode-shadow)}
#video-library .vn-unavailable{opacity:1;background:#f3f4f4;border-color:#d5d9da;box-shadow:none;--mode:#657079}
#video-library .vn-unavailable .vn-thumb{filter:grayscale(1);opacity:.55}
#video-library .vn-unavailable .vn-cta{background:#e6eaed;color:#596572;border:0;box-shadow:none}
#video-library .vn-footnote{text-align:left;padding-top:7px}
@media(max-width:1000px){#video-library .vn-panel{padding:18px}#video-library h4{font-size:18px}}
@media(max-width:600px){#video-library{border-radius:24px;padding:0 14px 24px}#video-library .vn-hero{gap:0;padding-bottom:0}#video-library .vn-copy{padding-top:24px}#video-library .vn-kicker{font-size:11px;padding:8px 11px;margin-bottom:17px}#video-library h2{font-size:30px}#video-library .vn-lead{font-size:13px}#video-library .vn-art{height:215px;border-radius:35%}#video-library .vn-grade{font-size:13px;min-height:49px}#video-library .vn-grade-row{padding-bottom:4px}#video-library .vn-panel{padding:16px 10px;margin-top:24px;border:1px solid #e4e7ed}#video-library .vn-unit{padding:10px;margin-bottom:0}#video-library h3{font-size:20px}#video-library .vn-cards{gap:18px 8px}#video-library .vn-card{padding:6px 6px 10px;border-radius:14px}#video-library h4{font-size:15px}#video-library .vn-description{font-size:11px;min-height:40px}#video-library .vn-cta{font-size:11px}#video-library .vn-step{font-size:14px}}
@media(prefers-reduced-motion:reduce){#video-library .vn-grade,#video-library .vn-card{transition:none}}

/* Illustrated unit chooser and video-learning hero. */
#video-library .vn-art{object-fit:contain;border-radius:24px;mix-blend-mode:normal;height:auto;max-height:360px}
#video-library .vn-unit{grid-template-columns:64px minmax(0,1fr) 10px;gap:9px;padding:9px;min-height:90px}
#video-library .vn-unit-picture{display:block;width:64px;height:64px;border-radius:12px;background-image:url('unit-atlas.jpg');background-size:400% 400%;background-repeat:no-repeat;box-shadow:0 2px 0 #20345312}
#video-library .vn-unit b{display:block;overflow-wrap:anywhere}
@media(min-width:1001px){#video-library .vn-content{grid-template-columns:260px minmax(0,1fr);gap:22px}}
@media(min-width:601px) and (max-width:1000px){#video-library .vn-unit{grid-template-columns:48px minmax(0,1fr);gap:7px}#video-library .vn-unit-picture{width:48px;height:48px}#video-library .vn-chevron{display:none}}
@media(max-width:600px){#video-library .vn-unit{grid-template-columns:1fr;gap:8px;align-content:start;padding:10px}#video-library .vn-unit-picture{width:100%;height:auto;aspect-ratio:1.4;background-size:400% 400%;border-radius:10px}#video-library .vn-unit b{font-size:12px}#video-library .vn-art{width:100%;max-height:260px;margin:12px 0}#video-library .vn-lead{font-size:12px}}

/* Strong editorial hierarchy for the video entrance. */
#video-library .vn-copy{padding:35px 0 30px}
#video-library .vn-format-badges{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px;font-size:14px;font-weight:900;letter-spacing:.04em}
#video-library .vn-format-badges span{display:inline-block;background:#ffcf59;color:#4d3616;border:2px solid #203453;padding:9px 14px;border-radius:10px;box-shadow:3px 4px 0 #203453;transform:rotate(-3deg)}
#video-library .vn-format-badges span+span{background:#d9eeff;color:#214b79;transform:rotate(2deg)}
#video-library h2.vn-impact-title{line-height:1.2;letter-spacing:-.035em;text-shadow:none}
#video-library .vn-title-intro{display:block;font-size:clamp(16px,1.7vw,22px);font-weight:800;letter-spacing:.02em;margin-bottom:17px;color:#43526b}
#video-library .vn-title-main{display:block;font-size:clamp(36px,4.4vw,59px);white-space:nowrap;font-weight:900}
#video-library .vn-video-word{display:inline-block;position:relative;background:#3061dc;color:white;padding:4px 12px 8px;margin:0 7px;border:2px solid #203453;border-radius:13px;box-shadow:4px 5px 0 #a6c7ff;transform:rotate(-3deg)}
#video-library .vn-word-play{position:absolute;right:-12px;top:-15px;display:grid;place-items:center;background:#ffca55;border:2px solid #203453;border-radius:50%;width:30px;height:30px;font-size:14px;color:#203453;transform:rotate(3deg)}
#video-library .vn-title-end{display:inline-block;position:relative;font-size:clamp(45px,5.4vw,70px);font-weight:900;margin-top:9px;background:linear-gradient(transparent 71%,#ffda6a 71%,#ffda6a 93%,transparent 93%);padding:0 8px 5px 0}
#video-library .vn-lead{margin-top:20px}
@media(max-width:1000px) and (min-width:601px){#video-library .vn-format-badges{font-size:11px;gap:8px}#video-library .vn-format-badges span{padding:8px}#video-library .vn-title-main{font-size:36px}}
@media(max-width:600px){#video-library .vn-copy{padding:29px 0 0}#video-library .vn-format-badges{font-size:12px;gap:10px;margin-bottom:25px}#video-library .vn-format-badges span{padding:8px 10px}#video-library .vn-title-intro{font-size:17px;margin-bottom:15px}#video-library .vn-title-main{font-size:38px}#video-library .vn-title-end{font-size:52px}#video-library .vn-video-word{padding:4px 9px 7px;margin:0 6px}#video-library .vn-lead{margin-top:15px}}
@media(max-width:360px){#video-library .vn-title-main{font-size:32px}#video-library .vn-format-badges{font-size:10px}}

/* Grade 2 electricity course entrance. */
#video-library .first-menu{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:12px 0 9px;color:#334a72;font-weight:800;font-size:13px}
.first-menu a{color:#264f9b;text-underline-offset:3px}
#video-library .first-film{display:block;border-radius:16px;background:#203453;color:white;text-decoration:none;overflow:hidden;box-shadow:0 4px 0 #b8cceb}
#video-library .first-photo{aspect-ratio:16/9;display:block;width:100%;object-fit:cover}
#video-library .first-details{display:block;padding:12px 14px 14px}#video-library .first-details b{display:block;font-size:16px;line-height:1.55;color:white}#video-library .first-details em{display:inline-block;background:#ffce56;color:#233452;border-radius:7px;font:800 13px/1.5 system-ui;padding:7px 12px;margin-top:9px}
#video-library .course-link{display:block;text-align:right;color:#254d99;margin:12px 0 18px;font-size:13px;font-weight:bold}
#video-library .review-entry{display:flex;align-items:center;justify-content:space-between;gap:8px;text-decoration:none;color:#203453;border:1px solid #cddbea;border-radius:11px;margin:7px 0;padding:10px;background:white}
#video-library .review-entry b{font-size:14px;display:block}#video-library .review-entry small{font-size:11px;color:#51617a}#video-library .review-entry i{font-style:normal;background:#e8f1ff;color:#234d99;padding:6px 9px;border-radius:8px}.review-entry:focus-visible,.first-film:focus-visible{outline:3px solid #264f9b}

#video-library .review-thumb { width: 40%; max-width: 144px; height: auto; border-radius: 6px; }