/* Trang khoa hoc Premiere (phien Landingpage, v2 11/10/2026). Moi class mang tien to clp- va nam trong .clp.
   Huong rieng "Cat dung cam xuc": nen trang, tim Premiere lam diem nhan, the goc vuong nhu clip tren timeline, timecode chu mono, cau hoi dang phu de.
   Tranh minh hoa phang ve tay (ColorME Illustrator, khong 3D, khong GenAI). Chu Bricolage Grotesque + Be Vietnam Pro + Roboto Mono. */
.clp{--paper:#FFFFFF;--tint:#F5F3FF;--tint-2:#ECE8FF;--line:#E7E4F2;--ink:#17142B;--ink-2:#4B4763;--muted:#8B87A0;--vi:#7B5CFF;--vi-2:#B9A8FF;--rec:#FF4D4D;--clip:#9A86FF;--aud:#4FC48F;
  --disp:'Bricolage Grotesque',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;--body:'Be Vietnam Pro',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;--mono:'Roboto Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;position:relative;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:clip;text-align:left}
.clp *,.clp *::before,.clp *::after{box-sizing:border-box}
.clp :where(h1,h2,h3,p,ul,ol,figure,blockquote){margin:0}
.clp :where(h1,h2,h3){font-family:var(--disp);color:inherit;text-transform:none}
.clp :where(a){text-decoration:none}
.clp :where(em,i){font-style:normal}
.clp img{max-width:100%}
.clp [id]{scroll-margin-top:96px}
.clp [hidden]{display:none!important}
.clp-w{max-width:1240px;margin:0 auto;padding-inline:clamp(16px,4vw,48px)}

/* hero */
.clp-hero{padding-top:clamp(28px,5vw,64px)}
.clp-hero__top{display:grid;gap:18px 40px;align-items:end}
@media (min-width:900px){.clp-hero__top{grid-template-columns:auto 1fr}}
.clp-ttl{display:grid;font-family:var(--disp)}
.clp-ttl__k{font-weight:500;font-size:clamp(20px,2.6vw,32px);letter-spacing:-.01em;line-height:1.15;color:var(--ink-2)}
.clp-ttl__n{font-weight:800;font-size:clamp(76px,15vw,208px);line-height:.86;letter-spacing:-.04em;margin-left:-.04em}
.clp-hero__side{display:grid;gap:14px;max-width:38ch;padding-bottom:clamp(6px,1.4vw,22px)}
@media (min-width:900px){.clp-hero__side{justify-self:end}}
.clp-hero__sub{color:var(--ink-2);font-size:clamp(16px,1.4vw,18px)}
.clp-tc{display:inline-flex;align-items:center;gap:10px;justify-self:start;padding:8px 14px;border-radius:8px;background:var(--ink);color:#fff;font:500 clamp(15px,1.4vw,18px)/1 var(--mono);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.clp-rec{width:10px;height:10px;border-radius:50%;background:var(--rec);box-shadow:0 0 0 4px rgba(255,77,77,.25)}
@media (prefers-reduced-motion:no-preference){.clp-rec{animation:clp-blink 1.2s steps(2,start) infinite}}
@keyframes clp-blink{to{opacity:.25}}
.clp-stage{position:relative;margin-top:clamp(22px,3vw,36px);width:min(1600px,calc(100vw - 32px));margin-left:50%;transform:translateX(-50%);border-radius:clamp(18px,2.4vw,28px);overflow:hidden;box-shadow:0 40px 80px -40px rgba(40,25,110,.45)}
@media (min-width:1300px){.clp-stage{width:min(1600px,calc(100vw - 64px))}}
.clp-heroart{display:block;width:100%;height:auto}
@media (max-width:700px){.clp-stage{aspect-ratio:4/5}.clp-heroart{height:100%;object-fit:cover}}
.clp-meta{display:flex;align-items:center;justify-content:space-between;gap:18px 28px;margin-top:clamp(18px,2.4vw,28px);flex-wrap:wrap}
.clp-ctas{display:flex;gap:12px;flex-wrap:wrap}
.clp-facts{display:flex;gap:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.clp-facts li{display:grid;padding:10px 18px;border-left:1px solid var(--line)}
.clp-facts li:first-child{border-left:0}
.clp-facts b{font:700 17px/1.2 var(--disp)}
.clp-facts span{font-size:13px;color:var(--muted)}
.clp-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:14px;font:700 16px var(--disp);border:2px solid var(--ink);cursor:pointer;white-space:nowrap;transition:transform .2s,background .2s}
.clp-btn svg{width:18px;height:18px}
.clp-btn--p,.clp-btn--ink{background:var(--vi);border-color:var(--vi);color:#fff}
.clp-btn--p:hover,.clp-btn--ink:hover{background:#6643FF;color:#fff;transform:translateY(-2px)}
.clp-btn--g{background:#fff;color:var(--ink)}
.clp-btn--g:hover{color:var(--ink);background:var(--tint)}
.clp-btn--sm{min-height:44px;padding:0 20px;font-size:15px;border-radius:12px}
.clp-btn[disabled]{background:#fff;color:var(--muted);border-color:var(--line);cursor:default;transform:none}
@media (max-width:760px){.clp-ctas{width:100%}.clp-ctas .clp-btn{flex:1 1 100%}.clp-facts{width:100%}.clp-facts li{flex:1;padding:10px 12px}}

/* sections */
.clp-sec{padding-block:clamp(80px,11vw,140px)}
.clp-sec--t0{padding-top:0}
.clp-hd{display:flex;align-items:end;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,48px)}
.clp-hd h2{font:700 clamp(34px,5vw,62px)/1.02 var(--disp);letter-spacing:-.025em;max-width:16ch;text-wrap:balance}
.clp-hd>p{max-width:42ch;color:var(--ink-2);font-size:18px}
.clp-kick{font:500 13px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--vi);margin-bottom:22px}
.clp-price{margin-top:14px;font:700 clamp(30px,3.4vw,44px)/1 var(--disp);letter-spacing:-.04em}
.clp-price small{font:500 15px var(--body);letter-spacing:0;color:var(--muted);margin-right:6px}

/* statement */
.clp-big{text-align:center;font:700 clamp(36px,6.4vw,92px)/1.02 var(--disp);letter-spacing:-.03em}
.clp-big p{text-wrap:balance}
.clp-big__2{color:var(--vi)}

/* customer questions as subtitles */
.clp-subs{display:grid;gap:22px}
@media (min-width:960px){.clp-subs{grid-template-columns:repeat(3,1fr)}}
.clp-subs figure{display:grid;gap:14px;align-content:start;padding:26px;border-radius:18px;background:var(--tint)}
.clp-subs blockquote{justify-self:start;padding:10px 16px;border-radius:8px;background:rgba(23,20,43,.9);color:#fff;font:600 clamp(17px,1.6vw,20px)/1.4 var(--body);box-decoration-break:clone}
.clp-subs blockquote::before{content:"— ";color:var(--vi-2)}
.clp-subs figcaption{color:var(--ink-2);padding-left:4px}

/* outcomes */
.clp-oc{display:grid;gap:18px}
@media (min-width:700px){.clp-oc{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.clp-oc{grid-template-columns:repeat(3,1fr)}}
.clp-oc article{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:18px;padding:10px 10px 22px;background:#fff}
.clp-oc img{display:block;width:100%;height:auto;border-radius:12px}
.clp-oc__n{margin:16px 12px 4px;font:500 12px var(--mono);letter-spacing:.06em;color:var(--vi)}
.clp-oc h3{margin:0 12px 6px;font:700 clamp(21px,1.9vw,25px)/1.15 var(--disp);letter-spacing:-.03em}
.clp-oc p{margin:0 12px;color:var(--ink-2)}

/* sessions as a timeline */
.clp-tl{border-radius:22px;background:var(--ink);padding:clamp(14px,2vw,22px);color:#fff}
.clp-tl__ruler{display:flex;justify-content:space-between;padding:4px 6px 12px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:14px;font:500 12px var(--mono);color:#9E99BC;background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 1px,transparent 1px 24px) bottom/100% 6px no-repeat}
.clp-tl__clips{display:grid;gap:10px;padding:0;list-style:none}
@media (min-width:700px){.clp-tl__clips{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1080px){.clp-tl__clips{grid-template-columns:repeat(4,1fr)}}
.clp-tl__clips>li{position:relative;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-content:start;padding:18px 16px 18px;border-radius:12px;background:#2A2547;border-top:6px solid var(--clip)}
.clp-tl__clips>li:nth-child(even){border-top-color:var(--aud)}
.clp-tl__clips img{grid-row:span 2;width:64px;height:64px;border-radius:10px;display:block}
.clp-tl__n{font:500 12px var(--mono);letter-spacing:.06em;color:var(--vi-2);align-self:end}
.clp-tl__clips b{font:700 18px/1.2 var(--disp);letter-spacing:-.015em}
.clp-tl__clips p{grid-column:1/-1;margin-top:10px;color:#C7C3DD;font-size:14.5px}

/* app + premium */
.clp-duo{display:grid;gap:18px}
@media (min-width:960px){.clp-duo{grid-template-columns:1.15fr .85fr}}
.clp-box{position:relative;border-radius:22px;padding:clamp(24px,3vw,40px);overflow:hidden}
.clp-box h3{font:700 clamp(28px,3vw,40px)/1.05 var(--disp);letter-spacing:-.02em;max-width:17ch;text-wrap:balance}
.clp-box p{margin-top:12px;color:var(--ink-2);max-width:40ch}
.clp-app{background:var(--tint-2);display:grid;align-content:start}
.clp-appart{display:block;width:min(100%,440px);height:auto;margin:18px auto -40px}
@media (min-width:960px){.clp-app{grid-template-columns:1fr 1fr;align-items:stretch}.clp-app__t{align-self:start}.clp-appart{align-self:end;width:calc(100% + 60px);max-width:none!important;margin:0 -40px -40px -20px}}
.clp-tick{display:grid;gap:10px;margin-top:22px;padding:0;list-style:none}
.clp-tick li{display:flex;gap:10px;align-items:center;font-weight:500}
.clp-tick li::before{content:"";width:22px;height:22px;border-radius:6px;background:var(--vi) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 12l4 4 8-8'/%3E%3C/svg%3E") center/14px no-repeat;flex:none}
.clp-prem{background:var(--ink);color:#fff;display:flex;flex-direction:column}
.clp-prem p{color:#C7C3DD}
.clp-prem__n{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-top:auto;padding-top:36px}
.clp-prem__n b{font:800 clamp(80px,9vw,128px)/.9 var(--disp);letter-spacing:-.04em;color:var(--vi-2)}
.clp-prem__n span{font-weight:500;color:#C7C3DD}
.clp-prem__t{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding:0;list-style:none}
.clp-prem__t li{padding:9px 14px;border-radius:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font:600 14px var(--disp)}
.clp-perks{display:grid;gap:12px;margin-top:18px}
@media (min-width:760px){.clp-perks{grid-template-columns:repeat(3,1fr)}}
.clp-perks>div{display:flex;gap:14px;align-items:center;padding:16px 20px;border-radius:16px;border:1px solid var(--line)}
.clp-perks i{width:42px;height:42px;border-radius:10px;flex:none;display:grid;place-items:center;font:700 16px var(--disp);background:var(--tint-2);color:var(--vi)}
.clp-perks b{font:700 16px/1.25 var(--disp)}
.clp-perks small{display:block;color:var(--muted);font-size:13px}

/* who */
.clp-who{display:grid;gap:18px}
@media (min-width:700px){.clp-who{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.clp-who{grid-template-columns:repeat(4,1fr)}}
.clp-who>div{display:flex;flex-direction:column;gap:6px}
.clp-who img{display:block;width:100%;height:auto;border-radius:18px;margin-bottom:12px}
.clp-who b{font:700 21px/1.15 var(--disp);letter-spacing:-.02em}
.clp-who p{color:var(--ink-2)}

/* classes (picker giu nguyen loi goi dang ky cua site) */
.clp-tabs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:14px;background:var(--tint);margin-bottom:16px}
.clp-tab{border:0;border-radius:10px;padding:10px 18px;font:700 15px var(--disp);background:transparent;color:var(--ink);cursor:pointer}
.clp-tab[aria-selected=true]{background:#fff;box-shadow:0 2px 8px -2px rgba(40,25,110,.25)}
.clp-list{display:grid;gap:10px}
.clp-cls{display:grid;grid-template-columns:auto auto 1fr auto;gap:4px 16px;align-items:center;padding:14px 16px;border-radius:16px;border:1px solid var(--line);background:#fff}
.clp-cls__ic{grid-row:span 2;width:40px;height:40px;border-radius:10px}
.clp-cls b{font:700 19px var(--disp);font-variant-numeric:tabular-nums}
.clp-cls>span{color:var(--ink-2)}
.clp-cls .clp-cls__p{grid-column:2/4;color:var(--muted);font-size:14px}
.clp-cls .clp-btn{grid-column:4;grid-row:1/3}
@media (max-width:640px){.clp-cls{grid-template-columns:auto 1fr}.clp-cls__ic{grid-row:auto}.clp-cls>span,.clp-cls .clp-cls__p{grid-column:1/-1}.clp-cls .clp-btn{grid-column:1/-1;grid-row:auto;margin-top:8px}}
.clp-cls--none{padding:22px;border-radius:16px;background:var(--tint);color:var(--ink-2)}

/* faq */
.clp-faq{display:grid;border-top:1px solid var(--line);counter-reset:q}
.clp-faq details{border-bottom:1px solid var(--line);counter-increment:q}
.clp-faq summary{display:flex;align-items:baseline;gap:18px;padding:22px 0;cursor:pointer;list-style:none;font:700 clamp(18px,1.7vw,22px)/1.3 var(--disp);letter-spacing:-.015em}
.clp-faq summary::-webkit-details-marker{display:none}
.clp-faq summary::before{content:counter(q,decimal-leading-zero);font:500 13px var(--mono);color:var(--vi);flex:none;width:28px}
.clp-faq summary::after{content:"+";margin-left:auto;font:500 26px/1 var(--mono);color:var(--muted)}
.clp-faq details[open] summary::after{content:"–";color:var(--vi)}
.clp-faq details p{margin:0 0 22px 46px;color:var(--ink-2);max-width:64ch}

/* end */
.clp-end{text-align:center;padding-top:clamp(90px,12vw,160px);display:grid;grid-template-columns:minmax(0,1fr);justify-items:center}
.clp-tc--end{justify-self:center;margin-bottom:22px}
.clp-end h2{font:800 clamp(44px,7.4vw,104px)/.98 var(--disp);letter-spacing:-.035em;text-wrap:balance}
.clp-end h2 span{color:var(--vi)}
.clp-end>p{font-size:19px;color:var(--ink-2);margin:20px 0 30px}
.clp-endstrip{display:block;width:min(1600px,calc(100vw - 32px));max-width:none!important;height:auto;margin:60px 0 0 50%;justify-self:start;transform:translateX(-50%)}

/* dock */
.clp-dock{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:40;display:flex;align-items:center;gap:14px;padding:8px 8px 8px 20px;border-radius:16px;background:var(--ink);color:#fff;box-shadow:0 18px 40px -16px rgba(23,20,43,.6);max-width:calc(100vw - 32px)}
.clp-dock p{font-size:14px;color:#C7C3DD;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clp-dock b{font:700 15px var(--disp);color:#fff}
.clp-tc{width:max-content}
@media (max-width:480px){.clp-facts li{padding:10px}.clp-facts b{font-size:15px}.clp-facts span{font-size:12px}}

/* noi dung buoi hoc that (giao trinh + bai tap Manage) */
@media (min-width:1080px){.clp-tl__clips{grid-template-columns:repeat(2,1fr)}}
.clp-tl__clips .clp-ss__t,.clp-tl__clips .clp-ss__k,.clp-tl__clips .clp-ss__m{grid-column:1/-1}
.clp-ss__t,.clp-ss__k{display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:12px 0 0;list-style:none}
.clp-ss__t li{padding:3px 9px;border-radius:6px;background:rgba(255,255,255,.08);font-size:12.5px;color:#E6E3F5}
.clp-ss__k li{display:inline-flex;align-items:center;gap:6px;margin-right:8px;font-size:12.5px;color:#A9A4C6}
.clp-ss__k kbd{font:500 11.5px/1 var(--mono);color:#fff;background:#3A3462;border:1px solid var(--vi-2);border-bottom-width:3px;border-radius:6px;padding:4px 7px}
.clp-tl__clips .clp-ss__m{margin-top:12px;padding:10px 12px;border-radius:8px;background:rgba(79,196,143,.14);color:#E6F7EE;font-size:14.5px}
.clp-ss__m b{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--aud);margin-right:8px}

/* bai cuoi khoa */
.clp-fp{display:grid;gap:clamp(28px,4vw,56px);padding:clamp(24px,4vw,56px);border-radius:28px;background:var(--tint)}
@media (min-width:980px){.clp-fp{grid-template-columns:1fr 1fr;align-items:center}}
.clp-fp .clp-label{color:var(--vi);font:500 13px var(--mono);letter-spacing:.06em}
.clp-fp h2{font:700 clamp(30px,3.6vw,50px)/1.04 var(--disp);letter-spacing:-.03em;max-width:15ch;text-wrap:balance;margin-top:10px}
.clp-fp__t>p{margin-top:16px;color:var(--ink-2);max-width:46ch}
.clp-fp__steps{margin:22px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.clp-fp__steps li{padding:12px 16px;border-radius:12px;background:#fff;box-shadow:0 0 0 1px var(--line);font-size:15px}
.clp-fp__steps b{color:var(--vi);margin-right:8px;font:500 13px var(--mono)}
.clp-fp__tl{min-width:0;padding:24px 22px;border-radius:20px;background:var(--ink);color:#fff}
.clp-fp__rl{display:flex;justify-content:space-between;font:500 12px var(--mono);color:#9E99BC;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.12);background:repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 1px,transparent 1px 20px) bottom/100% 6px no-repeat}
.clp-fp__len{position:relative;height:56px;margin-top:18px;border-radius:8px;background:repeating-linear-gradient(90deg,#2A2547 0 22px,#332D57 22px 24px)}
.clp-fp__len i{position:absolute;left:75%;right:0;top:0;bottom:0;border-radius:8px;background:var(--vi);box-shadow:0 0 0 2px var(--vi-2)}
.clp-fp__len::before{content:"";position:absolute;left:0;width:75%;top:0;bottom:0;border-radius:8px;background:var(--clip);opacity:.55}
.clp-fp__len b{position:absolute;right:10px;bottom:-30px;font:500 13px var(--mono);color:var(--vi-2)}
.clp-fp__cap{margin-top:40px;color:#A9A4C6;font-size:14px}

/* cach hoc */
.clp-how{display:grid;gap:16px}
@media (min-width:760px){.clp-how{grid-template-columns:1fr 1fr}.clp-how__cert{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;align-items:center}.clp-how__cert>b,.clp-how__cert>p{grid-column:1/-1}}
.clp-how>article{padding:24px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px var(--line);min-width:0}
.clp-how b{display:block;font:700 20px/1.25 var(--disp);letter-spacing:-.01em}
.clp-how p{margin-top:8px;color:var(--ink-2)}
.clp-how .clp-how__cert{background:var(--tint-2);box-shadow:none}
.clp-meter{display:grid;gap:10px;margin-top:12px}
.clp-meter span{font-size:15px}
.clp-meter ol{display:flex;gap:4px;padding:0;margin:0;list-style:none}
.clp-meter ol li{flex:1;height:16px;border-radius:4px;background:var(--vi)}
.clp-meter ol li.clp-o2{background:transparent;border:2px dashed rgba(23,20,43,.3)}
.clp-meter__bar{height:16px;border-radius:4px;background:rgba(23,20,43,.1);overflow:hidden}
.clp-meter__bar i{display:block;height:100%;background:var(--vi)}
/* chinh sach hoc phi (#303) */
.clp-plans{display:grid;gap:0;border-top:1px solid var(--line)}
@media (min-width:900px){.clp-plans{grid-template-columns:repeat(3,1fr)}.clp-plan+.clp-plan{border-left:1px solid var(--line)}}
.clp-plan{display:flex;flex-direction:column;gap:10px;padding:28px 0;border-bottom:1px solid var(--line);min-width:0}
@media (min-width:900px){.clp-plan{padding:32px 32px 36px;border-bottom:0}.clp-plan:first-child{padding-left:0}.clp-plan:last-child{padding-right:0}}
.clp-plan__k{font:500 12.5px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.clp-plan--main .clp-plan__k{color:var(--vi)}
.clp-plan__p{font:500 clamp(30px,3vw,40px)/1.05 var(--disp);letter-spacing:-.02em;color:var(--ink)}
.clp-plan__p--ask{color:var(--ink-2)}
.clp-plan__s{color:var(--ink-2)}
.clp-plan ul{list-style:none;padding:0;margin:8px 0 18px;display:grid;gap:0;flex:1}
.clp-plan li{padding:10px 0;border-top:1px solid var(--line);color:var(--ink);font-size:15px}
.clp-plan .clp-btn{align-self:flex-start}
/* QC 12/10 toi: dai cuoi trang doc duoc tren dien thoai, bot khoang trong truoc loi keu goi cuoi */
.clp-end{padding-top:clamp(56px,8vw,110px)}
@media (max-width:700px){.clp-endstrip{width:calc(100vw - 24px);height:170px;object-fit:cover;border-radius:18px;margin-top:36px}}
/* chinh sach hoc phi: goi chinh la mot the noi bat; tieu de can theo luoi */
#clp-hoc-phi .clp-hd{align-items:end}
@media (min-width:900px){.clp-plan--main{background:#F1EEFF;border-radius:22px;padding-left:28px!important;padding-right:28px!important}.clp-plan--main+.clp-plan{border-left:0}.clp-plans{border-top:0;gap:0 8px}}
@media (max-width:899px){.clp-plan--main{background:#F1EEFF;border-radius:20px;padding:24px 20px!important;border-bottom:0;margin-bottom:6px}}
.clp-who b{text-wrap:balance}
@media (min-width:900px){.clp-who{gap:18px 28px}}
/* bai cuoi khoa (13/10): man hinh xem truoc + timeline voi canh quay that, thay hai o tim */
.clp-ed{padding:16px!important}
.clp-ed__mon{position:relative;margin:0;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:#000}
.clp-ed__mon img{display:block;width:100%;height:100%;object-fit:cover}
.clp-ed__mon figcaption{position:absolute;left:5%;bottom:9%;display:grid;gap:2px;padding:8px 14px 9px;border-left:3px solid var(--vi);background:rgba(15,12,34,.72);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff}
.clp-ed__mon figcaption b{font:700 clamp(14px,1.5vw,19px)/1.2 var(--disp);letter-spacing:-.01em}
.clp-ed__mon figcaption span{font-size:12px;color:#CFCBE6}
.clp-ed__tc{position:absolute;right:10px;top:10px;padding:3px 8px;border-radius:6px;background:rgba(15,12,34,.72);font:500 11.5px var(--mono);color:#fff}
.clp-ed__rl{display:flex;justify-content:space-between;margin:14px 0 0 34px;padding-bottom:8px;font:500 11px var(--mono);color:#9E99BC;border-bottom:1px solid rgba(255,255,255,.14)}
.clp-ed__tracks{position:relative;display:grid;gap:6px;margin-top:10px}
.clp-ed__trk{display:grid;grid-template-columns:28px minmax(0,1fr);gap:6px;align-items:center}
.clp-ed__trk em{font:500 10.5px var(--mono);font-style:normal;color:#8E89AE}
.clp-ed__row{position:relative;height:26px;border-radius:6px;background:rgba(255,255,255,.05)}
.clp-ed__row--v{height:auto;display:flex;gap:3px;background:none}
.clp-ed__c{position:relative;flex:var(--w) 1 0;min-width:0;height:clamp(52px,6.4vw,74px);border-radius:6px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.clp-ed__c img{display:block;width:100%;height:100%;object-fit:cover}
.clp-ed__c b{position:absolute;left:0;right:0;top:0;padding:3px 6px;background:rgba(124,92,255,.86);font:500 10px/1.3 var(--mono);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clp-ed__c i{position:absolute;right:5px;bottom:4px;padding:1px 5px;border-radius:4px;background:rgba(15,12,34,.7);font:500 9.5px var(--mono);font-style:normal;color:#fff}
.clp-ed__ti,.clp-ed__au{position:absolute;top:3px;bottom:3px;left:calc(var(--l)*1%);width:calc(var(--w)*1%);border-radius:5px}
.clp-ed__ti{padding:0 7px;background:#E94F9B;font:500 10px/20px var(--mono);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clp-ed__au{background:#1F7A5C repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0 1px,transparent 1px 3px);-webkit-mask:linear-gradient(#000,#000);background-size:auto;opacity:.9;clip-path:polygon(0 50%,2% 20%,5% 62%,8% 12%,11% 70%,14% 30%,17% 55%,20% 8%,24% 66%,28% 26%,32% 58%,36% 14%,40% 72%,44% 34%,48% 60%,52% 10%,56% 64%,60% 28%,64% 56%,68% 18%,72% 68%,76% 32%,80% 58%,84% 16%,88% 62%,92% 30%,96% 54%,100% 40%,100% 60%,96% 76%,92% 66%,88% 88%,84% 70%,80% 84%,76% 64%,72% 92%,68% 72%,64% 86%,60% 68%,56% 90%,52% 70%,48% 88%,44% 66%,40% 94%,36% 72%,32% 86%,28% 68%,24% 90%,20% 70%,17% 84%,14% 66%,11% 92%,8% 70%,5% 86%,2% 68%)}
.clp-ed__ph{position:absolute;top:-22px;bottom:-4px;left:calc(34px + (100% - 34px)*.34);width:2px;background:#FFD23F;border-radius:2px}
.clp-ed__ph::before{content:"";position:absolute;left:-5px;top:0;border:6px solid transparent;border-top-color:#FFD23F}
.clp-ed .clp-fp__cap{margin-top:16px}
@media (max-width:600px){.clp-ed__ti{font-size:0}.clp-ed__c b{display:none}}