.safe-hero{padding:58px 0 70px;background:radial-gradient(circle at 8% 9%,rgba(108,92,231,.16),transparent 24%),radial-gradient(circle at 91% 22%,rgba(0,194,168,.14),transparent 22%)}
.breadcrumbs{display:flex;align-items:center;gap:8px;margin-bottom:42px;color:var(--muted);font-size:.74rem}.breadcrumbs a:hover{color:var(--primary)}.hero-copy{text-align:center}.safe-hero h1{max-width:960px}.hero-pills{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:23px}.hero-pills span{padding:8px 11px;border:1px solid rgba(43,39,76,.09);border-radius:999px;color:#4e5068;background:rgba(255,255,255,.8);font-size:.7rem;font-weight:800;box-shadow:0 8px 24px rgba(53,49,110,.06)}.hero-pills b{margin-right:4px;color:#0c9f8b}
.safe-studio{margin-top:43px;overflow:hidden;border:1px solid rgba(43,39,76,.1);border-radius:27px;background:rgba(255,255,255,.94);box-shadow:0 30px 85px rgba(48,40,113,.16)}.studio-topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;border-bottom:1px solid var(--border);background:rgba(250,250,255,.92)}.studio-status{display:flex;align-items:center;gap:10px}.studio-status>span:last-child,.studio-status strong,.studio-status small{display:block}.studio-status strong{font-size:.78rem}.studio-status small{margin-top:2px;color:var(--muted);font-size:.62rem}.live-dot{width:9px;height:9px;border-radius:50%;background:#13bfa5;box-shadow:0 0 0 0 rgba(19,191,165,.35);animation:live-pulse 2s infinite}.topbar-actions{display:flex;gap:8px}.secondary-button,.upload-button{display:inline-flex;min-height:39px;align-items:center;justify-content:center;gap:7px;padding:0 12px;border:1px solid rgba(43,39,76,.11);border-radius:10px;color:#514f6c;background:#fff;font-size:.68rem;font-weight:850;cursor:pointer;transition:.2s}.secondary-button:hover{border-color:rgba(108,92,231,.28);color:var(--primary)}.upload-button{border-color:transparent;color:#fff;background:linear-gradient(135deg,#6c5ce7,#8f73ee);box-shadow:0 9px 21px rgba(108,92,231,.23)}.upload-button:hover{transform:translateY(-1px);box-shadow:0 12px 27px rgba(108,92,231,.3)}
.studio-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.75fr)}.preview-column,.control-column{min-width:0;padding:24px}.preview-column{border-right:1px solid var(--border);background:linear-gradient(145deg,#f8f7ff,#f1f8f7)}.section-label{display:flex;align-items:center;gap:10px;margin-bottom:15px}.section-label>span{display:grid;flex:0 0 auto;width:30px;height:30px;place-items:center;border-radius:9px;color:#fff;background:#262544;font-size:.61rem;font-weight:900}.section-label strong,.section-label small{display:block}.section-label strong{font-size:.79rem}.section-label small{margin-top:2px;color:var(--muted);font-size:.61rem}
.preview-shell{position:relative;padding:10px;border:1px solid rgba(38,37,68,.11);border-radius:19px;background:#fff;box-shadow:0 18px 48px rgba(37,33,83,.12);outline:none;transition:.2s}.preview-shell:focus-visible{box-shadow:0 0 0 4px rgba(108,92,231,.16),0 18px 48px rgba(37,33,83,.12)}.preview-shell.dragging{transform:scale(.995);border-color:#13bfa5;box-shadow:0 0 0 5px rgba(19,191,165,.12),0 18px 48px rgba(37,33,83,.12)}.device-bar{display:flex;align-items:center;gap:8px;padding:3px 3px 10px;color:#4e4e62;font-size:.62rem;font-weight:800}.youtube-mark{display:grid;width:25px;height:18px;place-items:center;border-radius:6px;background:#ff3151}.youtube-mark i{width:0;height:0;margin-left:2px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid #fff}.device-pill{margin-left:auto;padding:4px 7px;border-radius:999px;color:#6755d7;background:#eeebff;font-size:.55rem}.thumbnail-frame{--overlay-opacity:.72;position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:#1d1b2e;cursor:crosshair;user-select:none;transition:aspect-ratio .32s cubic-bezier(.22,.8,.28,1),width .32s cubic-bezier(.22,.8,.28,1),border-radius .25s}.thumbnail-frame.vertical{width:min(52%,350px);margin-inline:auto}.thumbnail-frame>img{width:100%;height:100%;display:block;object-fit:cover;pointer-events:none}.zone-layer,.thirds-grid,.safe-frame,.scan-beam,.drop-hint{position:absolute;inset:0;pointer-events:none}.risk-zone{position:absolute;display:flex;align-items:center;justify-content:center;padding:4px;color:#fff;background:rgba(255,63,103,var(--overlay-opacity));font-size:clamp(.43rem,1.25vw,.65rem);font-weight:900;letter-spacing:.04em;text-align:center;text-shadow:0 1px 3px rgba(87,9,31,.42);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}.risk-zone.soft{background:rgba(255,145,59,calc(var(--overlay-opacity)*.92))}.safe-frame{inset:var(--safe-top,8%) var(--safe-right,8%) var(--safe-bottom,8%) var(--safe-left,8%);border:2px solid rgba(67,245,192,.94);border-radius:8px;box-shadow:0 0 0 999px rgba(21,20,39,calc(var(--overlay-opacity)*.19)),0 0 18px rgba(56,255,194,.35),inset 0 0 14px rgba(56,255,194,.14);transition:.25s}.safe-frame span{position:absolute;top:-1px;left:50%;padding:4px 7px;transform:translate(-50%,-50%);border-radius:999px;color:#073f38;background:#5ef4cb;font-size:clamp(.42rem,1vw,.57rem);font-weight:950;letter-spacing:.06em;white-space:nowrap}.thirds-grid{display:none;background:linear-gradient(90deg,transparent 33.1%,rgba(255,255,255,.75) 33.1%,rgba(255,255,255,.75) 33.45%,transparent 33.45%,transparent 66.45%,rgba(255,255,255,.75) 66.45%,rgba(255,255,255,.75) 66.8%,transparent 66.8%),linear-gradient(0deg,transparent 33.1%,rgba(255,255,255,.75) 33.1%,rgba(255,255,255,.75) 33.45%,transparent 33.45%,transparent 66.45%,rgba(255,255,255,.75) 66.45%,rgba(255,255,255,.75) 66.8%,transparent 66.8%)}.thirds-grid.visible{display:block}.focus-point{position:absolute;z-index:6;width:34px;height:34px;padding:0;transform:translate(-50%,-50%);border:0;border-radius:50%;color:#17182a;background:#fff;box-shadow:0 0 0 3px #1ee0bc,0 7px 18px rgba(13,15,36,.35);cursor:grab;touch-action:none;transition:box-shadow .2s}.focus-point:active{cursor:grabbing}.focus-point span:before,.focus-point span:after{position:absolute;content:"";background:#25243e}.focus-point span:before{width:12px;height:2px;left:11px;top:16px}.focus-point span:after{width:2px;height:12px;left:16px;top:11px}.focus-point.risk{box-shadow:0 0 0 4px #ff416b,0 7px 18px rgba(13,15,36,.35)}.focus-point.celebrate{animation:focus-pop .55s}.scan-beam{height:3px;opacity:0;background:linear-gradient(90deg,transparent,#5ef4cb 25%,#fff 50%,#5ef4cb 75%,transparent);box-shadow:0 0 14px #5ef4cb}.thumbnail-frame.scanning .scan-beam{opacity:1;animation:scan 1s ease-in-out}.drop-hint{display:flex;align-items:center;justify-content:center;flex-direction:column;opacity:0;color:#fff;background:rgba(23,24,42,.82);backdrop-filter:blur(4px);transition:.2s}.drop-hint>span{display:grid;width:48px;height:48px;place-items:center;margin-bottom:9px;border-radius:14px;color:#262544;background:#fff;font-size:1.25rem}.drop-hint strong{font-size:.9rem}.drop-hint small{margin-top:4px;color:rgba(255,255,255,.72);font-size:.65rem}.preview-shell.dragging .drop-hint{opacity:1}.mock-meta{display:flex;align-items:center;gap:9px;padding:11px 4px 3px}.mock-avatar{flex:0 0 auto;width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#a18cf9,#17c9ae)}.mock-meta>span:nth-child(2){display:grid;flex:1;gap:4px}.mock-meta b{display:block;width:min(70%,250px);height:5px;border-radius:99px;background:#dfddea}.mock-meta b:nth-child(2){width:min(48%,170px);background:#ecebf2}.mock-meta i{width:64px;height:4px;border-radius:99px;background:#f0eff5}.mock-meta>strong{align-self:flex-start;margin-top:-46px;padding:4px 6px;border-radius:5px;color:#fff;background:rgba(16,17,27,.84);font-size:.58rem}.preview-tip{display:flex;align-items:center;justify-content:center;gap:6px;margin:13px 0 0;color:#65647a;font-size:.64rem;font-weight:700}.preview-tip span{color:var(--primary)}
.preset-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.preset-button{display:flex;align-items:center;gap:9px;padding:11px;border:1px solid rgba(43,39,76,.1);border-radius:12px;color:#4d4c64;background:#fff;text-align:left;transition:.2s}.preset-button:hover{border-color:rgba(108,92,231,.25);transform:translateY(-1px)}.preset-button.active{border-color:rgba(108,92,231,.34);color:#4f3fbd;background:#f0edff;box-shadow:0 8px 20px rgba(82,65,191,.09)}.preset-shape{display:grid;flex:0 0 auto;width:34px;height:30px;place-items:center}.preset-shape i{display:block;max-width:30px;max-height:27px;border:2px solid currentColor;border-radius:4px}.preset-copy strong,.preset-copy small{display:block}.preset-copy strong{font-size:.68rem}.preset-copy small{margin-top:2px;color:var(--muted);font-size:.55rem}
.safety-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;margin-top:14px;padding:14px;border:1px solid rgba(19,191,165,.2);border-radius:15px;background:linear-gradient(120deg,#ebfcf8,#f7fffd);transition:.25s}.safety-card.risk{border-color:rgba(255,65,107,.24);background:linear-gradient(120deg,#fff1f5,#fff8fa)}.safety-icon{display:grid;width:39px;height:39px;place-items:center;border-radius:12px;color:#fff;background:#10b99f;font-weight:950}.safety-card.risk .safety-icon{background:#ff416b}.safety-card>div:nth-child(2) small,.safety-card>div:nth-child(2) strong{display:block}.safety-card>div:nth-child(2) small{color:#0e8e7b;font-size:.51rem;font-weight:950;letter-spacing:.09em}.safety-card.risk>div:nth-child(2) small{color:#d52d56}.safety-card>div:nth-child(2) strong{margin-top:2px;font-size:.75rem}.safety-card p{margin:3px 0 0;color:#67677e;font-size:.59rem;line-height:1.4}.safety-score{text-align:center}.safety-score strong,.safety-score small{display:block}.safety-score strong{color:#0d9f89;font-size:1.05rem}.safety-card.risk .safety-score strong{color:#db315a}.safety-score small{color:var(--muted);font-size:.49rem}
.control-card{margin-top:12px;padding:3px 14px;border:1px solid rgba(43,39,76,.09);border-radius:15px;background:#fff}.control-row{display:flex;align-items:center;justify-content:space-between;gap:13px;padding:11px 0;border-bottom:1px solid rgba(43,39,76,.07)}.control-row>span strong,.control-row>span small{display:block}.control-row>span strong{font-size:.67rem}.control-row>span small{margin-top:2px;color:var(--muted);font-size:.55rem}.switch{position:relative;display:inline-block;flex:0 0 auto;width:37px;height:21px}.switch input{position:absolute;opacity:0}.switch span{position:absolute;inset:0;border-radius:99px;background:#d8d7e1;transition:.2s}.switch span:after{position:absolute;width:15px;height:15px;top:3px;left:3px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.18);content:"";transition:.2s}.switch input:checked+span{background:#6c5ce7}.switch input:checked+span:after{transform:translateX(16px)}.switch input:focus-visible+span{box-shadow:0 0 0 3px rgba(108,92,231,.16)}.opacity-control{display:block;padding:11px 0}.opacity-control>span{display:flex;justify-content:space-between;font-size:.67rem}.opacity-control output{color:var(--primary);font-weight:850}.opacity-control input{width:100%;height:4px;margin-top:11px;accent-color:#6c5ce7}.legend{display:flex;flex-wrap:wrap;gap:12px;margin:12px 2px;color:var(--muted);font-size:.55rem;font-weight:750}.legend span{display:flex;align-items:center;gap:5px}.legend i{width:9px;height:9px;border-radius:3px}.safe-key{border:2px solid #13bfa5}.risk-key{background:#ff416b}.focus-key{border-radius:50%!important;background:#fff;box-shadow:0 0 0 2px #13bfa5}.download-button{display:flex;width:100%;align-items:center;justify-content:center;gap:10px;padding:12px;border:0;border-radius:13px;color:#fff;background:linear-gradient(135deg,#29264f,#6c5ce7);box-shadow:0 12px 27px rgba(67,53,155,.2);transition:.2s}.download-button:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(67,53,155,.28)}.download-button>span:first-child{font-size:1.1rem}.download-button strong,.download-button small{display:block;text-align:left}.download-button strong{font-size:.71rem}.download-button small{margin-top:2px;color:rgba(255,255,255,.69);font-size:.55rem}.privacy-note{display:flex;justify-content:center;gap:7px;margin:15px 0 0;color:var(--muted);font-size:.66rem}
.content-section{padding:72px 0}.content-section.alt{border-block:1px solid rgba(43,39,76,.06);background:rgba(249,249,254,.82)}.content{max-width:1060px}.section-kicker{display:inline-block;margin-bottom:9px;color:var(--primary);font-size:.67rem;font-weight:950;letter-spacing:.11em;text-transform:uppercase}.content h2{margin:0 0 14px;font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.04em}.content>p,.try-heading p{max-width:820px;margin:0;color:var(--muted);line-height:1.75}.benefit-grid,.tips-grid,.try-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}.benefit-card,.tips-grid article,.try-card{padding:23px;border:1px solid rgba(43,39,76,.09);border-radius:19px;background:#fff;box-shadow:0 11px 33px rgba(45,39,104,.055)}.benefit-card.wow-card{transform:translateY(-7px);border-color:rgba(19,191,165,.25);box-shadow:0 19px 40px rgba(15,166,144,.1)}.benefit-icon{display:grid;width:46px;height:44px;place-items:center;border-radius:13px;color:var(--primary);background:#efedff;font-size:.66rem;font-weight:950}.benefit-card h3,.tips-grid h3{margin:15px 0 8px;font-size:1rem}.benefit-card p,.tips-grid p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.67}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:28px 0 0;padding:0;list-style:none}.steps li{padding:20px;border:1px solid rgba(43,39,76,.09);border-radius:17px;background:#fff}.steps li>span{display:grid;width:36px;height:36px;place-items:center;margin-bottom:14px;border-radius:11px;color:#fff;background:linear-gradient(135deg,var(--primary),#00bda8);font-size:.68rem;font-weight:900}.steps strong{font-size:.83rem}.steps p{margin:7px 0 0;color:var(--muted);font-size:.76rem;line-height:1.62}.tip-number{color:#c8c2f8;font-size:1.8rem;font-weight:950}.tips-grid h3{margin-top:8px}.faq{display:grid;gap:10px;margin-top:26px}.faq details{border:1px solid rgba(43,39,76,.09);border-radius:15px;background:#fff}.faq summary{position:relative;padding:18px 48px 18px 19px;font-weight:800;cursor:pointer;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{position:absolute;right:19px;color:var(--primary);font-size:1.1rem;content:"+"}.faq details[open] summary:after{content:"-"}.faq details p{margin:0;padding:0 19px 19px;color:var(--muted);font-size:.82rem;line-height:1.7}.try-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.try-heading h2{margin-bottom:8px}.try-heading>a{flex:0 0 auto;color:var(--primary);font-size:.78rem;font-weight:850}.try-grid{grid-template-columns:repeat(4,1fr)}.try-card{display:flex;align-items:center;gap:11px;padding:17px;transition:.22s}.try-card:hover{transform:translateY(-4px);border-color:rgba(108,92,231,.25);box-shadow:0 18px 40px rgba(53,49,110,.11)}.try-icon{display:grid;flex:0 0 auto;width:42px;height:42px;place-items:center;border-radius:12px;color:var(--primary);background:#efedff;font-size:.59rem;font-weight:950}.try-card>span:nth-child(2){min-width:0}.try-card strong,.try-card small{display:block}.try-card strong{font-size:.74rem}.try-card small{margin-top:4px;color:var(--muted);font-size:.64rem;line-height:1.4}.try-card b{margin-left:auto;color:#7967e9}.toast{position:fixed;z-index:100;right:22px;bottom:22px;padding:12px 16px;opacity:0;transform:translateY(14px);border-radius:12px;color:#fff;background:#26243b;box-shadow:0 18px 40px rgba(18,17,40,.28);font-size:.74rem;font-weight:800;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translateY(0)}.spark{position:fixed;z-index:101;width:7px;height:7px;border-radius:2px;pointer-events:none;animation:spark .8s ease-out forwards}
@keyframes live-pulse{50%{box-shadow:0 0 0 8px rgba(19,191,165,0)}}@keyframes scan{0%{top:0}50%{top:99%}100%{top:0}}@keyframes focus-pop{50%{transform:translate(-50%,-50%) scale(1.3)}}@keyframes spark{to{opacity:0;transform:translate(var(--x),var(--y)) rotate(220deg) scale(.2)}}
@media(max-width:960px){.studio-layout{grid-template-columns:1fr}.preview-column{border-right:0;border-bottom:1px solid var(--border)}.preview-shell{max-width:760px;margin:auto}.control-column{max-width:760px;width:100%;margin:auto}.steps{grid-template-columns:repeat(2,1fr)}.try-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.safe-hero{padding:42px 0 56px}.breadcrumbs{margin-bottom:32px}.safe-hero h1{font-size:clamp(2.55rem,13.5vw,4rem)}.safe-studio{margin-top:33px;border-radius:21px}.studio-topbar{align-items:flex-start;flex-direction:column;padding:14px}.topbar-actions{width:100%}.secondary-button,.upload-button{flex:1}.preview-column,.control-column{padding:15px}.thumbnail-frame.vertical{width:min(76%,350px)}.preset-grid{grid-template-columns:1fr 1fr}.content-section{padding:54px 0}.benefit-grid,.tips-grid,.try-grid{grid-template-columns:1fr}.benefit-card.wow-card{transform:none}.steps{grid-template-columns:1fr}.try-heading{align-items:flex-start;flex-direction:column}.footer-inner{text-align:center}.safety-card{grid-template-columns:auto minmax(0,1fr)}.safety-score{display:none}}
@media(max-width:420px){.topbar-actions{flex-direction:column}.secondary-button,.upload-button{width:100%}.preset-grid{grid-template-columns:1fr}.preview-tip{text-align:center}.mock-meta>strong{display:none}.safe-frame span{display:none}.risk-zone{font-size:.39rem}.control-column{padding-inline:12px}.toast{right:12px;bottom:12px;left:12px;text-align:center}}
@media(prefers-reduced-motion:reduce){.live-dot,.thumbnail-frame.scanning .scan-beam,.focus-point.celebrate,.spark{animation:none}.upload-button,.preview-shell,.thumbnail-frame,.preset-button,.download-button,.try-card{transition:none}}