:root {
  --ink: #27212c;
  --muted: #786f7d;
  --paper: #f8f4ee;
  --card: #fffdf9;
  --pink: #ef347c;
  --pink-dark: #d91f68;
  --pink-soft: #ffe1ec;
  --mint: #53d6ae;
  --yellow: #ffdb67;
  --blue: #a8dff2;
  --line: #e7ded5;
  --shadow: 0 18px 50px rgba(56, 39, 52, .09);
  font-family: Inter, ui-rounded, "SF Pro Rounded", "PingFang TC", system-ui, sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); min-height: 100vh; }
button, input, select { font: inherit; }
button { cursor: pointer; }
.visually-hidden { position: fixed; left: -9999px; }
.shell { min-height: 100vh; }
.topbar { height: 76px; display: flex; align-items: center; justify-content: space-between; padding: 0 5vw; border-bottom: 1px solid rgba(60,40,50,.08); background: rgba(248,244,238,.9); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 20; }
.brand { border: 0; background: none; display: flex; align-items: center; gap: 10px; color: var(--ink); }
.brand-mark { color: var(--pink); font-size: 28px; }
.brand-name { font: italic 700 27px Georgia, serif; letter-spacing: -.6px; }
.top-actions { display: flex; gap: 10px; align-items: center; }
.privacy { color: var(--muted); font-size: 13px; }
.avatar { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: white; font-weight: 800; }
.page { max-width: 1180px; margin: auto; padding: 52px 28px 80px; }
.eyebrow { color: var(--pink); font-weight: 850; font-size: 13px; letter-spacing: .13em; text-transform: uppercase; }
.hero { display: grid; grid-template-columns: 1.12fr .88fr; gap: 30px; align-items: stretch; margin-bottom: 36px; }
.hero-copy { padding: 38px 12px 32px 0; }
h1 { font-size: clamp(42px, 6.3vw, 76px); line-height: .98; letter-spacing: -.055em; margin: 17px 0 22px; max-width: 780px; }
.hero p { font-size: 18px; color: var(--muted); line-height: 1.7; max-width: 650px; }
.local-pill { display: inline-flex; gap: 8px; align-items: center; margin-top: 18px; padding: 9px 13px; background: #e4f8f1; color: #17795e; border-radius: 99px; font-size: 13px; font-weight: 750; }
.hero-art { min-height: 330px; border-radius: 32px; background: #251f29; position: relative; overflow: hidden; box-shadow: var(--shadow); }
.frame-landscape { position: absolute; width: 78%; aspect-ratio: 16/9; left: 11%; top: 22%; border-radius: 16px; background: linear-gradient(140deg,#9570b9,#f59b9d 45%,#efd26d); overflow: hidden; }
.frame-landscape:before,.frame-landscape:after { content:""; position:absolute; bottom:0; width:34%; height:74%; border-radius: 50% 50% 8px 8px; background:#372b47; }
.frame-landscape:before { left:18%; }.frame-landscape:after { right:13%; background:#58405d; }
.crop-window { position:absolute; inset:8% 38%; border:3px solid white; border-radius:12px; box-shadow:0 0 0 999px rgba(0,0,0,.24); animation: camera 4s ease-in-out infinite alternate; }
@keyframes camera { from { transform:translateX(-46px); } to { transform:translateX(52px); } }
.motion-line { position:absolute; left:18%; right:18%; bottom:14%; height:5px; border-radius:5px; background:#564e59; }
.motion-line span { display:block; width:66%; height:100%; border-radius:5px; background:var(--mint); }
.motion-dot { position:absolute; width:14px; height:14px; border-radius:50%; background:var(--pink); bottom:calc(14% - 4px); left:63%; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card { border:1px solid var(--line); border-radius:25px; padding:25px; background:var(--card); text-align:left; min-height:260px; display:flex; flex-direction:column; transition:.2s ease; box-shadow:0 7px 20px rgba(40,25,35,.03); }
.feature-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); border-color:#f3a2c1; }
.feature-card.primary { background:var(--pink); color:white; border-color:var(--pink); }
.feature-icon { width:53px; height:53px; display:grid; place-items:center; border-radius:16px; background:var(--pink-soft); color:var(--pink); font-size:24px; margin-bottom:26px; }
.primary .feature-icon { color:white; background:rgba(255,255,255,.18); }
.feature-card h2 { font-size:25px; letter-spacing:-.035em; margin:0 0 10px; }
.feature-card p { color:var(--muted); line-height:1.6; margin:0 0 24px; flex:1; }
.primary p { color:rgba(255,255,255,.78); }
.card-cta { font-weight:850; display:flex; justify-content:space-between; align-items:center; }
.section-title { margin:55px 0 18px; display:flex; justify-content:space-between; align-items:end; }
.section-title h2 { margin:0; font-size:28px; }.section-title span { color:var(--muted); font-size:14px; }
.recent-empty { padding:32px; border:1px dashed #cfc4bb; border-radius:20px; text-align:center; color:var(--muted); }
.flow { max-width:1060px; }
.flow-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:30px; }
.back { border:0; background:white; width:46px; height:46px; border-radius:50%; font-size:22px; box-shadow:0 5px 20px rgba(0,0,0,.08); }
.steps { display:flex; gap:8px; align-items:center; color:var(--muted); font-size:12px; font-weight:750; }
.step-dot { width:28px; height:4px; border-radius:9px; background:#ddd3cc; }.step-dot.on { background:var(--pink); }
.stage-title { margin:12px 0 8px; font-size:clamp(34px,5vw,56px); letter-spacing:-.05em; }.stage-subtitle { color:var(--muted); font-size:17px; margin-bottom:30px; }
.upload-zone { min-height:420px; border:2px dashed #d9cbc2; border-radius:28px; background:var(--card); display:grid; place-items:center; text-align:center; padding:40px; }
.upload-icon { width:84px; height:84px; border-radius:24px; display:grid; place-items:center; margin:0 auto 22px; background:var(--pink-soft); color:var(--pink); font-size:37px; }
.upload-zone h3 { font-size:25px; margin:0 0 8px; }.upload-zone p { color:var(--muted); }
.btn { border:0; border-radius:14px; padding:15px 22px; font-weight:850; background:var(--ink); color:white; transition:.15s; }
.btn:hover { transform:translateY(-1px); }.btn.primary { background:var(--pink); }.btn.secondary { background:white; color:var(--ink); border:1px solid var(--line); }.btn.mint { background:var(--mint); color:#123d32; }.btn:disabled { opacity:.42; cursor:not-allowed; transform:none; }
.video-layout,.editor-layout { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr); gap:22px; align-items:start; }
.viewer { background:#111; border-radius:24px; overflow:hidden; min-height:430px; position:relative; display:grid; place-items:center; }
.viewer video,.viewer img { width:100%; height:100%; max-height:620px; object-fit:contain; display:block; }
.viewer-overlay { position:absolute; inset:0; pointer-events:none; }
.person-box { position:absolute; top:22%; width:17%; height:62%; border:3px solid var(--blue); border-radius:12px; pointer-events:auto; cursor:pointer; background:transparent; }
.person-box:before { content:attr(data-id); position:absolute; width:34px; height:34px; border-radius:50%; background:var(--yellow); display:grid; place-items:center; top:-19px; left:-4px; font-weight:900; color:var(--ink); }
.person-box.selected { border-color:var(--pink); box-shadow:0 0 0 4px rgba(239,52,124,.18); }.person-box.selected:before { background:var(--pink); color:white; }
.p1{left:18%}.p2{left:34%}.p3{left:50%}.p4{left:66%}
.panel { background:var(--card); border:1px solid var(--line); border-radius:24px; padding:23px; box-shadow:0 9px 30px rgba(44,29,39,.04); }
.panel h3 { margin:0 0 18px; font-size:20px; }.panel-note { color:var(--muted); font-size:13px; line-height:1.55; }
.choice-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:20px; }
.choice { border:1px solid var(--line); background:white; padding:12px 8px; border-radius:12px; font-weight:780; color:var(--ink); }.choice.on { border-color:var(--pink); color:var(--pink); background:var(--pink-soft); }
.field { margin:18px 0; }.field label { display:flex; justify-content:space-between; font-size:14px; font-weight:750; margin-bottom:9px; }.field select { width:100%; padding:13px; border:1px solid var(--line); border-radius:12px; background:white; }
.toggle-row { display:flex; justify-content:space-between; align-items:center; padding:14px 0; border-top:1px solid var(--line); font-weight:700; }.toggle { width:45px; height:26px; border-radius:99px; background:#d8d0ca; padding:3px; border:0; }.toggle:after { content:""; display:block; width:20px; height:20px; border-radius:50%; background:white; transition:.2s; }.toggle.on { background:var(--mint); }.toggle.on:after { transform:translateX(19px); }
.wide { width:100%; margin-top:10px; }
.analysis { padding:34px; border-radius:27px; background:#1e1a20; color:white; }
.progress-ring { width:126px; height:126px; margin:10px auto 25px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(var(--pink) calc(var(--progress)*1%),#423944 0); position:relative; }.progress-ring:before { content:""; position:absolute; inset:10px; border-radius:50%; background:#1e1a20; }.progress-ring strong { position:relative; font-size:25px; }
.analysis-list { display:grid; gap:10px; max-width:480px; margin:0 auto; }.analysis-item { display:flex; justify-content:space-between; color:#aaa0aa; }.analysis-item.done { color:var(--mint); }
.timeline { height:6px; background:#423944; border-radius:10px; margin:30px 0 12px; position:relative; }.timeline-fill { width:72%; height:100%; background:var(--mint); border-radius:10px; }.risk { position:absolute; top:-5px; width:16px; height:16px; background:var(--pink); border:3px solid #1e1a20; border-radius:50%; }.r1{left:23%}.r2{left:56%}.r3{left:81%}
.results-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.clip-card { background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; }.clip-thumb { aspect-ratio:9/12; background:linear-gradient(140deg,#52415c,#ef8e9a); position:relative; overflow:hidden; }.clip-crop { position:absolute; inset:8% 25%; border:2px solid white; border-radius:8px; }.clip-info { padding:16px; }.clip-info h3 { margin:0 0 8px; }.badges { display:flex; flex-wrap:wrap; gap:6px; }.badge { padding:5px 8px; border-radius:99px; background:#e3f8f1; color:#197c62; font-size:11px; font-weight:800; }.clip-actions { display:flex; gap:8px; margin-top:14px; }.clip-actions button { flex:1; padding:9px; border-radius:9px; border:1px solid var(--line); background:white; font-weight:750; }
.toolbar { display:grid; gap:8px; }.tool-tabs { display:flex; gap:6px; overflow:auto; padding-bottom:10px; }.tool-tab { white-space:nowrap; border:0; background:#eee7e1; padding:9px 12px; border-radius:99px; font-size:12px; font-weight:800; }.tool-tab.on { background:var(--ink); color:white; }
.slider-row { margin:14px 0; }.slider-row label { display:flex; justify-content:space-between; font-size:13px; font-weight:750; }.slider-row input { width:100%; accent-color:var(--pink); margin-top:8px; }
.preset-row { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; }.preset { padding:10px 4px; border:1px solid var(--line); background:white; border-radius:10px; font-size:12px; font-weight:750; }.preset.on { background:var(--pink-soft); color:var(--pink); border-color:var(--pink); }
.compare-hint { position:absolute; left:16px; bottom:16px; padding:8px 12px; border-radius:99px; color:white; background:rgba(0,0,0,.55); font-size:12px; }
.empty-photo { color:#aaa; text-align:center; }.empty-photo .upload-icon { background:#332e34; }
.summary { display:grid; gap:11px; margin-bottom:18px; }.summary-row { display:flex; justify-content:space-between; color:var(--muted); }.summary-row strong { color:var(--ink); }
.footer-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:22px; }
.toast { position:fixed; left:50%; bottom:28px; transform:translateX(-50%); background:#211c22; color:white; padding:13px 18px; border-radius:12px; z-index:90; box-shadow:var(--shadow); }
@media(max-width:820px){.hero,.video-layout,.editor-layout{grid-template-columns:1fr}.hero-art{min-height:280px}.cards{grid-template-columns:1fr}.feature-card{min-height:220px}.results-grid{grid-template-columns:1fr 1fr}.privacy{display:none}.page{padding:32px 18px 60px}.viewer{min-height:300px}}
@media(max-width:520px){.topbar{height:64px;padding:0 18px}.brand-name{font-size:23px}.hero-copy{padding-top:10px}.hero-art{min-height:230px}h1{font-size:44px}.results-grid{grid-template-columns:1fr}.steps span{display:none}.choice-grid{grid-template-columns:repeat(2,1fr)}.preset-row{grid-template-columns:1fr 1fr}}

/* FollowCut brand home */
.shell:has(.fc-home){background:#0c0f13;color:#f7f8fb;min-height:100vh}.shell:has(.fc-home) .topbar{background:rgba(12,15,19,.9);border-color:rgba(255,255,255,.07);color:white}.shell:has(.fc-home) .brand{color:white}.brand-cn{font-weight:700;font-size:14px;margin-left:-3px}.pro-pill{padding:6px 10px;border-radius:99px;background:#292821;color:#f6c865;font-size:12px;font-weight:850}.top-icon{width:31px;height:31px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:transparent;color:inherit;font-weight:800}.fc-home{max-width:1060px;padding-top:24px;padding-bottom:110px}.fc-hero{height:510px;border-radius:28px;position:relative;overflow:hidden;background:#111820;box-shadow:0 22px 70px rgba(0,0,0,.35)}.fc-hero>img{width:100%;height:100%;object-fit:cover;object-position:56% 30%}.fc-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,12,.95) 0%,rgba(5,8,12,.78) 34%,rgba(5,8,12,.12) 68%,rgba(5,8,12,.28)),linear-gradient(0deg,rgba(0,0,0,.68),transparent 45%)}.fc-hero-copy{position:absolute;left:48px;top:84px;z-index:2}.fc-kicker{font-size:11px;letter-spacing:.15em;color:#f2c76f;font-weight:850}.fc-hero h1{font-size:43px;line-height:1.16;letter-spacing:-.045em;margin:14px 0 17px}.fc-hero-copy p{font-size:14px;line-height:1.65;color:#c7cbd2}.fc-start{border:0;border-radius:99px;background:linear-gradient(135deg,#ffe4a3,#f0b951);color:#201b12;font-weight:900;padding:16px 24px;margin-top:17px;min-width:164px;text-align:left;box-shadow:0 8px 25px rgba(240,185,81,.23)}.fc-start b{float:right;font-size:25px;line-height:16px}.fc-rec{position:absolute;right:19px;top:17px;font-size:11px}.fc-rec i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ef5063;margin-right:5px}.fc-ratio{position:absolute;right:24px;bottom:100px;font-size:12px}.fc-focus{position:absolute;right:15%;top:12%;width:28%;height:62%;border:2px solid rgba(255,255,255,.9);border-radius:18px;transform:rotate(4deg);clip-path:polygon(0 0,28% 0,28% 2%,72% 2%,72% 0,100% 0,100% 26%,98% 26%,98% 74%,100% 74%,100% 100%,72% 100%,72% 98%,28% 98%,28% 100%,0 100%,0 74%,2% 74%,2% 26%,0 26%)}.fc-filmstrip{position:absolute;left:42%;right:5%;bottom:29px;height:68px;display:flex;gap:5px;padding:5px;border-radius:9px;background:rgba(5,7,9,.68);border:1px solid rgba(255,255,255,.25)}.fc-filmstrip span{flex:1;border-radius:4px;background-image:url('assets/followcut-hero.png');background-size:520%;border:1px solid rgba(255,255,255,.34)}.fc-tools{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px}.fc-tool{min-height:250px;border:0;border-radius:23px;padding:25px;text-align:left;color:white;position:relative;overflow:hidden}.fc-tool:after{content:"";position:absolute;inset:35% 0 0;background-image:linear-gradient(0deg,rgba(18,13,25,.08),rgba(20,16,30,.62)),url('assets/followcut-hero.png');background-size:cover;background-position:center 22%;opacity:.52}.fc-tool>*{position:relative;z-index:2}.fc-tool.track{background:linear-gradient(145deg,#8d91ff,#6355ba)}.fc-tool.beauty{background:linear-gradient(145deg,#d599ad,#8f5e70)}.fc-tool.photo{background:linear-gradient(145deg,#7ca2ff,#5b73b3)}.fc-tool-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:13px;background:rgba(255,255,255,.18);font-size:21px}.fc-tool h2{margin:25px 0 8px;font-size:22px}.fc-tool p{font-size:12px;line-height:1.65;color:rgba(255,255,255,.8)}.fc-tool>b{position:absolute;right:22px;bottom:20px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:white;color:#6e6588;font-size:19px}.fc-section-title{display:flex;justify-content:space-between;align-items:center;margin:31px 0 12px}.fc-section-title h2{font-size:18px}.fc-section-title button{border:0;background:none;color:#c3c6cc}.project-list{display:grid;gap:10px}.project-row{display:grid;grid-template-columns:116px 1fr auto;gap:16px;align-items:center;background:#181c22;border:1px solid rgba(255,255,255,.04);padding:10px;border-radius:16px}.project-thumb{height:76px;border-radius:10px;background-image:url('assets/followcut-hero.png');background-size:cover;position:relative}.project-thumb span{position:absolute;right:5px;bottom:4px;font-size:10px;background:rgba(0,0,0,.55);padding:2px 4px;border-radius:4px}.project-row h3{font-size:15px;margin:0 0 7px}.project-row h3 small{color:#777d87}.project-row p,.project-row time{font-size:11px;color:#8e949e}.project-row button{border:0;background:none;color:#a5abb4;font-size:18px}.mobile-nav{display:none}
@media(max-width:620px){.shell:has(.fc-home) .topbar{position:relative;height:106px;align-items:flex-start;padding-top:24px}.shell:has(.fc-home) .privacy{display:block;position:absolute;left:23px;top:63px;font-size:11px}.shell:has(.fc-home) .brand-name{font-size:28px}.shell:has(.fc-home) .top-actions{gap:8px}.fc-home{padding:16px 14px 108px}.fc-hero{height:390px;border-radius:20px}.fc-hero>img{object-position:59% center}.fc-shade{background:linear-gradient(90deg,rgba(5,8,12,.9),rgba(5,8,12,.22) 72%),linear-gradient(0deg,rgba(0,0,0,.8),transparent 50%)}.fc-hero-copy{left:22px;top:54px}.fc-kicker{display:none}.fc-hero h1{font-size:27px;margin-top:0}.fc-hero-copy p{font-size:11px}.fc-start{padding:13px 17px;min-width:140px}.fc-focus{right:9%;top:8%;width:33%;height:51%}.fc-filmstrip{left:34%;right:4%;height:50px;bottom:20px}.fc-ratio{bottom:83px}.fc-tools{gap:8px}.fc-tool{min-height:228px;border-radius:15px;padding:14px}.fc-tool-icon{width:39px;height:39px}.fc-tool h2{font-size:16px;margin-top:19px;white-space:nowrap}.fc-tool p{font-size:10px}.fc-tool>b{width:31px;height:31px;right:12px;bottom:12px}.project-row{grid-template-columns:92px 1fr auto;gap:11px}.project-thumb{height:64px}.project-row p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}.mobile-nav{display:flex;position:fixed;z-index:50;left:0;right:0;bottom:0;height:78px;background:rgba(18,22,27,.96);backdrop-filter:blur(18px);border-top:1px solid rgba(255,255,255,.08);justify-content:space-around;align-items:center}.mobile-nav span{display:flex;flex-direction:column;align-items:center;gap:4px;color:#777e88}.mobile-nav span.active{color:#f1c76e}.mobile-nav small{font-size:9px}.mobile-nav button{width:56px;height:56px;border:0;border-radius:50%;background:linear-gradient(145deg,#f7d788,#dca94d);font-size:29px;color:#282114}}
.fc-filmstrip span{background-size:220%}
.export-beauty{margin-top:24px;display:grid;grid-template-columns:1.3fr .8fr;gap:12px 30px;align-items:center;border-color:#efd58b;background:linear-gradient(135deg,#fffdf9,#fff7e4)}.beauty-copy{display:flex;align-items:center;gap:16px}.beauty-symbol{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#ffefba;color:#b87b16;font-size:23px}.beauty-copy h3{margin:0 0 6px}.beauty-copy p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}.beauty-control .toggle-row{border:0}.beauty-control .slider-row{margin:5px 0}.beauty-control .disabled{opacity:.38}.beauty-deep{grid-column:1/-1;border:0;border-top:1px solid #eadfc8;background:transparent;text-align:left;padding:15px 0 0;color:#9a6714;font-size:13px;font-weight:800}.beauty-badge{background:#fff0bf;color:#9a6714}
@media(max-width:620px){.export-beauty{grid-template-columns:1fr}.beauty-deep{grid-column:1}.beauty-copy p{font-size:12px}}
.fc-hero>img{object-position:54% 18%}
@media(max-width:620px){.fc-hero>img{object-position:58% 20%}}
.export-stage{min-height:calc(100vh - 76px);background:#060708;color:white;padding:22px max(22px,4vw) 50px}.export-head{display:flex;justify-content:space-between;align-items:center;max-width:1040px;margin:0 auto 20px}.export-head>div{display:flex;flex-direction:column;align-items:center}.export-head b{font:italic 700 24px Georgia,serif}.export-head small{font-size:10px;color:#878d95}.export-back,.export-save{width:48px;height:48px;border-radius:50%;border:1px solid #30343a;background:#191b1f;color:white;font-size:27px}.export-save{background:#ed3477;border-color:#ed3477}.export-work{max-width:880px;margin:auto;display:grid;grid-template-columns:minmax(280px,540px) 76px;justify-content:center;gap:12px}.export-preview{height:620px;position:relative;overflow:hidden;background:#111;border-radius:8px}.export-preview>img,.before-layer img{width:100%;height:100%;object-fit:cover;object-position:center 20%}.before-layer{display:none;position:absolute;inset:0 50% 0 0;overflow:hidden}.before-layer img{width:200%;filter:saturate(.78) contrast(.92) brightness(.9)}.is-comparing .before-layer{display:block}.compare-line{display:none;position:absolute;top:0;bottom:0;left:50%;width:2px;background:white}.is-comparing .compare-line{display:block}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:72px;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:white;font-size:26px}.quality-label{position:absolute;top:13px;left:13px;background:rgba(0,0,0,.55);padding:6px 9px;border-radius:7px;font-size:11px;color:#f2ce75}.export-tools{display:flex;flex-direction:column;gap:8px}.export-tools button{height:69px;border:1px solid #393d43;border-radius:13px;background:#0b0c0e;color:white;display:flex;flex-direction:column;align-items:center;justify-content:center}.export-tools button.on{background:#ed3477;border-color:#ff91b6}.export-tools b{font-size:21px}.export-tools span{font-size:11px;margin-top:4px}.export-dock{max-width:1040px;margin:20px auto 0;background:#f9f4ee;color:#27212c;border-radius:24px;padding:22px}.dock-title{display:flex;justify-content:space-between;align-items:center}.dock-title>div{display:grid;grid-template-columns:42px auto;align-items:center}.dock-title>div>span{grid-row:1/3;font-size:25px;color:#ed3477}.dock-title h2{margin:0;font-size:20px}.dock-title small{color:#ed3477;font-weight:800}.compare-button{border:1px solid #e4bbca;background:#fff0f5;border-radius:12px;padding:11px 15px;font-weight:800}.compare-button.on{background:#27212c;color:white}.ratio-row,.motion-row{display:flex;gap:9px;margin-top:16px}.ratio-row button,.motion-row button{flex:1;border:1px solid #e4b7c7;background:#ffeaf1;border-radius:11px;padding:12px;font-weight:850;color:#3a3039}.ratio-row button.on,.motion-row button.on{background:#ed3477;color:white;border-color:#ed3477}.enhance-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.enhance{border:1px solid #ead8de;border-radius:14px;background:white;padding:14px;display:grid;grid-template-columns:1fr auto}.enhance span{display:flex;flex-direction:column}.enhance small{color:#81777d;margin-top:3px}.enhance em{font-style:normal;color:#ed3477;font-weight:850}.enhance input{grid-column:1/-1;width:100%;accent-color:#ed3477;margin-top:12px}.export-footer{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:17px;border-top:1px solid #dfd5ce}.export-footer div{display:flex;flex-direction:column}.export-footer small{color:#8a8185}.export-footer button{border:0;border-radius:14px;background:#ed3477;color:white;padding:15px 24px;font-weight:900}
@media(max-width:620px){.export-stage{padding:12px 8px 110px}.export-head{margin-bottom:10px}.export-head b{font-size:20px}.export-work{grid-template-columns:1fr 55px;gap:6px}.export-preview{height:500px}.export-tools button{height:61px;border-radius:10px}.export-tools span{font-size:9px}.export-dock{border-radius:17px;padding:14px}.enhance-grid{grid-template-columns:1fr}.ratio-row button,.motion-row button{padding:10px 4px;font-size:12px}.dock-title h2{font-size:17px}.compare-button{padding:9px;font-size:11px}.export-footer button{padding:13px}.export-footer strong{font-size:12px}}
.result-toolbar{display:flex;justify-content:space-between;align-items:center;margin:0 0 16px;padding:13px 16px;border-radius:14px;background:#fff;border:1px solid var(--line)}.result-toolbar button{border:0;background:var(--pink-soft);color:var(--pink);font-weight:850;padding:9px 12px;border-radius:9px}.clip-card{position:relative}.clip-card.selected{border-color:var(--pink);box-shadow:0 0 0 2px rgba(239,52,124,.12)}.clip-check{position:absolute;z-index:5;top:10px;right:10px;width:34px;height:34px;border:2px solid white;border-radius:50%;background:rgba(21,18,22,.68);color:white;font-size:18px;font-weight:900}.clip-card.selected .clip-check{background:var(--pink)}