:root {
  color-scheme: dark;
  --bg: #101018;
  --panel: #171722;
  --panel-strong: #1c1c2a;
  --text: #f5f4fa;
  --muted: #a5a3b3;
  --soft: #767487;
  --line: rgba(255, 255, 255, .09);
  --violet: #a78bfa;
  --blue: #60a5fa;
  --mint: #74dfbc;
  --page: 1160px;
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--bg);
  color: var(--text);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; min-width: 320px; background: var(--bg); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { color: #fff; background: #6750b7; }
.page-shell { width: min(var(--page), calc(100% - 64px)); margin-inline: auto; }
.skip-link { position: fixed; z-index: 20; top: 8px; left: 8px; padding: 12px 16px; transform: translateY(-150%); color: #0b0b12; border-radius: 9px; background: white; font-weight: 700; }
.skip-link:focus { transform: translateY(0); }

.site-header { position: sticky; z-index: 10; top: 0; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 76px; padding-inline: max(32px, calc((100vw - var(--page)) / 2)); border-bottom: 1px solid rgba(255,255,255,.06); background: rgba(16,16,24,.83); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: Manrope, sans-serif; font-size: 16px; font-weight: 800; letter-spacing: -.04em; }
.brand-mark { display: inline-flex; flex: 0 0 auto; width: 36px; height: 36px; overflow: hidden; border-radius: 11px; }
.brand-mark img { display: block; width: 100%; height: 100%; }
.top-nav, .header-actions { display: flex; align-items: center; }
.top-nav { gap: 34px; margin-left: 72px; }
.top-nav a, .github-link { color: #c9c7d4; font-size: 13px; font-weight: 600; transition: color .2s ease; }
.top-nav a:hover, .github-link:hover, .site-footer > a:last-child:hover { color: #fff; }
.header-actions { gap: 22px; }
.github-link { display: inline-flex; align-items: center; gap: 8px; }
.github-link svg { width: 17px; height: 17px; }
.language-switch { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: rgba(255,255,255,.035); }
.language-switch button { min-width: 32px; padding: 5px 7px; border: 0; border-radius: 6px; background: transparent; color: var(--soft); cursor: pointer; font-size: 10px; font-weight: 800; }
.language-switch button[aria-pressed="true"] { background: #2b293b; color: #fff; }

.hero { position: relative; display: grid; grid-template-columns: .94fr 1.06fr; align-items: center; min-height: 666px; gap: 48px; padding-top: 68px; padding-bottom: 82px; }
.hero::before { position: absolute; top: 30px; left: 12%; z-index: -1; width: 400px; height: 400px; border-radius: 50%; background: rgba(90,73,160,.12); content: ''; filter: blur(90px); }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0; color: #c2b5fd; font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: #8f79fa; box-shadow: 0 0 15px rgba(143,121,250,.8); }
.dot-violet { background: #bd8dff; box-shadow: 0 0 15px #bd8dff66; }
.dot-cyan { background: #61d9d6; box-shadow: 0 0 15px #61d9d666; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: Manrope, 'DM Sans', sans-serif; }
.hero h1 { max-width: 570px; margin: 22px 0 20px; font-size: clamp(43px, 5.2vw, 67px); line-height: 1.03; letter-spacing: -.065em; }
.hero h1 .hero-highlight { color: #a99af7; }
.hero-description { max-width: 490px; margin-bottom: 28px; color: var(--muted); font-size: 16px; line-height: 1.8; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
.button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 13px; padding: 0 18px; border: 1px solid transparent; border-radius: 11px; font-size: 12px; font-weight: 700; transition: transform .2s ease, border-color .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: linear-gradient(110deg, #7662e8, #437fea); color: white; box-shadow: 0 8px 28px rgba(76,101,221,.2); }
.button-primary:hover { background: linear-gradient(110deg, #8876f2, #5892fb); }
.button-secondary { border-color: var(--line); background: rgba(255,255,255,.025); color: #dedce8; }
.button-secondary:hover { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.06); }
.hero-facts { display: flex; flex-wrap: wrap; gap: 22px; margin: 28px 0 0; padding: 0; color: #888697; list-style: none; }
.hero-facts li { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; }
.fact-icon { display: inline-grid; width: 18px; height: 18px; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; color: #b1a6f5; font-size: 11px; }

.product-visual { position: relative; display: grid; min-height: 440px; align-items: center; isolation: isolate; }
.product-visual::before { position: absolute; z-index: -2; width: 420px; height: 320px; justify-self: center; border-radius: 50%; background: linear-gradient(130deg, rgba(128,89,223,.17), rgba(35,154,186,.09)); content: ''; filter: blur(62px); }
.visual-orbit { position: absolute; z-index: -1; border: 1px solid rgba(181,169,255,.11); border-radius: 50%; transform: rotate(-15deg); }
.orbit-one { width: 520px; height: 330px; justify-self: center; }
.orbit-two { width: 450px; height: 275px; justify-self: center; transform: rotate(18deg); }
.app-window { position: relative; width: min(100%, 600px); margin: auto; overflow: hidden; border: 1px solid rgba(210,205,255,.2); border-radius: 16px; background: #11111a; box-shadow: 0 28px 80px rgba(0,0,0,.55), 0 0 0 7px rgba(255,255,255,.018); transform: perspective(1200px) rotateY(-4deg) rotateX(2deg); }
.window-bar { display: flex; height: 44px; align-items: center; justify-content: space-between; padding: 0 14px; border-bottom: 1px solid rgba(255,255,255,.07); background: #1c1c27; }
.window-dots { display: flex; gap: 5px; }
.window-dots i { width: 8px; height: 8px; border-radius: 50%; background: #555462; }
.window-dots i:first-child { background: #e77673; }.window-dots i:nth-child(2) { background: #e8ba69; }.window-dots i:nth-child(3) { background: #73c58b; }
.window-title { margin-left: 54px; color: #bcbac9; font-size: 10px; font-weight: 700; }
.window-status { display: inline-flex; align-items: center; gap: 6px; color: #b0b0bd; font-size: 9px; }
.window-status i { width: 6px; height: 6px; border-radius: 50%; background: #61ddb5; }
.tool-strip { display: flex; height: 48px; align-items: center; justify-content: space-around; padding: 0 8px; border-bottom: 1px solid rgba(255,255,255,.06); color: #777585; }
.tool-strip span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; font-size: 9px; }
.tool-strip b { color: #aaa7b8; font-size: 12px; }.tool-strip .selected { height: 30px; padding: 0 8px; border-radius: 7px; background: #343247; color: white; }
.tool-strip .selected b { color: #c2b4ff; }
.window-body { display: grid; grid-template-columns: 177px 1fr; min-height: 290px; }
.visual-sidebar { display: flex; flex-direction: column; gap: 9px; padding: 19px 13px 14px; border-right: 1px solid rgba(255,255,255,.06); background: #15151f; }
.visual-label { margin-bottom: 2px; color: #8d8a9c; font-size: 8px; font-weight: 800; letter-spacing: .11em; }
.preset { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 7px 8px; border: 1px solid rgba(255,255,255,.07); border-radius: 8px; background: rgba(255,255,255,.025); }
.preset.active { border-color: rgba(120,130,242,.55); background: rgba(99,102,241,.1); }
.preset-check { display: grid; width: 13px; height: 13px; flex: 0 0 13px; place-items: center; border: 1px solid #656273; border-radius: 4px; color: #fff; font-size: 9px; }
.preset.active .preset-check { border-color: #707aff; background: #6873f2; }
.preset strong, .preset small { display: block; }.preset strong { color: #dad9e3; font-size: 8px; font-weight: 600; }.preset small { margin-top: 3px; color: #7f7c8e; font-size: 7px; }
.visual-export { display: flex; min-height: 34px; align-items: center; justify-content: center; gap: 7px; margin-top: auto; border-radius: 7px; background: linear-gradient(105deg, #456fe0, #6e51d0); color: #fff; font-size: 9px; font-weight: 700; }
.visual-canvas { position: relative; display: grid; min-height: 290px; place-items: center; overflow: hidden; background: radial-gradient(ellipse at 50% 47%, #30314c 0, #191925 41%, #13131b 74%); }
.media-card { position: absolute; width: 139px; height: 165px; overflow: hidden; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; box-shadow: 0 13px 35px rgba(0,0,0,.4); }
.media-card-back { margin: -24px 0 0 74px; background: linear-gradient(155deg, #78d3bf, #5178d7 55%, #59509a); transform: rotate(11deg) scale(.8); opacity: .56; }
.media-card-front { margin: 14px 34px 0 0; background: linear-gradient(140deg, #e7a775, #de687b 48%, #694e95); }
.shape-sun, .shape-orb, .shape-arc, .shape-ribbon { position: absolute; display: block; }
.shape-orb { top: 18px; right: -10px; width: 105px; height: 105px; border-radius: 50%; background: linear-gradient(135deg, #f2d69a, #f4a87b); box-shadow: inset -9px -7px 22px rgba(136,59,84,.25); }
.shape-ribbon { top: 83px; left: -26px; width: 175px; height: 43px; border: 10px solid rgba(53,65,107,.73); border-radius: 60% 25% 55% 20%; transform: rotate(-28deg); }
.media-caption { position: absolute; bottom: 16px; left: 14px; color: #fff9eb; font-family: Georgia, serif; font-size: 20px; font-style: italic; line-height: .92; }
.media-meta { position: absolute; right: 10px; bottom: 8px; color: rgba(255,255,255,.7); font-size: 6px; letter-spacing: .1em; }
.shape-sun { top: 32px; left: 29px; width: 58px; height: 58px; border-radius: 50%; background: #c3f4b7; }.shape-arc { right: -23px; bottom: 18px; width: 155px; height: 66px; border: 12px solid #3e4f95; border-radius: 50%; transform: rotate(24deg); }
.canvas-badge { position: absolute; padding: 6px 8px; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; background: rgba(18,18,28,.82); color: #d1cfe0; font-size: 7px; font-weight: 700; }
.badge-webp { top: 19px; left: 18px; }.badge-size { right: 17px; bottom: 17px; }
.floating-note { position: absolute; z-index: 2; display: flex; align-items: center; gap: 9px; padding: 10px 13px 10px 10px; border: 1px solid rgba(255,255,255,.14); border-radius: 11px; background: rgba(29,28,42,.94); box-shadow: 0 14px 30px rgba(0,0,0,.36); backdrop-filter: blur(12px); }
.floating-note b, .floating-note small { display: block; white-space: nowrap; }.floating-note b { color: #e5e3ed; font-size: 9px; }.floating-note small { margin-top: 3px; color: #9390a4; font-size: 8px; }
.note-video { top: 28px; right: -4px; }.note-lock { bottom: 31px; left: -8px; }
.note-icon { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 8px; font-size: 12px; }.note-purple { background: rgba(139,92,246,.2); color: #c9b3ff; }.note-green { background: rgba(67,190,144,.18); color: #80edbf; }
.visual-caption { position: absolute; right: 8px; bottom: 0; margin: 0; color: #727082; font-size: 9px; }

.intro-band { border-block: 1px solid rgba(255,255,255,.055); background: #14141d; }
.intro-inner { display: flex; min-height: 112px; align-items: center; gap: 28px; }.intro-inner > p:first-child { max-width: 600px; margin: 0; color: #e3e1eb; font-family: Manrope, sans-serif; font-size: 17px; font-weight: 600; letter-spacing: -.025em; line-height: 1.5; }.intro-rule { width: 1px; height: 42px; background: rgba(255,255,255,.14); }.intro-small { max-width: 205px; margin: 0; color: #8f8c9d; font-size: 11px; line-height: 1.6; }

.tools-section { padding-top: 106px; padding-bottom: 112px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 38px; margin-bottom: 35px; }.section-heading h2, .workflow-copy h2, .honesty-section h2 { margin: 14px 0 0; font-size: clamp(30px, 4vw, 44px); line-height: 1.13; letter-spacing: -.055em; }.section-heading > p { max-width: 340px; margin: 0 0 4px; color: var(--muted); font-size: 13px; line-height: 1.8; }
.tool-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.tool-card { position: relative; min-height: 244px; overflow: hidden; padding: 22px 22px 19px; border: 1px solid rgba(255,255,255,.075); border-radius: 15px; background: linear-gradient(135deg, rgba(255,255,255,.045), rgba(255,255,255,.015)); transition: transform .22s ease, border-color .22s ease, background .22s ease; }
.tool-card:hover { transform: translateY(-4px); border-color: rgba(179,162,255,.25); background: linear-gradient(135deg, rgba(130,105,208,.09), rgba(255,255,255,.02)); }
.card-icon { display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid rgba(170,156,255,.21); border-radius: 10px; background: rgba(139,92,246,.1); color: #c3b0ff; }.card-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.card-index { margin: 20px 0 7px; color: #888599; font-size: 8px; font-weight: 800; letter-spacing: .14em; }.tool-card h3 { margin: 0 0 8px; font-size: 16px; letter-spacing: -.035em; }.tool-card > p:not(.card-index) { max-width: 295px; margin: 0; color: #a4a1b0; font-size: 11px; line-height: 1.75; }.card-foot { position: absolute; bottom: 17px; left: 22px; color: #777486; font-size: 8px; font-weight: 700; letter-spacing: .05em; }
.card-gif .card-icon { border-color: #ffbd7f30; background: #e99a5214; color: #f7bd83; }.card-video .card-icon { border-color: #69d6d230; background: #48c5bc12; color: #78d6ce; }.card-review .card-icon { border-color: #86bdff30; background: #4c98ff13; color: #84bcff; }.card-audio .card-icon { border-color: #f28bbc30; background: #d45c9713; color: #ee9bc3; }.card-secure .card-icon { border-color: #74deb330; background: #50ca9c13; color: #81e4ba; }

.workflow-section { display: grid; grid-template-columns: 1fr .86fr; align-items: center; gap: 90px; padding-top: 70px; padding-bottom: 118px; border-top: 1px solid rgba(255,255,255,.06); }
.workflow-copy h2 { max-width: 425px; }.workflow-copy > p:not(.eyebrow) { max-width: 440px; margin: 18px 0 25px; color: var(--muted); font-size: 13px; line-height: 1.8; }.workflow-list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }.workflow-list li { display: flex; align-items: center; gap: 13px; }.workflow-list li > span { display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; color: #a799f7; font-size: 9px; font-weight: 800; }.workflow-list p { margin: 0; color: #cfccd9; font-size: 12px; }
.privacy-card { position: relative; overflow: hidden; padding: 30px; border: 1px solid rgba(117,210,194,.16); border-radius: 17px; background: linear-gradient(150deg, #192322, #15171f 64%); }.privacy-glow { position: absolute; top: -130px; right: -50px; width: 230px; height: 230px; border-radius: 50%; background: rgba(69,198,159,.1); filter: blur(55px); }.privacy-symbol { display: grid; width: 54px; height: 54px; place-items: center; margin-bottom: 31px; border: 1px solid rgba(130,231,193,.2); border-radius: 14px; background: rgba(85,212,161,.1); color: #8be4bd; }.privacy-symbol svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }.privacy-kicker { margin: 0 0 10px; color: #8bceb4; font-size: 8px; font-weight: 800; letter-spacing: .15em; }.privacy-card h3 { margin: 0 0 11px; font-size: 21px; letter-spacing: -.04em; }.privacy-card > p:not(.privacy-kicker) { max-width: 360px; margin: 0; color: #a7b3ae; font-size: 11px; line-height: 1.8; }.privacy-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 23px; }.privacy-chips span { padding: 7px 9px; border: 1px solid rgba(255,255,255,.09); border-radius: 7px; color: #c1cec8; font-size: 8px; }

.honesty-section { display: grid; grid-template-columns: 44px 1fr; gap: 18px; max-width: 880px; padding: 27px; border: 1px solid rgba(255,255,255,.08); border-radius: 14px; background: rgba(255,255,255,.025); }.honesty-icon { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(135,155,245,.23); border-radius: 10px; background: rgba(95,117,217,.1); color: #a9b9ff; font-family: Georgia, serif; font-size: 19px; font-style: italic; }.honesty-section .eyebrow { color: #9895a9; font-size: 8px; }.honesty-section h2 { margin-top: 8px; font-size: 21px; letter-spacing: -.04em; }.honesty-section > div:last-child > p:last-child { max-width: 760px; margin: 10px 0 0; color: #a5a2b0; font-size: 11px; line-height: 1.8; }

.download-section { padding-top: 98px; padding-bottom: 88px; }.download-card { position: relative; display: flex; min-height: 320px; align-items: center; justify-content: space-between; overflow: hidden; padding: 48px 55px; border: 1px solid rgba(173,158,252,.2); border-radius: 21px; background: radial-gradient(ellipse at 87% 45%, rgba(104,84,183,.25), transparent 43%), linear-gradient(112deg, #1b1a28, #181a27); }.download-copy { position: relative; z-index: 2; max-width: 570px; }.download-copy h2 { margin: 17px 0 13px; font-size: clamp(29px, 3.8vw, 43px); line-height: 1.12; letter-spacing: -.06em; }.download-copy > p:not(.eyebrow) { max-width: 520px; margin-bottom: 22px; color: #aaa7b7; font-size: 12px; line-height: 1.8; }.download-mark { position: relative; display: grid; width: 205px; height: 205px; flex: 0 0 205px; place-items: center; margin-right: 20px; }.download-ring { position: absolute; border: 1px solid rgba(183,166,255,.25); border-radius: 50%; transform: rotate(-24deg); }.ring-a { width: 185px; height: 105px; }.ring-b { width: 150px; height: 175px; transform: rotate(38deg); }.download-core { display: grid; width: 77px; height: 77px; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 24px; background: linear-gradient(145deg, #8067ec, #3f80e5); box-shadow: 0 14px 45px #5c6fdd66; color: white; font-family: Manrope, sans-serif; font-size: 22px; font-weight: 800; letter-spacing: -.1em; }.download-spark { position: absolute; color: #d7c9ff; }.spark-a { top: 17px; right: 15px; font-size: 19px; }.spark-b { bottom: 18px; left: 14px; color: #7de5d4; font-size: 24px; }
.site-footer { display: flex; min-height: 88px; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid rgba(255,255,255,.07); }.footer-brand { font-size: 13px; }.footer-brand .brand-mark { width: 29px; height: 29px; }.site-footer p { margin: 0; color: #797688; font-size: 10px; }.site-footer > a:last-child { color: #aca9b7; font-size: 10px; font-weight: 700; }

a:focus-visible, button:focus-visible { outline: 2px solid #bbaeff; outline-offset: 3px; }
@media (max-width: 960px) { .hero { grid-template-columns: 1fr; gap: 10px; padding-top: 65px; }.hero-copy { max-width: 680px; }.product-visual { width: min(100%, 680px); min-height: 465px; margin: 0 auto; }.section-heading { align-items: start; flex-direction: column; gap: 15px; }.section-heading > p { max-width: 560px; }.workflow-section { gap: 42px; }.top-nav { margin-left: 0; } }
@media (max-width: 720px) { .page-shell { width: min(100% - 36px, var(--page)); }.site-header { height: 65px; padding-inline: 18px; }.top-nav { position: absolute; top: 64px; left: 0; width: 100%; justify-content: center; gap: 24px; padding: 13px 12px; border-bottom: 1px solid rgba(255,255,255,.06); background: rgba(16,16,24,.93); }.top-nav a { font-size: 11px; }.header-actions { gap: 12px; }.github-link span { display: none; }.hero { padding-top: 105px; padding-bottom: 55px; }.hero h1 { font-size: clamp(39px, 11vw, 57px); }.hero-description { font-size: 14px; }.hero-facts { gap: 11px; }.hero-facts li { font-size: 9px; }.product-visual { min-height: 365px; }.app-window { width: 96%; }.window-body { grid-template-columns: 130px 1fr; min-height: 235px; }.visual-sidebar { padding: 13px 8px 9px; }.preset { min-height: 43px; gap: 5px; padding: 5px; }.preset strong { font-size: 7px; }.visual-canvas { min-height: 235px; }.media-card { width: 115px; height: 139px; }.window-title { margin-left: 25px; }.tool-strip span { gap: 3px; font-size: 7px; }.tool-strip { padding-inline: 3px; }.tool-strip b { font-size: 9px; }.visual-caption { right: 14px; bottom: -4px; }.note-video { top: 0; right: -1px; }.note-lock { bottom: 20px; left: -1px; }.floating-note { padding: 7px; }.floating-note b { font-size: 8px; }.floating-note small { font-size: 7px; }.note-icon { width: 25px; height: 25px; }.orbit-one { width: 105%; height: 250px; }.orbit-two { width: 92%; height: 215px; }.intro-inner { align-items: start; flex-direction: column; gap: 12px; padding-block: 23px; }.intro-inner > p:first-child { font-size: 15px; }.intro-rule { width: 38px; height: 1px; }.intro-small { max-width: none; }.tools-section { padding-top: 72px; padding-bottom: 78px; }.tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }.tool-card { min-height: 250px; padding: 15px 13px 17px; border-radius: 12px; }.card-icon { width: 32px; height: 32px; }.card-index { margin-top: 17px; font-size: 7px; }.tool-card h3 { font-size: 14px; }.tool-card > p:not(.card-index) { font-size: 10px; }.card-foot { bottom: 14px; left: 13px; font-size: 7px; }.workflow-section { grid-template-columns: 1fr; gap: 35px; padding-top: 60px; padding-bottom: 75px; }.privacy-card { padding: 24px; }.honesty-section { grid-template-columns: 35px 1fr; gap: 10px; padding: 19px 14px; }.download-section { padding-top: 70px; padding-bottom: 60px; }.download-card { min-height: 0; padding: 32px 24px; }.download-mark { position: absolute; right: -64px; bottom: -59px; width: 185px; height: 185px; opacity: .35; }.download-copy { max-width: 100%; }.download-copy h2 { max-width: 440px; }.download-copy > p:not(.eyebrow) { max-width: 420px; }.site-footer { min-height: 100px; flex-wrap: wrap; padding-block: 20px; }.site-footer p { order: 3; width: 100%; } }
@media (max-width: 390px) { .top-nav { gap: 15px; }.top-nav a { font-size: 10px; }.tool-grid { grid-template-columns: 1fr; }.tool-card { min-height: 218px; }.hero-actions { align-items: stretch; flex-direction: column; }.button { width: 100%; }.product-visual { min-height: 330px; }.window-body { grid-template-columns: 112px 1fr; }.window-status { font-size: 8px; }.window-title { margin-left: 10px; }.visual-label { font-size: 7px; }.media-card { width: 101px; height: 125px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }