:root{--navy:#102e67;--blue:#2456e6;--purple:#7c24ea;--pink:#fc2969;--lime:#b9f64b;--ink:#111b31;--muted:#5f6f89;--line:#d8e1ec;--bg:#edf1f6;--surface:#fff;--good:#079b66;--warn:#d8730e;--shadow:0 14px 42px rgba(23,44,88,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 88% 0%,rgba(124,36,234,.05),transparent 24%),radial-gradient(circle at 8% 28%,rgba(36,86,230,.035),transparent 22%),linear-gradient(180deg,#edf1f7 0%,#e9eef5 58%,#f2f5f9 100%);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.55}a{color:inherit}button,input{font:inherit}.app{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:100vh}.side{position:sticky;top:0;height:100vh;overflow:auto;padding:24px 18px;background:linear-gradient(180deg,#fbfcfe 0%,#f3f6fa 100%);border-right:1px solid var(--line);z-index:20}.brand{display:flex;gap:0;align-items:center;margin:2px 6px 20px;font-weight:900;color:var(--navy)}.brand small{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#8a96aa}.search{position:relative;margin:0 2px 18px}.search input{width:100%;padding:11px 12px 11px 36px;border:1px solid var(--line);border-radius:13px;background:#f8faff;outline:none}.search span{position:absolute;left:13px;top:10px;color:#8b98ad}.nav-label{margin:18px 10px 6px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:#9ba6b7}.nav a{display:flex;align-items:center;gap:10px;padding:9px 11px;margin:2px 0;border-radius:11px;text-decoration:none;color:#506078;font-size:13px;font-weight:720}.nav a:hover,.nav a.active{color:var(--blue);background:#eff4ff}.nav .n{display:grid;place-items:center;width:23px;height:23px;border-radius:8px;background:#edf1f8;font-size:10px}.side-note{margin:20px 5px 4px;padding:14px;border-radius:15px;background:linear-gradient(135deg,#eef3ff,#fff0f7);font-size:12px;color:#5b6981}.main{min-width:0}.topbar{position:sticky;top:0;z-index:15;display:flex;align-items:center;justify-content:space-between;height:68px;padding:0 4vw;background:rgba(237,241,247,.92);backdrop-filter:blur(15px);border-bottom:1px solid rgba(227,233,242,.9)}.crumb{font-size:13px;color:#71809a}.actions{display:flex;align-items:center;gap:10px}.pill{padding:7px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:12px;font-weight:800;color:#516079}.langs{display:flex;gap:2px;padding:3px;background:#fff;border:1px solid var(--line);border-radius:999px}.langs button{border:0;background:transparent;border-radius:999px;padding:7px 12px;min-width:42px;min-height:34px;color:#708099;font-size:11px;font-weight:900;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.langs button.active{background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff}.mobile-menu{display:none;border:0;background:#fff;border-radius:10px;padding:8px 10px}.content{max-width:1380px;margin:auto;padding:28px 4vw 80px}.hero{position:relative;overflow:hidden;padding:52px;border-radius:30px;color:#fff;background:radial-gradient(circle at 88% 12%,rgba(252,41,105,.50),transparent 29%),radial-gradient(circle at 70% 96%,rgba(124,36,234,.65),transparent 31%),linear-gradient(135deg,#123b79,#172d63 62%,#432d69);box-shadow:var(--shadow)}.hero:after{content:"";position:absolute;width:380px;height:380px;border:70px solid rgba(255,255,255,.05);border-radius:50%;right:-130px;bottom:-180px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:.11em;text-transform:uppercase;color:#dbe4ff}.hero h1{max-width:900px;margin:12px 0 16px;font-size:clamp(38px,5vw,66px);line-height:1.03;letter-spacing:-.045em}.hero p{max-width:800px;margin:0;color:#e8edff;font-size:18px}.hero-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}.hero-tags span{padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);font-size:12px}.section{scroll-margin-top:90px;margin:25px 0;padding:32px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,#ffffff 0%,#f8faff 100%);box-shadow:0 8px 28px rgba(22,43,91,.055)}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px}.kicker{color:var(--purple);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}h2{margin:3px 0 7px;font-size:clamp(25px,3vw,35px);letter-spacing:-.035em}h3{margin:0 0 7px;font-size:20px}.lead{margin:0;color:var(--muted);font-size:16px}.badge{flex:0 0 auto;padding:7px 11px;border-radius:999px;background:#f2edff;color:var(--purple);font-size:11px;font-weight:850}.flow{display:flex;gap:9px;overflow:auto;padding:8px 2px 13px;scrollbar-width:thin}.flow-card{position:relative;flex:0 0 165px;min-height:122px;padding:16px;border:1px solid #dbe5f5;border-radius:17px;background:linear-gradient(180deg,#eef4ff 0%,#f8fbff 100%);box-shadow:0 8px 20px rgba(13,38,76,.05)}.flow-card.wide{flex-basis:300px;background:linear-gradient(135deg,#ece6ff,#fff0f7)}.flow-card:not(:last-child):after{content:'→';position:absolute;right:-12px;top:45%;width:24px;height:24px;display:grid;place-items:center;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--blue);z-index:3;font-weight:900}.flow-num{width:27px;height:27px;display:grid;place-items:center;margin-bottom:10px;border-radius:9px;color:#fff;background:linear-gradient(135deg,var(--blue),var(--pink));font-size:11px;font-weight:900}.flow-card b{display:block;font-size:14px;color:#223252}.flow-card p{margin:5px 0 0;color:#60708b;font-size:11px}.subflow{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:9px}.subflow span{padding:7px 6px;text-align:center;border:1px solid #ddd4fa;border-radius:10px;background:rgba(255,255,255,.72);font-size:10px;color:#5d4a83}.grid{display:grid;gap:16px}.grid2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}.info-grid{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);gap:22px;align-items:start}.copy-card{padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#f8faff 0%,#f3f6fb 100%)}.step-no{display:inline-grid;place-items:center;width:34px;height:34px;margin-bottom:12px;border-radius:11px;color:#fff;background:linear-gradient(135deg,var(--blue),var(--purple));font-size:12px;font-weight:900}.checklist{padding:0;margin:15px 0 0;list-style:none}.checklist li{position:relative;padding:8px 0 8px 27px;border-bottom:1px dashed #e6eaf1;color:#47576f;font-size:14px}.checklist li:last-child{border-bottom:0}.checklist li:before{content:'✓';position:absolute;left:0;top:8px;display:grid;place-items:center;width:18px;height:18px;border-radius:999px;background:#e6fbf3;color:var(--good);font-weight:900;font-size:11px}.callout{margin-top:15px;padding:13px 15px;border:1px solid #d9e5ff;border-radius:14px;background:#f2f6ff;color:#37537f;font-size:13px}.callout.warn{border-color:#ffe1bd;background:#fff8ef;color:#8a541d}.callout.good{border-color:#cfeede;background:#f2fcf7;color:#246949}.cost{display:inline-flex;align-items:center;gap:7px;margin-top:14px;padding:8px 11px;border-radius:999px;font-size:11px;font-weight:900}.cost.seo{color:#6840bb;background:#f2ecff;border:1px solid #dfd2ff}.cost.ai{color:#126246;background:#eafbf3;border:1px solid #c8efdd}.cost.useful{color:#98540c;background:#fff4e6;border:1px solid #ffddb1}.shot{margin:0;overflow:hidden;border:1px solid #d4deea;border-radius:18px;background:#e7edf5;box-shadow:0 8px 22px rgba(21,43,83,.07)}.zoom{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}.shot img{display:block;width:100%;height:auto}.shot figcaption{padding:11px 14px;background:#fff;color:#66758e;font-size:11px}details.gallery{margin-top:16px;border:1px solid var(--line);border-radius:16px;background:#fafbfe}details.gallery summary{cursor:pointer;padding:13px 16px;color:#49607e;font-size:13px;font-weight:850}details.gallery .inside{padding:0 14px 14px}.mini-title{display:flex;align-items:center;gap:0;margin:26px 0 12px;padding-top:2px}.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.fact-card{padding:18px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,#f7f9fe,#eef3fa)}.fact-card strong{display:block;margin-bottom:5px}.fact-card p{margin:0;color:var(--muted);font-size:13px}.tariff-scroll{width:100%;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.tariff-scroll .tariff-table{min-width:660px}
.tariff-table{display:grid;grid-template-columns:1.15fr repeat(3,1fr);overflow:hidden;border:1px solid var(--line);border-radius:17px}.tariff-table div{padding:12px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px}.tariff-table div:nth-child(4n){border-right:0}.tariff-table .head{background:#f3f6fb;font-weight:900;color:#41516a}.tariff-table .name{font-weight:800}.earn-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.earn-step{padding:18px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(135deg,#fafbff,#fff)}.earn-step b{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#eef3ff;color:var(--blue);margin-bottom:12px}.earn-step p{margin:0;color:var(--muted);font-size:13px}.faq{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.faq details{padding:15px 17px;border:1px solid var(--line);border-radius:15px;background:#fbfcff}.faq summary{cursor:pointer;font-weight:850}.faq p{margin:10px 0 0;color:var(--muted);font-size:13px}.footer{padding:28px 10px;text-align:center;color:#8490a4;font-size:11px}.lightbox{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(8,16,34,.88);z-index:100}.lightbox.open{display:flex}.lightbox img{max-width:96vw;max-height:90vh;border-radius:12px;box-shadow:0 20px 80px rgba(0,0,0,.35)}.lightbox button{position:absolute;top:18px;right:22px;border:0;border-radius:999px;background:#fff;color:#1b2942;width:40px;height:40px;font-size:20px;cursor:pointer}.search-hidden{display:none!important}@media(max-width:1050px){.app{grid-template-columns:1fr}.side{position:fixed;left:-300px;width:280px;transition:.25s;box-shadow:0 20px 50px rgba(0,0,0,.16)}.side.open{left:0}.mobile-menu{display:inline-flex}.info-grid,.grid2{grid-template-columns:1fr}.fact-grid,.earn-steps{grid-template-columns:1fr}}@media(max-width:680px){.crumb{display:none}.langs{position:relative;z-index:30}.langs button{min-width:44px;min-height:38px;padding:8px 12px}.content{padding:18px 14px 60px}.hero{padding:34px 23px;border-radius:24px}.section{padding:22px 17px;border-radius:20px}.topbar{padding:0 14px}.pill{display:none}.grid3,.faq{grid-template-columns:1fr}.flow-card{flex-basis:150px}}


/* v27 — professional GIF carousel + mass editing */
.video-section{overflow:hidden}
.video-head{align-items:flex-start}
.video-count{display:flex;align-items:baseline;gap:4px;min-width:72px;justify-content:center;padding:10px 14px;border:1px solid var(--line);border-radius:999px;background:#f8fafc;color:var(--muted);font-weight:800}
.video-count #gifCurrent{font-size:22px;color:var(--navy)}
.gif-carousel{margin-top:18px;border:1px solid #dce4ef;border-radius:24px;background:linear-gradient(180deg,#fbfcff 0%,#f4f7fb 100%);box-shadow:0 18px 46px rgba(23,44,88,.09);overflow:hidden}
.gif-toolbar{display:grid;grid-template-columns:52px 1fr 52px;gap:14px;align-items:center;padding:16px 18px;border-bottom:1px solid #e4eaf2;background:rgba(255,255,255,.86);backdrop-filter:blur(8px)}
.gif-nav{width:44px;height:44px;border-radius:14px;border:1px solid #d8e1ec;background:#fff;color:var(--navy);font-size:23px;font-weight:800;cursor:pointer;box-shadow:0 4px 14px rgba(16,46,103,.07);transition:.18s ease}
.gif-nav:hover{transform:translateY(-1px);border-color:#b8c7dd;box-shadow:0 8px 18px rgba(16,46,103,.11)}
.gif-dots{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap}
.gif-dot{width:9px;height:9px;border-radius:999px;border:0;background:#cbd5e1;padding:0;cursor:pointer;transition:.2s ease}
.gif-dot.active{width:28px;background:linear-gradient(90deg,var(--blue),var(--purple))}
.gif-stage{position:relative;padding:20px;touch-action:pan-y}
.gif-slide{display:none;animation:gifFade .24s ease}
.gif-slide.active{display:block}
@keyframes gifFade{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
.gif-label{display:flex;align-items:flex-start;gap:14px;margin-bottom:14px}
.gif-num{display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#eaf0ff,#f3eaff);color:var(--blue);font-weight:900}
.gif-label h3{margin:0 0 3px;font-size:20px;color:var(--ink)}
.gif-label p{margin:0;color:var(--muted);font-size:14px}
.gif-frame{position:relative;border-radius:18px;overflow:hidden;border:1px solid #dce4ef;background:#eef2f7;aspect-ratio:16/7.35;display:flex;align-items:center;justify-content:center}
.gif-media{display:block;width:100%;height:100%;object-fit:contain;background:#f5f7fa}
.gif-hint{padding:0 20px 18px;color:#7b879a;font-size:12px;text-align:center}
.mass-intro{align-items:stretch}
.mass-value{padding:24px;border-radius:22px;border:1px solid rgba(124,36,234,.18);background:linear-gradient(135deg,rgba(36,86,230,.06),rgba(124,36,234,.09));box-shadow:0 10px 30px rgba(23,44,88,.06)}
.mass-value-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;font-size:24px;font-weight:900;margin-bottom:16px}
.mass-value h3{margin:0 0 8px;color:var(--navy);font-size:22px}
.mass-value p{margin:0;color:var(--muted)}
.mass-grid{margin-top:18px}
.mass-grid .shot{height:100%}
@media(max-width:760px){
  .video-head{gap:12px}.video-count{min-width:62px;padding:8px 11px}.video-count #gifCurrent{font-size:19px}
  .gif-carousel{border-radius:18px}.gif-toolbar{grid-template-columns:44px 1fr 44px;padding:12px 10px;gap:8px}.gif-nav{width:40px;height:40px;border-radius:12px}.gif-dots{gap:5px}.gif-dot{width:7px;height:7px}.gif-dot.active{width:20px}
  .gif-stage{padding:14px}.gif-label{gap:10px}.gif-num{flex-basis:38px;height:38px;border-radius:12px}.gif-label h3{font-size:17px}.gif-label p{font-size:12px}.gif-frame{border-radius:14px;aspect-ratio:16/8.4}.gif-hint{padding:0 14px 14px}
  .mass-value{padding:18px}.mass-value h3{font-size:19px}
}

/* Final production additions */
.langs a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;padding:8px 12px;border-radius:10px;text-decoration:none;color:var(--muted);font-weight:900}
.langs a.active{background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;box-shadow:0 3px 12px rgba(36,86,230,.24)}
.tariff-cta{display:flex;justify-content:flex-start;margin-top:18px}.tariff-cta a{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff;text-decoration:none;font-weight:900;box-shadow:0 10px 24px rgba(36,86,230,.18)}
.tariff-cta a:hover{transform:translateY(-1px)}
.gif-frame::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#eef2f7 25%,#f7f9fc 50%,#eef2f7 75%);background-size:200% 100%;animation:gifSkeleton 1.2s infinite;z-index:0}.gif-frame.loaded::before{display:none}@keyframes gifSkeleton{to{background-position:-200% 0}}
.gif-media{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.gif-slide,.gif-nav,.tariff-cta a{animation:none!important;transition:none!important}.gif-frame::before{animation:none!important}}


/* v29 — markup/style separation utilities */
.topbar-left{display:flex;align-items:center;gap:10px}
.mt-16{margin-top:16px}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.lang-gateway{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#edf1f7,#f7f9fc)}
.lang-gateway-card{width:min(520px,100%);padding:38px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow);text-align:center}
.lang-gateway-card h1{margin:0 0 8px;color:var(--navy);font-size:32px}.lang-gateway-card p{margin:0 0 22px;color:var(--muted)}
.lang-gateway-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.lang-gateway-actions a{padding:11px 18px;border-radius:12px;text-decoration:none;font-weight:900;background:linear-gradient(135deg,var(--blue),var(--purple));color:#fff}

/* Final language switch: active language is circular */
.langs a{width:42px;height:42px;min-width:42px;padding:0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center}
.langs a.active{border-radius:50%;}
@media(max-width:680px){.langs a{width:42px;height:42px;min-width:42px;padding:0;border-radius:50%;}}