@import url('/sections.css');
/* Manhwa Recap Studio — official desktop studio palette. */
:root{--bg:#0a0b0f;--surface:#111319;--surface-2:#171920;--line:#282b35;--text:#f5f4f7;--muted:#a2a5b4;--accent:hsl(347 100% 65%);--accent-light:hsl(347 100% 74%);--green:#9ce0bc;--lavender:#b6a4ed;--radius:18px;font-family:'DM Sans',sans-serif;color:var(--text);background:var(--bg);font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;font-size:16px;line-height:1.6}button,input,select{font:inherit}a{color:inherit;text-decoration:none}button,a,input{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:not-allowed}img{max-width:100%}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible{outline:2px solid var(--accent-light);outline-offset:5px}button{color:inherit}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{font-family:'Manrope',sans-serif}h1{font-size:clamp(3rem,4.65vw,4.75rem);line-height:1.08;font-weight:750;letter-spacing:-.055em}h2{font-size:clamp(2rem,3.45vw,3.4rem);line-height:1.15;letter-spacing:-.045em;font-weight:650}h3{line-height:1.3;letter-spacing:-.025em}.container{max-width:1304px;margin:auto;padding:0 40px}.accent{color:var(--accent)}.muted{color:var(--muted)}.eyebrow{font-size:12px;letter-spacing:.15em;font-weight:650;margin-bottom:22px;color:#b5b8c6}.mini-mark{color:var(--accent);font-size:20px;margin-right:8px;vertical-align:middle}.site-header{position:sticky;top:0;z-index:20;background:rgba(10,11,15,.94);backdrop-filter:blur(16px);border-bottom:1px solid #20222a}.nav{height:88px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:inline-flex;align-items:center;gap:11px;line-height:1.05;font-size:21px;font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.7px;white-space:nowrap}.brand-light{display:block;font:500 10px 'DM Sans',sans-serif;letter-spacing:2.4px;margin-top:6px;text-transform:uppercase;color:#babcca}.desktop-nav{display:flex;gap:30px;font-size:14px;color:#c2c3cd}.desktop-nav a:hover,.login-link:hover{color:#fff}.nav-actions{display:flex;align-items:center;gap:24px;font-size:14px}.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;background:var(--accent);color:hsl(347 35% 7%);font-size:15px;font-weight:700;border:1px solid var(--accent);border-radius:9px;padding:14px 22px;transition:background .2s,transform .2s;line-height:1.4;text-align:center}.button:hover{background:hsl(347 100% 72%);transform:translateY(-2px)}.button.small{padding:10px 17px;font-size:14px}.button.ghost{background:transparent;border-color:var(--line);color:var(--text)}.button.ghost:hover{background:#20232c}.button.full{width:100%}.menu-toggle{display:none;background:none;border:0;font-size:22px}.mobile-nav{padding-top:16px;padding-bottom:16px}.mobile-nav a{display:block;padding:10px}.hero{min-height:730px;display:grid;grid-template-columns:1fr 1.08fr;align-items:center;gap:40px;padding-top:80px;padding-bottom:90px}.hero-description{max-width:440px;color:#aaadbb;font-size:17px;line-height:1.8;margin-top:28px}.hero-actions{display:flex;align-items:center;gap:12px;margin-top:32px;flex-wrap:wrap}.play-icon{font-size:21px}.microcopy{font-size:12px;color:#8e929f;margin-top:17px}.microcopy span{margin:0 8px}.hero-product{position:relative;border:1px solid #37353c;border-radius:13px;box-shadow:0 40px 100px #0008,0 0 100px hsl(347 100% 65% / 0.035);background:#101218;transform:perspective(1500px) rotateY(-5deg) rotateX(2deg);margin-bottom:15px}.hero-product:before{content:'';position:absolute;inset:50px -12px -25px 20px;border:1px solid #393038;border-radius:13px;z-index:-1;background:#0c0d12}.product-top{display:flex;align-items:center;gap:20px;padding:15px;font-size:9px;letter-spacing:1.3px;color:#9b9eab;border-bottom:1px solid var(--line)}.window-dots{display:flex;gap:5px}.window-dots i{width:6px;height:6px;border-radius:50%;background:#555762}.window-dots i:first-child{background:hsl(347 32% 50%)}.product-preview-label{margin-left:auto;font-size:9px;color:#999;letter-spacing:0}.product-body{display:flex}.mini-sidebar{width:42px;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:24px;padding:14px 0;color:#737987;font-size:18px}.mini-logo{font:bold 12px Manrope;color:var(--accent)}.side-active{color:var(--accent)}.side-bottom{margin-top:auto}.product-workspace{flex:1;min-width:0;padding:18px}.project-label{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}.overline{font-size:8px;letter-spacing:1.6px;color:#a6a4af;display:block;margin-bottom:5px}.project-label strong{font-size:11px;font-weight:600}.pill{font-size:10px;background:hsl(347 25% 15%);border:1px solid hsl(347 28% 22%);color:hsl(347 100% 77%);border-radius:5px;padding:3px 7px;white-space:nowrap}.preview-canvas{position:relative;aspect-ratio:1.64;background:#171722;overflow:hidden;border-radius:5px}.canvas-gradient{position:absolute;inset:0;background:linear-gradient(0deg,#0a0a13f2,transparent 65%)}.canvas-label{position:absolute;top:12px;left:13px;color:#e6ded8;font-size:8px;letter-spacing:2px;background:#08090c66;padding:3px 6px}.canvas-caption{position:absolute;bottom:43px;left:22px;font-family:Manrope;font-size:19px;line-height:1.35;font-weight:650;text-shadow:0 2px 14px #000}.canvas-controls{position:absolute;bottom:12px;left:14px;right:14px;display:flex;align-items:center;gap:10px;font-size:8px}.canvas-controls>span:first-child{font-size:17px}.canvas-progress{height:2px;background:linear-gradient(90deg,var(--accent) 20%,#b6b7bc40 20%);flex:1}.timeline-label{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:#a0a3b0;margin:18px 0 11px}.mini-timeline{position:relative}.film-track{display:grid;grid-template-columns:1.1fr .8fr 1fr 1.3fr;gap:4px}.frame span{font-size:8px;float:right;margin:2px 4px}.f2{background-position:80% 40%}.f3{background-position:10% 80%}.f4{background-position:40% 55%}.voice-track{height:28px;margin-top:5px;border-radius:3px;background:#263e39;display:flex;align-items:center;gap:9px;overflow:hidden;padding:4px 7px;color:#a5d0c2;font-size:8px}.waveform{height:15px;flex:1;background:repeating-linear-gradient(90deg,#a2c9ba 0 2px,transparent 2px 5px);clip-path:polygon(0 40%,3% 20%,6% 50%,10% 0,14% 35%,18% 20%,22% 45%,25% 0,30% 35%,35% 15%,40% 50%,45% 20%,50% 40%,55% 0,60% 45%,66% 15%,70% 40%,75% 0,80% 40%,86% 20%,92% 40%,96% 20%,100% 40%,100% 60%,96% 80%,92% 60%,86% 80%,80% 60%,75% 100%,70% 60%,66% 85%,60% 55%,55% 100%,50% 60%,45% 80%,40% 50%,35% 85%,30% 65%,25% 100%,22% 55%,18% 80%,14% 65%,10% 100%,6% 50%,3% 80%,0 60%)}.timeline-playhead{position:absolute;left:48%;top:-4px;bottom:-3px;width:1px;background:var(--accent);z-index:2}.timeline-playhead:before{content:'';display:block;margin-left:-3px;width:7px;height:7px;background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%)}.floating-note{position:absolute;bottom:-32px;right:-15px;display:flex;align-items:center;gap:13px;padding:15px 19px;border:1px solid #494049;border-radius:11px;background:#1b1b22;box-shadow:0 12px 40px #0006}.note-icon{display:grid;place-items:center;background:hsl(347 25% 19%);color:hsl(347 100% 73%);width:38px;height:38px;border-radius:9px;font-size:25px}.floating-note strong{display:block;font-size:12px}.floating-note div>span{display:block;font-size:10px;color:#b3b2bd;margin-top:2px}.compatibility{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid #242631;border-bottom:1px solid #242631;padding-top:30px;padding-bottom:30px;color:#a7aab8}.compatibility>span{font-size:10px;line-height:1.8;letter-spacing:1px}.compatibility strong{font-weight:600;color:#c9cbd4}.compatibility>div{font-family:Manrope;font-size:18px;font-weight:650;color:#b5b7c1;white-space:nowrap}.compatibility small{font-size:8px;font-family:'DM Sans';padding:3px;border:1px solid #34343f;border-radius:3px;margin-left:4px;vertical-align:middle}.section{padding-top:110px;padding-bottom:100px}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:44px}.section-head p{max-width:360px;color:var(--muted);font-size:16px;line-height:1.8}.workflow-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;border-bottom:1px solid var(--line)}.workflow-tabs button{background:transparent;border:0;border-bottom:2px solid transparent;padding:20px 0;text-align:left;color:#858998;font-size:12px;letter-spacing:.03em}.workflow-tabs span{font-size:14px;margin-left:10px;letter-spacing:0}.workflow-tabs .active{color:var(--accent);border-color:var(--accent)}.workflow-panel{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:42px;margin-top:28px;min-height:290px}.workflow-panel h3{font-size:26px;margin:12px 0}.workflow-panel p{color:var(--muted);max-width:420px;font-size:16px}.workflow-panel .eyebrow{margin:0;font-size:11px;color:var(--accent)}.workflow-visual{border:1px solid #343642;border-radius:10px;background:#0d0e14;padding:22px}.chapter-file{display:flex;align-items:center;gap:12px;border-bottom:1px solid #252832;padding:12px 0;font-size:14px}.chapter-file:last-child{border:0}.file-symbol{width:30px;height:38px;border:1px solid hsl(347 25% 28%);color:hsl(347 87% 77%);border-radius:4px;display:grid;place-items:center;background:hsl(347 25% 14%)}.chapter-file small{margin-left:auto;color:#898e9d;font-size:12px}.section-title-center{text-align:center;max-width:660px;margin:0 auto 50px}.section-title-center p{color:var(--muted);margin-top:18px}.site-footer{border-top:1px solid var(--line);padding-top:42px;padding-bottom:36px;display:flex;align-items:center;justify-content:space-between;gap:30px}.site-footer p{font-size:13px;color:var(--muted)}.site-footer>div{display:flex;gap:20px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#f4f2f5;color:#15151a;max-width:calc(100% - 40px);padding:14px 22px;border-radius:10px;box-shadow:0 10px 50px #0007;z-index:100;font-size:14px}.toast[hidden]{display:none}
@media(min-width:1500px){.hero{gap:65px}.hero-product{margin-right:-15px}}@media(max-width:1050px){.container{padding-left:28px;padding-right:28px}.desktop-nav{gap:18px}.hero{gap:28px;min-height:650px}h1{font-size:3.4rem}.hero-description{font-size:16px}.hero-actions .button{font-size:13px;padding:12px 16px}.floating-note{right:0}.canvas-caption{font-size:16px}.compatibility{flex-wrap:wrap;justify-content:center}.compatibility>span{width:100%;text-align:center}.workflow-panel{gap:30px;padding:28px}.site-footer{flex-wrap:wrap}}@media(max-width:760px){.container{padding-left:22px;padding-right:22px}.nav{height:74px;gap:15px}.brand{font-size:18px}.brand img{width:30px;height:30px}.brand-light{font-size:8px}.desktop-nav{display:none}.nav-actions{gap:15px}.nav-actions>.button{display:none}.menu-toggle{display:block}.hero{grid-template-columns:1fr;padding-top:54px;padding-bottom:75px;gap:55px}.hero-copy{max-width:540px}h1{font-size:clamp(3rem,10.5vw,4.4rem)}.hero-description{max-width:480px}.hero-product{transform:none;max-width:560px;width:100%;justify-self:center}.floating-note{bottom:-28px}.canvas-caption{font-size:19px}.compatibility{gap:24px}.compatibility>div{font-size:16px}.section{padding-top:76px;padding-bottom:65px}.section-head{display:block}.section-head p{margin-top:20px}.workflow-tabs{grid-template-columns:repeat(2,1fr);gap:0 18px}.workflow-tabs button{padding:15px 0}.workflow-tabs span{font-size:13px;margin-left:5px}.workflow-panel{grid-template-columns:1fr;padding:25px;gap:30px}.site-footer{display:block}.site-footer p{margin:18px 0}.site-footer>div{gap:20px}.section-title-center{margin-bottom:32px}.eyebrow{font-size:10px}.product-top{font-size:8px;gap:12px}.product-preview-label{font-size:8px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
