/* chlak-v2.css */
:root{
--bg:#08090d;
--bg-2:#0d0f15;
--panel:#11141c;
--panel-2:#151925;
--panel-3:#1a1f2c;
--text:#f7f8fb;
--muted:#a6adba;
--muted-2:#798194;
--line:#232938;
--line-2:#30384b;
--white:#ffffff;
--blue:#5f7cff;
--blue-2:#7aa2ff;
--violet:#8b5cf6;
--cyan:#3bd7ff;
--green:#26c281;
--red:#ff6b74;
--amber:#f2b84b;
--pink:#f05aa6;
--shadow:0 24px 70px rgba(0,0,0,.34);
--shadow-soft:0 12px 35px rgba(0,0,0,.22);
--radius-xl:28px;
--radius-lg:20px;
--radius-md:15px;
--max:1220px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
margin:0;
color:var(--text);
background:
linear-gradient(180deg,#08090d 0,#0a0c11 34%,#0c0f15 68%,#08090d 100%);
font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility;
}
body::before{
content:"";
position:fixed;
inset:0;
pointer-events:none;
opacity:.18;
background-image:
linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
background-size:44px 44px;
mask-image:linear-gradient(to bottom,black,transparent 74%);
-webkit-mask-image:linear-gradient(to bottom,black,transparent 74%);
}
*::selection{background:#536fff;color:#fff}
a{color:inherit}
img,svg{display:block}
button,input{font:inherit}
button{cursor:pointer}
[hidden]{display:none!important}
.container{width:min(var(--max),calc(100% - 40px));margin-inline:auto}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.header{
position:sticky;
top:0;
z-index:60;
border-bottom:1px solid rgba(48,56,75,.65);
background:rgba(8,9,13,.94);
}
.header-inner{
min-height:74px;
display:flex;
align-items:center;
justify-content:space-between;
gap:22px;
}
.brand{
display:inline-flex;
align-items:center;
gap:11px;
text-decoration:none;
min-width:max-content;
}
.brand img{
width:40px;
height:40px;
border-radius:12px;
object-fit:cover;
box-shadow:0 9px 28px rgba(84,109,255,.2);
}
.brand-word{
font-size:1.18rem;
font-weight:860;
letter-spacing:-.035em;
}
.desktop-nav{
display:flex;
align-items:center;
gap:3px;
margin-left:auto;
}
.nav-link,.nav-summary,.lang-summary{
display:inline-flex;
align-items:center;
gap:7px;
min-height:40px;
padding:0 12px;
border-radius:11px;
color:#c4c9d4;
text-decoration:none;
font-size:.89rem;
font-weight:680;
transition:background .16s ease,color .16s ease;
}
.nav-link:hover,.nav-summary:hover,.lang-summary:hover{
background:#141821;
color:#fff;
}
.nav-details,.lang-details{position:relative}
.nav-summary,.lang-summary{list-style:none;cursor:pointer}
.nav-summary::-webkit-details-marker,.lang-summary::-webkit-details-marker{display:none}
.mega{
position:absolute;
top:calc(100% + 12px);
right:-180px;
width:min(760px,calc(100vw - 40px));
padding:18px;
border:1px solid var(--line-2);
border-radius:20px;
background:#0f1219;
box-shadow:var(--shadow);
}
.mega-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
}
.mega-head{
grid-column:1/-1;
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
padding:2px 4px 10px;
color:var(--muted);
font-size:.77rem;
font-weight:800;
letter-spacing:.08em;
text-transform:uppercase;
}
.mega a{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px;
padding:11px 12px;
border:1px solid transparent;
border-radius:12px;
color:#d8dce5;
text-decoration:none;
font-size:.86rem;
font-weight:650;
}
.mega a:hover{
border-color:var(--line);
background:#151925;
color:#fff;
}
.mega small{
color:#747d90;
font-size:.68rem;
font-weight:700;
}
.lang-details{margin-left:4px}
.lang-pop{
position:absolute;
right:0;
top:calc(100% + 12px);
min-width:170px;
padding:8px;
border:1px solid var(--line-2);
border-radius:14px;
background:#0f1219;
box-shadow:var(--shadow-soft);
}
.lang-current{
display:block;
padding:10px 11px;
border-radius:9px;
background:#171b25;
color:#fff;
font-size:.85rem;
font-weight:750;
}
.lang-note{padding:9px 10px 5px;color:var(--muted-2);font-size:.72rem;line-height:1.4}
.mobile-menu{display:none;position:relative}
.mobile-menu>summary{
width:43px;height:43px;
display:grid;place-items:center;
list-style:none;cursor:pointer;
border:1px solid var(--line);
border-radius:12px;
background:#11141c;
}
.mobile-menu>summary::-webkit-details-marker{display:none}
.mobile-pop{
position:absolute;
right:0;
top:53px;
width:min(320px,calc(100vw - 26px));
padding:10px;
border:1px solid var(--line-2);
border-radius:17px;
background:#0f1219;
box-shadow:var(--shadow);
}
.mobile-pop a{
display:flex;
justify-content:space-between;
gap:12px;
padding:11px 12px;
border-radius:10px;
text-decoration:none;
color:#d5d9e2;
font-size:.88rem;
font-weight:650;
}
.mobile-pop a:hover{background:#171b25;color:#fff}
.mobile-pop .divider{height:1px;background:var(--line);margin:7px 5px}
.hero{
position:relative;
overflow:hidden;
padding:84px 0 50px;
}
.hero::before{
content:"";
position:absolute;
left:50%;
top:-210px;
width:900px;
height:620px;
transform:translateX(-50%);
border-radius:50%;
background:
radial-gradient(circle at center,rgba(95,124,255,.23),rgba(139,92,246,.08) 43%,transparent 72%);
pointer-events:none;
}
.hero-inner{position:relative;text-align:center}
.hero-chip{
display:inline-flex;
align-items:center;
gap:8px;
padding:7px 11px;
border:1px solid #293149;
border-radius:999px;
background:#10141e;
color:#cfd4df;
font-size:.76rem;
font-weight:760;
letter-spacing:.01em;
}
.hero-chip .live{
width:7px;height:7px;border-radius:50%;background:var(--green);
box-shadow:0 0 0 4px rgba(38,194,129,.12);
}
h1{
width:min(1120px,100%);
margin:24px auto 18px;
font-size:clamp(3rem,5.9vw,5.7rem);
line-height:1.02;
letter-spacing:-.058em;
font-weight:900;
text-wrap:balance;
}
.hero-line{
display:block;
}
.hero-line-accent{
margin-top:.03em;
padding-bottom:.06em;
}
.hero-gradient{
background:linear-gradient(90deg,#f58529 0%,#dd2a7b 35%,#a63cc0 68%,#6c63ff 100%);
-webkit-background-clip:text;
background-clip:text;
color:transparent;
}
.hero-copy{
width:min(760px,100%);
margin:6px auto 0;
color:var(--muted);
font-size:clamp(1rem,1.55vw,1.12rem);
line-height:1.72;
}
.hero-trust{
margin:18px auto 0;
display:flex;
justify-content:center;
flex-wrap:wrap;
gap:8px 16px;
color:#8f97a7;
font-size:.77rem;
font-weight:660;
}
.hero-trust span{display:inline-flex;align-items:center;gap:6px}
.hero-trust svg{color:#6f8bff}
.download-shell{
width:min(990px,100%);
margin:34px auto 0;
padding:10px;
border:1px solid #293149;
border-radius:25px;
background:linear-gradient(180deg,#141923,#0f1219);
box-shadow:0 26px 75px rgba(0,0,0,.34);
text-align:left;
}
.download-form{
display:grid;
grid-template-columns:minmax(0,1fr) auto auto;
gap:8px;
padding:6px;
border:1px solid #2b3346;
border-radius:18px;
background:#0b0d12;
}
.url-wrap{
min-width:0;
display:flex;
align-items:center;
gap:10px;
padding-left:10px;
}
.url-icon{color:#70798c;flex:0 0 auto}
.url-input{
width:100%;
min-width:0;
padding:14px 2px;
border:0;
outline:0;
background:transparent;
color:#f7f8fb;
font-size:.99rem;
}
.url-input::placeholder{color:#606878}
.button{
border:0;
border-radius:12px;
padding:13px 17px;
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
white-space:nowrap;
text-decoration:none;
font-weight:800;
transition:transform .16s ease,background .16s ease,border-color .16s ease;
}
.button:hover{transform:translateY(-1px)}
.button:disabled{opacity:.58;cursor:not-allowed;transform:none}
.button-quiet{
background:#171b25;
color:#d6dbe5;
border:1px solid #262d3d;
}
.button-quiet:hover{background:#1c2230}
.button-primary{
color:#fff;
background:linear-gradient(135deg,#f58529 0%,#dd2a7b 38%,#8134af 70%,#515bd4 100%);
box-shadow:0 9px 24px rgba(94,111,255,.22);
}
.button-primary:hover{background:linear-gradient(135deg,#ff8c32 0%,#e63285 38%,#8c3dbb 70%,#5d66df 100%)}
.download-meta{
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:11px 7px 1px;
color:#7e8798;
font-size:.75rem;
line-height:1.5;
}
.pattern-row{display:flex;flex-wrap:wrap;gap:5px}
.pattern{
padding:3px 7px;
border:1px solid #272e3d;
border-radius:7px;
background:#11151e;
color:#9da5b4;
font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
font-size:.7rem;
}
.download-meta a{color:#a7b5e9}
.status{
display:none;
margin:10px 2px 1px;
padding:12px 14px;
border-radius:12px;
font-size:.86rem;
font-weight:690;
}
.status.show{display:block}
.status.loading{background:#111b38;color:#b7c6ff;border:1px solid #26375f}
.status.success{background:#0e271f;color:#9ce6c4;border:1px solid #1d4a3b}
.status.error{background:#2c1518;color:#ffb6bc;border:1px solid #5b252b}
.quick-links{
width:min(990px,100%);
margin:15px auto 0;
display:flex;
justify-content:center;
gap:7px;
flex-wrap:wrap;
}
.quick-links a{
display:inline-flex;
align-items:center;
gap:7px;
padding:8px 11px;
border:1px solid var(--line);
border-radius:999px;
background:#0e1117;
color:#a9b0bd;
text-decoration:none;
font-size:.77rem;
font-weight:690;
}
.quick-links a:hover{border-color:#384159;color:#fff}
.result-wrap{
width:min(990px,100%);
margin:16px auto 0;
text-align:left;
}
.result-card{
display:grid;
grid-template-columns:180px minmax(0,1fr);
gap:20px;
padding:18px;
border:1px solid #273045;
border-radius:21px;
background:#10141c;
box-shadow:var(--shadow-soft);
}
.result-media{
min-height:180px;
aspect-ratio:4/5;
display:grid;
place-items:center;
overflow:hidden;
border:1px solid #252c3a;
border-radius:15px;
background:#0b0d12;
color:#737b89;
}
.result-media img{width:100%;height:100%;object-fit:cover}
.result-info{min-width:0;padding:6px 2px}
.ready-badge{
display:inline-flex;align-items:center;gap:6px;
padding:6px 8px;border-radius:999px;
background:#10261f;color:#92dfbd;border:1px solid #204839;
font-size:.71rem;font-weight:800;
}
.result-info h2{margin:12px 0 6px;font-size:1.32rem;letter-spacing:-.03em}
.result-url{margin:0;color:#798294;font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.result-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.carousel-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.media-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px;border:1px solid #252c3c;border-radius:12px;background:#0d1016}
.media-item strong{display:block;font-size:.8rem}.media-item small{display:block;margin-top:2px;color:#747d8d;font-size:.7rem}
.media-item .button{padding:8px 10px;font-size:.74rem}
.section{padding:76px 0}
.section-tight{padding:58px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:28px;margin-bottom:27px}
.section-intro{max-width:720px}
.eyebrow{
display:inline-flex;
align-items:center;
gap:7px;
color:#8ca0ff;
font-size:.72rem;
font-weight:850;
letter-spacing:.13em;
text-transform:uppercase;
}
.eyebrow::before{content:"";width:18px;height:1px;background:#6f87ff}
.section h2{
margin:9px 0 0;
font-size:clamp(2rem,4.2vw,3.45rem);
line-height:1.01;
letter-spacing:-.05em;
}
.section-description{max-width:500px;color:#878f9f;line-height:1.65;font-size:.9rem}
.tool-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:12px;
}
.tool-card{
position:relative;
min-height:205px;
padding:18px;
display:flex;
flex-direction:column;
border:1px solid #242b3b;
border-radius:19px;
background:linear-gradient(180deg,#121722,#0f1219);
color:inherit;
text-decoration:none;
overflow:hidden;
transition:transform .17s ease,border-color .17s ease,background .17s ease;
}
.tool-card::after{
content:"";
position:absolute;
right:-48px;
top:-48px;
width:125px;
height:125px;
border-radius:50%;
background:var(--tool-glow,rgba(95,124,255,.13));
opacity:.75;
pointer-events:none;
}
.tool-card:hover{
transform:translateY(-3px);
border-color:#3c4761;
background:linear-gradient(180deg,#151b28,#11151e);
}
.tool-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.tool-icon{
width:45px;height:45px;
display:grid;place-items:center;
border:1px solid var(--tool-border,#30416e);
border-radius:13px;
background:var(--tool-bg,#141d39);
color:var(--tool-color,#8ea4ff);
}
.tool-icon svg{width:22px;height:22px}
.tool-arrow{color:#616b7d;font-size:1.05rem}
.tool-copy{margin-top:auto;padding-top:28px}
.tool-copy h3{margin:0;font-size:1.01rem;letter-spacing:-.02em}
.tool-copy p{margin:6px 0 0;color:#81899a;font-size:.79rem;line-height:1.5}
.tool-type{
display:inline-flex;
margin-top:10px;
padding:4px 7px;
border:1px solid #2b3242;
border-radius:999px;
color:#6f7889;
font-size:.65rem;
font-weight:760;
text-transform:uppercase;
letter-spacing:.06em;
}
.advanced-wrap{
border:1px solid #252d3e;
border-radius:26px;
background:linear-gradient(180deg,#0f131b,#0c0f15);
overflow:hidden;
}
.advanced-top{
display:grid;
grid-template-columns:1.05fr .95fr;
gap:30px;
padding:30px;
border-bottom:1px solid #222938;
background:
linear-gradient(118deg,rgba(95,124,255,.12),transparent 43%),
#10141c;
}
.advanced-top h2{font-size:clamp(2rem,4vw,3.2rem)}
.advanced-top p{margin:0;color:#8b93a2;line-height:1.7}
.advanced-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
}
.advanced-card{
min-height:154px;
padding:18px;
border-right:1px solid #222938;
border-bottom:1px solid #222938;
text-decoration:none;
transition:background .15s ease;
}
.advanced-card:nth-child(4n){border-right:0}
.advanced-card:hover{background:#141923}
.advanced-icon{color:#778dff;margin-bottom:25px}
.advanced-icon svg{width:22px;height:22px}
.advanced-card h3{margin:0 0 6px;font-size:.94rem}
.advanced-card p{margin:0;color:#747d8d;font-size:.76rem;line-height:1.5}
.advanced-label{margin-top:9px;color:#5e6778;font-size:.65rem;font-weight:760;text-transform:uppercase;letter-spacing:.07em}
.mapper{
display:grid;
grid-template-columns:.82fr 1.18fr;
gap:16px;
align-items:stretch;
}
.mapper-intro,.mapper-table{
border:1px solid #252d3e;
border-radius:22px;
background:#0f1219;
}
.mapper-intro{padding:26px}
.mapper-intro h2{margin-top:0}
.mapper-intro p{color:#818a9a;line-height:1.7}
.mapper-note{
margin-top:24px;
padding:13px 14px;
border:1px solid #273147;
border-radius:13px;
background:#111726;
color:#a4aec0;
font-size:.8rem;
line-height:1.55;
}
.mapper-table{padding:10px}
.map-row{
display:grid;
grid-template-columns:1.1fr .9fr;
gap:15px;
align-items:center;
padding:13px 12px;
border-bottom:1px solid #202635;
}
.map-row:last-child{border-bottom:0}
.map-pattern{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:#a5adbb;font-size:.78rem}
.map-row a{text-decoration:none;color:#d9ddea;font-size:.83rem;font-weight:720}
.map-row a:hover{color:#8fa5ff}
.map-sub{display:block;margin-top:3px;color:#676f80;font-size:.7rem;font-family:inherit}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.step{
min-height:220px;
padding:22px;
border:1px solid #242b3b;
border-radius:19px;
background:#0f1219;
}
.step-number{
width:39px;height:39px;
display:grid;place-items:center;
border:1px solid #31406b;
border-radius:11px;
background:#141c35;
color:#94a9ff;
font-size:.73rem;font-weight:850
}
.step h3{margin:36px 0 8px;font-size:1.06rem}
.step p{margin:0;color:#7d8697;line-height:1.63;font-size:.83rem}
.trust-panel{
display:grid;
grid-template-columns:1.15fr .85fr;
gap:0;
border:1px solid #273047;
border-radius:26px;
overflow:hidden;
background:#0f1219;
}
.trust-copy{
padding:34px;
background:
linear-gradient(120deg,rgba(98,124,255,.1),transparent 55%),
#11151e;
}
.trust-copy h2{margin-top:0}
.trust-copy p{max-width:650px;color:#858e9f;line-height:1.72}
.trust-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:20px}
.trust-point{padding:12px;border:1px solid #252e41;border-radius:12px;background:#0e121a;color:#bac1cf;font-size:.8rem;font-weight:680}
.trust-side{padding:30px;background:#090b10;display:flex;flex-direction:column;justify-content:space-between}
.trust-side .mini{color:#697387;font-size:.69rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}
.trust-side h3{margin:11px 0;font-size:1.75rem;line-height:1.08;letter-spacing:-.04em}
.trust-side p{margin:0;color:#777f90;line-height:1.65;font-size:.86rem}
.trust-side a{margin-top:24px;color:#9badff;text-underline-offset:4px;font-weight:780}
.faq{max-width:900px;margin:0 auto}
.faq details{border-bottom:1px solid #242b3b}
.faq summary{
list-style:none;
cursor:pointer;
padding:20px 2px;
display:flex;
justify-content:space-between;
align-items:center;
gap:22px;
font-size:.94rem;
font-weight:760;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:#6f7b91;font-size:1.25rem}
.faq details[open] summary::after{content:"−"}
.faq-answer{padding:0 40px 21px 2px;color:#7f8798;line-height:1.7;font-size:.84rem}
footer{
margin-top:42px;
padding:48px 0 26px;
border-top:1px solid #202635;
background:#07080b;
}
.footer-grid{
display:grid;
grid-template-columns:1.45fr repeat(4,1fr);
gap:30px;
}
.footer-brand p{max-width:360px;color:#70798a;font-size:.8rem;line-height:1.65}
.footer-col h3{margin:4px 0 14px;color:#c9ced8;font-size:.78rem}
.footer-col a{
display:block;
width:max-content;
max-width:100%;
margin:9px 0;
color:#6f7787;
text-decoration:none;
font-size:.78rem;
}
.footer-col a:hover{color:#fff}
.footer-bottom{
display:flex;
justify-content:space-between;
gap:20px;
margin-top:34px;
padding-top:20px;
border-top:1px solid #1e2431;
color:#555e6f;
font-size:.71rem;
line-height:1.55;
}
@media(max-width:1080px){
.desktop-nav,.lang-details{display:none}
.mobile-menu{display:block}
.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.advanced-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.advanced-card:nth-child(4n){border-right:1px solid #222938}
.advanced-card:nth-child(3n){border-right:0}
.footer-grid{grid-template-columns:1.4fr repeat(2,1fr)}
.footer-col:nth-child(4),.footer-col:nth-child(5){grid-column:auto}
}
@media(max-width:820px){
.container{width:min(var(--max),calc(100% - 28px))}
.header-inner{min-height:68px}
.hero{padding:58px 0 35px}
h1{font-size:clamp(2.75rem,9.8vw,4.7rem);line-height:1.03;letter-spacing:-.052em}
.download-form{grid-template-columns:minmax(0,1fr) auto}
.url-wrap{grid-column:1/-1;padding:4px 7px 8px;border-bottom:1px solid #202737}
#pasteBtn{grid-column:1/2}
#submitBtn{grid-column:2/3}
.download-meta{align-items:flex-start;flex-direction:column}
.result-card{grid-template-columns:120px minmax(0,1fr)}
.section{padding:60px 0}
.section-tight{padding:48px 0}
.section-head{display:block}
.section-description{margin-top:13px}
.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.advanced-top{grid-template-columns:1fr}
.advanced-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.advanced-card:nth-child(3n){border-right:1px solid #222938}
.advanced-card:nth-child(2n){border-right:0}
.mapper{grid-template-columns:1fr}
.steps{grid-template-columns:1fr}
.trust-panel{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr 1fr}
.footer-brand{grid-column:1/-1}
}
@media(max-width:520px){
.container{width:min(var(--max),calc(100% - 20px))}
.brand img{width:37px;height:37px}
.hero{padding-top:44px}
h1{font-size:2.72rem;line-height:1.04;letter-spacing:-.045em}
.hero-copy{font-size:.96rem}
.download-shell{padding:8px;border-radius:20px}
.download-form{display:flex;flex-wrap:wrap}
.url-wrap{flex:1 0 100%;width:100%}
#pasteBtn{flex:1}
#submitBtn{flex:1.15}
.result-card{grid-template-columns:1fr}
.result-media{aspect-ratio:16/9}
.carousel-grid{grid-template-columns:1fr}
.tool-grid{grid-template-columns:1fr}
.tool-card{min-height:175px}
.advanced-grid{grid-template-columns:1fr}
.advanced-card,.advanced-card:nth-child(2n),.advanced-card:nth-child(3n),.advanced-card:nth-child(4n){border-right:0}
.map-row{grid-template-columns:1fr;gap:4px}
.trust-copy,.trust-side{padding:23px}
.trust-points{grid-template-columns:1fr}
.footer-grid{grid-template-columns:1fr}
.footer-brand{grid-column:auto}
.footer-bottom{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{transition:none!important;animation:none!important}
}
:root{
color-scheme:light;
--bg:#f5f7fb;
--bg-2:#eef2f7;
--panel:#ffffff;
--panel-2:#f8faff;
--panel-3:#f1f4f9;
--text:#111827;
--muted:#667085;
--muted-2:#8a94a6;
--line:#e4e8ef;
--line-2:#d9dfe8;
--blue:#4f67f6;
--blue-2:#6d83ff;
--violet:#7c5ce7;
--shadow:0 24px 70px rgba(15,23,42,.09);
--shadow-soft:0 12px 35px rgba(15,23,42,.07);
}
body{
color:#111827;
background:
radial-gradient(circle at 12% 5%,rgba(79,103,246,.10),transparent 29rem),
radial-gradient(circle at 88% 8%,rgba(124,92,231,.08),transparent 28rem),
linear-gradient(180deg,#fafbfe 0%,#f5f7fb 48%,#f8f9fc 100%);
}
body::before{
opacity:.32;
background-image:
linear-gradient(rgba(57,73,112,.04) 1px,transparent 1px),
linear-gradient(90deg,rgba(57,73,112,.04) 1px,transparent 1px);
}
.header{
border-bottom-color:rgba(220,225,234,.9);
background:rgba(255,255,255,.94);
box-shadow:0 1px 0 rgba(15,23,42,.025);
}
.brand-word{color:#111827}
.nav-link,.nav-summary,.lang-summary{color:#536075}
.nav-link:hover,.nav-summary:hover,.lang-summary:hover{background:#f3f5f9;color:#111827}
.mega,.lang-pop,.mobile-pop{
border-color:#dde2ea;
background:#fff;
box-shadow:0 22px 60px rgba(15,23,42,.12);
}
.mega-head{color:#7d8798}
.mega a{color:#384152}
.mega a:hover{border-color:#e1e5ec;background:#f6f8fb;color:#101828}
.mega small{color:#98a1b2}
.lang-current{background:#f2f5fa;color:#172033}
.lang-note{color:#7f899a}
.mobile-menu>summary{
border-color:#dfe4ec;
background:#fff;
color:#283346;
}
.mobile-pop a{color:#344054}
.mobile-pop a:hover{background:#f5f7fa;color:#111827}
.mobile-pop .divider{background:#e6eaf0}
.theme-toggle{
width:42px;
height:42px;
flex:0 0 42px;
display:grid;
place-items:center;
border:1px solid #dfe4ec;
border-radius:12px;
background:#fff;
color:#374151;
box-shadow:0 4px 14px rgba(15,23,42,.04);
transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease;
}
.theme-toggle:hover{
transform:translateY(-1px);
background:#f5f7fa;
border-color:#cfd6e1;
color:#111827;
}
.theme-icon{grid-area:1/1}
.theme-icon-sun{display:none}
.hero::before{
background:radial-gradient(circle at center,rgba(79,103,246,.15),rgba(124,92,231,.055) 46%,transparent 72%);
}
.hero-chip{
border-color:#dfe4ec;
background:rgba(255,255,255,.82);
color:#4e5a6d;
box-shadow:0 8px 24px rgba(15,23,42,.05);
}
h1{color:#111827}
.hero-gradient{
background:linear-gradient(90deg,#f58529 0%,#dd2a7b 35%,#8134af 68%,#515bd4 100%);
-webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-copy{color:#667085}
.hero-trust{color:#758095}
.download-shell{
border-color:#dde2ea;
background:rgba(255,255,255,.96);
box-shadow:0 30px 80px rgba(15,23,42,.10);
}
.download-form{
border-color:#dfe4ec;
background:#fbfcfe;
}
.url-icon{color:#8b95a7}
.url-input{color:#101828}
.url-input::placeholder{color:#9aa4b5}
.button-quiet{
background:#f2f5f9;
color:#344054;
border-color:#e0e5ec;
}
.button-quiet:hover{background:#e9edf4}
.button-primary{
color:#fff;
background:linear-gradient(135deg,#f58529 0%,#dd2a7b 38%,#8134af 70%,#515bd4 100%);
box-shadow:0 10px 24px rgba(84,103,239,.18);
}
.download-meta{color:#7b8595}
.pattern{border-color:#e0e5ec;background:#f5f7fa;color:#667085}
.download-meta a{color:#4e63d8}
.status.loading{background:#eef3ff;color:#3f55bf;border-color:#d7e0ff}
.status.success{background:#edf9f3;color:#197456;border-color:#d4efdf}
.status.error{background:#fff1f2;color:#b4232d;border-color:#ffd9dd}
.quick-links a{
border-color:#e0e5ec;
background:#fff;
color:#667085;
box-shadow:0 4px 14px rgba(15,23,42,.025);
}
.quick-links a:hover{border-color:#cbd3df;color:#111827;background:#f9fafc}
.result-card{
border-color:#dfe4ec;
background:#fff;
box-shadow:0 16px 45px rgba(15,23,42,.08);
}
.result-media{
border-color:#e1e5ec;
background:#f4f6fa;
color:#8b95a6;
}
.ready-badge{background:#edf9f3;color:#197456;border-color:#d2ecdd}
.result-url{color:#7c8797}
.media-item{border-color:#e2e6ed;background:#f8f9fb}
.media-item small{color:#818b9b}
.eyebrow{color:#5368df}
.eyebrow::before{background:#667bf2}
.section-description{color:#7a8495}
.tool-card{
border-color:#e1e5ec;
background:linear-gradient(180deg,#ffffff,#fafbfe);
box-shadow:0 10px 28px rgba(15,23,42,.035);
}
.tool-card:hover{
border-color:#cfd6e1;
background:#fff;
box-shadow:0 18px 45px rgba(15,23,42,.08);
}
.tool-icon{
border-color:#dfe5f2!important;
background:#f4f7ff!important;
color:#5068e6!important;
}
.tool-arrow{color:#a0a8b6}
.tool-copy h3{color:#182133}
.tool-copy p{color:#758095}
.tool-type{border-color:#e0e5ec;color:#8b95a5;background:#fafbfc}
.advanced-wrap{
border-color:#dfe4ec;
background:#fff;
box-shadow:0 18px 50px rgba(15,23,42,.05);
}
.advanced-top{
border-bottom-color:#e1e5ec;
background:
linear-gradient(118deg,rgba(79,103,246,.075),transparent 45%),
#fafbfe;
}
.advanced-top p{color:#758095}
.advanced-card{border-color:#e4e8ef}
.advanced-card:hover{background:#f7f9fc}
.advanced-icon{color:#5c71e9}
.advanced-card h3{color:#182133}
.advanced-card p{color:#7a8494}
.advanced-label{color:#98a2b3}
.mapper-intro,.mapper-table{
border-color:#dfe4ec;
background:#fff;
box-shadow:0 12px 35px rgba(15,23,42,.035);
}
.mapper-intro p{color:#748093}
.mapper-note{border-color:#dde4f2;background:#f4f7ff;color:#5b6882}
.map-row{border-bottom-color:#e7eaf0}
.map-pattern{color:#536075}
.map-row a{color:#344054}
.map-row a:hover{color:#5368df}
.map-sub{color:#98a2b3}
.step{
border-color:#e1e5ec;
background:#fff;
box-shadow:0 10px 28px rgba(15,23,42,.03);
}
.step-number{border-color:#dbe2fb;background:#f0f4ff;color:#5268dd}
.step h3{color:#182133}
.step p{color:#788395}
.trust-panel{border-color:#dce2eb;background:#fff}
.trust-copy{
background:
linear-gradient(120deg,rgba(79,103,246,.07),transparent 58%),
#fafbfe;
}
.trust-copy p{color:#748093}
.trust-point{border-color:#e1e5ec;background:#fff;color:#536075}
.trust-side{background:#111827}
.trust-side .mini{color:#8f9bb0}
.trust-side h3{color:#fff}
.trust-side p{color:#a5adba}
.trust-side a{color:#aebcff}
.faq details{border-bottom-color:#e1e5ec}
.faq summary{color:#182133}
.faq summary::after{color:#8d97a7}
.faq-answer{color:#748093}
footer{border-top-color:#e1e5ec;background:#fff}
.footer-brand p{color:#7b8595}
.footer-col h3{color:#344054}
.footer-col a{color:#7a8494}
.footer-col a:hover{color:#111827}
.footer-bottom{border-top-color:#e7eaf0;color:#98a2b3}
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="dark"] body{
color:#f7f8fb;
background:linear-gradient(180deg,#08090d 0,#0a0c11 34%,#0c0f15 68%,#08090d 100%);
}
html[data-theme="dark"] body::before{
opacity:.18;
background-image:
linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
}
html[data-theme="dark"] .header{border-bottom-color:rgba(48,56,75,.65);background:rgba(8,9,13,.94);box-shadow:none}
html[data-theme="dark"] .brand-word{color:#f7f8fb}
html[data-theme="dark"] .nav-link,
html[data-theme="dark"] .nav-summary,
html[data-theme="dark"] .lang-summary{color:#c4c9d4}
html[data-theme="dark"] .nav-link:hover,
html[data-theme="dark"] .nav-summary:hover,
html[data-theme="dark"] .lang-summary:hover{background:#141821;color:#fff}
html[data-theme="dark"] .mega,
html[data-theme="dark"] .lang-pop,
html[data-theme="dark"] .mobile-pop{border-color:#30384b;background:#0f1219;box-shadow:0 24px 70px rgba(0,0,0,.34)}
html[data-theme="dark"] .mega-head{color:#a6adba}
html[data-theme="dark"] .mega a{color:#d8dce5}
html[data-theme="dark"] .mega a:hover{border-color:#232938;background:#151925;color:#fff}
html[data-theme="dark"] .mega small{color:#747d90}
html[data-theme="dark"] .lang-current{background:#171b25;color:#fff}
html[data-theme="dark"] .lang-note{color:#798194}
html[data-theme="dark"] .mobile-menu>summary{border-color:#232938;background:#11141c;color:#f7f8fb}
html[data-theme="dark"] .mobile-pop a{color:#d5d9e2}
html[data-theme="dark"] .mobile-pop a:hover{background:#171b25;color:#fff}
html[data-theme="dark"] .mobile-pop .divider{background:#232938}
html[data-theme="dark"] .theme-toggle{border-color:#2a3142;background:#11141c;color:#e8ebf2;box-shadow:none}
html[data-theme="dark"] .theme-toggle:hover{background:#171b25;border-color:#394155;color:#fff}
html[data-theme="dark"] .theme-icon-moon{display:none}
html[data-theme="dark"] .theme-icon-sun{display:grid}
html[data-theme="dark"] .hero::before{background:radial-gradient(circle at center,rgba(95,124,255,.23),rgba(139,92,246,.08) 43%,transparent 72%)}
html[data-theme="dark"] .hero-chip{border-color:#293149;background:#10141e;color:#cfd4df;box-shadow:none}
html[data-theme="dark"] h1{color:#f7f8fb}
html[data-theme="dark"] .hero-gradient{background:linear-gradient(90deg,#f58529 0%,#dd2a7b 35%,#a63cc0 68%,#6c63ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="dark"] .hero-copy{color:#a6adba}
html[data-theme="dark"] .hero-trust{color:#8f97a7}
html[data-theme="dark"] .download-shell{border-color:#293149;background:linear-gradient(180deg,#141923,#0f1219);box-shadow:0 26px 75px rgba(0,0,0,.34)}
html[data-theme="dark"] .download-form{border-color:#2b3346;background:#0b0d12}
html[data-theme="dark"] .url-icon{color:#70798c}
html[data-theme="dark"] .url-input{color:#f7f8fb}
html[data-theme="dark"] .url-input::placeholder{color:#606878}
html[data-theme="dark"] .button-quiet{background:#171b25;color:#d6dbe5;border-color:#262d3d}
html[data-theme="dark"] .button-quiet:hover{background:#1c2230}
html[data-theme="dark"] .button-primary{background:linear-gradient(135deg,#f58529 0%,#dd2a7b 38%,#8134af 70%,#515bd4 100%);box-shadow:0 9px 24px rgba(94,111,255,.22)}
html[data-theme="dark"] .download-meta{color:#7e8798}
html[data-theme="dark"] .pattern{border-color:#272e3d;background:#11151e;color:#9da5b4}
html[data-theme="dark"] .download-meta a{color:#a7b5e9}
html[data-theme="dark"] .status.loading{background:#111b38;color:#b7c6ff;border-color:#26375f}
html[data-theme="dark"] .status.success{background:#0e271f;color:#9ce6c4;border-color:#1d4a3b}
html[data-theme="dark"] .status.error{background:#2c1518;color:#ffb6bc;border-color:#5b252b}
html[data-theme="dark"] .quick-links a{border-color:#232938;background:#0e1117;color:#a9b0bd;box-shadow:none}
html[data-theme="dark"] .quick-links a:hover{border-color:#384159;color:#fff;background:#0e1117}
html[data-theme="dark"] .result-card{border-color:#273045;background:#10141c;box-shadow:0 12px 35px rgba(0,0,0,.22)}
html[data-theme="dark"] .result-media{border-color:#252c3a;background:#0b0d12;color:#737b89}
html[data-theme="dark"] .ready-badge{background:#10261f;color:#92dfbd;border-color:#204839}
html[data-theme="dark"] .result-url{color:#798294}
html[data-theme="dark"] .media-item{border-color:#252c3c;background:#0d1016}
html[data-theme="dark"] .media-item small{color:#747d8d}
html[data-theme="dark"] .eyebrow{color:#8ca0ff}
html[data-theme="dark"] .eyebrow::before{background:#6f87ff}
html[data-theme="dark"] .section-description{color:#878f9f}
html[data-theme="dark"] .tool-card{border-color:#242b3b;background:linear-gradient(180deg,#121722,#0f1219);box-shadow:none}
html[data-theme="dark"] .tool-card:hover{border-color:#3c4761;background:linear-gradient(180deg,#151b28,#11151e);box-shadow:none}
html[data-theme="dark"] .tool-icon{border-color:var(--tool-border,#30416e)!important;background:var(--tool-bg,#141d39)!important;color:var(--tool-color,#8ea4ff)!important}
html[data-theme="dark"] .tool-arrow{color:#616b7d}
html[data-theme="dark"] .tool-copy h3{color:#f7f8fb}
html[data-theme="dark"] .tool-copy p{color:#81899a}
html[data-theme="dark"] .tool-type{border-color:#2b3242;color:#6f7889;background:transparent}
html[data-theme="dark"] .advanced-wrap{border-color:#252d3e;background:linear-gradient(180deg,#0f131b,#0c0f15);box-shadow:none}
html[data-theme="dark"] .advanced-top{border-bottom-color:#222938;background:linear-gradient(118deg,rgba(95,124,255,.12),transparent 43%),#10141c}
html[data-theme="dark"] .advanced-top p{color:#8b93a2}
html[data-theme="dark"] .advanced-card{border-color:#222938}
html[data-theme="dark"] .advanced-card:hover{background:#141923}
html[data-theme="dark"] .advanced-icon{color:#778dff}
html[data-theme="dark"] .advanced-card h3{color:#f7f8fb}
html[data-theme="dark"] .advanced-card p{color:#747d8d}
html[data-theme="dark"] .advanced-label{color:#5e6778}
html[data-theme="dark"] .mapper-intro,
html[data-theme="dark"] .mapper-table{border-color:#252d3e;background:#0f1219;box-shadow:none}
html[data-theme="dark"] .mapper-intro p{color:#818a9a}
html[data-theme="dark"] .mapper-note{border-color:#273147;background:#111726;color:#a4aec0}
html[data-theme="dark"] .map-row{border-bottom-color:#202635}
html[data-theme="dark"] .map-pattern{color:#a5adbb}
html[data-theme="dark"] .map-row a{color:#d9ddea}
html[data-theme="dark"] .map-row a:hover{color:#8fa5ff}
html[data-theme="dark"] .map-sub{color:#676f80}
html[data-theme="dark"] .step{border-color:#242b3b;background:#0f1219;box-shadow:none}
html[data-theme="dark"] .step-number{border-color:#31406b;background:#141c35;color:#94a9ff}
html[data-theme="dark"] .step h3{color:#f7f8fb}
html[data-theme="dark"] .step p{color:#7d8697}
html[data-theme="dark"] .trust-panel{border-color:#273047;background:#0f1219}
html[data-theme="dark"] .trust-copy{background:linear-gradient(120deg,rgba(98,124,255,.1),transparent 55%),#11151e}
html[data-theme="dark"] .trust-copy p{color:#858e9f}
html[data-theme="dark"] .trust-point{border-color:#252e41;background:#0e121a;color:#bac1cf}
html[data-theme="dark"] .trust-side{background:#090b10}
html[data-theme="dark"] .trust-side .mini{color:#697387}
html[data-theme="dark"] .trust-side h3{color:#f7f8fb}
html[data-theme="dark"] .trust-side p{color:#777f90}
html[data-theme="dark"] .trust-side a{color:#9badff}
html[data-theme="dark"] .faq details{border-bottom-color:#242b3b}
html[data-theme="dark"] .faq summary{color:#f7f8fb}
html[data-theme="dark"] .faq summary::after{color:#6f7b91}
html[data-theme="dark"] .faq-answer{color:#7f8798}
html[data-theme="dark"] footer{border-top-color:#202635;background:#07080b}
html[data-theme="dark"] .footer-brand p{color:#70798a}
html[data-theme="dark"] .footer-col h3{color:#c9ced8}
html[data-theme="dark"] .footer-col a{color:#6f7787}
html[data-theme="dark"] .footer-col a:hover{color:#fff}
html[data-theme="dark"] .footer-bottom{border-top-color:#1e2431;color:#555e6f}
.hero h1,
.hero h1 .hero-line,
.hero h1 .hero-gradient {
font-family: "Poppins", ui-sans-serif, system-ui, sans-serif !important;
font-weight: 800 !important;
}
.hero h1 {
line-height: 1.10 !important;
}
.hero h1 .hero-line {
line-height: 1.10 !important;
}
.hero h1 .hero-line-accent {
line-height: 1.12 !important;
margin-top: .08em !important;
padding-bottom: .08em !important;
}
@media (max-width: 820px) {
.hero h1,
.hero h1 .hero-line,
.hero h1 .hero-line-accent {
line-height: 1.12 !important;
}
}
.brand-mark{
width:40px;
height:40px;
flex:0 0 40px;
display:grid;
place-items:center;
border-radius:12px;
color:#fff;
font-weight:800;
font-family:Inter,ui-sans-serif,system-ui,sans-serif;
background:linear-gradient(135deg,#f58529 0%,#dd2a7b 35%,#8134af 68%,#515bd4 100%);
box-shadow:0 8px 24px rgba(129,52,175,.22);
}
@font-face {
font-family: "Poppins";
font-style: normal;
font-weight: 800;
font-display: swap;
src: url("/assets/fonts/poppins-800-latin-v1.woff2") format("woff2");
}
.tool-theme-video{
--tool-bg:#112238;
--tool-border:#23476f;
--tool-color:#70b7ff;
--tool-glow:rgba(61,153,255,.17);
}
.tool-theme-reels{
--tool-bg:#241a3c;
--tool-border:#49356e;
--tool-color:#b497ff;
--tool-glow:rgba(145,92,246,.17);
}
.tool-theme-photo{
--tool-bg:#163126;
--tool-border:#285846;
--tool-color:#77dfad;
--tool-glow:rgba(38,194,129,.16);
}
.tool-theme-story{
--tool-bg:#351d28;
--tool-border:#613145;
--tool-color:#ff8ebd;
--tool-glow:rgba(240,90,166,.16);
}
.tool-theme-igtv{
--tool-bg:#2d2414;
--tool-border:#574729;
--tool-color:#f2c96f;
--tool-glow:rgba(242,184,75,.15);
}
.tool-theme-carousel{
--tool-bg:#142d33;
--tool-border:#27505a;
--tool-color:#75dcea;
--tool-glow:rgba(59,215,255,.14);
}
.tool-theme-profile{
--tool-bg:#221c38;
--tool-border:#443768;
--tool-color:#aa98ff;
--tool-glow:rgba(139,92,246,.14);
}
.tool-theme-viewer{
--tool-bg:#1b283b;
--tool-border:#314b70;
--tool-color:#88baff;
--tool-glow:rgba(95,124,255,.15);
}
.is-hidden{
display:none !important;
}
@media (min-width:1081px) {
.header .header-inner > #themeToggle {
display:none !important;
visibility:hidden !important;
width:0 !important;
min-width:0 !important;
height:0 !important;
padding:0 !important;
margin:0 !important;
border:0 !important;
overflow:hidden !important;
}
.footer-bottom {
align-items:center;
}
.footer-settings {
display:inline-flex;
align-items:center;
gap:6px;
flex:0 0 auto;
padding:4px;
border:1px solid #e1e5ec;
border-radius:11px;
background:#fff;
}
.footer-language {
height:30px;
display:inline-flex;
align-items:center;
gap:6px;
padding:0 7px;
color:#667085;
font-size:.68rem;
font-weight:680;
white-space:nowrap;
}
.footer-language svg {
width:13px;
height:13px;
}
.footer-theme-toggle {
width:30px !important;
min-width:30px !important;
height:30px !important;
padding:0 !important;
margin:0 !important;
display:inline-grid !important;
place-items:center !important;
border:1px solid #e7eaf0 !important;
border-radius:8px !important;
background:#f8fafc !important;
color:#667085 !important;
box-shadow:none !important;
}
.footer-theme-toggle:hover {
background:#f1f4f8 !important;
color:#111827 !important;
}
.footer-theme-toggle .footer-theme-label {
display:none !important;
}
html[data-theme="dark"] .footer-settings {
border-color:#252c39;
background:#0d1118;
}
html[data-theme="dark"] .footer-language {
color:#9da7b8;
}
html[data-theme="dark"] .footer-theme-toggle {
border-color:#293140 !important;
background:#151a23 !important;
color:#c9ced8 !important;
}
}
@media (max-width:1080px) {
.footer-settings {
display:none !important;
}
}
@media (max-width:1080px) {
.header .header-inner > #themeToggle {
display:none !important;
visibility:hidden !important;
}
.mobile-menu {
display:block;
margin-left:auto;
position:relative;
}
.mobile-menu > summary {
width:42px;
height:42px;
display:grid;
place-items:center;
list-style:none;
cursor:pointer;
}
.mobile-menu > summary::-webkit-details-marker {
display:none;
}
.mobile-pop {
position:absolute;
top:calc(100% + 10px);
right:0;
width:min(340px,calc(100vw - 28px));
max-height:min(650px,calc(100vh - 92px));
overflow-y:auto;
overscroll-behavior:contain;
padding:8px;
border:1px solid #dde2ea;
border-radius:17px;
background:#fff;
box-shadow:
0 22px 60px rgba(15,23,42,.14),
0 4px 14px rgba(15,23,42,.05);
}
.mobile-pop > a,
.mobile-primary-link {
min-height:44px;
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:10px 11px;
border-radius:10px;
color:#344054;
text-decoration:none;
font-size:.86rem;
font-weight:680;
}
.mobile-pop > a small,
.mobile-primary-link small {
color:#98a2b3;
font-size:.68rem;
font-weight:700;
}
.mobile-pop > a:hover {
background:#f5f7fa;
color:#111827;
}
.mobile-group {
margin:2px 0;
border-radius:11px;
}
.mobile-group > summary {
min-height:46px;
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
padding:10px 11px;
list-style:none;
cursor:pointer;
border-radius:10px;
color:#344054;
font-size:.86rem;
font-weight:720;
transition:
background .15s ease,
color .15s ease;
}
.mobile-group > summary::-webkit-details-marker {
display:none;
}
.mobile-group > summary:hover,
.mobile-group[open] > summary {
background:#f4f6fa;
color:#111827;
}
.mobile-group-meta {
display:inline-flex;
align-items:center;
gap:7px;
color:#98a2b3;
}
.mobile-group-meta small {
font-size:.67rem;
font-weight:750;
}
.mobile-group-meta svg {
transition:transform .18s ease;
}
.mobile-group[open] .mobile-group-meta svg {
transform:rotate(180deg);
}
.mobile-submenu {
margin:1px 4px 7px;
padding:5px;
border:1px solid #e8ebf1;
border-radius:11px;
background:#f8fafc;
}
.mobile-submenu a {
min-height:40px;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:8px 9px;
border-radius:8px;
color:#475467;
text-decoration:none;
font-size:.8rem;
font-weight:650;
}
.mobile-submenu a:hover {
background:#fff;
color:#101828;
}
.mobile-submenu small {
flex:0 0 auto;
color:#98a2b3;
font-size:.63rem;
font-weight:700;
}
.mobile-divider,
.mobile-pop .divider {
height:1px;
margin:7px 7px;
background:#e7eaf0;
}
.footer-bottom {
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
justify-content:flex-start !important;
gap:13px !important;
}
.footer-settings {
display:inline-flex !important;
align-items:center;
gap:4px;
width:max-content;
padding:4px;
border:1px solid #e1e5ec;
border-radius:10px;
background:#fff;
box-shadow:0 1px 3px rgba(16,24,40,.04);
}
.footer-language {
height:31px;
display:inline-flex;
align-items:center;
gap:6px;
padding:0 8px;
color:#667085;
font-size:.68rem;
font-weight:700;
}
.footer-language svg {
width:13px;
height:13px;
}
.footer-theme-toggle {
width:31px !important;
min-width:31px !important;
height:31px !important;
margin:0 !important;
padding:0 !important;
display:grid !important;
place-items:center !important;
border:1px solid #e5e9f0 !important;
border-radius:7px !important;
background:#f8fafc !important;
color:#667085 !important;
box-shadow:none !important;
}
.footer-theme-toggle .footer-theme-label {
display:none !important;
}
html[data-theme="dark"] .mobile-pop {
border-color:#293140;
background:#0d1118;
}
html[data-theme="dark"] .mobile-pop > a,
html[data-theme="dark"] .mobile-group > summary {
color:#cbd2dc;
}
html[data-theme="dark"] .mobile-pop > a:hover,
html[data-theme="dark"] .mobile-group > summary:hover,
html[data-theme="dark"] .mobile-group[open] > summary {
background:#151b25;
color:#fff;
}
html[data-theme="dark"] .mobile-submenu {
border-color:#252d3a;
background:#10151d;
}
html[data-theme="dark"] .mobile-submenu a {
color:#aeb7c6;
}
html[data-theme="dark"] .mobile-submenu a:hover {
background:#171d27;
color:#fff;
}
html[data-theme="dark"] .mobile-divider,
html[data-theme="dark"] .mobile-pop .divider {
background:#242c39;
}
html[data-theme="dark"] .footer-settings {
border-color:#293140;
background:#0d1118;
}
html[data-theme="dark"] .footer-language {
color:#aab3c2;
}
html[data-theme="dark"] .footer-theme-toggle {
border-color:#293140 !important;
background:#151a23 !important;
color:#cbd2dc !important;
}
}
@media (max-width:520px) {
.mobile-pop {
width:min(320px,calc(100vw - 20px));
right:0;
}
}
@media (max-width:1080px) {
.header .header-inner > #themeToggle {
display:none !important;
visibility:hidden !important;
}
.mobile-pop {
width:min(340px,calc(100vw - 28px));
padding:8px;
border:1px solid #dde2ea;
border-radius:17px;
background:#fff;
box-shadow:
0 22px 60px rgba(15,23,42,.14),
0 4px 14px rgba(15,23,42,.05);
}
.mobile-instagram-tools {
margin:0 0 4px;
}
.mobile-instagram-tools > summary {
min-height:46px;
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
padding:10px 11px;
list-style:none;
cursor:pointer;
border-radius:10px;
color:#344054;
font-size:.86rem;
font-weight:720;
}
.mobile-instagram-tools > summary::-webkit-details-marker {
display:none;
}
.mobile-instagram-tools[open] > summary {
background:#f4f6fa;
color:#101828;
}
.mobile-instagram-tools .mobile-submenu {
max-height:340px;
overflow-y:auto;
margin:2px 4px 7px;
padding:5px;
border:1px solid #e7eaf0;
border-radius:11px;
background:#f8fafc;
}
.mobile-instagram-tools .mobile-submenu a {
min-height:40px;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:8px 9px;
border-radius:8px;
color:#475467;
text-decoration:none;
font-size:.8rem;
font-weight:650;
}
.mobile-instagram-tools .mobile-submenu a:hover {
background:#fff;
color:#101828;
}
.mobile-instagram-tools .mobile-submenu small {
flex:0 0 auto;
color:#98a2b3;
font-size:.63rem;
font-weight:700;
}
.mobile-nav-direct {
min-height:44px;
display:flex !important;
align-items:center !important;
padding:10px 11px !important;
border-radius:10px;
color:#344054 !important;
text-decoration:none;
font-size:.86rem !important;
font-weight:680 !important;
}
.mobile-nav-direct:hover {
background:#f5f7fa;
color:#111827 !important;
}
.mobile-language-row {
min-height:44px;
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:10px 11px;
color:#475467;
font-size:.82rem;
font-weight:680;
}
.mobile-language-main {
display:inline-flex;
align-items:center;
gap:7px;
}
.mobile-language-row small {
color:#98a2b3;
font-size:.65rem;
font-weight:700;
}
.footer-settings {
display:inline-flex !important;
}
html[data-theme="dark"] .mobile-pop {
border-color:#293140;
background:#0d1118;
}
html[data-theme="dark"] .mobile-instagram-tools > summary,
html[data-theme="dark"] .mobile-nav-direct,
html[data-theme="dark"] .mobile-language-row {
color:#cbd2dc !important;
}
html[data-theme="dark"] .mobile-instagram-tools[open] > summary {
background:#151b25;
color:#fff !important;
}
html[data-theme="dark"] .mobile-instagram-tools .mobile-submenu {
border-color:#252d3a;
background:#10151d;
}
html[data-theme="dark"] .mobile-instagram-tools .mobile-submenu a {
color:#aeb7c6;
}
html[data-theme="dark"] .mobile-instagram-tools .mobile-submenu a:hover {
background:#171d27;
color:#fff;
}
html[data-theme="dark"] .mobile-nav-direct:hover {
background:#151b25;
color:#fff !important;
}
}
@media (max-width:520px) {
.mobile-pop {
width:min(320px,calc(100vw - 20px));
}
}
.blog-main,
.article-main{
background:#f8f9fc;
}
.blog-hero{
padding:92px 0 62px;
border-bottom:1px solid #e6e9f0;
background:
radial-gradient(circle at 50% 0%,rgba(101,81,255,.12),transparent 42%),
#f8f9fc;
}
.blog-hero-inner{
max-width:920px;
text-align:center;
}
.blog-eyebrow,
.blog-section-kicker,
.article-category{
display:inline-block;
color:#5b6ff8;
font-size:.72rem;
font-weight:800;
letter-spacing:.14em;
}
.blog-hero h1{
max-width:900px;
margin:18px auto 20px;
color:#0f172a;
font-size:clamp(2.4rem,5vw,4.6rem);
line-height:1.02;
letter-spacing:-.045em;
}
.blog-lead{
max-width:790px;
margin:0 auto;
color:#667085;
font-size:1.05rem;
line-height:1.75;
}
.blog-topic-row{
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:8px;
margin-top:28px;
}
.blog-topic-row span{
padding:7px 11px;
border:1px solid #dfe3eb;
border-radius:999px;
background:#fff;
color:#667085;
font-size:.72rem;
font-weight:700;
}
.blog-section{
padding:72px 0;
}
.blog-section-head{
display:flex;
justify-content:space-between;
align-items:end;
gap:34px;
margin-bottom:30px;
}
.blog-section-head h2,
.blog-principles h2{
margin:8px 0 0;
color:#101828;
font-size:2rem;
letter-spacing:-.03em;
}
.blog-section-head > p{
max-width:470px;
margin:0;
color:#667085;
line-height:1.65;
}
.guide-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
}
.guide-card{
min-height:250px;
display:flex;
flex-direction:column;
padding:22px;
border:1px solid #e2e6ed;
border-radius:18px;
background:#fff;
color:inherit;
text-decoration:none;
}
.guide-card-live{
border-color:#cfd5ff;
box-shadow:0 12px 35px rgba(64,75,180,.09);
}
.guide-card-top{
display:flex;
justify-content:space-between;
gap:10px;
margin-bottom:28px;
}
.guide-category,
.guide-live,
.guide-year{
font-size:.66rem;
font-weight:800;
letter-spacing:.05em;
}
.guide-category{
color:#667085;
}
.guide-live{
color:#5264ef;
}
.guide-year{
color:#98a2b3;
}
.guide-card h3{
margin:0 0 12px;
color:#101828;
font-size:1rem;
line-height:1.42;
}
.guide-card p{
margin:0;
color:#7a8496;
font-size:.78rem;
line-height:1.65;
}
.guide-arrow{
margin-top:auto;
padding-top:20px;
color:#5264ef;
font-size:.75rem;
font-weight:800;
}
.guide-card-live:hover{
transform:translateY(-2px);
border-color:#aeb8ff;
}
.blog-principles{
padding:0 0 80px;
}
.blog-principles-card{
padding:34px;
border:1px solid #e2e6ed;
border-radius:22px;
background:#fff;
}
.blog-principles-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:16px;
margin-top:28px;
}
.blog-principles-grid > div{
padding:20px;
border-radius:14px;
background:#f7f8fb;
}
.blog-principles-grid strong{
color:#101828;
}
.blog-principles-grid p{
margin:8px 0 0;
color:#667085;
font-size:.8rem;
line-height:1.6;
}
.article-hero{
padding:68px 0 54px;
border-bottom:1px solid #e4e8ef;
background:
radial-gradient(circle at 50% 0%,rgba(100,82,255,.11),transparent 42%),
#f8f9fc;
}
.article-container{
max-width:900px;
}
.article-breadcrumb{
display:flex;
gap:8px;
margin-bottom:34px;
color:#8a94a6;
font-size:.75rem;
}
.article-breadcrumb a{
color:#5968e8;
text-decoration:none;
}
.article-hero h1{
max-width:900px;
margin:14px 0 18px;
color:#101828;
font-size:clamp(2.3rem,4.4vw,4rem);
line-height:1.04;
letter-spacing:-.045em;
}
.article-deck{
max-width:820px;
margin:0;
color:#667085;
font-size:1.02rem;
line-height:1.75;
}
.article-meta{
display:flex;
flex-wrap:wrap;
gap:8px 18px;
margin-top:25px;
color:#8b95a7;
font-size:.7rem;
font-weight:700;
}
.article-layout{
max-width:1100px;
display:grid;
grid-template-columns:220px minmax(0,760px);
gap:55px;
align-items:start;
padding-top:58px;
padding-bottom:84px;
}
.article-toc{
position:sticky;
top:110px;
display:flex;
flex-direction:column;
gap:11px;
padding:18px;
border:1px solid #e3e7ee;
border-radius:14px;
background:#fff;
}
.article-toc strong{
margin-bottom:4px;
color:#101828;
font-size:.75rem;
}
.article-toc a{
color:#7b8597;
text-decoration:none;
font-size:.72rem;
}
.article-toc a:hover{
color:#5264ef;
}
.article-content{
min-width:0;
}
.article-content section{
scroll-margin-top:120px;
margin-bottom:54px;
}
.article-content h2{
margin:0 0 18px;
color:#101828;
font-size:1.8rem;
line-height:1.2;
letter-spacing:-.025em;
}
.article-content h3{
margin:30px 0 10px;
color:#101828;
font-size:1.08rem;
}
.article-content p{
margin:0 0 17px;
color:#667085;
font-size:.94rem;
line-height:1.82;
}
.article-content a{
color:#5061e8;
}
.article-callout{
margin:26px 0;
padding:20px 22px;
border:1px solid #d9defe;
border-radius:14px;
background:#f2f4ff;
}
.article-callout strong{
color:#3343ba;
}
.article-callout p{
margin:7px 0 0;
}
.article-steps{
display:grid;
gap:12px;
padding:0;
list-style:none;
counter-reset:steps;
}
.article-steps li{
counter-increment:steps;
position:relative;
padding:20px 20px 20px 58px;
border:1px solid #e3e7ee;
border-radius:14px;
background:#fff;
}
.article-steps li::before{
content:counter(steps,decimal-leading-zero);
position:absolute;
top:19px;
left:18px;
color:#5868ed;
font-size:.72rem;
font-weight:800;
}
.article-steps strong{
color:#101828;
}
.article-steps p{
margin:7px 0 0;
}
.article-compare{
display:grid;
grid-template-columns:1fr 1fr;
gap:14px;
}
.article-compare > div{
padding:22px;
border:1px solid #e2e6ed;
border-radius:16px;
background:#fff;
}
.article-compare span,
.article-next > span{
color:#6676f0;
font-size:.66rem;
font-weight:800;
letter-spacing:.1em;
}
.article-compare h3{
margin:9px 0 10px;
}
.article-compare p{
font-size:.82rem;
}
.article-compare a{
font-size:.76rem;
font-weight:800;
text-decoration:none;
}
.article-faq details{
border-bottom:1px solid #e3e7ee;
}
.article-faq summary{
padding:18px 0;
color:#101828;
cursor:pointer;
font-weight:700;
}
.article-faq details p{
padding:0 0 18px;
}
.article-next{
padding:28px;
border:1px solid #dfe3eb;
border-radius:18px;
background:#fff;
}
.article-next h2{
margin-top:8px;
}
.article-actions{
display:flex;
flex-wrap:wrap;
gap:9px;
margin-top:22px;
}
.article-actions a{
display:inline-flex;
min-height:42px;
align-items:center;
padding:0 14px;
border-radius:10px;
text-decoration:none;
font-size:.75rem;
font-weight:800;
}
.article-primary{
background:#111827;
color:#fff!important;
}
.article-secondary{
border:1px solid #dfe3eb;
color:#475467!important;
background:#fff;
}
html[data-theme="dark"] .blog-main,
html[data-theme="dark"] .article-main,
html[data-theme="dark"] .blog-hero,
html[data-theme="dark"] .article-hero{
background:#080a0f;
}
html[data-theme="dark"] .blog-hero,
html[data-theme="dark"] .article-hero{
border-color:#202735;
}
html[data-theme="dark"] .blog-hero h1,
html[data-theme="dark"] .blog-section-head h2,
html[data-theme="dark"] .blog-principles h2,
html[data-theme="dark"] .guide-card h3,
html[data-theme="dark"] .article-hero h1,
html[data-theme="dark"] .article-content h2,
html[data-theme="dark"] .article-content h3,
html[data-theme="dark"] .article-faq summary{
color:#f4f6fb;
}
html[data-theme="dark"] .guide-card,
html[data-theme="dark"] .blog-principles-card,
html[data-theme="dark"] .article-toc,
html[data-theme="dark"] .article-steps li,
html[data-theme="dark"] .article-compare > div,
html[data-theme="dark"] .article-next{
border-color:#252c39;
background:#0d1118;
}
html[data-theme="dark"] .blog-principles-grid > div,
html[data-theme="dark"] .article-callout{
border-color:#252d45;
background:#111722;
}
@media(max-width:980px){
.guide-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.article-layout{
grid-template-columns:1fr;
}
.article-toc{
position:static;
}
}
@media(max-width:680px){
.blog-hero{
padding:64px 0 44px;
}
.blog-section{
padding:50px 0;
}
.blog-section-head{
display:block;
}
.blog-section-head > p{
margin-top:12px;
}
.guide-grid,
.blog-principles-grid,
.article-compare{
grid-template-columns:1fr;
}
.guide-card{
min-height:220px;
}
.article-hero{
padding:50px 0 40px;
}
.article-layout{
padding-top:38px;
padding-bottom:60px;
}
}
.article-table-wrap{
overflow-x:auto;
margin:24px 0;
border:1px solid #e2e6ed;
border-radius:16px;
background:#fff;
}
.article-table{
width:100%;
min-width:720px;
border-collapse:collapse;
}
.article-table th,
.article-table td{
padding:14px 16px;
border-bottom:1px solid #e8ebf1;
text-align:left;
vertical-align:top;
color:#667085;
font-size:.76rem;
line-height:1.55;
}
.article-table th{
background:#f7f8fb;
color:#344054;
font-size:.7rem;
font-weight:800;
}
.article-table tbody tr:last-child td{
border-bottom:0;
}
.article-compare-three{
grid-template-columns:repeat(3,minmax(0,1fr));
}
html[data-theme="dark"] .article-table-wrap{
border-color:#252c39;
background:#0d1118;
}
html[data-theme="dark"] .article-table th{
background:#121722;
color:#d9dfeb;
}
html[data-theme="dark"] .article-table td,
html[data-theme="dark"] .article-table th{
border-color:#252c39;
}
@media(max-width:760px){
.article-compare-three{
grid-template-columns:1fr;
}
}
@media (min-width: 769px) {
.header .desktop-nav {
display:flex;
align-items:center;
gap:3px;
}
.header .desktop-nav > .lang-details {
margin-left:0 !important;
margin-inline-start:0 !important;
padding-left:0 !important;
flex:0 0 auto;
}
.header .desktop-nav > .lang-details > .lang-summary {
padding-left:10px;
padding-right:10px;
gap:6px;
}
}
/* chlak-mobile-footer.css */
@media (max-width: 768px) {
footer .footer-bottom {
display:flex !important;
flex-direction:column !important;
align-items:flex-start !important;
justify-content:flex-start !important;
width:100% !important;
gap:16px !important;
}
footer .footer-settings {
box-sizing:border-box !important;
display:grid !important;
grid-template-columns:auto 44px !important;
align-items:center !important;
justify-content:start !important;
column-gap:8px !important;
row-gap:0 !important;
width:max-content !important;
max-width:100% !important;
min-width:0 !important;
height:auto !important;
min-height:44px !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
position:static !important;
top:auto !important;
right:auto !important;
bottom:auto !important;
left:auto !important;
transform:none !important;
translate:none !important;
overflow:visible !important;
}
footer .footer-settings .footer-language {
box-sizing:border-box !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
gap:8px !important;
width:auto !important;
min-width:0 !important;
max-width:none !important;
height:44px !important;
min-height:44px !important;
margin:0 !important;
padding:0 14px !important;
border:1px solid #e0e5ec !important;
border-radius:12px !important;
background:#ffffff !important;
color:#596579 !important;
box-shadow:
0 1px 2px rgba(15,23,42,.03) !important;
font-size:.82rem !important;
font-weight:700 !important;
line-height:1 !important;
white-space:nowrap !important;
position:static !important;
top:auto !important;
right:auto !important;
bottom:auto !important;
left:auto !important;
transform:none !important;
translate:none !important;
flex:0 0 auto !important;
}
footer .footer-settings .footer-language svg {
display:block !important;
width:17px !important;
min-width:17px !important;
height:17px !important;
flex:0 0 17px !important;
}
footer .footer-settings .footer-theme-toggle {
-webkit-appearance:none !important;
appearance:none !important;
box-sizing:border-box !important;
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
width:44px !important;
min-width:44px !important;
max-width:44px !important;
height:44px !important;
min-height:44px !important;
max-height:44px !important;
margin:0 !important;
padding:0 !important;
border:1px solid #e0e5ec !important;
border-radius:12px !important;
background:#ffffff !important;
color:#596579 !important;
box-shadow:
0 1px 2px rgba(15,23,42,.03) !important;
position:static !important;
top:auto !important;
right:auto !important;
bottom:auto !important;
left:auto !important;
inset:auto !important;
transform:none !important;
translate:none !important;
flex:0 0 44px !important;
overflow:hidden !important;
cursor:pointer !important;
touch-action:manipulation !important;
-webkit-tap-highlight-color:transparent;
}
footer .footer-settings .footer-theme-toggle:hover {
transform:none !important;
}
footer .footer-settings .footer-theme-toggle:active {
transform:none !important;
}
footer .footer-settings .footer-theme-toggle:focus-visible {
outline:2px solid #667eea !important;
outline-offset:2px !important;
}
footer .footer-settings .footer-theme-toggle .theme-icon {
width:20px !important;
height:20px !important;
align-items:center !important;
justify-content:center !important;
margin:0 !important;
padding:0 !important;
}
footer .footer-settings .footer-theme-toggle svg {
display:block !important;
width:18px !important;
height:18px !important;
margin:auto !important;
}
html[data-theme="dark"]
footer .footer-settings .footer-language,
html[data-theme="dark"]
footer .footer-settings .footer-theme-toggle {
border-color:#2e3747 !important;
background:#121722 !important;
color:#d7deea !important;
box-shadow:none !important;
}
footer,
footer .container,
footer .footer-bottom,
footer .footer-settings {
max-width:100% !important;
}
}
@media (max-width: 359px) {
footer .footer-settings {
grid-template-columns:auto 42px !important;
column-gap:7px !important;
}
footer .footer-settings .footer-language {
height:42px !important;
min-height:42px !important;
padding-left:12px !important;
padding-right:12px !important;
font-size:.78rem !important;
}
footer .footer-settings .footer-theme-toggle {
width:42px !important;
min-width:42px !important;
max-width:42px !important;
height:42px !important;
min-height:42px !important;
max-height:42px !important;
flex-basis:42px !important;
}
}
/* chlak-footer-classic-v3.css */
.chf3 {
margin-top:
72px
!important;
border-top:
1px solid #e8edf4
!important;
background:
#ffffff
!important;
}
.chf3-inner {
width:
min(1180px, calc(100% - 48px))
!important;
margin:
0 auto
!important;
padding:
48px 0 22px
!important;
}
.chf3-main {
display:
grid
!important;
grid-template-columns:
minmax(250px,1.4fr)
repeat(4,minmax(125px,.72fr))
!important;
gap:
44px
!important;
align-items:
start
!important;
}
.chf3-brand {
max-width:
290px
!important;
}
.chf3-logo {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
11px
!important;
margin-bottom:
14px
!important;
color:
#111827
!important;
font-size:
19px
!important;
font-weight:
850
!important;
letter-spacing:
-.02em
!important;
text-decoration:
none
!important;
}
.chf3-logo-mark {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
40px
!important;
height:
40px
!important;
border-radius:
11px
!important;
background:
linear-gradient(
135deg,
#f43f5e,
#a855f7 58%,
#4f46e5
)
!important;
color:
#fff
!important;
font-size:
14px
!important;
font-weight:
900
!important;
box-shadow:
0 8px 20px rgba(124,58,237,.15)
!important;
}
.chf3-brand > p {
margin:
0 0 17px
!important;
color:
#75839a
!important;
font-size:
12px
!important;
line-height:
1.65
!important;
}
.chf3-socials {
display:
flex
!important;
gap:
8px
!important;
}
.chf3-social {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
31px
!important;
height:
31px
!important;
border-radius:
9px
!important;
}
.chf3-social img {
display:
block
!important;
width:
15px
!important;
height:
15px
!important;
filter:
brightness(0) invert(1)
!important;
}
.chf3-ig {
background:
linear-gradient(
135deg,
#833ab4,
#e1306c 63%,
#fcaf45
)
!important;
}
.chf3-fb {
background:
#1877f2
!important;
}
.chf3-pin {
background:
#e60023
!important;
}
.chf3-col {
display:
flex
!important;
flex-direction:
column
!important;
align-items:
flex-start
!important;
gap:
9px
!important;
}
.chf3-col h3 {
margin:
0 0 6px
!important;
color:
#172033
!important;
font-size:
11px
!important;
font-weight:
850
!important;
letter-spacing:
.035em
!important;
}
.chf3-col a {
color:
#71809a
!important;
font-size:
11px
!important;
font-weight:
500
!important;
line-height:
1.42
!important;
text-decoration:
none
!important;
transition:
color .16s ease,
transform .16s ease
!important;
}
.chf3-col a:hover {
color:
#4f46e5
!important;
transform:
translateX(2px)
!important;
}
.chf3-soon {
color:
#a98a55
!important;
font-size:
9px
!important;
font-weight:
700
!important;
line-height:
1.4
!important;
}
.chf3-bottom {
display:
flex
!important;
align-items:
center
!important;
justify-content:
space-between
!important;
gap:
20px
!important;
margin-top:
38px
!important;
padding-top:
18px
!important;
border-top:
1px solid #edf0f5
!important;
color:
#94a3b8
!important;
font-size:
10px
!important;
}
.chf3-bottom-right {
display:
flex
!important;
align-items:
center
!important;
gap:
15px
!important;
}
.chf3-bottom-right a {
color:
#7b899e
!important;
font-size:
10px
!important;
text-decoration:
none
!important;
}
.chf3-bottom-right a:hover {
color:
#4f46e5
!important;
}
.chf3-independent {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
5px
!important;
color:
#94a3b8
!important;
font-size:
9px
!important;
}
.chf3-independent::before {
content:
""
!important;
width:
5px
!important;
height:
5px
!important;
border-radius:
50%
!important;
background:
#34d399
!important;
}
.chf3-language {
padding:
6px 9px
!important;
border:
1px solid #e2e8f0
!important;
border-radius:
8px
!important;
background:
#fafbfc
!important;
color:
#64748b
!important;
font-size:
9px
!important;
font-weight:
650
!important;
}
@media (max-width: 1050px) {
.chf3-inner {
width:
min(100% - 36px,850px)
!important;
}
.chf3-main {
grid-template-columns:
repeat(2,minmax(0,1fr))
!important;
gap:
34px
!important;
}
.chf3-brand {
grid-column:
1 / -1
!important;
max-width:
520px
!important;
}
}
@media (max-width: 650px) {
.chf3 {
margin-top:
52px
!important;
}
.chf3-inner {
width:
calc(100% - 28px)
!important;
padding:
38px 0 20px
!important;
}
.chf3-main {
grid-template-columns:
1fr 1fr
!important;
gap:
30px 22px
!important;
}
.chf3-brand {
grid-column:
1 / -1
!important;
}
.chf3-bottom {
align-items:
flex-start
!important;
flex-direction:
column
!important;
}
.chf3-bottom-right {
flex-wrap:
wrap
!important;
}
}
@media (max-width: 430px) {
.chf3-main {
grid-template-columns:
1fr
!important;
}
.chf3-brand {
grid-column:
auto
!important;
}
}
/* chlak-dark-mode-v1.css */
:root {
color-scheme: light;
}
html[data-theme="dark"] {
color-scheme: dark;
}
.chf3-theme-toggle {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 32px !important;
height: 32px !important;
padding: 0 !important;
border: 1px solid #e2e8f0 !important;
border-radius: 8px !important;
background: #fafbfc !important;
color: #526176 !important;
cursor: pointer !important;
transition:
background .16s ease,
border-color .16s ease,
color .16s ease,
transform .16s ease
!important;
}
.chf3-theme-toggle:hover {
border-color: #cbd5e1 !important;
background: #f1f5f9 !important;
color: #111827 !important;
transform: translateY(-1px) !important;
}
.chf3-theme-toggle:focus-visible {
outline: 2px solid #818cf8 !important;
outline-offset: 2px !important;
}
.chf3-theme-toggle svg {
display: block !important;
width: 15px !important;
height: 15px !important;
}
.chf3-theme-sun {
display: none !important;
}
html[data-theme="dark"] .chf3-theme-moon {
display: none !important;
}
html[data-theme="dark"] .chf3-theme-sun {
display: block !important;
}
html[data-theme="dark"],
html[data-theme="dark"] body {
background: #0b1120 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] body {
transition:
background-color .18s ease,
color .18s ease
!important;
}
html[data-theme="dark"] main {
background: #0b1120 !important;
}
html[data-theme="dark"] header,
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .header,
html[data-theme="dark"] .topbar {
background: rgba(11,17,32,.96) !important;
border-color: #1e293b !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] header a,
html[data-theme="dark"] header button,
html[data-theme="dark"] .site-header a,
html[data-theme="dark"] .header a {
color: #cbd5e1 !important;
}
html[data-theme="dark"] #video-platforms,
html[data-theme="dark"] #broad-search-intent,
html[data-theme="dark"] #source-matching,
html[data-theme="dark"] #planned-workflow,
html[data-theme="dark"] #limits,
html[data-theme="dark"] #other-media,
html[data-theme="dark"] #faq {
color: #e5e7eb !important;
}
html[data-theme="dark"] #video-platforms h2,
html[data-theme="dark"] #video-platforms h3,
html[data-theme="dark"] #broad-search-intent h2,
html[data-theme="dark"] #broad-search-intent h3,
html[data-theme="dark"] #source-matching h2,
html[data-theme="dark"] #source-matching h3,
html[data-theme="dark"] #planned-workflow h2,
html[data-theme="dark"] #planned-workflow h3,
html[data-theme="dark"] #limits h2,
html[data-theme="dark"] #limits h3,
html[data-theme="dark"] #other-media h2,
html[data-theme="dark"] #other-media h3,
html[data-theme="dark"] #faq h2,
html[data-theme="dark"] #faq h3 {
color: #f8fafc !important;
}
html[data-theme="dark"] #video-platforms p,
html[data-theme="dark"] #broad-search-intent p,
html[data-theme="dark"] #source-matching p,
html[data-theme="dark"] #planned-workflow p,
html[data-theme="dark"] #limits p,
html[data-theme="dark"] #other-media p,
html[data-theme="dark"] #faq p {
color: #94a3b8 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-card {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.16) !important;
}
html[data-theme="dark"] #video-platforms .ch-route-card.is-planned {
background: #0f172a !important;
}
html[data-theme="dark"] #video-platforms .ch-route-body h3 {
color: #f1f5f9 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-body p {
color: #94a3b8 !important;
}
html[data-theme="dark"] #video-platforms .ch-route-tag {
background: #172033 !important;
border-color: #2b374c !important;
color: #94a3b8 !important;
}
html[data-theme="dark"] #broad-search-intent > div,
html[data-theme="dark"] #broad-search-intent article {
border-color: #263244 !important;
}
html[data-theme="dark"] #broad-search-intent > div > div:first-child,
html[data-theme="dark"] #broad-search-intent article:first-child {
background: #111827 !important;
}
html[data-theme="dark"] #source-matching .chsm-info,
html[data-theme="dark"] #source-matching .chsm-router {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #source-matching .chsm-router-head {
background: #0f172a !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #source-matching .chsm-row {
background: #111827 !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #source-matching a.chsm-row:hover {
background: #162033 !important;
}
html[data-theme="dark"] #source-matching .chsm-row.is-planned {
background: #0f172a !important;
}
html[data-theme="dark"] #source-matching .chsm-url strong,
html[data-theme="dark"] #source-matching .chsm-action,
html[data-theme="dark"] #source-matching .chsm-router-head span {
color: #e2e8f0 !important;
}
html[data-theme="dark"] #source-matching .chsm-url small,
html[data-theme="dark"] #source-matching .chsm-router-head small {
color: #8493a9 !important;
}
html[data-theme="dark"] #source-matching .chsm-trust span {
background: #0f172a !important;
border-color: #263244 !important;
color: #cbd5e1 !important;
}
html[data-theme="dark"] #planned-workflow .chpw-step {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #planned-workflow .chpw-number,
html[data-theme="dark"] #planned-workflow .chpw-foot {
background: #172033 !important;
border-color: #2b374c !important;
}
html[data-theme="dark"] #limits .chlim-shell,
html[data-theme="dark"] #limits .chlim-main {
background: #111827 !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #limits .chlim-rule {
background: #0f172a !important;
border-color: #263244 !important;
}
html[data-theme="dark"] #limits .chlim-rule strong {
color: #e2e8f0 !important;
}
html[data-theme="dark"] #limits .chlim-rule small {
color: #8493a9 !important;
}
html[data-theme="dark"] #limits .chlim-responsible {
background: #080e1b !important;
}
html[data-theme="dark"] #other-media .chom-card {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 14px 34px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #other-media .chom-body h3 {
color: #f1f5f9 !important;
}
html[data-theme="dark"] #other-media .chom-badge {
background: #172033 !important;
border-color: #2b374c !important;
color: #a5b4fc !important;
}
html[data-theme="dark"] #other-media .chom-open {
color: #a5b4fc !important;
}
html[data-theme="dark"] #faq .chfaq-item {
background: #111827 !important;
border-color: #263244 !important;
box-shadow: 0 8px 22px rgba(0,0,0,.15) !important;
}
html[data-theme="dark"] #faq .chfaq-item[open] summary {
background: #0f172a !important;
}
html[data-theme="dark"] #faq .chfaq-question {
color: #e5e7eb !important;
}
html[data-theme="dark"] #faq .chfaq-number,
html[data-theme="dark"] #faq .chfaq-plus {
background: #172033 !important;
border-color: #2b374c !important;
}
html[data-theme="dark"] #faq .chfaq-plus::before,
html[data-theme="dark"] #faq .chfaq-plus::after {
background: #94a3b8 !important;
}
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
background: #111827 !important;
border-color: #263244 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
color: #64748b !important;
}
html[data-theme="dark"] .ch3-platform,
html[data-theme="dark"] .ch3-platform-card,
html[data-theme="dark"] .ch3-card {
background: #111827 !important;
border-color: #263244 !important;
color: #e5e7eb !important;
}
html[data-theme="dark"] .chf3 {
background: #0b1120 !important;
border-color: #1e293b !important;
}
html[data-theme="dark"] .chf3-logo {
color: #f8fafc !important;
}
html[data-theme="dark"] .chf3-brand > p {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-col h3 {
color: #e5e7eb !important;
}
html[data-theme="dark"] .chf3-col a {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-col a:hover {
color: #c7d2fe !important;
}
html[data-theme="dark"] .chf3-bottom {
border-color: #1e293b !important;
color: #64748b !important;
}
html[data-theme="dark"] .chf3-bottom-right a {
color: #94a3b8 !important;
}
html[data-theme="dark"] .chf3-language,
html[data-theme="dark"] .chf3-theme-toggle {
background: #111827 !important;
border-color: #263244 !important;
color: #cbd5e1 !important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background: #172033 !important;
border-color: #34445c !important;
color: #ffffff !important;
}
@media (prefers-reduced-motion: no-preference) {
body,
header,
main,
footer,
section,
article,
details,
input {
transition:
background-color .18s ease,
border-color .18s ease,
color .18s ease
!important;
}
}
.chf3-theme-toggle {
position: relative !important;
width: 34px !important;
height: 34px !important;
flex: 0 0 34px !important;
padding: 0 !important;
border:
1px solid #dfe5ee
!important;
border-radius:
9px
!important;
background:
linear-gradient(
180deg,
#ffffff 0%,
#f8fafc 100%
)
!important;
color:
#526176
!important;
box-shadow:
0 1px 2px rgba(15,23,42,.04),
0 4px 10px rgba(15,23,42,.035)
!important;
cursor:
pointer
!important;
overflow:
hidden
!important;
}
.chf3-theme-toggle .chf3-theme-moon {
display:
block
!important;
}
.chf3-theme-toggle .chf3-theme-sun {
display:
none
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-moon {
display:
none
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-sun {
display:
block
!important;
}
.chf3-theme-toggle .chf3-theme-moon,
.chf3-theme-toggle .chf3-theme-sun {
width:
15px
!important;
height:
15px
!important;
flex:
0 0 15px
!important;
color:
currentColor
!important;
}
.chf3-theme-toggle:hover {
background:
#f4f6fa
!important;
border-color:
#cbd5e1
!important;
color:
#111827
!important;
box-shadow:
0 2px 5px rgba(15,23,42,.07),
0 6px 14px rgba(15,23,42,.05)
!important;
transform:
translateY(-1px)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle {
background:
#111827
!important;
border-color:
#2b3749
!important;
color:
#e2e8f0
!important;
box-shadow:
0 1px 2px rgba(0,0,0,.18)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background:
#172033
!important;
border-color:
#3b4b63
!important;
color:
#ffffff
!important;
}
.chf3-bottom-right {
align-items:
center
!important;
}
.chf3-language {
min-height:
34px
!important;
box-sizing:
border-box
!important;
}
.chf3-theme-toggle {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
width: 44px !important;
height: 26px !important;
min-width: 44px !important;
min-height: 26px !important;
flex: 0 0 44px !important;
padding: 0 !important;
margin: 0 !important;
border:
1px solid #dce3ec
!important;
border-radius:
999px
!important;
background:
#edf1f6
!important;
color:
#526176
!important;
box-shadow:
inset 0 1px 2px rgba(15,23,42,.035)
!important;
cursor:
pointer
!important;
overflow:
hidden
!important;
transform:
none
!important;
transition:
background .2s ease,
border-color .2s ease
!important;
}
.chf3-theme-toggle::before {
content: "" !important;
position: absolute !important;
top: 3px !important;
left: 3px !important;
width: 18px !important;
height: 18px !important;
border-radius:
50%
!important;
background:
#ffffff
!important;
box-shadow:
0 1px 3px rgba(15,23,42,.18),
0 1px 1px rgba(15,23,42,.08)
!important;
transition:
transform .2s ease
!important;
z-index:
1
!important;
}
.chf3-theme-toggle .chf3-theme-moon,
.chf3-theme-toggle .chf3-theme-sun {
position: absolute !important;
top: 50% !important;
left: 6px !important;
width: 12px !important;
height: 12px !important;
margin: 0 !important;
transform:
translateY(-50%)
!important;
z-index:
2
!important;
pointer-events:
none
!important;
transition:
opacity .15s ease
!important;
}
.chf3-theme-toggle .chf3-theme-moon {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
color:
#475569
!important;
}
.chf3-theme-toggle .chf3-theme-sun {
display: block !important;
visibility: hidden !important;
opacity: 0 !important;
}
html[data-theme="dark"] .chf3-theme-toggle {
background:
#4f46e5
!important;
border-color:
#4f46e5
!important;
color:
#ffffff
!important;
box-shadow:
inset 0 1px 2px rgba(0,0,0,.12)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle::before {
transform:
translateX(18px)
!important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-moon {
display: block !important;
visibility: hidden !important;
opacity: 0 !important;
}
html[data-theme="dark"]
.chf3-theme-toggle
.chf3-theme-sun {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
left:
24px
!important;
color:
#4f46e5
!important;
}
.chf3-theme-toggle:hover {
transform:
none
!important;
border-color:
#c9d2df
!important;
box-shadow:
inset 0 1px 2px rgba(15,23,42,.04)
!important;
}
html[data-theme="dark"] .chf3-theme-toggle:hover {
background:
#4338ca
!important;
border-color:
#4338ca
!important;
}
.chf3-theme-toggle:focus-visible {
outline:
2px solid #818cf8
!important;
outline-offset:
2px
!important;
}
.chf3-bottom-right {
display: flex !important;
align-items: center !important;
}
.chf3-language {
height: 26px !important;
min-height: 26px !important;
display: inline-flex !important;
align-items: center !important;
padding:
0 9px
!important;
box-sizing:
border-box
!important;
}
/* chlak-theme-final-v3.css */
.chf3-bottom-right
> button.chf3-theme-toggle.ch-theme-final {
all: unset !important;
box-sizing: border-box !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 32px !important;
height: 28px !important;
min-width: 32px !important;
min-height: 28px !important;
flex: 0 0 32px !important;
margin: 0 !important;
padding: 0 !important;
border:
1px solid #e2e8f0
!important;
border-radius:
8px
!important;
background:
#ffffff
!important;
color:
#526176
!important;
box-shadow:
0 1px 2px rgba(15,23,42,.04)
!important;
cursor:
pointer
!important;
vertical-align:
middle
!important;
transition:
background-color .16s ease,
border-color .16s ease,
color .16s ease,
box-shadow .16s ease
!important;
}
.chf3-bottom-right
> button.chf3-theme-toggle.ch-theme-final::before,
.chf3-bottom-right
> button.chf3-theme-toggle.ch-theme-final::after {
content:
none
!important;
display:
none
!important;
}
.chf3-bottom-right
> button.chf3-theme-toggle.ch-theme-final
> svg.ch-theme-final-icon {
all:
unset
!important;
display:
block
!important;
position:
static
!important;
width:
15px
!important;
height:
15px
!important;
min-width:
15px
!important;
min-height:
15px
!important;
visibility:
visible
!important;
opacity:
1
!important;
color:
currentColor
!important;
transform:
none
!important;
pointer-events:
none
!important;
}
.chf3-bottom-right
> button.chf3-theme-toggle.ch-theme-final
path {
fill:
currentColor
!important;
}
html:not([data-theme="dark"])
.chf3-bottom-right
> button.ch-theme-final {
background:
#ffffff
!important;
border-color:
#e2e8f0
!important;
color:
#526176
!important;
}
html:not([data-theme="dark"])
.chf3-bottom-right
> button.ch-theme-final:hover {
background:
#f8fafc
!important;
border-color:
#cbd5e1
!important;
color:
#111827
!important;
}
html[data-theme="dark"]
.chf3-bottom-right
> button.ch-theme-final {
background:
#f8fafc
!important;
border-color:
#dce3ec
!important;
color:
#f59e0b
!important;
box-shadow:
0 1px 3px rgba(0,0,0,.22)
!important;
}
html[data-theme="dark"]
.chf3-bottom-right
> button.ch-theme-final:hover {
background:
#ffffff
!important;
border-color:
#cbd5e1
!important;
color:
#d97706
!important;
}
.chf3-bottom-right
> button.ch-theme-final:focus-visible {
outline:
2px solid #818cf8
!important;
outline-offset:
2px
!important;
}
.chf3-bottom-right {
display:
flex
!important;
align-items:
center
!important;
}
.chf3-bottom-right
.chf3-language {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
height:
28px
!important;
min-height:
28px
!important;
padding:
0 10px
!important;
margin:
0
!important;
border-radius:
8px
!important;
}
/* chlak-home-socials-v1.css */
.chf3-socials {
display:
flex
!important;
align-items:
center
!important;
flex-wrap:
wrap
!important;
gap:
8px
!important;
}
.chf3-social {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
width:
31px
!important;
height:
31px
!important;
flex:
0 0 31px
!important;
padding:
0
!important;
border:
0
!important;
border-radius:
9px
!important;
text-decoration:
none
!important;
box-shadow:
0 3px 8px rgba(15,23,42,.08)
!important;
transition:
transform .16s ease,
box-shadow .16s ease,
opacity .16s ease
!important;
}
.chf3-social:hover {
transform:
translateY(-2px)
!important;
box-shadow:
0 7px 16px rgba(15,23,42,.14)
!important;
}
.chf3-social:focus-visible {
outline:
2px solid #6366f1
!important;
outline-offset:
3px
!important;
}
.chf3-social img {
display:
block
!important;
width:
15px
!important;
height:
15px
!important;
object-fit:
contain
!important;
filter:
brightness(0) invert(1)
!important;
}
.chf3-ig {
background:
linear-gradient(
135deg,
#833ab4,
#e1306c 63%,
#f77737
)
!important;
}
.chf3-fb {
background:
#1877f2
!important;
}
.chf3-x {
background:
#111111
!important;
}
.chf3-tiktok {
background:
#111111
!important;
}
.chf3-youtube {
background:
#ff0033
!important;
}
.chf3-quora {
background:
#b92b27
!important;
}
@media (max-width: 650px) {
.chf3-socials {
gap:
9px
!important;
}
.chf3-social {
width:
34px
!important;
height:
34px
!important;
flex-basis:
34px
!important;
}
}
.chf3-social.chf3-quora {
padding: 0 !important;
overflow: hidden !important;
background: #b92b27 !important;
}
.chf3-social.chf3-quora img {
width: 31px !important;
height: 31px !important;
max-width: 31px !important;
max-height: 31px !important;
object-fit: cover !important;
border-radius: 9px !important;
filter: none !important;
opacity: 1 !important;
}
@media (max-width: 650px) {
.chf3-social.chf3-quora img {
width: 34px !important;
height: 34px !important;
max-width: 34px !important;
max-height: 34px !important;
}
}
.chf3-social.chf3-quora {
background: #b92b27 !important;
overflow: hidden !important;
}
.chf3-social.chf3-quora img {
width: 17px !important;
height: 17px !important;
max-width: 17px !important;
max-height: 17px !important;
object-fit: contain !important;
border-radius: 0 !important;
filter: brightness(0) invert(1) !important;
opacity: 1 !important;
}
@media (max-width: 650px) {
.chf3-social.chf3-quora img {
width: 18px !important;
height: 18px !important;
max-width: 18px !important;
max-height: 18px !important;
}
}
/* chlak-facebook-video-pro-v1.css */
body.ch-facebook-video-page
.hero {
position:
relative
!important;
overflow:
hidden
!important;
padding:
70px 0 56px
!important;
background:
radial-gradient(
circle at 50% 5%,
rgba(113,92,255,.13),
transparent 36%
),
radial-gradient(
circle at 82% 18%,
rgba(236,72,153,.08),
transparent 28%
),
#fbfcff
!important;
}
body.ch-facebook-video-page
.hero-inner {
width:
min(
1120px,
calc(100% - 48px)
)
!important;
max-width:
1120px
!important;
margin:
0 auto
!important;
text-align:
center
!important;
}
body.ch-facebook-video-page
.hero-chip {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
7px
!important;
min-height:
28px
!important;
padding:
5px 11px
!important;
border:
1px solid #e4e8f0
!important;
border-radius:
999px
!important;
background:
rgba(255,255,255,.82)
!important;
color:
#637083
!important;
font-size:
12px
!important;
font-weight:
700
!important;
box-shadow:
0 4px 14px rgba(15,23,42,.04)
!important;
}
body.ch-facebook-video-page
.hero-chip
.live {
width:
7px
!important;
height:
7px
!important;
border-radius:
50%
!important;
background:
#34d399
!important;
box-shadow:
0 0 0 4px rgba(52,211,153,.12)
!important;
}
body.ch-facebook-video-page
.hero h1 {
width:
min(1000px,100%)
!important;
margin:
24px auto 18px
!important;
font-size:
clamp(48px,6.1vw,76px)
!important;
font-weight:
850
!important;
line-height:
.98
!important;
letter-spacing:
-.055em
!important;
}
body.ch-facebook-video-page
.hero-line {
display:
block
!important;
}
body.ch-facebook-video-page
.hero h1
.hero-line:first-child {
color:
#111827
!important;
}
body.ch-facebook-video-page
.hero-gradient {
background:
linear-gradient(
90deg,
#7c3aed,
#c026d3 52%,
#ec4899
)
!important;
-webkit-background-clip:
text
!important;
background-clip:
text
!important;
color:
transparent
!important;
}
body.ch-facebook-video-page
.hero-copy {
width:
min(770px,100%)
!important;
margin:
0 auto
!important;
color:
#64748b
!important;
font-size:
16px
!important;
line-height:
1.72
!important;
}
body.ch-facebook-video-page
.hero-trust {
display:
flex
!important;
flex-wrap:
wrap
!important;
justify-content:
center
!important;
align-items:
center
!important;
gap:
9px 20px
!important;
max-width:
850px
!important;
margin:
18px auto 0
!important;
}
body.ch-facebook-video-page
.hero-trust span {
display:
inline-flex
!important;
align-items:
center
!important;
gap:
5px
!important;
color:
#667085
!important;
font-size:
12px
!important;
font-weight:
650
!important;
}
body.ch-facebook-video-page
.download-shell {
width:
min(850px,100%)
!important;
max-width:
850px
!important;
margin:
28px auto 0
!important;
padding:
0
!important;
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
body.ch-facebook-video-page
.fb-video-control {
width:
100%
!important;
margin:
0
!important;
padding:
7px
!important;
border:
1px solid #dfe4ec
!important;
border-radius:
20px
!important;
background:
rgba(255,255,255,.97)
!important;
box-shadow:
0 18px 45px rgba(15,23,42,.09),
0 2px 7px rgba(15,23,42,.035)
!important;
}
body.ch-facebook-video-page
.fb-video-row {
display:
flex
!important;
align-items:
center
!important;
width:
100%
!important;
gap:
7px
!important;
}
body.ch-facebook-video-page
.fb-video-input {
flex:
1 1 auto
!important;
min-width:
0
!important;
height:
58px
!important;
padding:
0 17px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#111827
!important;
font:
inherit
!important;
font-size:
17px
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
}
body.ch-facebook-video-page
.fb-video-input::placeholder {
color:
#94a3b8
!important;
opacity:
1
!important;
font-size:
16.5px
!important;
}
body.ch-facebook-video-page
.fb-video-input:focus {
box-shadow:
inset 0 0 0 1px #c4b5fd,
0 0 0 4px rgba(124,58,237,.08)
!important;
}
body.ch-facebook-video-page
.fb-video-paste {
flex:
0 0 76px
!important;
width:
76px
!important;
min-width:
76px
!important;
height:
46px
!important;
padding:
0 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
11px
!important;
background:
#fff
!important;
color:
#334155
!important;
font:
inherit
!important;
font-size:
13px
!important;
font-weight:
750
!important;
cursor:
pointer
!important;
}
body.ch-facebook-video-page
.fb-video-download {
flex:
0 0 145px
!important;
width:
145px
!important;
min-width:
145px
!important;
height:
58px
!important;
padding:
0 18px
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
linear-gradient(
135deg,
#8b5cf6,
#d946ef
)
!important;
color:
#fff
!important;
font:
inherit
!important;
font-size:
14px
!important;
font-weight:
800
!important;
box-shadow:
0 9px 23px rgba(168,85,247,.25)
!important;
}
body.ch-facebook-video-page
.fb-video-download[disabled] {
cursor:
not-allowed
!important;
opacity:
.62
!important;
filter:
saturate(.72)
!important;
}
body.ch-facebook-video-page
.download-meta {
width:
100%
!important;
margin:
10px 0 0
!important;
padding:
0 8px
!important;
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
color:
#748196
!important;
font-size:
12px
!important;
line-height:
1.55
!important;
text-align:
left
!important;
}
body.ch-facebook-video-page
.download-meta strong {
color:
#4b5563
!important;
font-weight:
700
!important;
}
body.ch-facebook-video-page
.guide-jump-links,
body.ch-facebook-video-page
.facebook-tool-links {
display:
flex
!important;
flex-wrap:
wrap
!important;
justify-content:
center
!important;
align-items:
center
!important;
gap:
8px
!important;
width:
min(850px,100%)
!important;
margin:
14px auto 0
!important;
}
body.ch-facebook-video-page
.guide-jump-links a,
body.ch-facebook-video-page
.facebook-tool-links a {
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
min-height:
34px
!important;
padding:
7px 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
999px
!important;
background:
rgba(255,255,255,.72)
!important;
color:
#5f6c80
!important;
font-size:
12px
!important;
font-weight:
650
!important;
line-height:
1
!important;
text-decoration:
none
!important;
}
body.ch-facebook-video-page
.facebook-tool-links {
margin-top:
9px
!important;
}
body.ch-facebook-video-page
.facebook-tool-links a[aria-current="page"] {
border-color:
#ddd6fe
!important;
background:
#f5f3ff
!important;
color:
#6d28d9
!important;
}
body.ch-facebook-video-page
main > .section,
body.ch-facebook-video-page
main > .section-tight {
padding:
58px 0
!important;
}
body.ch-facebook-video-page
main > .section > .container,
body.ch-facebook-video-page
main > .section-tight > .container,
body.ch-facebook-video-page
.tool-info > .container {
width:
min(
1120px,
calc(100% - 48px)
)
!important;
max-width:
1120px
!important;
margin:
0 auto
!important;
}
body.ch-facebook-video-page
.section-head {
display:
block
!important;
max-width:
920px
!important;
margin:
0 0 32px
!important;
}
body.ch-facebook-video-page
.section-head h2,
body.ch-facebook-video-page
.trust-copy h2 {
margin:
0
!important;
color:
#111827
!important;
font-size:
clamp(31px,3.25vw,45px)
!important;
font-weight:
800
!important;
line-height:
1.08
!important;
letter-spacing:
-.035em
!important;
}
body.ch-facebook-video-page
.section-description {
max-width:
800px
!important;
margin:
14px 0 0
!important;
color:
#64748b
!important;
font-size:
16px
!important;
line-height:
1.75
!important;
}
body.ch-facebook-video-page
.eyebrow {
margin-bottom:
10px
!important;
color:
#7c3aed
!important;
font-size:
11px
!important;
font-weight:
800
!important;
letter-spacing:
.13em
!important;
text-transform:
uppercase
!important;
}
body.ch-facebook-video-page
.steps {
display:
grid
!important;
grid-template-columns:
repeat(
3,
minmax(0,1fr)
)
!important;
gap:
18px
!important;
}
body.ch-facebook-video-page
.step {
height:
100%
!important;
min-height:
225px
!important;
padding:
27px
!important;
border:
1px solid #e4e9f1
!important;
border-radius:
21px
!important;
background:
#fff
!important;
box-shadow:
0 12px 34px rgba(15,23,42,.05)
!important;
}
body.ch-facebook-video-page
.step-number {
display:
grid
!important;
place-items:
center
!important;
width:
42px
!important;
height:
42px
!important;
border:
1px solid #ddd8ff
!important;
border-radius:
12px
!important;
background:
#f5f3ff
!important;
color:
#6d28d9
!important;
font-size:
12px
!important;
font-weight:
850
!important;
}
body.ch-facebook-video-page
.step h3 {
margin:
22px 0 10px
!important;
color:
#111827
!important;
font-size:
18px
!important;
font-weight:
760
!important;
line-height:
1.35
!important;
}
body.ch-facebook-video-page
.step p {
margin:
0
!important;
color:
#64748b
!important;
font-size:
14.5px
!important;
line-height:
1.72
!important;
}
body.ch-facebook-video-page
.trust-panel {
display:
grid
!important;
grid-template-columns:
minmax(0,1.5fr)
minmax(290px,.75fr)
!important;
gap:
22px
!important;
padding:
30px
!important;
border:
1px solid #e4e9f1
!important;
border-radius:
23px
!important;
background:
#fff
!important;
box-shadow:
0 14px 40px rgba(15,23,42,.05)
!important;
}
body.ch-facebook-video-page
.trust-copy p,
body.ch-facebook-video-page
.trust-side p {
color:
#64748b
!important;
line-height:
1.72
!important;
}
body.ch-facebook-video-page
.trust-points {
display:
grid
!important;
grid-template-columns:
repeat(
2,
minmax(0,1fr)
)
!important;
gap:
9px
!important;
margin-top:
20px
!important;
}
body.ch-facebook-video-page
.trust-point {
padding:
11px 13px
!important;
border:
1px solid #e7ebf2
!important;
border-radius:
11px
!important;
background:
#f8fafc
!important;
color:
#475569
!important;
font-size:
13px
!important;
font-weight:
650
!important;
}
body.ch-facebook-video-page
.trust-side {
display:
flex
!important;
flex-direction:
column
!important;
justify-content:
space-between
!important;
gap:
20px
!important;
padding:
23px
!important;
border:
1px solid #e4e1ff
!important;
border-radius:
18px
!important;
background:
#f8f7ff
!important;
}
body.ch-facebook-video-page
.trust-side h3 {
margin:
8px 0
!important;
color:
#111827
!important;
}
body.ch-facebook-video-page
.trust-side a {
color:
#6d28d9
!important;
font-weight:
750
!important;
text-decoration:
none
!important;
}
body.ch-facebook-video-page
.mapper {
display:
grid
!important;
grid-template-columns:
minmax(0,.9fr)
minmax(0,1.1fr)
!important;
gap:
22px
!important;
padding:
28px
!important;
border:
1px solid #e4e9f1
!important;
border-radius:
22px
!important;
background:
#fff
!important;
box-shadow:
0 12px 34px rgba(15,23,42,.045)
!important;
}
body.ch-facebook-video-page
.mapper-intro h3 {
margin:
0 0 12px
!important;
color:
#111827
!important;
}
body.ch-facebook-video-page
.mapper-intro p {
color:
#64748b
!important;
line-height:
1.72
!important;
}
body.ch-facebook-video-page
.mapper-table {
display:
grid
!important;
gap:
8px
!important;
}
body.ch-facebook-video-page
.map-row {
display:
grid
!important;
grid-template-columns:
minmax(0,1fr)
auto
!important;
gap:
16px
!important;
align-items:
center
!important;
min-height:
72px
!important;
padding:
14px 16px
!important;
border:
1px solid #e7ebf2
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#64748b
!important;
}
body.ch-facebook-video-page
.map-pattern {
color:
#1f2937
!important;
font-weight:
730
!important;
}
body.ch-facebook-video-page
.map-sub {
display:
block
!important;
margin-top:
4px
!important;
color:
#8491a4
!important;
font-size:
12px
!important;
font-weight:
500
!important;
}
body.ch-facebook-video-page
.map-row a {
color:
#6d28d9
!important;
font-weight:
700
!important;
text-decoration:
none
!important;
}
body.ch-facebook-video-page
.tool-info {
padding:
58px 0
!important;
}
body.ch-facebook-video-page
.tool-info > .container {
max-width:
900px
!important;
padding:
34px 38px
!important;
border:
1px solid #e5e9f0
!important;
border-radius:
23px
!important;
background:
#fff
!important;
box-shadow:
0 14px 40px rgba(15,23,42,.04)
!important;
}
body.ch-facebook-video-page
.tool-info h2 {
margin:
0 0 18px
!important;
color:
#111827
!important;
font-size:
clamp(30px,3.2vw,43px)
!important;
line-height:
1.1
!important;
letter-spacing:
-.035em
!important;
}
body.ch-facebook-video-page
.tool-info h3 {
margin:
30px 0 10px
!important;
color:
#1f2937
!important;
font-size:
20px
!important;
}
body.ch-facebook-video-page
.tool-info p {
color:
#64748b
!important;
line-height:
1.8
!important;
}
body.ch-facebook-video-page
#facebook-faq
.container {
width:
min(
1040px,
calc(100% - 48px)
)
!important;
max-width:
1040px
!important;
margin:
0 auto
!important;
}
body.ch-facebook-video-page
#facebook-faq
.section-head {
width:
min(900px,100%)
!important;
max-width:
900px
!important;
margin:
0 auto 30px
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq {
display:
grid
!important;
gap:
10px
!important;
width:
min(900px,100%)
!important;
margin:
0 auto
!important;
}
body.ch-facebook-video-page
#facebook-faq
details {
overflow:
hidden
!important;
border:
1px solid #e4e9f1
!important;
border-radius:
15px
!important;
background:
#fff
!important;
box-shadow:
0 7px 22px rgba(15,23,42,.035)
!important;
}
body.ch-facebook-video-page
#facebook-faq
summary {
padding:
18px 20px
!important;
color:
#172033
!important;
font-size:
15px
!important;
font-weight:
720
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq-answer {
padding:
0 20px 19px
!important;
color:
#64748b
!important;
font-size:
14.5px
!important;
line-height:
1.72
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.hero {
background:
radial-gradient(
circle at 50% 0,
rgba(99,102,241,.18),
transparent 37%
),
#0b1120
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.hero h1
.hero-line:first-child,
html[data-theme="dark"]
body.ch-facebook-video-page
.section-head h2,
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-copy h2,
html[data-theme="dark"]
body.ch-facebook-video-page
.tool-info h2 {
color:
#f8fafc
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.hero-copy,
html[data-theme="dark"]
body.ch-facebook-video-page
.hero-trust span,
html[data-theme="dark"]
body.ch-facebook-video-page
.section-description {
color:
#94a3b8
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.fb-video-control {
border-color:
#273244
!important;
background:
#111722
!important;
box-shadow:
0 20px 55px rgba(0,0,0,.22)
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.fb-video-input {
background:
#0c1320
!important;
color:
#f8fafc
!important;
box-shadow:
inset 0 0 0 1px #273244
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.fb-video-paste {
border-color:
#303b4f
!important;
background:
#171f2d
!important;
color:
#dbe3ee
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.download-meta {
color:
#78869a
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.download-meta strong {
color:
#a9b4c5
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.guide-jump-links a,
html[data-theme="dark"]
body.ch-facebook-video-page
.facebook-tool-links a {
border-color:
#273244
!important;
background:
rgba(15,23,42,.74)
!important;
color:
#9ca8bb
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.facebook-tool-links a[aria-current="page"] {
border-color:
#4c3f72
!important;
background:
#1b1732
!important;
color:
#c4b5fd
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.step,
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-panel,
html[data-theme="dark"]
body.ch-facebook-video-page
.mapper,
html[data-theme="dark"]
body.ch-facebook-video-page
.tool-info > .container,
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq details {
border-color:
#273244
!important;
background:
#111722
!important;
box-shadow:
none
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.step h3,
html[data-theme="dark"]
body.ch-facebook-video-page
.mapper-intro h3,
html[data-theme="dark"]
body.ch-facebook-video-page
.map-pattern,
html[data-theme="dark"]
body.ch-facebook-video-page
.tool-info h3,
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq summary {
color:
#f1f5f9
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.step p,
html[data-theme="dark"]
body.ch-facebook-video-page
.mapper-intro p,
html[data-theme="dark"]
body.ch-facebook-video-page
.tool-info p,
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-copy p,
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-side p,
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq .faq-answer {
color:
#8f9bae
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.step-number {
border-color:
#37305d
!important;
background:
#1b1732
!important;
color:
#c4b5fd
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-point,
html[data-theme="dark"]
body.ch-facebook-video-page
.map-row {
border-color:
#273244
!important;
background:
#0e1522
!important;
color:
#8f9bae
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-side {
border-color:
#37305d
!important;
background:
#17152a
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.trust-side h3 {
color:
#f1f5f9
!important;
}
@media (max-width:900px) {
body.ch-facebook-video-page
.trust-panel,
body.ch-facebook-video-page
.mapper {
grid-template-columns:
1fr
!important;
}
body.ch-facebook-video-page
.steps {
grid-template-columns:
1fr
!important;
}
}
@media (max-width:700px) {
body.ch-facebook-video-page
.hero {
padding:
52px 0 44px
!important;
}
body.ch-facebook-video-page
.hero-inner,
body.ch-facebook-video-page
main > .section > .container,
body.ch-facebook-video-page
main > .section-tight > .container,
body.ch-facebook-video-page
.tool-info > .container,
body.ch-facebook-video-page
#facebook-faq .container {
width:
calc(100% - 24px)
!important;
}
body.ch-facebook-video-page
.hero h1 {
font-size:
clamp(40px,12vw,57px)
!important;
}
body.ch-facebook-video-page
.fb-video-row {
display:
grid
!important;
grid-template-columns:
1fr auto
!important;
}
body.ch-facebook-video-page
.fb-video-input {
grid-column:
1 / -1
!important;
width:
100%
!important;
}
body.ch-facebook-video-page
.fb-video-paste {
width:
100%
!important;
min-width:
0
!important;
height:
50px
!important;
}
body.ch-facebook-video-page
.fb-video-download {
width:
100%
!important;
min-width:
0
!important;
height:
50px
!important;
}
body.ch-facebook-video-page
.trust-points {
grid-template-columns:
1fr
!important;
}
body.ch-facebook-video-page
.trust-panel,
body.ch-facebook-video-page
.mapper,
body.ch-facebook-video-page
.tool-info > .container {
padding:
23px
!important;
border-radius:
18px
!important;
}
body.ch-facebook-video-page
.map-row {
grid-template-columns:
1fr
!important;
gap:
8px
!important;
}
}
/* chlak-facebook-brand-faq-v1.css */
body.ch-facebook-video-page
.hero,
body.ch-facebook-reels-page
.hero {
background:
radial-gradient(
circle at 50% 5%,
rgba(24,119,242,.13),
transparent 36%
),
radial-gradient(
circle at 82% 18%,
rgba(8,102,255,.055),
transparent 28%
),
#fbfcff
!important;
}
body.ch-facebook-video-page
.hero-gradient,
body.ch-facebook-reels-page
.hero-gradient {
background:
linear-gradient(
90deg,
#1877f2 0%,
#1877f2 48%,
#0866ff 100%
)
!important;
background-image:
linear-gradient(
90deg,
#1877f2 0%,
#1877f2 48%,
#0866ff 100%
)
!important;
-webkit-background-clip:
text
!important;
background-clip:
text
!important;
color:
transparent
!important;
-webkit-text-fill-color:
transparent
!important;
}
body.ch-facebook-video-page
.fb-video-input:focus,
body.ch-facebook-reels-page
.fb-reels-input:focus {
box-shadow:
inset 0 0 0 1px rgba(24,119,242,.46),
0 0 0 4px rgba(24,119,242,.075)
!important;
}
body.ch-facebook-video-page
.fb-video-download,
body.ch-facebook-reels-page
.fb-reels-download {
background:
#1877f2
!important;
background-image:
none
!important;
color:
#ffffff
!important;
box-shadow:
0 9px 23px rgba(24,119,242,.20)
!important;
}
body.ch-facebook-video-page
.fb-video-download[disabled],
body.ch-facebook-reels-page
.fb-reels-download[disabled] {
cursor:
not-allowed
!important;
background:
#1877f2
!important;
background-image:
none
!important;
color:
#ffffff
!important;
filter:
saturate(.82)
!important;
}
body.ch-facebook-video-page
.facebook-tool-links a,
body.ch-facebook-reels-page
.facebook-tool-links a {
border-color:
#dfe5ee
!important;
background:
rgba(255,255,255,.82)
!important;
color:
#5f6c80
!important;
box-shadow:
none
!important;
}
body.ch-facebook-video-page
.facebook-tool-links a[aria-current="page"],
body.ch-facebook-reels-page
.facebook-tool-links a[aria-current="page"] {
border-color:
rgba(24,119,242,.22)
!important;
background:
rgba(24,119,242,.055)
!important;
color:
#1877f2
!important;
box-shadow:
0 4px 12px rgba(24,119,242,.055)
!important;
}
body.ch-facebook-video-page
.facebook-tool-links a[aria-current="page"]::before,
body.ch-facebook-reels-page
.facebook-tool-links a[aria-current="page"]::before {
content:
""
!important;
width:
6px
!important;
height:
6px
!important;
flex:
0 0 6px
!important;
margin-right:
7px
!important;
border-radius:
999px
!important;
background:
#1877f2
!important;
box-shadow:
0 0 0 3px rgba(24,119,242,.065)
!important;
}
body.ch-facebook-video-page
.eyebrow,
body.ch-facebook-reels-page
.eyebrow {
color:
#1877f2
!important;
}
body.ch-facebook-video-page
.step-number,
body.ch-facebook-reels-page
.step-number {
border-color:
rgba(24,119,242,.17)
!important;
background:
rgba(24,119,242,.050)
!important;
color:
#1877f2
!important;
}
body.ch-facebook-video-page
.trust-side a,
body.ch-facebook-video-page
.map-row a,
body.ch-facebook-reels-page
.trust-side a,
body.ch-facebook-reels-page
.map-row a {
color:
#1877f2
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq {
counter-reset:
facebookFAQ
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details {
counter-increment:
facebookFAQ
!important;
overflow:
hidden
!important;
border:
1px solid #e4e9f1
!important;
border-radius:
15px
!important;
background:
#ffffff
!important;
box-shadow:
0 7px 22px rgba(15,23,42,.035)
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary {
display:
grid
!important;
grid-template-columns:
34px minmax(0,1fr) 22px
!important;
align-items:
center
!important;
column-gap:
16px
!important;
min-height:
64px
!important;
padding:
10px 18px
!important;
list-style:
none
!important;
color:
#172033
!important;
font-size:
15px
!important;
font-weight:
720
!important;
cursor:
pointer
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::-webkit-details-marker,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::-webkit-details-marker {
display:
none
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::marker,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::marker {
content:
""
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::before,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::before {
content:
counter(
facebookFAQ,
decimal-leading-zero
)
!important;
display:
grid
!important;
place-items:
center
!important;
width:
32px
!important;
height:
32px
!important;
border:
1px solid rgba(24,119,242,.17)
!important;
border-radius:
10px
!important;
background:
rgba(24,119,242,.035)
!important;
color:
#1877f2
!important;
font-family:
ui-monospace,
SFMono-Regular,
Menlo,
Monaco,
Consolas,
monospace
!important;
font-size:
10px
!important;
font-weight:
700
!important;
line-height:
1
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::after,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::after {
content:
"+"
!important;
display:
grid
!important;
place-items:
center
!important;
width:
22px
!important;
min-width:
22px
!important;
height:
22px
!important;
min-height:
22px
!important;
border:
0
!important;
border-radius:
50%
!important;
background:
#f8fafc
!important;
color:
#64748b
!important;
font-family:
Arial,
Helvetica,
sans-serif
!important;
font-size:
14px
!important;
font-weight:
400
!important;
line-height:
1
!important;
text-align:
center
!important;
box-shadow:
none
!important;
transform:
none
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details[open] > summary::after,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details[open] > summary::after {
content:
"−"
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details
.faq-answer,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details
.faq-answer {
padding:
0 20px 19px
!important;
color:
#64748b
!important;
font-size:
14.5px
!important;
line-height:
1.72
!important;
border-top:
1px solid rgba(226,232,240,.72)
!important;
}
body.ch-facebook-video-page
#facebook-faq
.faq > details[open],
body.ch-facebook-video-page
#facebook-faq
.faq > details:hover,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details[open],
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details:hover {
border-color:
rgba(24,119,242,.14)
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.hero,
html[data-theme="dark"]
body.ch-facebook-reels-page
.hero {
background:
radial-gradient(
circle at 50% 0,
rgba(24,119,242,.18),
transparent 37%
),
#0b1120
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.hero-gradient,
html[data-theme="dark"]
body.ch-facebook-reels-page
.hero-gradient {
background:
linear-gradient(
90deg,
#60a5fa,
#3b82f6 55%,
#1877f2
)
!important;
-webkit-background-clip:
text
!important;
background-clip:
text
!important;
color:
transparent
!important;
-webkit-text-fill-color:
transparent
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.facebook-tool-links a[aria-current="page"],
html[data-theme="dark"]
body.ch-facebook-reels-page
.facebook-tool-links a[aria-current="page"] {
border-color:
rgba(96,165,250,.30)
!important;
background:
rgba(24,119,242,.12)
!important;
color:
#93c5fd
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.step-number,
html[data-theme="dark"]
body.ch-facebook-reels-page
.step-number {
border-color:
rgba(96,165,250,.24)
!important;
background:
rgba(24,119,242,.12)
!important;
color:
#93c5fd
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq
.faq > details,
html[data-theme="dark"]
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details {
border-color:
rgba(148,163,184,.16)
!important;
background:
rgba(15,23,42,.78)
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary,
html[data-theme="dark"]
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary {
color:
#f1f5f9
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::before,
html[data-theme="dark"]
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::before {
border-color:
rgba(96,165,250,.28)
!important;
background:
rgba(24,119,242,.10)
!important;
color:
#93c5fd
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary::after,
html[data-theme="dark"]
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary::after {
background:
#172033
!important;
color:
#94a3b8
!important;
}
@media (max-width:650px) {
body.ch-facebook-video-page
#facebook-faq
.faq > details > summary,
body.ch-facebook-reels-page
#facebook-reel-faq
.faq > details > summary {
grid-template-columns:
32px minmax(0,1fr) 22px
!important;
column-gap:
10px
!important;
padding:
10px 12px
!important;
}
}
/* chlak-tool-control-tiktok-geometry-v1.css */
body.ch-video-page,
body.ch-reels-page,
body.ch-photo-page,
body.ch-story-page,
body.ch-carousel-page,
body.ch-post-page,
body.ch-profile-page,
body.ch-viewer-page,
body.ch-audio-page,
body.ch-unfollowers-page,
body.ch-block-checker-page,
body.ch-profile-picture-page {
--tool-action-bg:
linear-gradient(
135deg,
#f58529 0%,
#dd2a7b 38%,
#8134af 70%,
#515bd4 100%
);
--tool-action-shadow:
0 10px 25px rgba(193,53,132,.20);
--tool-focus:
#dd2a7b;
--tool-focus-ring:
rgba(221,42,123,.08);
}
body.ch-facebook-video-page,
body.ch-facebook-reels-page {
--tool-action-bg:
#1877f2;
--tool-action-shadow:
0 10px 25px rgba(24,119,242,.20);
--tool-focus:
#1877f2;
--tool-focus-ring:
rgba(24,119,242,.08);
}
body.ch-pinterest-video-page,
body.ch-pinterest-image-page {
--tool-action-bg:
#e60023;
--tool-action-shadow:
0 10px 25px rgba(230,0,35,.18);
--tool-focus:
#e60023;
--tool-focus-ring:
rgba(230,0,35,.07);
}
body.ch-tiktok-downloader-page,
body.ch-tiktok-mp3-page,
body.ch-tiktok-photo-page,
body.ch-tiktok-story-page,
body.ch-tiktok-profile-page {
--tool-action-bg:
#111827;
--tool-action-shadow:
0 10px 25px rgba(15,23,42,.20);
--tool-focus:
#64748b;
--tool-focus-ring:
rgba(15,23,42,.06);
}
body.ch-youtube-home-sync,
body.ch-youtube-mp4-home-sync,
body.ch-youtube-shorts-home-sync,
body.ch-youtube-transcript-home-sync,
body.ch-youtube-subtitle-home-sync,
body.ch-youtube-hashtag-home-sync {
--tool-action-bg:
#e5484d;
--tool-action-shadow:
0 10px 25px rgba(229,72,77,.20);
--tool-focus:
#e5484d;
--tool-focus-ring:
rgba(229,72,77,.08);
}
body.ch-video-page .ch3-downloader,
body.ch-reels-page .ch3-downloader,
body.ch-photo-page .ch3-downloader,
body.ch-story-page .ch3-downloader,
body.ch-carousel-page .ch3-downloader,
body.ch-post-page .ch3-downloader,
body.ch-profile-page .ch3-downloader,
body.ch-viewer-page .ch3-downloader,
body.ch-audio-page .ch3-downloader,
body.ch-unfollowers-page .ch3-downloader,
body.ch-profile-picture-page .ch3-downloader,
body.ch-tiktok-downloader-page .ch3-downloader,
body.ch-tiktok-mp3-page .ch3-downloader,
body.ch-tiktok-photo-page .ch3-downloader,
body.ch-tiktok-story-page .ch3-downloader,
body.ch-tiktok-profile-page .ch3-downloader,
body.ch-youtube-home-sync .ch3-downloader,
body.ch-youtube-mp4-home-sync .ch3-downloader,
body.ch-youtube-shorts-home-sync .ch3-downloader,
body.ch-youtube-transcript-home-sync .ch3-downloader,
body.ch-youtube-subtitle-home-sync .ch3-downloader,
body.ch-youtube-hashtag-home-sync .ch3-downloader {
box-sizing:
border-box
!important;
width:
min(850px,100%)
!important;
max-width:
850px
!important;
margin-left:
auto
!important;
margin-right:
auto
!important;
}
body.ch-video-page .ch3-url-row,
body.ch-reels-page .ch3-url-row,
body.ch-photo-page .ch3-url-row,
body.ch-story-page .ch3-url-row,
body.ch-carousel-page .ch3-url-row,
body.ch-post-page .ch3-url-row,
body.ch-profile-page .ch3-url-row,
body.ch-viewer-page .ch3-url-row,
body.ch-audio-page .ch3-url-row,
body.ch-unfollowers-page .ch3-url-row,
body.ch-profile-picture-page .ch3-url-row,
body.ch-tiktok-downloader-page .ch3-url-row,
body.ch-tiktok-mp3-page .ch3-url-row,
body.ch-tiktok-photo-page .ch3-url-row,
body.ch-tiktok-story-page .ch3-url-row,
body.ch-tiktok-profile-page .ch3-url-row,
body.ch-youtube-home-sync .ch3-url-row,
body.ch-youtube-mp4-home-sync .ch3-url-row,
body.ch-youtube-shorts-home-sync .ch3-url-row,
body.ch-youtube-transcript-home-sync .ch3-url-row,
body.ch-youtube-subtitle-home-sync .ch3-url-row,
body.ch-youtube-hashtag-home-sync .ch3-url-row {
box-sizing:
border-box
!important;
display:
flex
!important;
align-items:
center
!important;
width:
100%
!important;
min-height:
72px
!important;
margin:
0
!important;
padding:
7px
!important;
gap:
7px
!important;
border:
1px solid rgba(148,163,184,.34)
!important;
border-radius:
20px
!important;
background:
rgba(255,255,255,.97)
!important;
box-shadow:
0 18px 45px rgba(15,23,42,.09),
0 2px 7px rgba(15,23,42,.035)
!important;
}
body.ch-video-page .ch3-url-row > .ch3-url-input,
body.ch-reels-page .ch3-url-row > .ch3-url-input,
body.ch-photo-page .ch3-url-row > .ch3-url-input,
body.ch-story-page .ch3-url-row > .ch3-url-input,
body.ch-carousel-page .ch3-url-row > .ch3-url-input,
body.ch-post-page .ch3-url-row > .ch3-url-input,
body.ch-unfollowers-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-downloader-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-mp3-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-photo-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-story-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-profile-page .ch3-url-row > .ch3-url-input,
body.ch-youtube-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-mp4-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-shorts-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-transcript-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-subtitle-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-hashtag-home-sync .ch3-url-row > .ch3-url-input {
box-sizing:
border-box
!important;
display:
block
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
width:
auto
!important;
height:
58px
!important;
margin:
0
!important;
padding:
0 17px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#111827
!important;
font-family:
inherit
!important;
font-size:
17px
!important;
font-weight:
450
!important;
line-height:
normal
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
opacity:
1
!important;
}
body.ch-video-page .ch3-url-input::placeholder,
body.ch-reels-page .ch3-url-input::placeholder,
body.ch-photo-page .ch3-url-input::placeholder,
body.ch-story-page .ch3-url-input::placeholder,
body.ch-carousel-page .ch3-url-input::placeholder,
body.ch-post-page .ch3-url-input::placeholder,
body.ch-profile-page .ch3-url-input::placeholder,
body.ch-viewer-page .ch3-url-input::placeholder,
body.ch-audio-page .ch3-url-input::placeholder,
body.ch-unfollowers-page .ch3-url-input::placeholder,
body.ch-profile-picture-page .ch3-url-input::placeholder,
body.ch-tiktok-downloader-page .ch3-url-input::placeholder,
body.ch-tiktok-mp3-page .ch3-url-input::placeholder,
body.ch-tiktok-photo-page .ch3-url-input::placeholder,
body.ch-tiktok-story-page .ch3-url-input::placeholder,
body.ch-tiktok-profile-page .ch3-url-input::placeholder,
body.ch-youtube-home-sync .ch3-url-input::placeholder,
body.ch-youtube-mp4-home-sync .ch3-url-input::placeholder,
body.ch-youtube-shorts-home-sync .ch3-url-input::placeholder,
body.ch-youtube-transcript-home-sync .ch3-url-input::placeholder,
body.ch-youtube-subtitle-home-sync .ch3-url-input::placeholder,
body.ch-youtube-hashtag-home-sync .ch3-url-input::placeholder {
color:
#94a3b8
!important;
opacity:
1
!important;
font-size:
16.5px
!important;
font-weight:
450
!important;
}
body.ch-profile-page .ch3-url-row > .url-wrap,
body.ch-profile-picture-page .ch3-url-row > .url-wrap,
body.ch-viewer-page .ch3-url-row > .url-wrap,
body.ch-audio-page .ch3-url-row > .audio-url-field {
box-sizing:
border-box
!important;
display:
flex
!important;
align-items:
center
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
width:
auto
!important;
height:
58px
!important;
margin:
0
!important;
padding:
0
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
}
body.ch-profile-page .url-wrap .ch3-url-input,
body.ch-profile-picture-page .url-wrap .ch3-url-input,
body.ch-viewer-page .url-wrap .ch3-url-input,
body.ch-audio-page .audio-url-field .ch3-url-input {
box-sizing:
border-box
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
width:
100%
!important;
height:
58px
!important;
margin:
0
!important;
padding-top:
0
!important;
padding-bottom:
0
!important;
border:
0
!important;
outline:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
color:
#111827
!important;
font-size:
17px
!important;
}
body.ch-video-page .ch3-url-input:focus,
body.ch-reels-page .ch3-url-input:focus,
body.ch-photo-page .ch3-url-input:focus,
body.ch-story-page .ch3-url-input:focus,
body.ch-carousel-page .ch3-url-input:focus,
body.ch-post-page .ch3-url-input:focus,
body.ch-unfollowers-page .ch3-url-input:focus,
body.ch-tiktok-downloader-page .ch3-url-input:focus,
body.ch-tiktok-mp3-page .ch3-url-input:focus,
body.ch-tiktok-photo-page .ch3-url-input:focus,
body.ch-tiktok-story-page .ch3-url-input:focus,
body.ch-tiktok-profile-page .ch3-url-input:focus,
body.ch-youtube-home-sync .ch3-url-input:focus,
body.ch-youtube-mp4-home-sync .ch3-url-input:focus,
body.ch-youtube-shorts-home-sync .ch3-url-input:focus,
body.ch-youtube-transcript-home-sync .ch3-url-input:focus,
body.ch-youtube-subtitle-home-sync .ch3-url-input:focus,
body.ch-youtube-hashtag-home-sync .ch3-url-input:focus {
box-shadow:
inset 0 0 0 1px var(--tool-focus),
0 0 0 4px var(--tool-focus-ring)
!important;
}
body.ch-profile-page .url-wrap:focus-within,
body.ch-profile-picture-page .url-wrap:focus-within,
body.ch-viewer-page .url-wrap:focus-within,
body.ch-audio-page .audio-url-field:focus-within {
box-shadow:
inset 0 0 0 1px var(--tool-focus),
0 0 0 4px var(--tool-focus-ring)
!important;
}
body.ch-video-page .ch3-paste-btn,
body.ch-reels-page .ch3-paste-btn,
body.ch-photo-page .ch3-paste-btn,
body.ch-story-page .ch3-paste-btn,
body.ch-carousel-page .ch3-paste-btn,
body.ch-post-page .ch3-paste-btn,
body.ch-profile-page .ch3-paste-btn,
body.ch-viewer-page .ch3-paste-btn,
body.ch-audio-page .ch3-paste-btn,
body.ch-unfollowers-page .ch3-paste-btn,
body.ch-profile-picture-page .ch3-paste-btn,
body.ch-tiktok-downloader-page #tiktokPaste,
body.ch-tiktok-mp3-page #tiktokMp3Paste,
body.ch-tiktok-photo-page #tiktokPhotoPaste,
body.ch-tiktok-story-page #tiktokStoryPaste,
body.ch-tiktok-profile-page #tiktokProfilePaste,
body.ch-youtube-home-sync .ch3-paste-btn,
body.ch-youtube-mp4-home-sync .ch3-paste-btn,
body.ch-youtube-shorts-home-sync .ch3-paste-btn,
body.ch-youtube-transcript-home-sync .ch3-paste-btn,
body.ch-youtube-subtitle-home-sync .ch3-paste-btn,
body.ch-youtube-hashtag-home-sync .ch3-paste-btn {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 76px
!important;
width:
76px
!important;
min-width:
76px
!important;
height:
46px
!important;
margin:
0
!important;
padding:
0 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
11px
!important;
background:
#ffffff
!important;
color:
#334155
!important;
font-family:
inherit
!important;
font-size:
13px
!important;
font-weight:
750
!important;
line-height:
1
!important;
white-space:
nowrap
!important;
box-shadow:
none
!important;
}
body.ch-video-page .ch3-download-btn,
body.ch-reels-page .ch3-download-btn,
body.ch-photo-page .ch3-download-btn,
body.ch-story-page .ch3-download-btn,
body.ch-carousel-page .ch3-download-btn,
body.ch-post-page .ch3-download-btn,
body.ch-profile-page .ch3-download-btn,
body.ch-viewer-page .ch3-download-btn,
body.ch-audio-page .ch3-download-btn,
body.ch-unfollowers-page .ch3-download-btn,
body.ch-profile-picture-page .ch3-download-btn,
body.ch-tiktok-downloader-page .ch3-download-btn,
body.ch-tiktok-mp3-page .ch3-download-btn,
body.ch-tiktok-photo-page .ch3-download-btn,
body.ch-tiktok-story-page .ch3-download-btn,
body.ch-tiktok-profile-page .ch3-download-btn,
body.ch-youtube-home-sync .ch3-download-btn,
body.ch-youtube-mp4-home-sync .ch3-download-btn,
body.ch-youtube-shorts-home-sync .ch3-download-btn,
body.ch-youtube-transcript-home-sync .ch3-download-btn,
body.ch-youtube-subtitle-home-sync .ch3-download-btn,
body.ch-youtube-hashtag-home-sync .ch3-download-btn {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 auto
!important;
width:
auto
!important;
min-width:
145px
!important;
height:
58px
!important;
margin:
0
!important;
padding:
0 18px
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
var(--tool-action-bg)
!important;
background-image:
var(--tool-action-bg)
!important;
color:
#ffffff
!important;
font-family:
inherit
!important;
font-size:
14px
!important;
font-weight:
800
!important;
line-height:
1
!important;
white-space:
nowrap
!important;
box-shadow:
var(--tool-action-shadow)
!important;
}
body .ch3-download-btn[disabled],
body .ch3-paste-btn[disabled] {
cursor:
not-allowed
!important;
}
body.ch-facebook-video-page .fb-video-control,
body.ch-facebook-reels-page .fb-reels-control {
box-sizing:
border-box
!important;
width:
min(850px,100%)
!important;
max-width:
850px
!important;
margin:
0 auto
!important;
}
body.ch-facebook-video-page .fb-video-row,
body.ch-facebook-reels-page .fb-reels-row {
box-sizing:
border-box
!important;
display:
flex
!important;
align-items:
center
!important;
width:
100%
!important;
min-height:
72px
!important;
padding:
7px
!important;
gap:
7px
!important;
border:
1px solid rgba(148,163,184,.34)
!important;
border-radius:
20px
!important;
background:
rgba(255,255,255,.97)
!important;
box-shadow:
0 18px 45px rgba(15,23,42,.09),
0 2px 7px rgba(15,23,42,.035)
!important;
}
body.ch-facebook-video-page .fb-video-input,
body.ch-facebook-reels-page .fb-reels-input {
box-sizing:
border-box
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
width:
auto
!important;
height:
58px
!important;
padding:
0 17px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#111827
!important;
font-size:
17px
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
}
body.ch-facebook-video-page .fb-video-input::placeholder,
body.ch-facebook-reels-page .fb-reels-input::placeholder {
color:
#94a3b8
!important;
opacity:
1
!important;
font-size:
16.5px
!important;
}
body.ch-facebook-video-page .fb-video-input:focus,
body.ch-facebook-reels-page .fb-reels-input:focus {
box-shadow:
inset 0 0 0 1px var(--tool-focus),
0 0 0 4px var(--tool-focus-ring)
!important;
}
body.ch-facebook-video-page .fb-video-paste,
body.ch-facebook-reels-page .fb-reels-paste {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 76px
!important;
width:
76px
!important;
min-width:
76px
!important;
height:
46px
!important;
padding:
0 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
11px
!important;
background:
#ffffff
!important;
color:
#334155
!important;
font-size:
13px
!important;
font-weight:
750
!important;
}
body.ch-facebook-video-page .fb-video-download,
body.ch-facebook-reels-page .fb-reels-download {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
min-width:
145px
!important;
height:
58px
!important;
padding:
0 18px
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
var(--tool-action-bg)
!important;
background-image:
none
!important;
color:
#ffffff
!important;
font-size:
14px
!important;
font-weight:
800
!important;
box-shadow:
var(--tool-action-shadow)
!important;
}
body.ch-pinterest-video-page .pin-video-control,
body.ch-pinterest-image-page .pin-image-control {
box-sizing:
border-box
!important;
width:
min(850px,100%)
!important;
max-width:
850px
!important;
margin:
0 auto
!important;
}
body.ch-pinterest-video-page .pin-video-row,
body.ch-pinterest-image-page .pin-image-row {
box-sizing:
border-box
!important;
display:
flex
!important;
align-items:
center
!important;
width:
100%
!important;
min-height:
72px
!important;
padding:
7px
!important;
gap:
7px
!important;
border:
1px solid rgba(148,163,184,.34)
!important;
border-radius:
20px
!important;
background:
rgba(255,255,255,.97)
!important;
box-shadow:
0 18px 45px rgba(15,23,42,.09),
0 2px 7px rgba(15,23,42,.035)
!important;
}
body.ch-pinterest-video-page .pin-video-input,
body.ch-pinterest-image-page .pin-image-input {
box-sizing:
border-box
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
height:
58px
!important;
padding:
0 17px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#111827
!important;
font-size:
17px
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
}
body.ch-pinterest-video-page .pin-video-input::placeholder,
body.ch-pinterest-image-page .pin-image-input::placeholder {
color:
#94a3b8
!important;
opacity:
1
!important;
font-size:
16.5px
!important;
}
body.ch-pinterest-video-page .pin-video-input:focus,
body.ch-pinterest-image-page .pin-image-input:focus {
box-shadow:
inset 0 0 0 1px var(--tool-focus),
0 0 0 4px var(--tool-focus-ring)
!important;
}
body.ch-pinterest-video-page .pin-video-paste,
body.ch-pinterest-image-page .pin-image-paste {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 76px
!important;
width:
76px
!important;
min-width:
76px
!important;
height:
46px
!important;
padding:
0 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
11px
!important;
background:
#ffffff
!important;
color:
#334155
!important;
font-size:
13px
!important;
font-weight:
750
!important;
}
body.ch-pinterest-video-page .pin-video-download,
body.ch-pinterest-image-page .pin-image-download {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
min-width:
145px
!important;
height:
58px
!important;
padding:
0 18px
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
#e60023
!important;
background-image:
none
!important;
color:
#ffffff
!important;
font-size:
14px
!important;
font-weight:
800
!important;
box-shadow:
var(--tool-action-shadow)
!important;
}
body.ch-video-page .ch3-paste-btn:not(:disabled):hover,
body.ch-reels-page .ch3-paste-btn:not(:disabled):hover,
body.ch-photo-page .ch3-paste-btn:not(:disabled):hover,
body.ch-story-page .ch3-paste-btn:not(:disabled):hover,
body.ch-carousel-page .ch3-paste-btn:not(:disabled):hover,
body.ch-post-page .ch3-paste-btn:not(:disabled):hover,
body.ch-profile-page .ch3-paste-btn:not(:disabled):hover,
body.ch-viewer-page .ch3-paste-btn:not(:disabled):hover,
body.ch-audio-page .ch3-paste-btn:not(:disabled):hover,
body.ch-profile-picture-page .ch3-paste-btn:not(:disabled):hover,
body.ch-facebook-video-page .fb-video-paste:not(:disabled):hover,
body.ch-facebook-reels-page .fb-reels-paste:not(:disabled):hover,
body.ch-pinterest-video-page .pin-video-paste:not(:disabled):hover,
body.ch-pinterest-image-page .pin-image-paste:not(:disabled):hover,
body.ch-tiktok-downloader-page #tiktokPaste:not(:disabled):hover,
body.ch-tiktok-mp3-page #tiktokMp3Paste:not(:disabled):hover,
body.ch-tiktok-photo-page #tiktokPhotoPaste:not(:disabled):hover,
body.ch-tiktok-story-page #tiktokStoryPaste:not(:disabled):hover,
body.ch-tiktok-profile-page #tiktokProfilePaste:not(:disabled):hover,
body.ch-youtube-home-sync .ch3-paste-btn:not(:disabled):hover,
body.ch-youtube-mp4-home-sync .ch3-paste-btn:not(:disabled):hover,
body.ch-youtube-shorts-home-sync .ch3-paste-btn:not(:disabled):hover,
body.ch-youtube-transcript-home-sync .ch3-paste-btn:not(:disabled):hover,
body.ch-youtube-subtitle-home-sync .ch3-paste-btn:not(:disabled):hover,
body.ch-youtube-hashtag-home-sync .ch3-paste-btn:not(:disabled):hover {
border-color:
#cbd5e1
!important;
background:
#f8fafc
!important;
}
html[data-theme="dark"]
body .ch3-url-row,
html[data-theme="dark"]
body.ch-facebook-video-page .fb-video-row,
html[data-theme="dark"]
body.ch-facebook-reels-page .fb-reels-row,
html[data-theme="dark"]
body.ch-pinterest-video-page .pin-video-row,
html[data-theme="dark"]
body.ch-pinterest-image-page .pin-image-row {
border-color:
#334155
!important;
background:
rgba(15,23,42,.97)
!important;
box-shadow:
0 18px 45px rgba(0,0,0,.22)
!important;
}
html[data-theme="dark"]
body .ch3-url-row > .ch3-url-input,
html[data-theme="dark"]
body.ch-facebook-video-page .fb-video-input,
html[data-theme="dark"]
body.ch-facebook-reels-page .fb-reels-input,
html[data-theme="dark"]
body.ch-pinterest-video-page .pin-video-input,
html[data-theme="dark"]
body.ch-pinterest-image-page .pin-image-input,
html[data-theme="dark"]
body.ch-profile-page .url-wrap,
html[data-theme="dark"]
body.ch-profile-picture-page .url-wrap,
html[data-theme="dark"]
body.ch-viewer-page .url-wrap,
html[data-theme="dark"]
body.ch-audio-page .audio-url-field {
background:
#111827
!important;
color:
#e5e7eb
!important;
box-shadow:
inset 0 0 0 1px #273449
!important;
}
html[data-theme="dark"]
body .ch3-paste-btn,
html[data-theme="dark"]
body.ch-facebook-video-page .fb-video-paste,
html[data-theme="dark"]
body.ch-facebook-reels-page .fb-reels-paste,
html[data-theme="dark"]
body.ch-pinterest-video-page .pin-video-paste,
html[data-theme="dark"]
body.ch-pinterest-image-page .pin-image-paste,
html[data-theme="dark"]
body.ch-tiktok-mp3-page #tiktokMp3Paste,
html[data-theme="dark"]
body.ch-tiktok-photo-page #tiktokPhotoPaste,
html[data-theme="dark"]
body.ch-tiktok-story-page #tiktokStoryPaste,
html[data-theme="dark"]
body.ch-tiktok-profile-page #tiktokProfilePaste {
border-color:
#334155
!important;
background:
#111827
!important;
color:
#e2e8f0
!important;
}
@media (max-width:700px) {
body.ch-video-page .ch3-url-row,
body.ch-reels-page .ch3-url-row,
body.ch-photo-page .ch3-url-row,
body.ch-story-page .ch3-url-row,
body.ch-carousel-page .ch3-url-row,
body.ch-post-page .ch3-url-row,
body.ch-profile-page .ch3-url-row,
body.ch-viewer-page .ch3-url-row,
body.ch-audio-page .ch3-url-row,
body.ch-unfollowers-page .ch3-url-row,
body.ch-profile-picture-page .ch3-url-row,
body.ch-tiktok-downloader-page .ch3-url-row,
body.ch-tiktok-mp3-page .ch3-url-row,
body.ch-tiktok-photo-page .ch3-url-row,
body.ch-tiktok-story-page .ch3-url-row,
body.ch-tiktok-profile-page .ch3-url-row,
body.ch-youtube-home-sync .ch3-url-row,
body.ch-youtube-mp4-home-sync .ch3-url-row,
body.ch-youtube-shorts-home-sync .ch3-url-row,
body.ch-youtube-transcript-home-sync .ch3-url-row,
body.ch-youtube-subtitle-home-sync .ch3-url-row,
body.ch-youtube-hashtag-home-sync .ch3-url-row,
body.ch-facebook-video-page .fb-video-row,
body.ch-facebook-reels-page .fb-reels-row,
body.ch-pinterest-video-page .pin-video-row,
body.ch-pinterest-image-page .pin-image-row {
display:
grid
!important;
grid-template-columns:
minmax(105px,.8fr)
minmax(145px,1.2fr)
!important;
gap:
7px
!important;
}
body.ch-video-page .ch3-url-row > .ch3-url-input,
body.ch-reels-page .ch3-url-row > .ch3-url-input,
body.ch-photo-page .ch3-url-row > .ch3-url-input,
body.ch-story-page .ch3-url-row > .ch3-url-input,
body.ch-carousel-page .ch3-url-row > .ch3-url-input,
body.ch-post-page .ch3-url-row > .ch3-url-input,
body.ch-unfollowers-page .ch3-url-row > .ch3-url-input,
body.ch-profile-page .ch3-url-row > .url-wrap,
body.ch-profile-picture-page .ch3-url-row > .url-wrap,
body.ch-viewer-page .ch3-url-row > .url-wrap,
body.ch-audio-page .ch3-url-row > .audio-url-field,
body.ch-tiktok-downloader-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-mp3-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-photo-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-story-page .ch3-url-row > .ch3-url-input,
body.ch-tiktok-profile-page .ch3-url-row > .ch3-url-input,
body.ch-youtube-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-mp4-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-shorts-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-transcript-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-subtitle-home-sync .ch3-url-row > .ch3-url-input,
body.ch-youtube-hashtag-home-sync .ch3-url-row > .ch3-url-input,
body.ch-facebook-video-page .fb-video-input,
body.ch-facebook-reels-page .fb-reels-input,
body.ch-pinterest-video-page .pin-video-input,
body.ch-pinterest-image-page .pin-image-input {
grid-column:
1 / -1
!important;
width:
100%
!important;
height:
55px
!important;
}
body.ch-video-page .ch3-paste-btn,
body.ch-reels-page .ch3-paste-btn,
body.ch-photo-page .ch3-paste-btn,
body.ch-story-page .ch3-paste-btn,
body.ch-carousel-page .ch3-paste-btn,
body.ch-post-page .ch3-paste-btn,
body.ch-profile-page .ch3-paste-btn,
body.ch-viewer-page .ch3-paste-btn,
body.ch-audio-page .ch3-paste-btn,
body.ch-unfollowers-page .ch3-paste-btn,
body.ch-profile-picture-page .ch3-paste-btn,
body.ch-tiktok-downloader-page #tiktokPaste,
body.ch-tiktok-mp3-page #tiktokMp3Paste,
body.ch-tiktok-photo-page #tiktokPhotoPaste,
body.ch-tiktok-story-page #tiktokStoryPaste,
body.ch-tiktok-profile-page #tiktokProfilePaste,
body.ch-youtube-home-sync .ch3-paste-btn,
body.ch-youtube-mp4-home-sync .ch3-paste-btn,
body.ch-youtube-shorts-home-sync .ch3-paste-btn,
body.ch-youtube-transcript-home-sync .ch3-paste-btn,
body.ch-youtube-subtitle-home-sync .ch3-paste-btn,
body.ch-youtube-hashtag-home-sync .ch3-paste-btn,
body.ch-facebook-video-page .fb-video-paste,
body.ch-facebook-reels-page .fb-reels-paste,
body.ch-pinterest-video-page .pin-video-paste,
body.ch-pinterest-image-page .pin-image-paste {
grid-column:
1
!important;
width:
100%
!important;
min-width:
0
!important;
height:
51px
!important;
}
body.ch-video-page .ch3-download-btn,
body.ch-reels-page .ch3-download-btn,
body.ch-photo-page .ch3-download-btn,
body.ch-story-page .ch3-download-btn,
body.ch-carousel-page .ch3-download-btn,
body.ch-post-page .ch3-download-btn,
body.ch-profile-page .ch3-download-btn,
body.ch-viewer-page .ch3-download-btn,
body.ch-audio-page .ch3-download-btn,
body.ch-unfollowers-page .ch3-download-btn,
body.ch-profile-picture-page .ch3-download-btn,
body.ch-tiktok-downloader-page .ch3-download-btn,
body.ch-tiktok-mp3-page .ch3-download-btn,
body.ch-tiktok-photo-page .ch3-download-btn,
body.ch-tiktok-story-page .ch3-download-btn,
body.ch-tiktok-profile-page .ch3-download-btn,
body.ch-youtube-home-sync .ch3-download-btn,
body.ch-youtube-mp4-home-sync .ch3-download-btn,
body.ch-youtube-shorts-home-sync .ch3-download-btn,
body.ch-youtube-transcript-home-sync .ch3-download-btn,
body.ch-youtube-subtitle-home-sync .ch3-download-btn,
body.ch-youtube-hashtag-home-sync .ch3-download-btn,
body.ch-facebook-video-page .fb-video-download,
body.ch-facebook-reels-page .fb-reels-download,
body.ch-pinterest-video-page .pin-video-download,
body.ch-pinterest-image-page .pin-image-download {
grid-column:
2
!important;
width:
100%
!important;
min-width:
0
!important;
height:
51px
!important;
}
}
@media (max-width:420px) {
body.ch-video-page .ch3-url-row,
body.ch-reels-page .ch3-url-row,
body.ch-photo-page .ch3-url-row,
body.ch-story-page .ch3-url-row,
body.ch-carousel-page .ch3-url-row,
body.ch-post-page .ch3-url-row,
body.ch-profile-page .ch3-url-row,
body.ch-viewer-page .ch3-url-row,
body.ch-audio-page .ch3-url-row,
body.ch-unfollowers-page .ch3-url-row,
body.ch-profile-picture-page .ch3-url-row,
body.ch-tiktok-downloader-page .ch3-url-row,
body.ch-tiktok-mp3-page .ch3-url-row,
body.ch-tiktok-photo-page .ch3-url-row,
body.ch-tiktok-story-page .ch3-url-row,
body.ch-tiktok-profile-page .ch3-url-row,
body.ch-youtube-home-sync .ch3-url-row,
body.ch-youtube-mp4-home-sync .ch3-url-row,
body.ch-youtube-shorts-home-sync .ch3-url-row,
body.ch-youtube-transcript-home-sync .ch3-url-row,
body.ch-youtube-subtitle-home-sync .ch3-url-row,
body.ch-youtube-hashtag-home-sync .ch3-url-row,
body.ch-facebook-video-page .fb-video-row,
body.ch-facebook-reels-page .fb-reels-row,
body.ch-pinterest-video-page .pin-video-row,
body.ch-pinterest-image-page .pin-image-row {
grid-template-columns:
1fr
!important;
}
body.ch-video-page .ch3-paste-btn,
body.ch-reels-page .ch3-paste-btn,
body.ch-photo-page .ch3-paste-btn,
body.ch-story-page .ch3-paste-btn,
body.ch-carousel-page .ch3-paste-btn,
body.ch-post-page .ch3-paste-btn,
body.ch-profile-page .ch3-paste-btn,
body.ch-viewer-page .ch3-paste-btn,
body.ch-audio-page .ch3-paste-btn,
body.ch-unfollowers-page .ch3-paste-btn,
body.ch-profile-picture-page .ch3-paste-btn,
body.ch-tiktok-downloader-page #tiktokPaste,
body.ch-tiktok-mp3-page #tiktokMp3Paste,
body.ch-tiktok-photo-page #tiktokPhotoPaste,
body.ch-tiktok-story-page #tiktokStoryPaste,
body.ch-tiktok-profile-page #tiktokProfilePaste,
body.ch-youtube-home-sync .ch3-paste-btn,
body.ch-youtube-mp4-home-sync .ch3-paste-btn,
body.ch-youtube-shorts-home-sync .ch3-paste-btn,
body.ch-youtube-transcript-home-sync .ch3-paste-btn,
body.ch-youtube-subtitle-home-sync .ch3-paste-btn,
body.ch-youtube-hashtag-home-sync .ch3-paste-btn,
body.ch-facebook-video-page .fb-video-paste,
body.ch-facebook-reels-page .fb-reels-paste,
body.ch-pinterest-video-page .pin-video-paste,
body.ch-pinterest-image-page .pin-image-paste,
body.ch-video-page .ch3-download-btn,
body.ch-reels-page .ch3-download-btn,
body.ch-photo-page .ch3-download-btn,
body.ch-story-page .ch3-download-btn,
body.ch-carousel-page .ch3-download-btn,
body.ch-post-page .ch3-download-btn,
body.ch-profile-page .ch3-download-btn,
body.ch-viewer-page .ch3-download-btn,
body.ch-audio-page .ch3-download-btn,
body.ch-unfollowers-page .ch3-download-btn,
body.ch-profile-picture-page .ch3-download-btn,
body.ch-tiktok-downloader-page .ch3-download-btn,
body.ch-tiktok-mp3-page .ch3-download-btn,
body.ch-tiktok-photo-page .ch3-download-btn,
body.ch-tiktok-story-page .ch3-download-btn,
body.ch-tiktok-profile-page .ch3-download-btn,
body.ch-youtube-home-sync .ch3-download-btn,
body.ch-youtube-mp4-home-sync .ch3-download-btn,
body.ch-youtube-shorts-home-sync .ch3-download-btn,
body.ch-youtube-transcript-home-sync .ch3-download-btn,
body.ch-youtube-subtitle-home-sync .ch3-download-btn,
body.ch-youtube-hashtag-home-sync .ch3-download-btn,
body.ch-facebook-video-page .fb-video-download,
body.ch-facebook-reels-page .fb-reels-download,
body.ch-pinterest-video-page .pin-video-download,
body.ch-pinterest-image-page .pin-image-download {
grid-column:
1
!important;
}
}
body.ch-facebook-video-page
.fb-video-control,
body.ch-facebook-reels-page
.fb-reels-control {
padding:
0
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
0
!important;
background:
transparent
!important;
background-image:
none
!important;
box-shadow:
none
!important;
filter:
none
!important;
overflow:
visible
!important;
}
body.ch-facebook-video-page
.fb-video-control::before,
body.ch-facebook-video-page
.fb-video-control::after,
body.ch-facebook-reels-page
.fb-reels-control::before,
body.ch-facebook-reels-page
.fb-reels-control::after {
display:
none
!important;
content:
none
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.fb-video-control,
html[data-theme="dark"]
body.ch-facebook-reels-page
.fb-reels-control {
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
body.ch-facebook-video-page
.fb-video-row,
body.ch-facebook-reels-page
.fb-reels-row {
padding:
0
!important;
min-height:
58px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
0
!important;
background:
transparent
!important;
background-color:
transparent
!important;
background-image:
none
!important;
box-shadow:
none
!important;
filter:
none
!important;
overflow:
visible
!important;
}
body.ch-facebook-video-page
.fb-video-row::before,
body.ch-facebook-video-page
.fb-video-row::after,
body.ch-facebook-reels-page
.fb-reels-row::before,
body.ch-facebook-reels-page
.fb-reels-row::after {
content:
none
!important;
display:
none
!important;
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
body.ch-facebook-video-page
.fb-video-row,
body.ch-facebook-reels-page
.fb-reels-row {
gap:
7px
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.fb-video-row,
html[data-theme="dark"]
body.ch-facebook-reels-page
.fb-reels-row {
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
/* chlak-facebook-control-single-shell-v1.css */
body.ch-facebook-video-page
.download-shell,
body.ch-facebook-reels-page
.download-shell {
box-sizing:
border-box
!important;
width:
min(850px,100%)
!important;
max-width:
850px
!important;
margin:
28px auto 0
!important;
padding:
0
!important;
border:
0
!important;
border-radius:
0
!important;
background:
transparent
!important;
background-image:
none
!important;
box-shadow:
none
!important;
filter:
none
!important;
overflow:
visible
!important;
}
body.ch-facebook-video-page
form.fb-video-control,
body.ch-facebook-reels-page
form.fb-reels-control {
box-sizing:
border-box
!important;
display:
block
!important;
width:
100%
!important;
max-width:
850px
!important;
min-height:
72px
!important;
margin:
0
!important;
padding:
7px
!important;
border:
1px solid rgba(148,163,184,.34)
!important;
outline:
0
!important;
border-radius:
20px
!important;
background:
rgba(255,255,255,.97)
!important;
background-image:
none
!important;
box-shadow:
0 18px 45px rgba(15,23,42,.09),
0 2px 7px rgba(15,23,42,.035)
!important;
filter:
none
!important;
overflow:
visible
!important;
}
body.ch-facebook-video-page
form.fb-video-control::before,
body.ch-facebook-video-page
form.fb-video-control::after,
body.ch-facebook-reels-page
form.fb-reels-control::before,
body.ch-facebook-reels-page
form.fb-reels-control::after {
content:
none
!important;
display:
none
!important;
}
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row,
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row {
box-sizing:
border-box
!important;
display:
flex
!important;
align-items:
center
!important;
width:
100%
!important;
min-height:
58px
!important;
margin:
0
!important;
padding:
0
!important;
gap:
7px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
0
!important;
background:
transparent
!important;
background-color:
transparent
!important;
background-image:
none
!important;
box-shadow:
none
!important;
filter:
none
!important;
overflow:
visible
!important;
}
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row::before,
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row::after,
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row::before,
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row::after {
content:
none
!important;
display:
none
!important;
}
body.ch-facebook-video-page
form.fb-video-control
.fb-video-input,
body.ch-facebook-reels-page
form.fb-reels-control
.fb-reels-input {
box-sizing:
border-box
!important;
display:
block
!important;
flex:
1 1 auto
!important;
min-width:
0
!important;
width:
auto
!important;
height:
58px
!important;
margin:
0
!important;
padding:
0 17px
!important;
border:
0
!important;
outline:
0
!important;
border-radius:
13px
!important;
background:
#f8fafc
!important;
color:
#111827
!important;
font-family:
inherit
!important;
font-size:
17px
!important;
font-weight:
450
!important;
box-shadow:
inset 0 0 0 1px #edf0f5
!important;
}
body.ch-facebook-video-page
.fb-video-input::placeholder,
body.ch-facebook-reels-page
.fb-reels-input::placeholder {
color:
#94a3b8
!important;
opacity:
1
!important;
font-size:
16.5px
!important;
font-weight:
450
!important;
}
body.ch-facebook-video-page
.fb-video-input:focus,
body.ch-facebook-reels-page
.fb-reels-input:focus {
box-shadow:
inset 0 0 0 1px rgba(24,119,242,.48),
0 0 0 4px rgba(24,119,242,.075)
!important;
}
body.ch-facebook-video-page
.fb-video-paste,
body.ch-facebook-reels-page
.fb-reels-paste {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 76px
!important;
width:
76px
!important;
min-width:
76px
!important;
height:
46px
!important;
margin:
0
!important;
padding:
0 12px
!important;
border:
1px solid #dfe5ee
!important;
border-radius:
11px
!important;
background:
#ffffff
!important;
background-image:
none
!important;
color:
#334155
!important;
font-family:
inherit
!important;
font-size:
13px
!important;
font-weight:
750
!important;
line-height:
1
!important;
box-shadow:
none
!important;
}
body.ch-facebook-video-page
.fb-video-download,
body.ch-facebook-reels-page
.fb-reels-download {
box-sizing:
border-box
!important;
display:
inline-flex
!important;
align-items:
center
!important;
justify-content:
center
!important;
flex:
0 0 auto
!important;
width:
auto
!important;
min-width:
145px
!important;
height:
58px
!important;
margin:
0
!important;
padding:
0 18px
!important;
border:
0
!important;
border-radius:
13px
!important;
background:
#1877f2
!important;
background-image:
none
!important;
color:
#ffffff
!important;
font-family:
inherit
!important;
font-size:
14px
!important;
font-weight:
800
!important;
line-height:
1
!important;
box-shadow:
0 9px 23px rgba(24,119,242,.20)
!important;
}
body.ch-facebook-video-page
.fb-video-download[disabled],
body.ch-facebook-reels-page
.fb-reels-download[disabled] {
cursor:
not-allowed
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
.download-shell,
html[data-theme="dark"]
body.ch-facebook-reels-page
.download-shell {
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
form.fb-video-control,
html[data-theme="dark"]
body.ch-facebook-reels-page
form.fb-reels-control {
border-color:
#334155
!important;
background:
rgba(15,23,42,.97)
!important;
box-shadow:
0 18px 45px rgba(0,0,0,.22)
!important;
}
html[data-theme="dark"]
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row,
html[data-theme="dark"]
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row {
border:
0
!important;
background:
transparent
!important;
box-shadow:
none
!important;
}
@media (max-width:700px) {
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row,
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row {
display:
grid
!important;
grid-template-columns:
minmax(105px,.8fr)
minmax(145px,1.2fr)
!important;
gap:
7px
!important;
}
body.ch-facebook-video-page
.fb-video-input,
body.ch-facebook-reels-page
.fb-reels-input {
grid-column:
1 / -1
!important;
width:
100%
!important;
height:
55px
!important;
}
body.ch-facebook-video-page
.fb-video-paste,
body.ch-facebook-reels-page
.fb-reels-paste {
grid-column:
1
!important;
width:
100%
!important;
min-width:
0
!important;
height:
51px
!important;
}
body.ch-facebook-video-page
.fb-video-download,
body.ch-facebook-reels-page
.fb-reels-download {
grid-column:
2
!important;
width:
100%
!important;
min-width:
0
!important;
height:
51px
!important;
}
}
@media (max-width:420px) {
body.ch-facebook-video-page
form.fb-video-control
> .fb-video-row,
body.ch-facebook-reels-page
form.fb-reels-control
> .fb-reels-row {
grid-template-columns:
1fr
!important;
}
body.ch-facebook-video-page
.fb-video-paste,
body.ch-facebook-reels-page
.fb-reels-paste,
body.ch-facebook-video-page
.fb-video-download,
body.ch-facebook-reels-page
.fb-reels-download {
grid-column:
1
!important;
}
}
/* chlak-universal-result-v1.css */
#postResult{
width:min(720px,calc(100% - 28px))!important;
max-width:720px!important;
margin:22px auto 18px!important;
}
#postResult[hidden]{
display:none!important;
}
.tool-status-note{
box-sizing:border-box!important;
width:min(720px,calc(100% - 28px))!important;
max-width:720px!important;
margin:16px auto 0!important;
padding:13px 17px!important;
border-radius:12px!important;
text-align:left!important;
font-size:13px!important;
font-weight:650!important;
line-height:1.4!important;
}
.tool-status-note.chc-status-success{
color:#15803d!important;
background:#f0fdf4!important;
border:1px solid #bbf7d0!important;
}
.tool-status-note.chc-status-error{
color:#dc2626!important;
background:#fff1f2!important;
border:1px solid #fecdd3!important;
}
.tool-status-note.chc-status-info{
color:#475569!important;
background:#f8fafc!important;
border:1px solid #e2e8f0!important;
}
.chc-result-card{
box-sizing:border-box!important;
width:100%!important;
margin:24px auto 0!important;
background:#fff!important;
border:1px solid #e4e4ec!important;
border-radius:22px!important;
box-shadow:0 8px 40px rgba(15,23,42,.12)!important;
overflow:hidden!important;
text-align:left!important;
animation:rdFadeUp .35s ease both!important;
}
@keyframes rdFadeUp{
from{
opacity:0;
transform:translateY(14px);
}
to{
opacity:1;
transform:translateY(0);
}
}
.chc-result-info{
padding:27px!important;
}
.chc-ready-badge{
display:inline-flex!important;
align-items:center!important;
gap:6px!important;
margin-bottom:12px!important;
padding:5px 12px!important;
color:#16a34a!important;
background:#f0fdf4!important;
border:1px solid #bbf7d0!important;
border-radius:999px!important;
font-size:12px!important;
font-weight:800!important;
}
.chc-result-title{
margin:0 0 6px!important;
color:#111827!important;
font-size:18px!important;
font-weight:800!important;
line-height:1.25!important;
}
.chc-source{
margin:0 0 18px!important;
color:#64748b!important;
font-size:12px!important;
line-height:1.5!important;
overflow-wrap:anywhere!important;
word-break:break-word!important;
}
.chc-actions{
display:flex!important;
flex-wrap:wrap!important;
gap:10px!important;
margin-bottom:18px!important;
}
.chc-download-all,
.chc-open-original{
appearance:none!important;
min-height:44px!important;
border-radius:12px!important;
padding:0 17px!important;
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
gap:7px!important;
font:inherit!important;
font-size:13px!important;
font-weight:800!important;
line-height:1!important;
text-decoration:none!important;
cursor:pointer!important;
transition:
transform .18s ease,
box-shadow .18s ease,
opacity .18s ease!important;
}
.chc-download-all{
border:0!important;
background:#111!important;
color:#fff!important;
box-shadow:0 6px 18px rgba(0,0,0,.16)!important;
}
.chc-download-all:hover{
transform:translateY(-1px)!important;
box-shadow:0 9px 23px rgba(0,0,0,.20)!important;
}
.chc-download-all:disabled{
opacity:.55!important;
cursor:wait!important;
transform:none!important;
}
.chc-open-original{
color:#475569!important;
background:#fff!important;
border:1px solid #d7dce5!important;
}
.chc-open-original:hover{
color:#111827!important;
border-color:#111827!important;
}
.chc-grid{
display:grid!important;
grid-template-columns:repeat(3,minmax(0,1fr))!important;
gap:10px!important;
}
.chc-media-card{
position:relative!important;
aspect-ratio:1 / 1!important;
min-width:0!important;
overflow:hidden!important;
background:#111827!important;
border:1px solid #e4e4ec!important;
border-radius:12px!important;
}
.chc-media-thumb{
display:block!important;
width:100%!important;
height:100%!important;
aspect-ratio:1 / 1!important;
object-fit:cover!important;
background:#111827!important;
}
.chc-video-placeholder{
position:absolute!important;
inset:0!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
background:
radial-gradient(circle at 50% 40%,#273449,#0f172a 72%)!important;
}
.chc-play{
width:48px!important;
height:48px!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
color:#fff!important;
background:rgba(255,255,255,.15)!important;
border:1px solid rgba(255,255,255,.28)!important;
border-radius:999px!important;
backdrop-filter:blur(6px)!important;
}
.chc-media-overlay{
position:absolute!important;
z-index:3!important;
left:0!important;
right:0!important;
bottom:0!important;
padding:30px 8px 8px!important;
background:
linear-gradient(
transparent,
rgba(0,0,0,.78)
)!important;
}
.chc-media-download{
appearance:none!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
gap:5px!important;
width:100%!important;
min-height:34px!important;
padding:6px!important;
color:#fff!important;
background:rgba(255,255,255,.16)!important;
border:1px solid rgba(255,255,255,.32)!important;
border-radius:8px!important;
backdrop-filter:blur(5px)!important;
font:inherit!important;
font-size:12px!important;
font-weight:800!important;
cursor:pointer!important;
}
.chc-media-download:hover{
background:rgba(255,255,255,.25)!important;
}
.chc-media-download:disabled{
opacity:.6!important;
cursor:wait!important;
}
html[data-theme="dark"] .chc-result-card{
background:#111827!important;
border-color:#293548!important;
box-shadow:0 8px 40px rgba(0,0,0,.38)!important;
}
html[data-theme="dark"] .chc-result-title{
color:#f8fafc!important;
}
html[data-theme="dark"] .chc-source{
color:#94a3b8!important;
}
html[data-theme="dark"] .chc-open-original{
background:#111827!important;
color:#cbd5e1!important;
border-color:#334155!important;
}
html[data-theme="dark"] .chc-open-original:hover{
color:#fff!important;
border-color:#64748b!important;
}
html[data-theme="dark"] .tool-status-note.chc-status-info{
color:#cbd5e1!important;
background:#111827!important;
border-color:#334155!important;
}
@media(max-width:560px){
#postResult{
width:calc(100% - 20px)!important;
}
.tool-status-note{
width:calc(100% - 20px)!important;
}
.chc-result-info{
padding:18px 15px!important;
}
.chc-actions{
gap:8px!important;
}
.chc-download-all,
.chc-open-original{
flex:1 1 0!important;
min-width:0!important;
padding:0 11px!important;
font-size:12px!important;
white-space:nowrap!important;
}
.chc-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
gap:8px!important;
}
.chc-media-download{
font-size:11px!important;
}
}
.tool-status-note{
display:none!important;
}
.chc-runtime-status{
box-sizing:border-box!important;
width:min(
720px,
calc(100% - 28px)
)!important;
max-width:720px!important;
margin:16px auto 0!important;
padding:13px 17px!important;
border-radius:12px!important;
text-align:left!important;
font-size:13px!important;
font-weight:650!important;
line-height:1.4!important;
}
.chc-runtime-status[hidden],
.chc-runtime-status[data-type="info"]{
display:none!important;
}
.chc-runtime-status[data-type="error"]{
display:block!important;
color:#dc2626!important;
background:#fff1f2!important;
border:1px solid #fecdd3!important;
}
.chc-caption{
display:block!important;
box-sizing:border-box!important;
width:100%!important;
max-width:100%!important;
margin:0 0 16px!important;
padding:0!important;
text-align:center!important;
color:#71717a!important;
font-size:14px!important;
line-height:18px!important;
font-weight:600!important;
letter-spacing:0!important;
}
.chc-caption-line{
display:block!important;
width:100%!important;
text-align:center!important;
white-space:nowrap!important;
}
html[data-theme="dark"]
.chc-caption{
color:#a1a1aa!important;
}
html[data-theme="dark"]
.chc-runtime-status[data-type="error"]{
color:#fecaca!important;
background:#321b20!important;
border-color:#7f1d1d!important;
}
@media(max-width:560px){
.chc-runtime-status{
width:calc(100% - 20px)!important;
}
.chc-caption{
margin:6px auto 10px!important;
font-size:16px!important;
line-height:19px!important;
font-weight:400!important;
}
}
html
.tool-home-download-area
.tool-status-note{
display:none!important;
}
html
.tool-home-download-area
.tool-status-note{
display:none!important;
}
#postResult.chp-single
.chc-grid{
grid-template-columns:minmax(0,320px)!important;
justify-content:center!important;
}
.chc-caption-line{
display:block!important;
width:100%!important;
text-align:center!important;
}
.chc-runtime-status{
box-sizing:border-box!important;
width:min(
720px,
calc(100% - 28px)
)!important;
max-width:720px!important;
margin:16px auto 0!important;
padding:13px 17px!important;
border-radius:12px!important;
text-align:left!important;
font-size:13px!important;
font-weight:650!important;
line-height:1.4!important;
}
.chc-runtime-status[hidden],
.chc-runtime-status[data-type="info"]{
display:none!important;
}
.chc-runtime-status[data-type="error"]{
display:block!important;
color:#dc2626!important;
background:#fff1f2!important;
border:1px solid #fecdd3!important;
}
@media(max-width:560px){
#postResult.chp-single
.chc-grid{
grid-template-columns:minmax(0,1fr)!important;
}
.chc-runtime-status{
width:calc(100% - 20px)!important;
}
}
/* chlak-instagram-video-player-v3.css */
#resultWrap {
width: min(640px, calc(100% - 24px)) !important;
max-width: 640px !important;
margin: 18px auto 0 !important;
}
#resultWrap .result-card {
display: grid !important;
grid-template-columns: 158px minmax(0, 1fr) !important;
gap: 18px !important;
align-items: center !important;
width: 100% !important;
padding: 18px !important;
border: 1px solid #e2e8f0 !important;
border-radius: 18px !important;
background: #fff !important;
box-shadow:
0 18px 45px rgba(15,23,42,.07),
0 3px 10px rgba(15,23,42,.04) !important;
}
#resultWrap .result-media {
width: 158px !important;
height: auto !important;
aspect-ratio: 9 / 16 !important;
overflow: hidden !important;
border-radius: 12px !important;
background: #000 !important;
box-shadow:
0 8px 22px rgba(15,23,42,.13) !important;
}
#resultWrap .result-media video,
#resultWrap .result-media img {
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
background: #000 !important;
}
#resultWrap .result-info {
min-width: 0 !important;
}
#resultWrap .ready-badge {
width: fit-content !important;
margin: 0 0 9px !important;
font-size: 12px !important;
}
#resultWrap #resultTitle {
margin: 0 0 5px !important;
font-size: 20px !important;
line-height: 1.25 !important;
letter-spacing: -.025em !important;
}
#resultWrap #resultUrl {
width: 100% !important;
margin: 0 0 16px !important;
overflow: hidden !important;
white-space: nowrap !important;
text-overflow: ellipsis !important;
color: #64748b !important;
font-size: 12px !important;
}
#resultWrap .result-actions {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 9px !important;
width: 100% !important;
}
#resultWrap .result-actions .button,
#resultWrap .chlak-download-another {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
min-height: 46px !important;
border-radius: 11px !important;
font-weight: 700 !important;
}
#resultWrap #mainDownloadBtn {
border: 0 !important;
color: #fff !important;
background:
linear-gradient(
110deg,
#9333ea,
#c026d3 52%,
#ec4899
) !important;
box-shadow:
0 9px 22px rgba(192,38,211,.18) !important;
}
#resultWrap #openOriginal {
min-height: 43px !important;
border: 1px solid #e2e8f0 !important;
background: #fff !important;
}
#resultWrap .chlak-download-another {
min-height: 43px !important;
border: 1px solid #e2e8f0 !important;
background: #f8fafc !important;
color: #334155 !important;
cursor: pointer !important;
}
html[data-theme="dark"] #resultWrap .result-card {
border-color:
rgba(148,163,184,.20) !important;
background: #111827 !important;
}
html[data-theme="dark"] #resultWrap #resultUrl {
color: #94a3b8 !important;
}
html[data-theme="dark"] #resultWrap #openOriginal,
html[data-theme="dark"] #resultWrap .chlak-download-another {
border-color:
rgba(148,163,184,.20) !important;
background: #1e293b !important;
color: #e5e7eb !important;
}
@media (max-width: 640px) {
#resultWrap {
width:
min(
380px,
calc(100% - 20px)
) !important;
}
#resultWrap .result-card {
grid-template-columns:
1fr !important;
gap: 14px !important;
padding: 14px !important;
}
#resultWrap .result-media {
width: 100% !important;
max-width: 205px !important;
margin:
0 auto !important;
}
#resultWrap .ready-badge {
margin-left:
auto !important;
margin-right:
auto !important;
}
#resultWrap #resultTitle,
#resultWrap #resultUrl {
text-align:
center !important;
}
}
@media (max-width: 640px) {
#resultWrap {
width: min(
370px,
calc(100% - 16px)
) !important;
max-width: 370px !important;
margin-top: 16px !important;
}
#resultWrap .result-card {
width: 100% !important;
padding: 16px !important;
gap: 15px !important;
border-radius: 18px !important;
}
#resultWrap .result-media {
width: 100% !important;
max-width: 320px !important;
aspect-ratio: 9 / 16 !important;
margin:
0 auto !important;
border-radius: 12px !important;
}
#resultWrap .result-media video,
#resultWrap .result-media img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
}
#resultWrap .result-actions {
width: 100% !important;
gap: 10px !important;
}
#resultWrap .result-actions .button,
#resultWrap .chlak-download-another {
min-height: 48px !important;
font-size: 16px !important;
}
}
/* chlak-instagram-video-mobile-wide-v2.css */
@media (max-width: 640px) {
#resultWrap .result-media {
width: min(310px, 100%) !important;
max-width: 310px !important;
min-width: 0 !important;
aspect-ratio: 9 / 16 !important;
margin-left: auto !important;
margin-right: auto !important;
overflow: hidden !important;
border-radius: 12px !important;
}
#resultWrap .result-media video,
#resultWrap .result-media img {
display: block !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
object-fit: cover !important;
margin: 0 !important;
}
}
/* chlak-instagram-video-mobile-clean-v1.css */
@media (max-width: 640px) {
#resultWrap .ready-badge,
#resultWrap #resultTitle,
#resultWrap #resultUrl {
display: none !important;
}
#resultWrap .result-info {
margin: 0 !important;
padding: 0 !important;
}
#resultWrap .result-actions {
margin-top: 0 !important;
}
#resultWrap .result-card {
row-gap: 12px !important;
}
}
/* chlak-lang-menu-v1.css */
.lang-details{position:relative}
.lang-details>.lang-pop.clm-ready{
position:absolute;top:calc(100% + 10px);inset-inline-end:0;inset-inline-start:auto;z-index:1000;
width:min(280px,calc(100vw - 24px));padding:0!important;margin:0;display:block!important;
background:var(--clm-bg);border:1px solid var(--clm-line);border-radius:16px;
box-shadow:0 18px 50px rgba(17,17,26,.16),0 2px 6px rgba(17,17,26,.06);overflow:hidden;
animation:clmIn .14s ease-out
}
@keyframes clmIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.lang-details,.clm-mobile{
--clm-bg:#fff;--clm-line:#ececf1;--clm-text:#1d1d26;--clm-muted:#8a8a99;--clm-hover:#f5f5f8;
--clm-active-bg:#f1f1f5;--clm-active:#1d1d26;--clm-input:#f7f7fa
}
html.dark .lang-details,body.dark .lang-details,html[data-theme="dark"] .lang-details,body[data-theme="dark"] .lang-details,
html.dark .clm-mobile,body.dark .clm-mobile,html[data-theme="dark"] .clm-mobile,body[data-theme="dark"] .clm-mobile{
--clm-bg:#17171f;--clm-line:#2a2a36;--clm-text:#ededf3;--clm-muted:#8f8fa3;--clm-hover:#22222d;
--clm-active-bg:#262631;--clm-active:#ededf3;--clm-input:#1f1f29
}
.clm-search{display:flex;align-items:center;gap:8px;margin:10px;padding:0 12px;height:40px;border-radius:11px;
background:var(--clm-input);border:1px solid var(--clm-line);color:var(--clm-muted)}
.clm-search:focus-within{border-color:var(--clm-muted)}
.clm-search svg{flex:0 0 auto}
.clm-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--clm-text);font:inherit;font-size:14px;padding:0}
.clm-search input::placeholder{color:var(--clm-muted)}
.clm-search input::-webkit-search-cancel-button{display:none}
.clm-list{position:relative;max-height:300px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
padding:2px 6px 8px;border-top:1px solid var(--clm-line);scrollbar-width:thin;scrollbar-color:var(--clm-line) transparent}
.clm-list::-webkit-scrollbar{width:6px}.clm-list::-webkit-scrollbar-thumb{background:var(--clm-line);border-radius:6px}
.clm-item{display:flex!important;align-items:center;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;
min-height:42px;padding:9px 12px!important;margin:2px 0!important;border-radius:10px;
color:var(--clm-text)!important;text-decoration:none!important;font-size:14.5px;font-weight:500;line-height:1.2;
background:transparent!important;cursor:pointer;transition:background .12s}
.clm-item:hover,.clm-item:focus-visible,.clm-item.is-kb{background:var(--clm-hover)!important;outline:0}
.clm-item.is-current{background:var(--clm-active-bg)!important;color:var(--clm-active)!important;font-weight:600;cursor:default}
.clm-name{display:flex;flex-direction:column;gap:2px;min-width:0}
.clm-sub{font-size:11.5px;font-weight:450;color:var(--clm-muted)}
.clm-item.is-current .clm-sub{color:inherit;opacity:.7}
.clm-check{flex:0 0 auto;display:none}.clm-item.is-current .clm-check{display:block}
.clm-empty{padding:14px 12px 18px;text-align:center;font-size:13.5px;color:var(--clm-muted)}
.clm-item[hidden],.clm-empty[hidden]{display:none!important}
.chf3-language{display:none!important}
.clm-mobile{margin:4px 0}
.clm-mobile-toggle{display:flex!important;align-items:center;justify-content:space-between;width:100%;cursor:pointer;
-webkit-tap-highlight-color:transparent;user-select:none}
.clm-mobile-toggle .clm-chev{transition:transform .18s;opacity:.7}
.clm-mobile.is-open .clm-chev{transform:rotate(180deg)}
.clm-mobile-panel{margin:8px 0 6px;background:var(--clm-bg);border:1px solid var(--clm-line);border-radius:14px;overflow:hidden}
.clm-mobile-panel[hidden]{display:none}
.clm-mobile-panel .clm-search{margin:8px}
.clm-mobile-panel .clm-list{max-height:none!important;overflow:visible!important}
.clm-mobile-panel .clm-item{min-height:46px;font-size:15px}
.clm-pop-fit{overflow-y:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
html.clm-lock,html.clm-lock body{overflow:hidden!important;overscroll-behavior:none}
/* chlak-facebook-dark-control-v1.css */
html[data-theme="dark"] body.ch-facebook-video-page .fb-video-control,
html[data-theme="dark"] body.ch-facebook-reels-page .fb-reels-control{background:rgba(15,23,42,.93)!important;border:1px solid rgba(71,85,105,.65)!important}
html[data-theme="dark"] body.ch-facebook-video-page .fb-video-input,
html[data-theme="dark"] body.ch-facebook-reels-page .fb-reels-input{background:#111827!important;color:#f8fafc!important;box-shadow:inset 0 0 0 1px #273449!important}
html[data-theme="dark"] body.ch-facebook-video-page .fb-video-input::placeholder,
html[data-theme="dark"] body.ch-facebook-reels-page .fb-reels-input::placeholder{color:#64748b!important;opacity:1}
html[data-theme="dark"] body.ch-facebook-video-page .hero .hero-chip,
html[data-theme="dark"] body.ch-facebook-reels-page .hero .hero-chip,
html[data-theme="dark"] body.ch-pinterest-video-page .hero .hero-chip,
html[data-theme="dark"] body.ch-pinterest-image-page .hero .hero-chip{background:rgba(15,18,25,.88)!important;color:#cbd5e1!important;border-color:#293149!important;box-shadow:0 8px 24px rgba(15,23,42,.043)!important}
html:not([data-theme="dark"]) body:is(.ch-facebook-video-page,.ch-facebook-reels-page,.ch-pinterest-video-page,.ch-pinterest-image-page){background:#fff!important}
html:not([data-theme="dark"]) body:is(.ch-facebook-video-page,.ch-facebook-reels-page,.ch-pinterest-video-page,.ch-pinterest-image-page) .hero{background-color:transparent!important}
html:not([data-theme="dark"]) body:is(.ch-facebook-video-page,.ch-facebook-reels-page,.ch-pinterest-video-page,.ch-pinterest-image-page) .hero::before{display:none!important}
/* reeldown-brand-v1.css */
.brand-mark.rd-logo,.chf3-logo-mark.rd-logo{background:none!important;box-shadow:none!important;border-radius:0!important;padding:0!important;color:transparent!important;overflow:visible!important}
.brand-mark.rd-logo img,.chf3-logo-mark.rd-logo img{display:block;width:100%;height:100%;object-fit:contain}
.chf3-logo-mark.rd-logo{width:40px!important;height:40px!important;min-width:40px!important}
.brand-mark.rd-logo img,.chf3-logo-mark.rd-logo img{box-shadow:none!important;border-radius:0!important;background:transparent!important;border:0!important;outline:0!important;filter:drop-shadow(0 4px 10px rgba(129,52,175,.18))}
html[data-theme="dark"] .brand-mark.rd-logo img,html[data-theme="dark"] .chf3-logo-mark.rd-logo img{filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}
.brand-mark.rd-logo,.chf3-logo-mark.rd-logo{display:inline-flex!important;width:40px!important;height:40px!important;min-width:40px!important;flex:0 0 40px!important}
.brand-mark.rd-logo img,.chf3-logo-mark.rd-logo img{width:40px!important;height:40px!important;max-width:40px!important}