/* ============================================================
   C/24 MOTION WORKS / BESPOKE SCENE CHASSIS
   Every tool owns a unique static part graph. This file supplies only the
   shared instrument frame, CSS-built materials, state language and motion.
   ============================================================ */

.fm-masthead{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.92fr) minmax(430px,1.08fr);align-items:center;gap:clamp(30px,3.2vw,58px);width:100%}
.fm-copy{position:relative;z-index:2;min-width:0}.fm-workbench{grid-column:1/-1;min-width:0}.page-head .fm-masthead{max-width:1480px}.page-head .fm-copy h1.display{max-width:none;font-size:clamp(50px,4.8vw,84px);line-height:.84;font-variation-settings:'wdth' 102,'wght' 900}.page-head .fm-copy .lede{max-width:54ch}body[data-page="convert"] .hero .shell{max-width:1480px}body[data-page="convert"] .fm-copy h1.display{max-width:none;font-size:clamp(54px,5vw,90px);line-height:.82;font-variation-settings:'wdth' 102,'wght' 900}
@keyframes fm-title-lock{from{font-variation-settings:'wdth' 78,'wght' 900;letter-spacing:.015em}to{font-variation-settings:'wdth' 102,'wght' 900;letter-spacing:-.01em}}
@media(min-width:768px) and (prefers-reduced-motion:no-preference){.page-head .fm-copy h1.display,body[data-page="convert"] .fm-copy h1.display{animation:fm-title-lock .72s var(--ease-mech) both}}

