:root{--vlms-primary:#6a3fbf;--vlms-accent:#f4b400;--vlms-text:#1f2330;--vlms-muted:#6b7280;--vlms-bg:#f7f6fb;--vlms-radius:14px}
.vlms-wrap{max-width:1200px;margin:0 auto;padding:30px 20px;color:var(--vlms-text)}
.vlms-btn{display:inline-block;background:var(--vlms-primary);color:#fff!important;padding:12px 24px;border-radius:999px;border:0;font-weight:600;text-decoration:none;cursor:pointer;transition:.2s}
.vlms-btn:hover{filter:brightness(1.1)}
.vlms-btn-sm{padding:8px 16px;font-size:14px}
.vlms-btn-block{display:block;text-align:center;margin:12px 0}
.vlms-btn-outline{background:#fff;color:var(--vlms-primary)!important;border:2px solid var(--vlms-primary)}
.vlms-btn.is-done{background:#16a34a}
.vlms-notice{padding:14px 18px;border-radius:10px;margin:16px 0}
.vlms-success{background:#ecfdf5;color:#065f46}.vlms-error{background:#fef2f2;color:#991b1b}
.vlms-tag{background:#efe9ff;color:var(--vlms-primary);padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;font-style:normal}
.vlms-free{color:#16a34a;font-weight:700}

/* grid + cards */
.vlms-grid{display:grid;gap:24px}
.vlms-cols-2{grid-template-columns:repeat(2,1fr)}.vlms-cols-3{grid-template-columns:repeat(3,1fr)}.vlms-cols-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.vlms-cols-3,.vlms-cols-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.vlms-grid{grid-template-columns:1fr}}
.vlms-card{background:#fff;border-radius:var(--vlms-radius);overflow:hidden;box-shadow:0 6px 24px rgba(20,20,40,.08);transition:.25s}
.vlms-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(20,20,40,.14)}
.vlms-card-img{display:block;position:relative;aspect-ratio:16/10;background:var(--vlms-bg)}
.vlms-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.vlms-noimg{width:100%;height:100%;background:linear-gradient(135deg,#d9c8ff,#ffe6a7)}
.vlms-price{position:absolute;top:12px;left:12px;background:#fff;padding:6px 12px;border-radius:999px;font-weight:700;font-size:14px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.vlms-price del{color:var(--vlms-muted);font-weight:400;margin-right:4px}
.vlms-card-body{padding:18px}
.vlms-card-body h3{margin:8px 0 10px;font-size:18px;line-height:1.3}.vlms-card-body h3 a{color:inherit;text-decoration:none}
.vlms-meta{display:flex;flex-wrap:wrap;gap:16px;color:var(--vlms-muted);font-size:14px;align-items:center;margin:8px 0}
.vlms-meta img,.vlms-inst img{border-radius:50%;vertical-align:middle;margin-right:4px}
.vlms-card-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #eee;padding-top:12px;margin-top:12px;font-size:14px}

/* categories + stats */
.vlms-cats{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}
.vlms-cat{background:#fff;border:1px solid #e8e6f0;border-radius:12px;padding:12px 18px;text-decoration:none;color:inherit;display:flex;flex-direction:column;min-width:150px}
.vlms-cat span{color:var(--vlms-muted);font-size:13px}.vlms-cat:hover{border-color:var(--vlms-primary)}
.vlms-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;margin:30px 0}
.vlms-stats h2{font-size:42px;margin:0;color:var(--vlms-primary)}.vlms-stats p{margin:4px 0 0;color:var(--vlms-muted)}
@media(max-width:600px){.vlms-stats{grid-template-columns:repeat(2,1fr)}}

/* course / lesson layout */
.vlms-course,.vlms-lesson{display:grid;grid-template-columns:1fr 340px;gap:36px}
@media(max-width:900px){.vlms-course,.vlms-lesson{grid-template-columns:1fr}}
.vlms-hero{width:100%;border-radius:var(--vlms-radius);margin-bottom:20px}
.vlms-box{background:#fff;border-radius:var(--vlms-radius);padding:24px;box-shadow:0 6px 24px rgba(20,20,40,.08);position:sticky;top:20px}
.vlms-price-big{font-size:30px;font-weight:800;margin-bottom:10px}.vlms-price-big del{font-size:18px;color:var(--vlms-muted);font-weight:400;margin-right:8px}
.vlms-includes{list-style:none;padding:0;margin:16px 0 0;font-size:14px}.vlms-includes li{padding:6px 0;border-bottom:1px dashed #eee}
.vlms-progress{height:10px;background:#eee;border-radius:999px;overflow:hidden;margin:8px 0}
.vlms-progress div{height:100%;background:linear-gradient(90deg,var(--vlms-primary),var(--vlms-accent))}
/* curriculum: sections → lessons */
.vlms-curriculum{margin:0}
.vlms-section{background:#fff;border:1px solid #ece9f5;border-radius:12px;margin-bottom:12px;overflow:hidden}
.vlms-section summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:14px 18px;background:#f8f6fd;font-weight:700;align-items:center}
.vlms-section summary::-webkit-details-marker{display:none}
.vlms-section summary::before{content:"▾";float:left;margin-right:8px;color:var(--vlms-primary);transition:.2s}
.vlms-section:not([open]) summary::before{transform:rotate(-90deg)}
.vlms-section-meta{display:flex;gap:12px;font-weight:500;font-size:13px;color:var(--vlms-muted)}
.vlms-bar-sec{grid-column:1/-1}
.vlms-section ol{list-style:none;margin:0;padding:0}
.vlms-section li{border-top:1px solid #f1eef8}
.vlms-section li>a,.vlms-section li>span{display:flex;align-items:center;gap:12px;padding:12px 18px;text-decoration:none;color:inherit}
.vlms-section li>a:hover{background:#faf8ff}
.vlms-section li.is-locked>span{color:var(--vlms-muted)}
.vlms-l-icon{width:22px;text-align:center;flex-shrink:0}
.vlms-l-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.vlms-l-title{line-height:1.3}
.vlms-l-len{flex-shrink:0;color:var(--vlms-muted);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.vlms-l-len b{color:var(--vlms-primary)}
.vlms-section li.is-current>a{background:#f3edff;box-shadow:inset 4px 0 0 var(--vlms-primary)}
.vlms-section li.is-done .vlms-l-title{color:#15803d}
.vlms-bar{display:block;height:5px;background:#eee;border-radius:999px;overflow:hidden}
.vlms-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--vlms-primary),var(--vlms-accent));transition:width .4s}
.vlms-bar-lg{height:10px;flex:1}
.is-done .vlms-bar i{background:#22c55e}
.vlms-compact .vlms-section summary{padding:10px 14px;font-size:14px}
.vlms-compact .vlms-section li>a,.vlms-compact .vlms-section li>span{padding:9px 14px;font-size:14px}
.vlms-lesson-progress{display:flex;align-items:center;gap:12px;margin:14px 0;font-weight:600}
.vlms-resume-note{font-size:13px;margin:-4px 0 8px;text-align:center}
.vlms-muted{color:var(--vlms-muted);font-size:13px}

/* ratings */
.vlms-stars{display:inline-flex;gap:2px;line-height:1}
.vlms-stars i{font-style:normal;font-size:14px;position:relative;color:#ddd}
.vlms-stars i::before{content:"★"}
.vlms-stars i::after{content:"★";position:absolute;left:0;top:0;width:var(--fill);overflow:hidden;color:#f4b400;white-space:nowrap}
.vlms-stars-md i{font-size:18px}.vlms-stars-lg i{font-size:28px}
.vlms-rating-line{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--vlms-muted);margin:4px 0}
.vlms-rating-line a{color:inherit}
.vlms-reviews{margin-top:40px}
.vlms-rating-summary{display:flex;align-items:center;gap:18px;margin-bottom:20px}
.vlms-rating-big{font-size:52px;font-weight:800;line-height:1;color:var(--vlms-primary)}
.vlms-review-form{background:#fff;border:1px solid #ece9f5;border-radius:12px;padding:18px;margin-bottom:24px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.vlms-review-form textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:8px}
.vlms-star-input{display:inline-flex;flex-direction:row-reverse;gap:2px}
.vlms-star-input input{display:none}
.vlms-star-input label{font-size:32px;color:#ddd;cursor:pointer;transition:.15s}
.vlms-star-input label:hover,.vlms-star-input label:hover~label,.vlms-star-input input:checked~label{color:#f4b400}
.vlms-review{display:flex;gap:14px;padding:14px 0;border-bottom:1px solid #eee}
.vlms-review img{border-radius:50%;flex-shrink:0}
.vlms-review-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:4px}
.vlms-review p{margin:0}

.vlms-crumb a{color:var(--vlms-muted);text-decoration:none;font-size:14px}
.vlms-lesson-actions{display:flex;gap:12px;justify-content:space-between;flex-wrap:wrap;margin:20px 0}

/* player */
.vlms-player{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--vlms-radius);overflow:hidden;user-select:none;-webkit-user-select:none}
.vlms-player iframe,.vlms-player video{width:100%;height:100%;border:0;display:block}
.vlms-player-loading{color:#aaa;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.vlms-watermark{position:absolute;pointer-events:none;color:rgba(255,255,255,.35);font-size:13px;font-family:monospace;text-shadow:0 0 3px #000;transition:top 1.5s,left 1.5s;z-index:5}

/* quiz */
.vlms-q{border:1px solid #ece9f5;border-radius:10px;padding:16px 20px;margin:0 0 16px;background:#fff}
.vlms-q legend{font-weight:600;padding:0 6px}.vlms-q label{display:block;padding:8px 0;cursor:pointer}
.vlms-verify{display:flex;gap:10px;max-width:520px}.vlms-verify input{flex:1;padding:12px;border:1px solid #ddd;border-radius:999px}

/* collapsible sections + pins */
.vlms-curriculum-tools{display:flex;gap:14px;justify-content:flex-end;margin-bottom:8px}
.vlms-link{background:none;border:0;color:var(--vlms-primary);cursor:pointer;font-size:13px;font-weight:600;padding:2px 4px}
.vlms-link:hover{text-decoration:underline}
.vlms-section summary{grid-template-columns:1fr auto auto}
.vlms-section.is-pinned{border-color:var(--vlms-accent);box-shadow:0 0 0 2px rgba(244,180,0,.18)}
.vlms-section.is-pinned summary{background:#fffaeb}
.vlms-pin-flag{margin-right:6px}
.vlms-pin{background:none;border:0;cursor:pointer;font-size:15px;filter:grayscale(1);opacity:.35;transition:.15s;padding:2px 6px;border-radius:6px}
.vlms-pin:hover{opacity:.9;background:#fff}
.vlms-pin.is-on{filter:none;opacity:1}
.vlms-section summary:focus-visible{outline:2px solid var(--vlms-primary)}

/* course materials */
.vlms-materials{margin-top:36px}
.vlms-mat-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.vlms-mat a,.vlms-mat>span{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #ece9f5;border-radius:12px;padding:12px 14px;text-decoration:none;color:inherit;transition:.2s}
.vlms-mat a:hover{border-color:var(--vlms-primary);box-shadow:0 6px 18px rgba(20,20,40,.08)}
.vlms-mat.is-locked>span{color:var(--vlms-muted);background:#faf9fd}
.vlms-mat-icon{width:44px;height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:22px;background:#f4f1fb;border-radius:10px;overflow:hidden}
.vlms-mat-icon img{width:100%;height:100%;object-fit:cover}
.vlms-mat-info{flex:1;min-width:0;display:flex;flex-direction:column}
.vlms-mat-info strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vlms-mat-info small{color:var(--vlms-muted);font-size:12px}
.vlms-mat-dl{font-size:20px;color:var(--vlms-primary)}

/* listing shell: grid / list views */
.vlms-listing-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.vlms-listing-head h2{margin:0}
.vlms-view-toggle{display:inline-flex;border:1px solid #e3dff0;border-radius:999px;overflow:hidden;background:#fff}
.vlms-view-toggle button{background:none;border:0;padding:8px 16px;cursor:pointer;font-size:14px;font-weight:600;color:var(--vlms-muted)}
.vlms-view-toggle button.is-on{background:var(--vlms-primary);color:#fff}
.vlms-listing[data-view="grid"] .vlms-view-list,.vlms-listing[data-view="list"] .vlms-view-grid{display:none}
.vlms-empty{background:#fff;border:1px dashed #ddd;border-radius:12px;padding:30px;text-align:center;color:var(--vlms-muted)}
.vlms-rows{display:flex;flex-direction:column;gap:14px}
.vlms-row{display:grid;grid-template-columns:200px 1fr 180px;gap:20px;background:#fff;border-radius:var(--vlms-radius);padding:16px;box-shadow:0 4px 18px rgba(20,20,40,.06);align-items:center}
.vlms-row-img{display:block;border-radius:10px;overflow:hidden;aspect-ratio:16/10;background:var(--vlms-bg)}
.vlms-row-img img{width:100%;height:100%;object-fit:cover;display:block}
.vlms-row-body{min-width:0}
.vlms-row-body h3{margin:6px 0;font-size:19px}.vlms-row-body h3 a{color:inherit;text-decoration:none}
.vlms-row-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.vlms-row-excerpt{margin:0 0 8px;color:var(--vlms-muted);font-size:14px}
.vlms-row-progress{display:flex;align-items:center;gap:10px;margin-top:8px}
.vlms-row-progress .vlms-bar{flex:1;max-width:320px}
.vlms-row-cta{text-align:right}
.vlms-row-cta .vlms-price-big{font-size:22px;margin-bottom:8px}
@media(max-width:820px){.vlms-row{grid-template-columns:120px 1fr}.vlms-row-cta{grid-column:2;text-align:left}}
@media(max-width:520px){.vlms-row{grid-template-columns:1fr}.vlms-row-cta{grid-column:1}}

/* course tabs */
.vlms-tabs{margin-top:10px}
.vlms-tablist{display:flex;gap:6px;border-bottom:2px solid #ece9f5;margin-bottom:20px;flex-wrap:wrap}
.vlms-tablist button{background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;padding:12px 20px;font-size:16px;font-weight:700;color:var(--vlms-muted);cursor:pointer;display:flex;align-items:center;gap:8px}
.vlms-tablist button:hover{color:var(--vlms-text)}
.vlms-tablist button.is-on{color:var(--vlms-primary);border-bottom-color:var(--vlms-primary)}
.vlms-count{background:var(--vlms-primary);color:#fff;border-radius:999px;font-size:12px;padding:1px 8px}
.vlms-tabpanel{display:none}
.vlms-tabpanel.is-on{display:block}
.vlms-notes-head{margin:26px 0 12px;font-size:17px}
.vlms-notes-head a{color:inherit}

/* CTA states */
.vlms-cta-continue{background:#0ea5e9}
.vlms-cta-start{background:#16a34a}
.vlms-cta-done{background:#64748b}
.vlms-card-progress{display:flex;flex-direction:column;gap:5px;margin:10px 0 4px}

/* learning paths */
.vlms-path-badge{position:absolute;top:12px;right:12px;background:var(--vlms-primary);color:#fff;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700}
.vlms-path-award{background:#fffaeb;border:1px solid #f6e5b0;border-radius:10px;padding:12px 16px;margin:14px 0}
.vlms-path-overall{display:flex;align-items:center;gap:12px;margin:14px 0 24px;flex-wrap:wrap}
.vlms-path-overall .vlms-bar{flex:1;min-width:200px}
.vlms-stages{list-style:none;padding:0;margin:0;position:relative}
.vlms-stages::before{content:"";position:absolute;left:19px;top:20px;bottom:20px;width:2px;background:#e6e1f3}
.vlms-stage{display:grid;grid-template-columns:40px 1fr;gap:16px;margin-bottom:22px;position:relative}
.vlms-stage-marker{width:40px;height:40px;border-radius:50%;background:#fff;border:2px solid #ddd6ee;display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--vlms-muted);z-index:1}
.vlms-stage.is-active .vlms-stage-marker{border-color:var(--vlms-primary);color:var(--vlms-primary);box-shadow:0 0 0 5px rgba(106,63,191,.12)}
.vlms-stage.is-done .vlms-stage-marker{background:#16a34a;border-color:#16a34a;color:#fff}
.vlms-stage-body{background:#fff;border:1px solid #ece9f5;border-radius:12px;padding:16px 20px}
.vlms-stage.is-active .vlms-stage-body{border-color:var(--vlms-primary)}
.vlms-stage.is-locked .vlms-stage-body{opacity:.62;background:#faf9fd}
.vlms-stage-body h3{margin:0 0 6px;font-size:17px}
.vlms-stage-courses{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.vlms-stage-course{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #f1eef8;border-radius:9px}
.vlms-stage-course.is-done{background:#f4fdf7;border-color:#c9f0d8}
.vlms-sc-icon{flex-shrink:0}
.vlms-sc-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.vlms-sc-body a{color:inherit;text-decoration:none;font-weight:600}
.vlms-sc-body a:hover{color:var(--vlms-primary)}
.vlms-sc-meta{color:var(--vlms-muted);font-size:13px;white-space:nowrap}
@media(max-width:600px){.vlms-stage{grid-template-columns:32px 1fr;gap:10px}.vlms-stages::before{left:15px}.vlms-stage-marker{width:32px;height:32px;font-size:14px}}

/* capture blackout veil */
.vlms-veil{position:absolute;inset:0;background:#000;color:#eee;display:none;align-items:center;justify-content:center;text-align:center;padding:24px;z-index:20}
.vlms-player.is-veiled .vlms-veil{display:flex}
.vlms-veil strong{display:block;font-size:18px;margin-bottom:6px}
.vlms-veil span{font-size:14px;color:#aaa;max-width:380px;display:inline-block}
