:root {
  --motion-ease-out: cubic-bezier(.23,1,.32,1);
  --motion-ease-in-out: cubic-bezier(.77,0,.175,1);
  --motion-hover-duration: 200ms;
  --motion-entry-duration: 600ms;
  --studio-surface: color-mix(in oklab,var(--background) 90%,var(--primary) 10%);
  --studio-line: color-mix(in oklab,var(--primary) 24%,var(--background));
}
.home-motion .motion-tools { border-top:1px solid var(--border); padding-block:var(--space-16); margin-top:var(--space-12); }
.studio-intro { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:var(--space-12); align-items:center; }
.studio-heading h2 { font-size:clamp(2.4rem,4.2vw,4rem); line-height:1.06; letter-spacing:-.055em; margin:0; }
.studio-heading .eyebrow { margin-bottom:var(--space-6); }
.studio-lead { max-width:34ch; color:var(--muted); font-size:var(--text-md); line-height:1.6; margin-block:var(--space-6); }
.studio-footnote { font-size:var(--text-sm); color:var(--muted); max-width:32ch; padding-left:var(--space-4); border-left:2px solid var(--primary); }
.motion-demo { margin:0; min-width:0; background:var(--studio-surface); border:1px solid var(--studio-line); border-radius:var(--radius-lg); padding:var(--space-6); overflow:hidden; }
.demo-topline { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); font-size:var(--text-sm); font-weight:600; }
.demo-tag { border:1px solid var(--studio-line); border-radius:100px; padding:var(--space-1) var(--space-3); color:var(--primary); font-size:var(--text-xs); white-space:nowrap; }
.demo-scene { position:relative; isolation:isolate; perspective:1000px; height:300px; display:grid; place-items:center; margin-block:var(--space-6); }
.demo-scene,.demo-scene * { pointer-events:none; }
.demo-grid { position:absolute; inset:20% -10% -60%; z-index:-2; transform:rotateX(66deg); background-image:linear-gradient(var(--studio-line) 1px,transparent 1px),linear-gradient(90deg,var(--studio-line) 1px,transparent 1px); background-size:40px 40px; opacity:.45; mask-image:linear-gradient(transparent,#000 45%,transparent); }
.demo-orbit { position:absolute; width:85%; height:60%; border:1px solid var(--studio-line); border-radius:50%; transform:rotateX(62deg) rotateZ(-15deg) translateY(50%); z-index:-1; }
.demo-art { width:76%; transform:rotateY(-12deg) rotateX(7deg) rotateZ(-3deg); border:1px solid var(--studio-line); border-radius:var(--radius); box-shadow:18px 24px 0 color-mix(in oklab,var(--primary) 8%,transparent),0 25px 55px #0003; overflow:hidden; }
.demo-art img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.format-plane { position:absolute; border-radius:var(--radius-sm); min-width:88px; padding:var(--space-3) var(--space-4); background:var(--background); border:1px solid var(--studio-line); box-shadow:0 12px 30px #0003; transform:rotateY(-12deg) rotateZ(-3deg); }
.format-plane span { display:block; font-size:.6rem; letter-spacing:.12em; color:var(--muted); }
.format-plane strong { display:block; font-size:var(--text-xl); line-height:1.2; color:var(--primary); }
.demo-input { left:0; top:14%; }
.demo-output { right:0; bottom:7%; background:var(--green-300); }
.demo-output span,.demo-output strong { color:#0c2115; }
.motion-demo figcaption { border-top:1px solid var(--studio-line); padding-top:var(--space-4); display:flex; align-items:center; gap:var(--space-4); justify-content:space-between; }
.motion-demo figcaption p { max-width:35ch; color:var(--muted); font-size:var(--text-xs); margin:0; }
.demo-button { border:1px solid var(--studio-line); background:var(--background); color:var(--foreground); padding:var(--space-3) var(--space-4); border-radius:100px; font-size:var(--text-sm); white-space:nowrap; min-height:44px; }
.demo-button:disabled { cursor:default; opacity:.65; }
.tools-heading { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-6); padding-top:var(--space-16); padding-bottom:var(--space-6); border-bottom:1px solid var(--border); }
.tools-heading p { margin:0; font-weight:600; }
.tools-heading span { font-size:var(--text-sm); color:var(--muted); }
.home-motion .motion-tool-grid { gap:var(--space-12) var(--space-8); margin-block:var(--space-8) 0; }
.home-motion .motion-card { border:0; padding:0; }
.tool-art { position:relative; perspective:1000px; background:var(--studio-surface); border:1px solid var(--studio-line); border-radius:var(--radius); overflow:hidden; aspect-ratio:3/2; }
.home-motion .tool-art img { border-radius:0; width:100%; height:100%; object-fit:cover; transform:scale(1); }
.art-caption { position:absolute; left:var(--space-3); bottom:var(--space-3); max-width:calc(100% - var(--space-6)); background:#0c2115e8; color:#e9f3e9; padding:var(--space-1) var(--space-3); border-radius:100px; font-size:var(--text-xs); line-height:1.5; pointer-events:none; }
.tool-title-row { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-4); }
.home-motion .tool-title-row h3 { margin-block:var(--space-4) var(--space-2); }
.tool-open { font-size:var(--text-xs); color:var(--primary); flex-shrink:0; }
.home-motion .motion-card > p { font-size:var(--text-sm); line-height:1.6; max-width:36ch; }
.home-motion .motion-guides { padding-block:var(--space-16); }
.motion-guides .editorial-heading { align-items:flex-end; gap:var(--space-6); margin-bottom:var(--space-8); }
.motion-guides h2 { font-size:clamp(1.7rem,3vw,2.5rem); line-height:1.15; }
.motion-guides .eyebrow { margin-bottom:var(--space-3); }
.motion-guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-8); }
.home-motion .motion-guide-card { display:block; border:0; padding:0; min-width:0; }
.motion-guide-card .teaser-picture { display:block; border-radius:var(--radius); overflow:hidden; background:var(--studio-surface); border:1px solid var(--studio-line); margin-bottom:var(--space-6); }
.home-motion .motion-guide-card .teaser-picture img { border-radius:0; object-fit:cover; }
.home-motion .motion-guide-card h3 { font-size:var(--text-md); line-height:1.4; margin-block:var(--space-2) var(--space-3); }
.home-motion .motion-guide-card p { font-size:var(--text-sm); line-height:1.65; }
.home-motion .motion-guide-card .category { font-size:var(--text-xs); }
.demo-button:focus-visible { outline:3px solid var(--ring); outline-offset:4px; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .tool-art img,.motion-guide-card .teaser-picture img { transition:transform var(--motion-hover-duration) ease; }
  .motion-card a:hover .tool-art img { transform:perspective(1000px) rotateY(-2deg) rotateX(1deg) scale(1.035); }
  .motion-guide-card:hover .teaser-picture img { transform:scale(1.025); }
}
@media(max-width:960px) {
  .studio-intro { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:var(--space-8); }
  .demo-scene { height:260px; }
  .motion-demo { padding:var(--space-4); }
  .demo-topline { font-size:var(--text-xs); }
  .motion-demo figcaption { flex-wrap:wrap; }
  .motion-guide-grid { gap:var(--space-6); }
}
@media(max-width:700px) {
  .studio-intro { grid-template-columns:1fr; gap:var(--space-8); }
  .studio-heading h2 { font-size:clamp(2.4rem,8vw,3.5rem); }
  .studio-heading h2 br { display:none; }
  .studio-heading .eyebrow { margin-bottom:var(--space-4); }
  .studio-lead { font-size:var(--text-base); max-width:42ch; }
  .studio-footnote { max-width:42ch; }
  .demo-scene { height:280px; margin-block:var(--space-4); }
  .motion-demo figcaption { flex-wrap:nowrap; }
  .tools-heading { padding-top:var(--space-12); }
  .tools-heading span { display:none; }
  .home-motion .motion-tool-grid { gap:var(--space-8) var(--space-4); }
  .art-caption { font-size:.6rem; left:var(--space-2); bottom:var(--space-2); padding:var(--space-1) var(--space-2); }
  .tool-open { display:none; }
  .home-motion .tool-title-row h3 { font-size:var(--text-base); margin-top:var(--space-3); }
  .home-motion .motion-card > p { font-size:var(--text-xs); }
  .motion-guide-grid { grid-template-columns:1fr; gap:var(--space-8); }
  .home-motion .motion-guide-card { display:grid; grid-template-columns:120px minmax(0,1fr); gap:var(--space-4); }
  .motion-guide-card .teaser-picture { margin:0; align-self:start; }
  .home-motion .motion-guide-card .teaser-picture img { aspect-ratio:1; object-fit:cover; }
  .home-motion .motion-guide-card h3 { font-size:var(--text-base); }
  .home-motion .motion-guide-card p { display:none; }
  .motion-guides .editorial-heading { align-items:flex-start; }
  .motion-guides .editorial-heading > a { font-size:var(--text-xs); white-space:nowrap; }
}
@media(max-width:400px) {
  .demo-scene { height:240px; }
  .format-plane { min-width:70px; padding:var(--space-2) var(--space-3); }
  .format-plane strong { font-size:var(--text-lg); }
  .demo-art { width:80%; }
  .motion-demo figcaption { flex-wrap:wrap; }
  .home-motion .motion-guide-card { grid-template-columns:96px minmax(0,1fr); }
}
@media(prefers-reduced-motion:reduce) {
  .home-motion .tool-art img,.home-motion .teaser-picture img { transform:none !important; transition:none; }
  .demo-art,.format-plane { transform:none; }
}
:root { --studio-cycle:8s; --studio-tilt-time:160ms; }
.home-motion .motion-demo { position:relative; background:radial-gradient(ellipse at 60% 45%,color-mix(in oklab,var(--primary) 15%,var(--background)),var(--background) 75%); border-color:color-mix(in oklab,var(--primary) 40%,var(--background)); }
.home-motion .demo-scene { height:360px; margin-block:var(--space-4); }
.render-stage { position:relative; height:100%; width:100%; perspective:900px; overflow:hidden; }
.render-camera { position:absolute; width:100%; height:100%; transform-style:preserve-3d; transform:rotateX(-8deg) rotateY(-19deg); }
.stage-floor { position:absolute; bottom:12%; left:8%; width:84%; height:45%; background:radial-gradient(ellipse,color-mix(in oklab,var(--primary) 26%,transparent),transparent 68%); transform:rotateX(65deg); }
.stage-halo { position:absolute; width:290px; height:290px; left:calc(50% - 145px); top:14px; border:1px solid var(--studio-line); border-radius:50%; }
.stage-halo::after { content:''; position:absolute; inset:var(--space-6); border:1px solid var(--studio-line); border-radius:50%; }
.device-model { position:absolute; width:245px; height:175px; left:calc(50% - 140px); top:64px; transform-style:preserve-3d; }
.device-front,.device-back { position:absolute; inset:0; background:linear-gradient(135deg,#d8e9ce,#8eb79a); border:1px solid #cbefc8; border-radius:var(--radius-sm); backface-visibility:hidden; }
.device-front { transform:translateZ(15px); padding:var(--space-2); }
.device-back { transform:rotateY(180deg) translateZ(15px); background:#284b35; }
.device-side { position:absolute; right:-15px; top:5px; width:30px; height:165px; background:linear-gradient(90deg,#668774,#345540); transform:rotateY(90deg); }
.device-top { position:absolute; left:5px; top:-15px; width:235px; height:30px; background:#daebcd; transform:rotateX(90deg); }
.device-screen { height:100%; overflow:hidden; position:relative; border-radius:4px; background:#0c2115; }
.device-screen img { width:100%; height:100%; object-fit:cover; }
.screen-scan { position:absolute; left:0; top:0; width:28%; height:100%; background:linear-gradient(90deg,transparent,#b4ff6580,transparent); opacity:0; }
.screen-format { position:absolute; left:var(--space-2); right:var(--space-2); bottom:var(--space-2); background:#0c2115e8; color:#e9f3e9; font-size:var(--text-xs); letter-spacing:.08em; text-align:center; padding:var(--space-1); }
.screen-format span { color:#b4ff65; padding-inline:var(--space-2); }
.device-neck { position:absolute; left:101px; top:175px; width:44px; height:40px; background:linear-gradient(90deg,#48705a,#d0e5c4,#789c7c); transform:translateZ(-6px) rotateX(-8deg); }
.device-foot { position:absolute; left:63px; top:195px; width:120px; height:45px; border-radius:var(--radius-sm); background:linear-gradient(110deg,#5b8069,#c1d8b5); transform:rotateX(74deg); box-shadow:0 18px 22px #0005; }
.output-model { position:absolute; width:105px; height:140px; right:4%; top:126px; transform-style:preserve-3d; transform:translateZ(70px) rotateY(-12deg) rotateZ(7deg); }
.output-front { position:absolute; inset:0; padding:var(--space-3); background:linear-gradient(145deg,#d8f6bb,#9be5a8); border:1px solid #d8f6bb; border-radius:var(--radius-sm); transform:translateZ(8px); color:#0c2115; box-shadow:0 16px 24px #0003; }
.output-side { position:absolute; right:-8px; top:4px; width:16px; height:132px; background:#518d5e; transform:rotateY(90deg); }
.output-top { position:absolute; left:4px; top:-8px; width:97px; height:16px; background:#e0f7c9; transform:rotateX(90deg); }
.output-mini { display:block; font-size:8px; letter-spacing:.08em; }.output-front strong { display:block; font-size:32px; line-height:1.5; letter-spacing:-.05em; }.output-bottom { position:absolute; bottom:var(--space-3); font-size:8px; }
.output-lines { width:70%; height:20px; border-top:3px solid #518d5e; border-bottom:3px solid #518d5e; }
.film-stream { position:absolute; left:1%; top:110px; width:86px; height:100px; transform-style:preserve-3d; transform:translateZ(45px) rotateY(20deg) rotateZ(-13deg); }
.film-frame { position:absolute; width:90px; height:66px; padding:6px 4px; background:#254a32; border-block:5px dotted #9be5a8; box-shadow:0 8px 18px #0004; border-radius:4px; }
.film-frame:nth-child(1){top:-42px;transform:translateZ(-18px) rotateZ(-7deg);}.film-frame:nth-child(2){top:10px;transform:translateZ(0);}.film-frame:nth-child(3){top:62px;transform:translateZ(18px) rotateZ(7deg);}.film-frame img{width:100%;height:100%;object-fit:cover;}
.orbit-chip { position:absolute; padding:var(--space-1) var(--space-3); background:#173d28; color:#b4ff65; border:1px solid #518d5e; border-radius:100px; font-size:var(--text-xs); }
.chip-a { left:17%; top:20px; transform:translateZ(60px) rotateZ(-7deg); }.chip-b { right:13%; top:32px; transform:translateZ(20px) rotateZ(8deg); }
.scene-running .render-camera { animation:camera-tour var(--studio-cycle) var(--motion-ease-in-out) infinite; }
.scene-running .film-stream { animation:film-route var(--studio-cycle) var(--motion-ease-in-out) infinite; }
.scene-running .output-model { animation:output-arrive var(--studio-cycle) var(--motion-ease-in-out) infinite; }
.scene-running .screen-scan { animation:conversion-scan var(--studio-cycle) linear infinite; }
.scene-running .chip-a { animation:chip-float var(--studio-cycle) ease-in-out infinite; }.scene-running .chip-b { animation:chip-float var(--studio-cycle) ease-in-out infinite reverse; }
.scene-paused .render-stage * { animation-play-state:paused !important; }
@keyframes camera-tour {0%,100%{transform:rotateX(-8deg) rotateY(-19deg);}40%{transform:rotateX(5deg) rotateY(8deg);}75%{transform:rotateX(-3deg) rotateY(-9deg);}}
@keyframes film-route {0%,100%{transform:translate3d(0,0,45px) rotateY(20deg) rotateZ(-13deg);opacity:1;}35%{transform:translate3d(110%,8%,10px) rotateY(-20deg) rotateZ(0);opacity:0;}65%{transform:translate3d(-30%,-12%,45px) rotateY(20deg) rotateZ(-13deg);opacity:0;}85%{transform:translate3d(0,0,45px) rotateY(20deg) rotateZ(-13deg);opacity:1;}}
@keyframes output-arrive {0%,15%,100%{transform:translate3d(0,8%,70px) rotateY(-12deg) rotateZ(7deg);}55%{transform:translate3d(-10%,-12%,110px) rotateY(14deg) rotateZ(-4deg);}80%{transform:translate3d(0,-5%,85px) rotateY(-8deg) rotateZ(4deg);}}
@keyframes conversion-scan {0%,25%,75%,100%{transform:translateX(-110%);opacity:0;}30%{opacity:1;}65%{transform:translateX(420%);opacity:1;}70%{opacity:0;}}
@keyframes chip-float {0%,100%{transform:translate3d(0,0,60px) rotateZ(-7deg);}50%{transform:translate3d(10%,-30%,70px) rotateZ(5deg);}}
.home-motion .compatibility { padding-block:var(--space-12); }
.home-motion .platform-row { flex-wrap:wrap; overflow:visible; justify-content:center; gap:var(--space-4); }
.home-motion .platform-logo { position:relative; flex-basis:68px; min-height:72px; border:1px solid transparent; border-radius:var(--radius); padding:var(--space-3); background:var(--studio-surface); }
.home-motion .platform-logo.wordmark { flex-basis:150px; }
.home-motion .platform-logo img { max-width:100%; }
.home-motion .faq { max-width:none; margin-block:var(--space-12); padding:var(--space-8); border-radius:var(--radius-lg); background:var(--card); border:1px solid var(--studio-line); }
.home-motion .faq h2 { font-size:var(--text-xl); margin-bottom:var(--space-2); }.home-motion .faq-intro { color:var(--muted); margin:0 0 var(--space-6); }
.home-motion .faq details { background:var(--background); border:1px solid var(--studio-line); border-radius:var(--radius); padding:0; margin-top:var(--space-3); overflow:hidden; }
.home-motion .faq summary { padding:var(--space-6); font-size:var(--text-base); }.home-motion .faq details[open] { border-color:var(--primary); }.home-motion .faq details[open] summary { color:var(--primary); }.home-motion .faq details p { margin:0; padding:0 var(--space-6) var(--space-6); max-width:90ch; }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .home-motion .platform-logo { transition:transform 200ms var(--motion-ease-out),background-color 200ms ease,border-color 200ms ease; }
 .home-motion .platform-logo:hover { transform:translateY(-8px) rotate(-4deg) scale(1.1); border-color:var(--primary); background:color-mix(in oklab,var(--primary) 16%,var(--background)); }
 .home-motion .platform-logo img { transition:transform 200ms var(--motion-ease-out); }.home-motion .platform-logo:hover img{transform:rotate(9deg) scale(1.07);}
 .home-motion .motion-card a .tool-art { transition:transform 200ms var(--motion-ease-out); transform:perspective(800px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); }
 .home-motion .motion-card a:hover .tool-art img { transform:scale(1.07); }
}
@media(max-width:700px){.home-motion .demo-scene{height:330px;}.device-model{width:200px;height:145px;left:calc(50% - 115px);top:70px;}.device-side{height:135px;}.device-top{width:190px;}.device-neck{left:80px;top:145px;}.device-foot{left:45px;top:167px;}.output-model{width:84px;height:116px;right:2%;top:150px;}.output-side{height:108px;}.output-top{width:76px;}.output-front strong{font-size:26px;}.output-mini,.output-bottom{font-size:7px;}.film-stream{left:0;transform:scale(.75);}.film-frame{width:65px;height:52px;}.home-motion .faq{padding:var(--space-4);}.home-motion .faq summary{padding:var(--space-4);}.home-motion .faq details p{padding:0 var(--space-4) var(--space-4);}.home-motion .platform-row{display:flex;}.home-motion .platform-logo{flex-basis:58px;min-height:62px;}.home-motion .platform-logo.wordmark{flex-basis:128px;}}
@media(prefers-reduced-motion:reduce){.render-stage *{animation:none !important;}.render-camera{transform:rotateX(-5deg) rotateY(-12deg);}.home-motion .platform-logo:hover,.home-motion .platform-logo:hover img{transform:none;}}
.visual-site .header-modern { position:relative; gap:var(--space-6); padding-block:var(--space-4); z-index:20; }
.brand-new { display:flex; align-items:center; flex-shrink:0; color:var(--foreground); }
.brand-new svg { display:block; width:310px; height:auto; max-height:60px; }
.brand-new svg tspan { fill:var(--primary); }
.brand-footer svg { width:240px; }
.menu-topline { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); }
.menu-close { position:absolute;top:var(--space-4);right:var(--space-4);display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:var(--space-2); border:1px solid var(--studio-line); border-radius:var(--radius-sm); background:var(--background); color:var(--foreground); }
.menu-topline,.menu-download > .menu-heading { padding-right:var(--space-12); }
.visual-site .header-modern .brand-new { flex-shrink:1;min-width:0; }
.visual-site .header-modern .brand-new svg { max-width:100%; }
.visual-site .header-modern .nav-modern { flex-shrink:0; }
.brand-footer { max-width:100%; }.brand-footer svg { max-width:100%; }
.menu-close img { display:block; width:24px; height:24px; }
.menu-close:hover { border-color:var(--primary); }
:root[data-theme='dark'] .menu-close img { filter:brightness(0) invert(1); }
.nav-modern { display:flex; align-items:center; gap:var(--space-2); margin-left:auto; font-size:var(--text-sm); }
.nav-modern .nav-link,.tools-menu > summary { border-radius:100px; padding:var(--space-3) var(--space-4); font-weight:600; text-decoration:none; min-height:46px; cursor:pointer; }
.nav-modern .nav-link:hover,.tools-menu > summary:hover,.tools-menu[open] > summary { background:var(--studio-surface); color:var(--primary); text-decoration:none; }
.tools-menu { border:0; padding:0; margin:0; }
.tools-menu > summary { background:var(--studio-surface); border:1px solid var(--studio-line); }
.tools-menu > summary::marker { color:var(--primary); font-size:.75em; }
.theme-toggle { display:grid !important; place-items:center; width:46px; height:46px; min-width:46px; padding:var(--space-3); background:var(--studio-surface); border:1px solid var(--studio-line); border-radius:50%; color:var(--foreground); }
.theme-toggle img { width:24px; height:24px; display:block; }
:root[data-theme='dark'] .theme-toggle img { filter:brightness(0) invert(1); }
.theme-moon { display:none !important; }:root[data-theme='light'] .theme-moon { display:block !important; }:root[data-theme='light'] .theme-sun { display:none !important; }
.tools-popover { position:absolute; top:calc(100% - 1px); left:0; right:0; display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); padding:var(--space-8); gap:var(--space-8); background:var(--card); border:1px solid var(--studio-line); border-radius:var(--radius-lg); box-shadow:0 24px 64px #0004; max-height:calc(100dvh - 110px); overflow-y:auto; color:var(--foreground); }
.tools-popover .menu-heading { color:var(--foreground); font-size:var(--text-md); font-weight:600; margin:0; }
.tools-popover .menu-note { color:var(--muted); font-size:var(--text-sm); margin:var(--space-2) 0 var(--space-4); }
.menu-tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3); }
.menu-tool-grid a { display:flex; flex-direction:column; align-items:flex-start; padding:var(--space-4); border:1px solid var(--studio-line); border-radius:var(--radius); text-decoration:none; background:var(--background); }
.menu-tool-grid strong { font-size:var(--text-base); }.menu-tool-grid span { font-size:var(--text-xs); color:var(--muted); margin-top:var(--space-1); }
.menu-tool-grid a:hover { border-color:var(--primary); color:var(--primary); }
.menu-download { padding-left:var(--space-8); border-left:1px solid var(--studio-line); }
.menu-main-action { display:block; text-align:center; background:var(--green-300); color:#0c2115; padding:var(--space-3) var(--space-4); margin-top:var(--space-4); border-radius:var(--radius-sm); text-decoration:none; font-weight:600; }
.menu-platforms { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-1); }
.menu-platforms a { text-decoration:none; padding:var(--space-2); border-radius:var(--radius-sm); font-size:var(--text-sm); min-height:44px; display:flex; align-items:center; gap:var(--space-2); flex-wrap:wrap; }
.menu-platforms a:hover { background:var(--background); color:var(--primary); }.menu-platforms small { color:var(--muted); font-size:10px; }
.menu-mobile-links { display:none; }
@media(max-width:900px){.nav-modern .nav-link{display:none;}.menu-mobile-links{display:flex;flex-wrap:wrap;gap:var(--space-4);border-top:1px solid var(--studio-line);padding-top:var(--space-4);margin-top:var(--space-4);}.menu-mobile-links a{text-decoration:none;min-height:44px;display:flex;align-items:center;}}
@media(max-width:800px){.brand-new svg{width:240px;}.header-modern .nav-modern{gap:0;}.nav-modern .nav-link,.tools-menu > summary{padding-inline:var(--space-3);}.tools-popover{padding:var(--space-6);gap:var(--space-6);}.menu-download{padding-left:var(--space-6);}}
@media(max-width:650px){.visual-site .header-modern{gap:var(--space-2);flex-wrap:nowrap;}.brand-new svg{width:190px;}.nav-modern .nav-link{display:none;}.nav-modern{margin-left:auto;}.tools-menu > summary{font-size:var(--text-xs);padding:var(--space-3);}.theme-toggle{width:42px;height:42px;min-width:42px;padding:var(--space-2);}.tools-popover{grid-template-columns:1fr;padding:var(--space-4);gap:var(--space-6);max-height:calc(100dvh - 88px);}.menu-tool-grid{gap:var(--space-2);}.menu-tool-grid a{padding:var(--space-3);}.menu-tool-grid strong{font-size:var(--text-sm);}.menu-download{padding:var(--space-6) 0 0;border-left:0;border-top:1px solid var(--studio-line);}.menu-mobile-links{display:flex;gap:var(--space-4);border-top:1px solid var(--studio-line);padding-top:var(--space-4);margin-top:var(--space-4);}.menu-mobile-links a{text-decoration:none;min-height:44px;display:flex;align-items:center;}}
@media(max-width:370px){.brand-new svg{width:175px;}.tools-menu > summary{padding-inline:var(--space-2);}}
.menu-tool-grid a { flex-direction:row; align-items:center; gap:var(--space-3); }
.menu-tool-grid .menu-art { display:block; flex:0 0 60px; width:60px; height:60px; margin:0; perspective:500px; }
.menu-art img { display:block; width:100%; height:100%; object-fit:contain; border-radius:0; box-shadow:none; background:transparent; filter:drop-shadow(0 3px 4px #0002); }
.menu-tool-grid .menu-tool-copy { display:block; min-width:0; margin:0; color:var(--foreground); font-size:var(--text-base); }
.menu-tool-copy strong { display:block; }.menu-tool-grid .menu-tool-copy > span { display:block; margin-top:var(--space-1); color:var(--muted); font-size:var(--text-xs); }
.menu-quick-download { background:var(--green-300); color:#0c2115; border-radius:var(--radius); padding:var(--space-4); margin-block:var(--space-4) var(--space-6); }
.menu-quick-download label { color:#0c2115; font-size:var(--text-sm); text-align:center; margin-bottom:var(--space-3); }
.menu-quick-download input { background:#0c2115; color:#fff; border-color:#0c2115; font-size:var(--text-sm); min-height:48px; padding:var(--space-3); }
.menu-quick-download input::placeholder { color:#c8d9cd; }.menu-quick-download .menu-main-action { width:100%; min-height:46px; padding:var(--space-3); border:0; background:#163d27; color:#fff; font-size:var(--text-sm); margin-top:var(--space-3); }
.tools-popover .menu-quick-download p { color:#0c2115; font-size:var(--text-xs); text-align:center; margin:var(--space-3) 0 0; }
.menu-quick-download :focus-visible { outline-color:#0c2115; }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .menu-art img { transition:transform 200ms var(--motion-ease-out); }
 [data-menu-tool="convert"]:hover .menu-art img { transform:rotateY(-22deg) rotateZ(-7deg) scale(1.14); }
 [data-menu-tool="compress"]:hover .menu-art img { transform:scale(.82) rotateZ(4deg); }
 [data-menu-tool="trim"]:hover .menu-art img { transform:translateX(-7%) rotateZ(-6deg) scale(1.1); }
 [data-menu-tool="audio"]:hover .menu-art img { transform:rotateZ(12deg) scale(1.12); }
 [data-menu-tool="frame"]:hover .menu-art img { transform:scale(1.18) rotateZ(-4deg); }
 [data-menu-tool="adjust"]:hover .menu-art img { transform:rotateZ(-25deg) scale(1.12); }
}
@media(max-width:650px){.menu-tool-grid a{gap:var(--space-2);padding:var(--space-2);}.menu-tool-grid .menu-art{flex-basis:36px;width:36px;height:44px;}.menu-tool-copy strong{font-size:var(--text-sm);}.menu-tool-grid .menu-tool-copy > span{font-size:11px;}}
@media(prefers-reduced-motion:reduce){.menu-art img{transform:none !important;transition:none;}}