.fm-stage{--fm-x:0px;--fm-y:0px;--fm-a:var(--blaze);--fm-b:var(--cobalt);--fm-c:#35c96d;position:relative;z-index:3;isolation:isolate;contain:layout paint style;min-width:0;width:100%;color:var(--paper);filter:drop-shadow(0 34px 46px rgba(0,0,0,.44))}
.fm-machine{position:relative;display:grid;grid-template-rows:auto 1fr auto;min-width:0;aspect-ratio:16/10;overflow:hidden;border:1px solid rgba(242,239,232,.62);border-top:6px solid var(--fm-a);background:#030303}
.fm-head,.fm-foot{position:relative;z-index:20;display:grid;align-items:center;min-width:0;font:650 10px/1.1 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.055em;text-transform:uppercase}
.fm-head{grid-template-columns:minmax(0,1fr) auto;min-height:42px;padding:0 16px;border-bottom:1px solid rgba(242,239,232,.25);background:#050505}.fm-model{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fm-status{display:inline-flex;align-items:center;gap:7px;color:#b9b0a4}.fm-status::before{content:"";width:7px;height:7px;background:var(--fm-a);box-shadow:0 0 15px color-mix(in srgb,var(--fm-a) 70%,transparent)}
.fm-foot{grid-template-columns:repeat(3,1fr);min-height:42px;border-top:1px solid rgba(242,239,232,.25);background:#050505;color:#c2baaf}.fm-foot span{display:flex;align-items:center;min-width:0;height:100%;overflow:hidden;padding:0 14px;border-right:1px solid rgba(242,239,232,.2);text-overflow:ellipsis;white-space:nowrap}.fm-foot span:last-child{border-right:0}

.fm-viewport{position:relative;min-height:clamp(300px,30vw,404px);overflow:hidden;background:#070707;color:var(--paper);perspective:1000px}
.fm-viewport[data-tone="blaze"]{--fm-a:#ff4d00;--fm-b:#3155ff;--fm-c:#ffe1c9}.fm-viewport[data-tone="cobalt"]{--fm-a:#3155ff;--fm-b:#00d6ff;--fm-c:#ff4d00}.fm-viewport[data-tone="violet"]{--fm-a:#9765ff;--fm-b:#3155ff;--fm-c:#ff7250}.fm-viewport[data-tone="amber"]{--fm-a:#ffb000;--fm-b:#ff4d00;--fm-c:#3155ff}.fm-viewport[data-tone="green"]{--fm-a:#35c96d;--fm-b:#00d6ff;--fm-c:#3155ff}.fm-viewport[data-tone="ice"]{--fm-a:#00d6ff;--fm-b:#3155ff;--fm-c:#f2efe8}.fm-viewport[data-tone="rose"]{--fm-a:#ff416c;--fm-b:#ff4d00;--fm-c:#9765ff}.fm-viewport[data-tone="paper"]{--fm-a:#f2efe8;--fm-b:#ff4d00;--fm-c:#3155ff}
.fm-viewport::before{content:"";position:absolute;inset:-18%;z-index:0;background:radial-gradient(circle at 76% 24%,color-mix(in srgb,var(--fm-a) 23%,transparent),transparent 23%),radial-gradient(circle at 22% 78%,color-mix(in srgb,var(--fm-b) 17%,transparent),transparent 27%),linear-gradient(135deg,transparent 0 47%,rgba(242,239,232,.045) 47% 48%,transparent 48% 100%);transform:translate3d(calc(var(--fm-x) * -.18),calc(var(--fm-y) * -.18),0);transition:transform .18s linear}.fm-viewport::after{content:"";position:absolute;inset:0;z-index:1;opacity:.32;background-image:linear-gradient(rgba(242,239,232,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(242,239,232,.12) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 94%)}
.fm-art-copy{position:absolute;z-index:15;display:flex;flex-direction:column;gap:5px;width:min(43%,290px);pointer-events:none}.fm-art-copy span{color:var(--fm-a);font:700 8px/1.1 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}.fm-art-copy strong{font:900 clamp(15px,1.7vw,25px)/.9 'Archivo',sans-serif;font-variation-settings:'wdth' 98,'wght' 900;letter-spacing:-.035em;text-transform:uppercase}.fm-art-copy small{max-width:32ch;color:rgba(242,239,232,.62);font:600 8px/1.35 'IBM Plex Mono',ui-monospace,monospace;letter-spacing:.025em;text-transform:uppercase}.fm-viewport[data-copy="nw"] .fm-art-copy{top:6%;left:5%}.fm-viewport[data-copy="ne"] .fm-art-copy{top:6%;right:5%;align-items:flex-end;text-align:right}.fm-viewport[data-copy="sw"] .fm-art-copy{bottom:7%;left:5%}
.fm-art-field{position:absolute;inset:0;z-index:6;transform:translateZ(0)}.fm-object{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);translate:calc(var(--fm-x) * var(--d) * .12) calc(var(--fm-y) * var(--d) * .12);transition:translate .18s linear;will-change:translate}.fm-piece{position:relative;display:block;width:100%;height:100%;overflow:hidden;rotate:var(--r);border:1px solid rgba(242,239,232,.8);background:#111;color:var(--paper);box-shadow:0 14px 26px rgba(0,0,0,.32);transform-origin:center;backface-visibility:hidden}.fm-piece>strong{position:absolute;z-index:9;right:6px;bottom:6px;left:6px;display:block;min-width:0;overflow:hidden;padding:5px 6px;background:#050505;color:var(--paper);font:850 clamp(9px,1.05vw,14px)/1 'Archivo',sans-serif;font-variation-settings:'wdth' 88,'wght' 850;letter-spacing:.02em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.fm-piece>strong span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.fm-object[data-role="input"] .fm-piece{border-color:var(--fm-b)}.fm-object[data-role="input"] .fm-piece>strong{box-shadow:inset 4px 0 var(--fm-b)}.fm-object[data-role="output"] .fm-piece{border-color:var(--fm-a)}.fm-object[data-role="output"] .fm-piece>strong{background:var(--fm-a);color:#050505}.fm-piece i{display:block;font-style:normal}
.fm-piece>strong{font-size:clamp(7px,.9vw,13px);line-height:.9;letter-spacing:.01em;text-overflow:clip;white-space:normal}.fm-piece>strong span:not([data-fm-input]):not([data-fm-output]){overflow:hidden;font-size:clamp(6px,.65vw,10px);overflow-wrap:normal;text-overflow:clip;white-space:nowrap}

/* CSS-built materials. The catalog composes and positions these differently per route. */
.fm-file .fm-piece{clip-path:polygon(0 0,72% 0,100% 27%,100% 100%,0 100%);background:linear-gradient(135deg,#f2efe8 0 74%,#c9c1b5 74%);color:#080808}.fm-file .fm-piece::before{content:"";position:absolute;top:0;right:0;width:28%;height:27%;border-bottom:1px solid #080808;border-left:1px solid #080808;background:var(--fm-a)}
.fm-checker .fm-piece,.fm-mask .fm-piece{background-color:#f2efe8;background-image:linear-gradient(45deg,rgba(8,8,8,.22) 25%,transparent 25%),linear-gradient(-45deg,rgba(8,8,8,.22) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(8,8,8,.22) 75%),linear-gradient(-45deg,transparent 75%,rgba(8,8,8,.22) 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.fm-mask .fm-piece::before{content:"";position:absolute;inset:17% 25% 24%;border:2px dashed var(--fm-a);border-radius:44% 44% 34% 34%;background:#0b0b0b}
.fm-photo .fm-piece{padding:7%;background:#f2efe8}.fm-photo .fm-piece::before{content:"";position:absolute;inset:7% 7% 27%;background:radial-gradient(circle at 74% 25%,var(--fm-a) 0 8%,transparent 8.5%),linear-gradient(145deg,transparent 0 42%,var(--fm-b) 43% 64%,#131313 65%);filter:saturate(1.12)}.fm-photo .fm-piece::after{content:"";position:absolute;inset:7% 7% 27%;border:1px solid rgba(8,8,8,.55)}.fm-photo .fm-piece>strong{right:7%;bottom:7%;left:7%}
.fm-aperture .fm-piece,.fm-disc .fm-piece,.fm-loop .fm-piece{border-radius:50%}.fm-aperture .fm-piece{background:repeating-conic-gradient(from 8deg,var(--fm-a) 0 9deg,#080808 9deg 19deg);box-shadow:inset 0 0 0 18px rgba(5,5,5,.62),inset 0 0 0 20px var(--fm-b),0 0 32px color-mix(in srgb,var(--fm-a) 35%,transparent)}.fm-aperture .fm-piece::after{content:"";position:absolute;inset:34%;border:2px solid var(--paper);border-radius:50%;background:#050505}.fm-aperture[data-variant="hex"] .fm-piece{clip-path:polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%);border-radius:0}.fm-aperture .fm-piece>strong,.fm-disc .fm-piece>strong,.fm-loop .fm-piece>strong{right:17%;bottom:12%;left:17%;text-align:center}
.fm-disc .fm-piece{background:radial-gradient(circle,#080808 0 8%,var(--fm-a) 8% 11%,#111 11% 25%,#292929 25% 27%,#0b0b0b 27% 48%,#303030 48% 49%,#0a0a0a 49%);box-shadow:inset 0 0 0 2px var(--fm-b),0 0 26px color-mix(in srgb,var(--fm-a) 25%,transparent)}
.fm-loop .fm-piece{overflow:visible;border:3px solid var(--fm-a);border-right-color:transparent;background:transparent}.fm-loop .fm-piece::after{content:"";position:absolute;right:-7%;bottom:3%;border:8px solid transparent;border-top-color:var(--fm-a);rotate:-30deg}
.fm-pixels .fm-piece,.fm-raster .fm-piece,.fm-spark .fm-piece,.fm-tiles .fm-piece,.fm-packet .fm-piece{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:1fr;gap:2px;padding:6px;background:#050505}.fm-pixels .fm-piece i,.fm-raster .fm-piece i,.fm-spark .fm-piece i,.fm-tiles .fm-piece i,.fm-packet .fm-piece i{background:var(--fm-b)}.fm-pixels .fm-piece i:nth-child(3n),.fm-raster .fm-piece i:nth-child(3n),.fm-spark .fm-piece i:nth-child(3n),.fm-tiles .fm-piece i:nth-child(3n),.fm-packet .fm-piece i:nth-child(3n){background:var(--fm-a)}.fm-pixels .fm-piece i:nth-child(5n),.fm-raster .fm-piece i:nth-child(5n),.fm-spark .fm-piece i:nth-child(5n),.fm-tiles .fm-piece i:nth-child(5n),.fm-packet .fm-piece i:nth-child(5n){background:#f2efe8}.fm-raster .fm-piece{gap:0;padding:0}.fm-raster .fm-piece i{border:1px solid rgba(5,5,5,.45)}.fm-spark .fm-piece i{box-shadow:0 0 12px color-mix(in srgb,var(--fm-a) 65%,transparent)}.fm-tiles .fm-piece{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr)}.fm-tiles .fm-piece i:nth-child(1){grid-area:1/1/3/2}.fm-tiles .fm-piece i:nth-child(4){scale:.7}.fm-packet .fm-piece{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr)}
.fm-film .fm-piece{display:flex;align-items:center;gap:3px;padding:13% 4%;background:repeating-linear-gradient(90deg,#050505 0 8%,transparent 8% 12%),#202020}.fm-film .fm-piece::before,.fm-film .fm-piece::after{content:"";position:absolute;right:0;left:0;height:7%;background:repeating-linear-gradient(90deg,var(--paper) 0 4%,transparent 4% 8%)}.fm-film .fm-piece::before{top:3%}.fm-film .fm-piece::after{bottom:3%}.fm-film .fm-piece i{flex:1;height:100%;border:1px solid rgba(242,239,232,.45);background:linear-gradient(145deg,var(--fm-b),#080808 60%,var(--fm-a))}
.fm-wave .fm-piece,.fm-spectrum .fm-piece,.fm-fingerprint .fm-piece{display:flex;align-items:center;justify-content:center;gap:3px;padding:8% 5% 22%;background:#050505}.fm-wave .fm-piece i,.fm-spectrum .fm-piece i,.fm-fingerprint .fm-piece i{width:5%;height:30%;background:var(--fm-a);transform-origin:bottom}.fm-wave .fm-piece i:nth-child(3n+1){height:72%}.fm-wave .fm-piece i:nth-child(4n+2){height:46%;background:var(--fm-b)}.fm-wave .fm-piece i:nth-child(5n){height:88%}.fm-spectrum .fm-piece{align-items:flex-end;background:linear-gradient(to top,color-mix(in srgb,var(--fm-b) 20%,transparent),transparent),#050505}.fm-spectrum .fm-piece i{height:calc(18% + (var(--i) * 0%));background:linear-gradient(to top,var(--fm-b),var(--fm-a))}.fm-spectrum .fm-piece i:nth-child(2n){height:73%}.fm-spectrum .fm-piece i:nth-child(3n){height:42%}.fm-spectrum .fm-piece i:nth-child(5n){height:94%}.fm-fingerprint .fm-piece{align-items:flex-end;gap:2px;border-radius:45% 45% 12% 12%;background:#f2efe8}.fm-fingerprint .fm-piece i{height:65%;border-radius:12px 12px 0 0;background:#080808}.fm-fingerprint .fm-piece i:nth-child(2n){height:42%}.fm-fingerprint .fm-piece i:nth-child(3n){height:82%}
.fm-atom .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-atom .fm-piece i{position:absolute;inset:8%;border:2px solid var(--fm-a);border-radius:50%;rotate:calc(var(--i) * 37deg)}.fm-atom .fm-piece i:nth-child(2){inset:17% 3%;border-color:var(--fm-b);rotate:62deg}.fm-atom .fm-piece i:nth-child(3){inset:3% 22%;border-color:var(--paper);rotate:-52deg}.fm-atom .fm-piece::after{content:"";position:absolute;inset:42%;border-radius:50%;background:var(--fm-a);box-shadow:0 0 20px var(--fm-a)}
.fm-layers .fm-piece,.fm-stack .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-layers .fm-piece i,.fm-stack .fm-piece i{position:absolute;inset:12% 5% 22%;border:1px solid var(--paper);background:color-mix(in srgb,var(--fm-b) 48%,#080808);translate:calc(var(--i) * 4px) calc(var(--i) * -4px)}.fm-layers .fm-piece i:nth-child(2),.fm-stack .fm-piece i:nth-child(2){inset:19% 12% 15%;background:color-mix(in srgb,var(--fm-a) 60%,#080808)}.fm-layers .fm-piece i:nth-child(3),.fm-stack .fm-piece i:nth-child(3){inset:26% 19% 8%;background:#f2efe8}.fm-layers .fm-piece i:nth-child(4),.fm-stack .fm-piece i:nth-child(4){inset:34% 26% 2%;background:var(--fm-b)}
.fm-browser .fm-piece{padding:17% 7% 7%;background:#f2efe8;color:#080808}.fm-browser .fm-piece::before{content:"●  ●  ●";position:absolute;top:0;right:0;left:0;height:14%;padding:3% 5%;border-bottom:1px solid #080808;background:var(--fm-a);font:700 7px/1 monospace;letter-spacing:4px}.fm-browser .fm-piece::after{content:"";position:absolute;inset:23% 9% 28%;background:linear-gradient(135deg,var(--fm-b) 0 45%,#080808 45% 52%,var(--fm-a) 52%)}
.fm-archive .fm-piece{overflow:visible;margin-top:12%;height:88%;background:var(--fm-a)}.fm-archive .fm-piece::before{content:"";position:absolute;top:-14%;left:-1px;width:48%;height:15%;border:1px solid var(--paper);border-bottom:0;background:var(--fm-a)}.fm-archive .fm-piece::after{content:"";position:absolute;top:0;bottom:0;left:48%;width:7%;background:repeating-linear-gradient(to bottom,#080808 0 5%,transparent 5% 10%)}
.fm-meta .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-meta .fm-piece i{position:relative;width:max-content;margin:5% 0;padding:6px 9px;border:1px solid var(--paper);background:#080808;color:var(--paper);font:700 8px/1 monospace}.fm-meta .fm-piece i:nth-child(2){margin-left:24%;background:var(--fm-b)}.fm-meta .fm-piece i:nth-child(3){margin-left:9%;background:var(--fm-a);color:#080808}
.fm-frame .fm-piece{overflow:visible;border:2px solid var(--fm-a);background:rgba(49,85,255,.1);box-shadow:0 0 0 999px rgba(0,0,0,.26)}.fm-frame .fm-piece i{position:absolute;width:12px;height:12px;border:3px solid var(--paper);background:#050505}.fm-frame .fm-piece i:nth-child(1){top:-6px;left:-6px;border-right:0;border-bottom:0}.fm-frame .fm-piece i:nth-child(2){top:-6px;right:-6px;border-bottom:0;border-left:0}.fm-frame[data-variant="large"] .fm-piece{border-width:4px}.fm-frame .fm-piece>strong{bottom:8px}
.fm-silhouette .fm-piece{border:0;background:transparent;box-shadow:none}.fm-silhouette .fm-piece::before{content:"";position:absolute;top:4%;left:34%;width:32%;aspect-ratio:1;border-radius:50%;background:var(--paper);box-shadow:0 0 0 4px var(--fm-a)}.fm-silhouette .fm-piece::after{content:"";position:absolute;right:16%;bottom:17%;left:16%;height:56%;border-radius:44% 44% 12% 12%;background:var(--paper);clip-path:polygon(22% 0,78% 0,100% 100%,0 100%)}
.fm-brush .fm-piece{overflow:visible;border:0;background:linear-gradient(90deg,var(--fm-a) 0 66%,#f2efe8 66%);clip-path:polygon(0 22%,68% 22%,80% 0,100% 0,100% 100%,80% 100%,68% 78%,0 78%);box-shadow:none}.fm-brush .fm-piece::after{content:"";position:absolute;right:1%;bottom:14%;width:19%;height:72%;background:repeating-linear-gradient(90deg,#080808 0 2px,transparent 2px 5px)}
.fm-scissors .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-scissors .fm-piece i{position:absolute;bottom:10%;width:34%;aspect-ratio:1;border:4px solid var(--fm-a);border-radius:50%}.fm-scissors .fm-piece i:first-child{left:4%}.fm-scissors .fm-piece i:nth-child(2){right:4%}.fm-scissors .fm-piece::before,.fm-scissors .fm-piece::after{content:"";position:absolute;top:4%;left:48%;width:5px;height:58%;background:var(--paper);transform-origin:bottom}.fm-scissors .fm-piece::before{rotate:32deg}.fm-scissors .fm-piece::after{rotate:-32deg}
.fm-gate .fm-piece{display:flex;align-items:stretch;justify-content:space-between;overflow:visible;border:0;background:transparent;box-shadow:none}.fm-gate .fm-piece i{width:42%;border:1px solid var(--paper);background:repeating-linear-gradient(135deg,var(--fm-a) 0 7px,#080808 7px 14px)}.fm-gate .fm-piece::after{content:"";position:absolute;top:47%;right:22%;left:22%;height:6%;background:var(--fm-b);box-shadow:0 0 14px var(--fm-b)}
.fm-filter .fm-piece{background:repeating-linear-gradient(100deg,var(--fm-a) 0 7%,transparent 7% 14%),linear-gradient(var(--fm-b),#080808)}.fm-scan .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-scan .fm-piece::before{content:"";position:absolute;top:0;bottom:0;left:44%;width:12%;background:var(--fm-a);box-shadow:0 0 24px var(--fm-a),-16px 0 0 color-mix(in srgb,var(--fm-b) 35%,transparent),16px 0 0 color-mix(in srgb,var(--fm-b) 35%,transparent)}
.fm-code .fm-piece{display:flex;align-items:stretch;gap:3px;padding:6px 6px 22%;background:#050505}.fm-code .fm-piece i{flex:1;overflow:hidden;color:var(--fm-a);font:700 7px/.9 'IBM Plex Mono',monospace;word-break:break-all}.fm-code .fm-piece i::after{content:attr(data-glyph) attr(data-glyph) attr(data-glyph) attr(data-glyph)}
.fm-tracks .fm-piece{display:flex;flex-direction:column;justify-content:center;gap:9%;padding:9% 5% 24%;background:#050505}.fm-tracks .fm-piece i{height:10%;background:var(--fm-b);box-shadow:14px 0 var(--fm-a)}.fm-tracks .fm-piece i:nth-child(2n){width:76%;margin-left:auto;background:var(--fm-a)}
.fm-cassette .fm-piece{background:linear-gradient(#f2efe8 0 20%,var(--fm-a) 20% 72%,#080808 72%);color:#080808}.fm-cassette .fm-piece::before,.fm-cassette .fm-piece::after{content:"";position:absolute;top:34%;width:23%;aspect-ratio:1;border:5px solid #080808;border-radius:50%;background:#f2efe8}.fm-cassette .fm-piece::before{left:16%}.fm-cassette .fm-piece::after{right:16%}
.fm-page .fm-piece{overflow:visible;border:0;background:transparent;box-shadow:none}.fm-page .fm-piece i{position:absolute;right:7%;left:7%;height:25%;border:1px solid var(--paper);background:var(--fm-b);transform-origin:left}.fm-page .fm-piece i:nth-child(1){top:4%;rotate:-5deg}.fm-page .fm-piece i:nth-child(2){top:20%;rotate:4deg;background:var(--fm-a)}.fm-page .fm-piece i:nth-child(3){top:36%;rotate:-2deg}.fm-page .fm-piece i:nth-child(4){top:52%;rotate:6deg;background:#f2efe8}.fm-page .fm-piece i:nth-child(5){top:68%}
.fm-container .fm-piece{background:#0d0d0d;box-shadow:inset 0 0 0 8px var(--fm-b),inset 0 0 0 10px #080808,inset 0 0 0 17px var(--fm-a)}.fm-container .fm-piece::before,.fm-container .fm-piece::after{content:"";position:absolute;border:1px solid var(--paper)}.fm-container .fm-piece::before{inset:21% 17% 34%}.fm-container .fm-piece::after{inset:31% 26% 42%;background:var(--fm-b)}
.fm-meter .fm-piece{border-radius:90px 90px 8px 8px;background:conic-gradient(from 270deg,var(--fm-b),var(--fm-a) 45%,#1c1c1c 45% 100%)}.fm-meter .fm-piece::before{content:"";position:absolute;inset:24% 18% 0;border-radius:80px 80px 0 0;background:#080808}.fm-meter .fm-piece::after{content:"";position:absolute;left:49%;bottom:18%;width:3px;height:42%;background:var(--paper);transform-origin:bottom;rotate:-36deg}
.fm-zip .fm-piece{border:0;background:linear-gradient(90deg,var(--fm-b) 0 44%,#080808 44% 56%,var(--fm-a) 56%);box-shadow:none}.fm-zip .fm-piece::before{content:"";position:absolute;top:4%;bottom:4%;left:45%;width:10%;background:repeating-linear-gradient(to bottom,#f2efe8 0 5px,transparent 5px 10px)}.fm-zip .fm-piece::after{content:"";position:absolute;top:6%;left:41%;width:18%;height:14%;border:2px solid var(--paper);background:#080808}
.fm-qr .fm-piece{padding:7%;background:#f2efe8}.fm-qr .fm-piece::before{content:"";position:absolute;inset:7% 7% 23%;background:repeating-conic-gradient(#080808 0 25%,transparent 0 50%) 0 0/13px 13px}.fm-qr .fm-piece i{position:absolute;width:22%;aspect-ratio:1;border:5px solid #080808;background:#f2efe8;box-shadow:inset 0 0 0 4px #f2efe8,inset 0 0 0 10px #080808}.fm-qr .fm-piece i:nth-child(1){top:9%;left:9%}.fm-qr .fm-piece i:nth-child(2){top:9%;right:9%}.fm-qr .fm-piece i:nth-child(3){bottom:28%;left:9%}
.fm-stamp .fm-piece{overflow:visible;border:4px solid var(--fm-a);background:rgba(255,77,0,.12);box-shadow:none}.fm-stamp .fm-piece::before{content:"C/24";position:absolute;inset:17%;display:grid;place-items:center;border:3px solid var(--fm-a);color:var(--fm-a);font:900 clamp(14px,2vw,30px)/1 'Archivo',sans-serif;rotate:-8deg}

.fm-sweep{position:absolute;z-index:18;top:0;bottom:0;left:0;width:3px;opacity:0;background:var(--fm-a);box-shadow:10px 0 0 color-mix(in srgb,var(--fm-a) 15%,transparent),0 0 24px var(--fm-a);pointer-events:none}
.fm-activate{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:54px;margin:0;padding:12px 16px;border:1px solid var(--fm-a);border-top:0;border-radius:0;background:var(--fm-a);color:#050505;cursor:pointer;font:850 12px/1 'Archivo',sans-serif;font-variation-settings:'wdth' 86,'wght' 850;letter-spacing:.055em;text-align:left;text-transform:uppercase;transition:background-color .16s linear,color .16s linear,transform .12s var(--ease-snap)}.fm-activate span{font:700 20px/1 'IBM Plex Mono',monospace}.fm-activate:hover{background:var(--paper);color:var(--forge)}.fm-activate:active{transform:translateY(2px)}.fm-activate:disabled{cursor:progress;opacity:.76;transform:none}.fm-activate:disabled:hover{background:var(--fm-a);color:var(--forge)}.fm-activate:focus-visible{outline:3px solid var(--forge);outline-offset:-4px}.fm-stage.fm-drag .fm-machine{border-color:var(--cobalt-hot)}.fm-stage.fm-drag .fm-activate{background:var(--cobalt);border-color:var(--cobalt);color:var(--paper)}

/* Finite, semantic motion primitives. Each scene owns a different ordered mix. */
.fm-stage.fm-run [data-motion] .fm-piece{animation-duration:3.45s;animation-delay:calc(var(--i) * 55ms);animation-timing-function:var(--ease-mech);animation-fill-mode:both}
[data-motion="build"] .fm-piece{animation-name:fm-build}[data-motion="compress"] .fm-piece{animation-name:fm-compress}[data-motion="crop"] .fm-piece{animation-name:fm-crop}[data-motion="cut"] .fm-piece{animation-name:fm-cut}[data-motion="develop"] .fm-piece{animation-name:fm-develop}[data-motion="expand"] .fm-piece{animation-name:fm-expand}[data-motion="fade"] .fm-piece{animation-name:fm-fade}[data-motion="fan"] .fm-piece{animation-name:fm-fan}[data-motion="filter"] .fm-piece{animation-name:fm-filter}[data-motion="fold"] .fm-piece{animation-name:fm-fold}[data-motion="lace"] .fm-piece{animation-name:fm-lace}[data-motion="lock"] .fm-piece{animation-name:fm-lock}[data-motion="orbit"] .fm-piece{animation-name:fm-orbit}[data-motion="pack"] .fm-piece{animation-name:fm-pack}[data-motion="peel"] .fm-piece{animation-name:fm-peel}[data-motion="pulse"] .fm-piece{animation-name:fm-pulse}[data-motion="refine"] .fm-piece{animation-name:fm-refine}[data-motion="reveal"] .fm-piece{animation-name:fm-reveal}[data-motion="rise"] .fm-piece{animation-name:fm-rise}[data-motion="scan"] .fm-piece{animation-name:fm-scan}[data-motion="scatter"] .fm-piece{animation-name:fm-scatter}[data-motion="scrub"] .fm-piece{animation-name:fm-scrub}[data-motion="shred"] .fm-piece{animation-name:fm-shred}[data-motion="slide"] .fm-piece{animation-name:fm-slide}[data-motion="spin"] .fm-piece{animation-name:fm-spin}[data-motion="split"] .fm-piece{animation-name:fm-split}[data-motion="stamp"] .fm-piece{animation-name:fm-stamp}[data-motion="tile"] .fm-piece{animation-name:fm-tile}[data-motion="unfold"] .fm-piece{animation-name:fm-unfold}[data-motion="unfurl"] .fm-piece{animation-name:fm-unfurl}[data-motion="unpack"] .fm-piece{animation-name:fm-unpack}[data-motion="unzip"] .fm-piece{animation-name:fm-unzip}[data-motion="wipe"] .fm-piece{animation-name:fm-wipe}[data-motion="zip"] .fm-piece{animation-name:fm-zip}
@keyframes fm-build{0%,18%{clip-path:inset(100% 0 0);opacity:.2}72%,100%{clip-path:inset(0);opacity:1}}@keyframes fm-compress{0%,18%{scale:1}55%{scale:.7 1.08}78%,100%{scale:.84}}@keyframes fm-crop{0%,18%{clip-path:inset(0)}55%{clip-path:inset(13% 17%)}78%,100%{clip-path:inset(4%)}}@keyframes fm-cut{0%,22%{scale:1;opacity:1}48%{scale:1.08;rotate:var(--r)}63%{scale:.82;opacity:.42}78%,100%{scale:1;opacity:1}}@keyframes fm-develop{0%,20%{filter:grayscale(1) brightness(.35);opacity:.35}60%{filter:grayscale(.35) brightness(1.35)}78%,100%{filter:none;opacity:1}}@keyframes fm-expand{0%,20%{scale:.42 .82;opacity:.35}65%{scale:1.08 1}78%,100%{scale:1;opacity:1}}@keyframes fm-fade{0%,20%{opacity:1}56%{opacity:.18}78%,100%{opacity:.72}}@keyframes fm-fan{0%,20%{rotate:calc(var(--r) - 14deg);scale:.86}58%{rotate:calc(var(--r) + 9deg);scale:1.05}78%,100%{rotate:var(--r);scale:1}}@keyframes fm-filter{0%,20%{filter:none}52%{filter:contrast(1.8) saturate(.2)}78%,100%{filter:none}}@keyframes fm-fold{0%,20%{rotate:var(--r);scale:1 1}55%{rotate:calc(var(--r) + 11deg);scale:.54 1}78%,100%{rotate:var(--r);scale:.82 1}}@keyframes fm-lace{0%,18%{translate:-12% 0;opacity:.45}46%{translate:8% -4%;opacity:1}78%,100%{translate:0;opacity:1}}@keyframes fm-lock{0%,20%{scale:1}48%{scale:1.09}59%{scale:.92}72%,100%{scale:1}}@keyframes fm-orbit{0%,18%{rotate:var(--r);translate:0}48%{rotate:calc(var(--r) + 180deg);translate:4% -5%}78%,100%{rotate:calc(var(--r) + 360deg);translate:0}}@keyframes fm-pack{0%,18%{scale:1;translate:-8% 0}55%{scale:.72;translate:12% 0}78%,100%{scale:1;translate:0}}@keyframes fm-peel{0%,18%{rotate:var(--r);transform:rotateY(0)}52%{rotate:calc(var(--r) - 8deg);transform:rotateY(48deg)}78%,100%{rotate:var(--r);transform:rotateY(0)}}@keyframes fm-pulse{0%,18%{scale:1}42%{scale:1.09}58%{scale:.96}78%,100%{scale:1}}@keyframes fm-refine{0%,18%{filter:blur(5px) contrast(.75);scale:.92}62%{filter:blur(0) contrast(1.35);scale:1.04}78%,100%{filter:none;scale:1}}@keyframes fm-reveal{0%,18%{clip-path:inset(0 100% 0 0);opacity:.3}70%,100%{clip-path:inset(0);opacity:1}}@keyframes fm-rise{0%,18%{translate:0 24%;opacity:.25}62%{translate:0 -4%;opacity:1}78%,100%{translate:0;opacity:1}}@keyframes fm-scan{0%,18%{filter:brightness(.55)}46%{filter:brightness(1.8);box-shadow:0 0 34px var(--fm-a)}78%,100%{filter:none}}@keyframes fm-scatter{0%,18%{scale:.78;filter:blur(2px)}48%{scale:1.08;rotate:calc(var(--r) + 7deg)}78%,100%{scale:1;rotate:var(--r);filter:none}}@keyframes fm-scrub{0%,18%{translate:-10% 0}52%{translate:11% 0}78%,100%{translate:0}}@keyframes fm-shred{0%,20%{clip-path:inset(0);opacity:1}60%{clip-path:inset(0 0 72%);opacity:.35}78%,100%{clip-path:inset(0);opacity:1}}@keyframes fm-slide{0%,18%{translate:-22% 0;opacity:.35}58%{translate:4% 0;opacity:1}78%,100%{translate:0;opacity:1}}@keyframes fm-spin{0%,18%{rotate:var(--r)}70%,100%{rotate:calc(var(--r) + 360deg)}}@keyframes fm-split{0%,18%{scale:1;letter-spacing:0}48%{scale:1.18 .82;letter-spacing:.12em}78%,100%{scale:1;letter-spacing:0}}@keyframes fm-stamp{0%,24%{scale:1.14;opacity:.35}51%{scale:.89;opacity:1}59%{scale:1.06}74%,100%{scale:1}}@keyframes fm-tile{0%,18%{background-size:100% 100%}58%{background-size:36% 36%}78%,100%{background-size:100% 100%}}@keyframes fm-unfold{0%,18%{transform:rotateX(58deg);scale:.7}62%{transform:rotateX(-6deg);scale:1.04}78%,100%{transform:none;scale:1}}@keyframes fm-unfurl{0%,18%{scale:1 .18;transform-origin:top}64%{scale:1 1.06;transform-origin:top}78%,100%{scale:1}}@keyframes fm-unpack{0%,18%{scale:.68;rotate:calc(var(--r) - 12deg)}60%{scale:1.08;rotate:calc(var(--r) + 4deg)}78%,100%{scale:1;rotate:var(--r)}}@keyframes fm-unzip{0%,18%{clip-path:inset(0 43%)}64%{clip-path:inset(0)}78%,100%{clip-path:inset(0)}}@keyframes fm-wipe{0%,18%{clip-path:inset(0 92% 0 0)}62%{clip-path:inset(0)}78%,100%{clip-path:inset(0)}}@keyframes fm-zip{0%,18%{clip-path:inset(0 0 86%)}62%{clip-path:inset(0)}78%,100%{clip-path:inset(0)}}
.fm-stage.fm-run .fm-wave i,.fm-stage.fm-run .fm-spectrum i,.fm-stage.fm-run .fm-meter .fm-piece::after{animation:fm-meter-live .82s ease-in-out calc(var(--i) * 35ms) 3 alternate}.fm-stage.fm-run .fm-film i{animation:fm-frame-flash .55s steps(2,end) calc(var(--i) * 90ms) 4}.fm-stage.fm-run .fm-qr i{animation:fm-module-seat .5s var(--ease-snap) calc(var(--i) * 150ms) both}.fm-stage.fm-run .fm-sweep{animation:fm-sweep-pass 3.2s linear .1s both}
@keyframes fm-meter-live{to{scale:1 .52;opacity:.62}}@keyframes fm-frame-flash{50%{filter:brightness(2);translate:5% 0}}@keyframes fm-module-seat{from{scale:.2;opacity:0}to{scale:1;opacity:1}}@keyframes fm-sweep-pass{0%{opacity:0;translate:0}10%,84%{opacity:.55}100%{opacity:0;translate:calc(100vw - 3px) 0}}

/* Real workflow state treatment. */
.fm-stage[data-state="resolving"] .fm-status::before,.fm-stage[data-state="working"] .fm-status::before{background:var(--meter-amber)}.fm-stage.fm-visible[data-state="resolving"] .fm-sweep,.fm-stage.fm-visible[data-state="working"] .fm-sweep{opacity:.72;animation:fm-working-sweep 1.55s linear infinite}.fm-stage.fm-visible[data-state="working"] .fm-object:nth-child(2n) .fm-piece{animation:fm-working-seat 1.25s var(--ease-mech) infinite alternate}.fm-stage[data-state="done"] .fm-status{color:#8bffb5}.fm-stage[data-state="done"] .fm-status::before{background:var(--meter-green)}.fm-stage[data-state="done"] .fm-object[data-role="output"] .fm-piece{border-color:var(--meter-green);box-shadow:0 0 0 3px rgba(53,201,109,.24),0 20px 34px rgba(0,0,0,.4)}.fm-stage[data-state="done"] .fm-object[data-role="output"] .fm-piece>strong{background:var(--meter-green);color:#041a0b}.fm-stage[data-state="error"] .fm-status{color:#ff9ca0}.fm-stage[data-state="error"] .fm-status::before{background:var(--clip-red)}.fm-stage[data-state="error"] .fm-viewport{box-shadow:inset 0 0 0 3px var(--clip-red)}.fm-stage[data-state="error"] .fm-sweep{left:20%;opacity:.85;background:var(--clip-red)}
@keyframes fm-working-sweep{from{translate:0}to{translate:calc(100vw - 3px) 0}}@keyframes fm-working-seat{to{translate:0 -3%;filter:brightness(1.28)}}

@media(max-width:1099px){.fm-masthead{grid-template-columns:minmax(0,.94fr) minmax(400px,1.06fr);gap:30px}.page-head .fm-copy h1.display,body[data-page="convert"] .fm-copy h1.display{font-size:clamp(50px,6.8vw,76px)}.fm-art-copy strong{font-size:clamp(15px,2vw,22px)}}
@media(max-width:899px){.fm-masthead{grid-template-columns:1fr;gap:30px}.page-head .fm-copy h1.display,body[data-page="convert"] .fm-copy h1.display{max-width:9ch}.fm-stage{max-width:780px;filter:drop-shadow(0 22px 32px rgba(0,0,0,.36))}.page-head .fm-stage{margin-top:4px}.fm-viewport{min-height:clamp(286px,53vw,392px)}}
@media(max-width:640px){.page-head:has(.fm-stage){padding-bottom:26px}body[data-page="convert"] .hero{padding-bottom:48px}.fm-masthead{gap:22px}.page-head .fm-copy h1.display,body[data-page="convert"] .fm-copy h1.display{max-width:none;font-size:clamp(44px,13vw,62px);line-height:.85}.page-head .fm-copy .lede,body[data-page="convert"] .fm-copy .lede{font-size:15px;line-height:1.4}.fm-stage{width:calc(100% + 40px);margin-inline:-20px;filter:none}.fm-machine{aspect-ratio:4/3;border-inline:0}.fm-viewport{min-height:clamp(244px,70vw,310px)}.fm-head{min-height:38px;padding-inline:12px;font-size:9px}.fm-foot{min-height:38px;font-size:8px}.fm-foot span{padding-inline:9px}.fm-activate{min-height:54px;padding-inline:14px}.fm-art-copy{width:45%}.fm-art-copy strong{font-size:clamp(12px,3.8vw,17px)}.fm-art-copy small{font-size:6px}.fm-piece>strong{right:4px;bottom:4px;left:4px;padding:4px;font-size:clamp(7px,2.5vw,10px)}.fm-viewport::after{background-size:22px 22px}.fm-object{translate:0 0}}
@media(max-width:380px){.fm-viewport{min-height:230px}.fm-art-copy{width:48%;gap:3px}.fm-art-copy small{display:none}.fm-art-copy strong{font-size:12px}.fm-foot span{font-size:6px;letter-spacing:0}.fm-piece>strong{font-size:7px}}

@media(prefers-reduced-motion:reduce){.fm-stage{--fm-x:0px;--fm-y:0px}.fm-stage .fm-piece,.fm-stage .fm-piece i,.fm-stage .fm-piece::before,.fm-stage .fm-piece::after,.fm-stage .fm-sweep{animation:none!important;transition:none!important}.fm-stage .fm-sweep{left:50%;opacity:.22}.fm-object{translate:0 0}}
.fm-stage.fm-save-data .fm-piece,.fm-stage.fm-save-data .fm-piece i,.fm-stage.fm-save-data .fm-piece::before,.fm-stage.fm-save-data .fm-piece::after,.fm-stage.fm-save-data .fm-sweep{animation:none!important;transition:none!important}
@media(forced-colors:active){.fm-stage{filter:none;color:CanvasText}.fm-machine,.fm-head,.fm-foot,.fm-viewport,.fm-piece,.fm-activate,.fm-piece>strong{background:Canvas;color:CanvasText;border-color:CanvasText;forced-color-adjust:auto}.fm-viewport::before,.fm-viewport::after,.fm-art-copy small,.fm-sweep{display:none}.fm-piece i,.fm-piece::before,.fm-piece::after{border-color:CanvasText!important;background:CanvasText!important;box-shadow:none!important}.fm-activate:focus-visible{outline:3px solid Highlight}.fm-object[data-role="output"] .fm-piece>strong{background:Highlight;color:HighlightText}}