/* SamarShop product styling, matched to QuickSFX Pro's Premiere panel palette. */
:root{
  --bg:#101112;
  --surface:#17191b;
  --surface-2:#202225;
  --surface-3:#282b30;
  --line:rgba(233,236,242,.1);
  --line-bright:rgba(233,236,242,.17);
  --text:#e9ecf2;
  --muted:#a3a9b3;
  --subtle:#7c8490;
  --blue:#1684f2;
  --teal:#1684f2;
  --violet:#73b6f5;
  --wave-blue:#8fc4ff;
}
html{scroll-padding-top:90px}
body{background:var(--bg)}
body:before{z-index:0;background:radial-gradient(ellipse at 73% 10%,rgba(20,132,242,.105),transparent 29%),radial-gradient(ellipse at 11% 42%,rgba(20,132,242,.055),transparent 24%),radial-gradient(ellipse at 90% 82%,rgba(81,146,230,.045),transparent 23%);animation:ambientDrift 16s ease-in-out infinite alternate}
body>*{position:relative;z-index:1}
.site-header{background:rgba(29,29,29,.78);border-bottom-color:rgba(233,236,242,.075);box-shadow:0 10px 35px rgba(0,0,0,.13)}
.brand-mark{background:linear-gradient(145deg,rgba(20,132,242,.22),rgba(20,132,242,.05));border-color:rgba(20,132,242,.36);box-shadow:0 0 20px rgba(20,132,242,.07)}
.brand-mark span{background:var(--teal)}
.brand b,.live-dot,.brand-mark span,.footer-email span{color:var(--teal)}
.site-nav{color:#aab0b9}
.site-nav a:hover,.site-nav a:focus-visible{color:var(--teal)}
.site-nav .nav-cta{border-color:rgba(20,132,242,.34);background:linear-gradient(180deg,rgba(20,132,242,.12),rgba(20,132,242,.035));box-shadow:inset 0 1px rgba(255,255,255,.08),0 4px 18px rgba(20,132,242,.04)}
.site-nav .nav-cta:hover{border-color:rgba(20,132,242,.7);background:rgba(20,132,242,.15);box-shadow:0 0 24px rgba(20,132,242,.12)}
.product-breadcrumb{display:flex;align-items:center;gap:9px;margin-bottom:23px;color:#7d858f;font-size:11px;letter-spacing:.02em}
.product-breadcrumb a{color:#bac1c7;transition:color .2s ease}
.product-breadcrumb a:hover{color:var(--teal)}
.product-breadcrumb strong{color:#e9ecf2;font-weight:600}
.eyebrow{color:#a8b2ad}
.live-dot{box-shadow:0 0 12px rgba(20,132,242,.7);animation:dotGlow 2.8s ease-in-out infinite}
h1 span,.section-heading h2 span,.feature-copy h2 span,.closing-content h2 span{background-image:linear-gradient(105deg,#65b2ff 0%,#1684f2 56%,#d1e8ff 100%);background-size:180% auto;animation:accentShimmer 9s ease-in-out infinite}
.button-primary{color:#f5f9ff;background:linear-gradient(118deg,#1684f2,#0b69c7 57%,#2588e8);border:1px solid rgba(122,186,255,.5);box-shadow:0 8px 26px rgba(20,132,242,.2),inset 0 1px rgba(255,255,255,.24)}
.button-primary:hover{box-shadow:0 11px 34px rgba(20,132,242,.24),0 0 26px rgba(20,132,242,.12),inset 0 1px rgba(255,255,255,.6)}
.button-quiet:hover{border-color:rgba(20,132,242,.44);background:rgba(20,132,242,.07)}
.hero-note{color:#8e969f}
.note-icon{border-color:rgba(20,132,242,.35);color:var(--teal)}
.price-note{border-color:rgba(20,132,242,.22);background:linear-gradient(110deg,rgba(20,132,242,.085),rgba(20,132,242,.025));box-shadow:inset 0 1px rgba(255,255,255,.03),0 6px 24px rgba(0,0,0,.1)}
.price-note strong span{color:#bbddff}
.product-stage{perspective:1100px}
.orb-one{background:#69b3ff;box-shadow:0 0 19px rgba(20,132,242,.72)}
.orb-two{background:#acd5ff;box-shadow:0 0 15px rgba(20,132,242,.6)}
.product-stage .stage-glow{background:radial-gradient(ellipse,rgba(20,132,242,.17),rgba(20,132,242,.04) 40%,transparent 72%);filter:blur(15px);animation:stageGlow 7s ease-in-out infinite alternate}
.timeline-window,.qsp-window{border-color:rgba(233,236,242,.15);box-shadow:0 26px 70px rgba(0,0,0,.44),inset 0 1px rgba(255,255,255,.07)}
.timeline-window{background:linear-gradient(148deg,#24272b,#1d1f22 56%,#191b1d)}
.timeline-top,.qsp-header{background:rgba(255,255,255,.025)}
.timeline-dot:nth-child(1){background:#d96860}.timeline-dot:nth-child(2){background:#d4a65d}.timeline-dot:nth-child(3){background:#1684f2}
.audio-clip-accent{border-color:rgba(20,132,242,.28);background:linear-gradient(90deg,rgba(20,132,242,.22),rgba(20,132,242,.08))}
.waveform{background:repeating-linear-gradient(90deg,rgba(143,196,255,.9) 0 2px,transparent 2px 5px);filter:drop-shadow(0 0 4px rgba(69,151,255,.38))}
.audio-clip{background:linear-gradient(110deg,rgba(54,103,159,.24),rgba(31,48,70,.47));border-color:rgba(117,172,237,.25)}
.audio-clip b{color:#c9e2ff}
.waveform-accent{background:repeating-linear-gradient(90deg,rgba(143,196,255,.97) 0 2px,transparent 2px 5px);background-size:200% 100%;filter:drop-shadow(0 0 7px rgba(69,151,255,.58)) drop-shadow(0 0 18px rgba(30,119,237,.27));animation:waveShimmer 7s linear infinite}
.mini-wave{background:repeating-linear-gradient(90deg,#8fc4ff 0 1px,transparent 1px 3px);filter:drop-shadow(0 0 4px rgba(20,132,242,.4))}
.wave-muted{opacity:.44}
.audio-clip-accent{position:relative;isolation:isolate;border-color:rgba(83,160,255,.42);background:linear-gradient(110deg,rgba(31,103,181,.24),rgba(29,48,72,.45));box-shadow:0 0 16px rgba(36,117,213,.1)}
.audio-clip-accent:after{content:"";position:absolute;z-index:-1;left:11%;right:20%;top:50%;height:19px;transform:translateY(-50%);background:rgba(93,169,255,.24);filter:blur(14px);pointer-events:none}
.qsp-window{background:linear-gradient(145deg,rgba(37,42,51,.97),rgba(29,32,38,.98));backdrop-filter:blur(18px)}
.mini-mark{background:linear-gradient(145deg,#1684f2,#0a58aa);box-shadow:0 0 13px rgba(20,132,242,.2)}
.qsp-wordmark{display:inline-flex;align-items:baseline;gap:1px;color:#e9ecf2;font-family:var(--font-display);font-size:12px;font-weight:800;letter-spacing:-.055em;white-space:nowrap}
.qsp-wordmark i{font-style:normal;color:#1684f2;text-shadow:0 0 12px rgba(20,132,242,.4)}
.qsp-wordmark>b{margin-left:3px;color:#1684f2;font-size:inherit;font-weight:800;letter-spacing:.005em}
.qsp-wordmark>strong{margin-left:2px;color:#dce0e6;font-size:inherit;font-weight:700}
.qsp-header .qsp-wordmark{font-size:12px}
.qsp-tabs .active{color:#e0f0ff;border-bottom-color:var(--teal);box-shadow:0 6px 16px rgba(20,132,242,.08)}
.sound-card.selected{border-color:rgba(20,132,242,.48);background:linear-gradient(105deg,rgba(20,132,242,.12),rgba(20,132,242,.045));box-shadow:0 0 22px rgba(20,132,242,.075),inset 0 1px rgba(255,255,255,.035)}
.sound-card.selected .sound-icon{background:rgba(20,132,242,.16);color:#c5e2ff}
.star{color:#a8d2ff}
.footer-status i,.status-pill.status-testing i{background:#1684f2;box-shadow:0 0 10px rgba(20,132,242,.45)}
.stage-caption{color:#abb3b7}
.proof-strip{background:linear-gradient(90deg,rgba(20,132,242,.025),rgba(255,255,255,.018),rgba(20,132,242,.025));border-color:rgba(233,236,242,.07)}
.proof-inner>span{color:#81bdff}
.proof-inner b{color:#cbd0d5}
.step-card,.feature-list article,.compat-card{background:linear-gradient(145deg,rgba(37,42,51,.67),rgba(29,32,37,.72));border-color:rgba(233,236,242,.105);box-shadow:inset 0 1px rgba(255,255,255,.035),0 12px 34px rgba(0,0,0,.12)}
.step-card{transition:transform .38s cubic-bezier(.2,.8,.2,1),border-color .35s ease,box-shadow .35s ease,background .35s ease}
.step-card:hover{transform:translateY(-5px);border-color:rgba(20,132,242,.28);background:linear-gradient(145deg,rgba(20,132,242,.075),rgba(37,42,51,.79));box-shadow:0 18px 42px rgba(0,0,0,.2),0 0 26px rgba(20,132,242,.055),inset 0 1px rgba(255,255,255,.06)}
.step-number,.feature-index{color:#69b3ff}
.step-symbol{background:linear-gradient(145deg,rgba(20,132,242,.16),rgba(20,132,242,.045));border-color:rgba(20,132,242,.19)}
.search-decoration span{border-color:rgba(20,132,242,.24);color:#bedfff;background:rgba(20,132,242,.08)}
.waveform-decoration{opacity:.84;background:repeating-linear-gradient(90deg,rgba(143,196,255,.68) 0 2px,transparent 2px 5px);filter:drop-shadow(0 0 8px rgba(20,132,242,.3))}
.track-decoration span{background:linear-gradient(90deg,rgba(20,132,242,.66),rgba(20,132,242,.12));box-shadow:0 0 12px rgba(20,132,242,.09)}
.track-decoration span:nth-child(3){background:linear-gradient(90deg,rgba(20,132,242,.42),rgba(20,132,242,.08))}
.feature-section{background:linear-gradient(180deg,rgba(255,255,255,.012),rgba(20,132,242,.025) 48%,rgba(255,255,255,.008));border-top-color:rgba(233,236,242,.07);border-bottom-color:rgba(233,236,242,.07)}
.feature-list article{transition:transform .28s ease,border-color .28s ease,background .28s ease}
.feature-list article:hover{transform:translateX(4px);border-color:rgba(20,132,242,.22);background:rgba(20,132,242,.035)}
.feature-icon{color:#84c0ff;border-color:rgba(20,132,242,.25);background:rgba(20,132,242,.075)}
.quote-mark{color:#1684f2;text-shadow:0 0 27px rgba(20,132,242,.23)}
.compat-card{border-color:rgba(20,132,242,.19);background:radial-gradient(ellipse at 10% 2%,rgba(20,132,242,.09),transparent 46%),linear-gradient(140deg,rgba(37,42,51,.86),rgba(29,32,37,.92));box-shadow:inset 0 1px rgba(255,255,255,.04),0 20px 48px rgba(0,0,0,.2)}
.compat-status{border-left-color:rgba(233,236,242,.1)}
.status-pill.status-testing{border-color:rgba(20,132,242,.24);background:rgba(20,132,242,.075);color:#b9ddff}
.closing-section{border-color:rgba(20,132,242,.19);background:linear-gradient(115deg,rgba(37,42,51,.96),rgba(29,32,37,.96));box-shadow:0 20px 58px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.04)}
.closing-glow{background:radial-gradient(ellipse,rgba(20,132,242,.18),transparent 70%);animation:stageGlow 8s ease-in-out infinite alternate}
.closing-decoration span{color:rgba(20,132,242,.12)}
.closing-decoration i{background:#78baff;box-shadow:0 0 15px rgba(20,132,242,.72)}
.site-footer{border-top-color:rgba(233,236,242,.09)}
.footer-email:hover{color:#def0ff}
.shortcut-section{padding:112px 0 90px}
.shortcut-section .section-heading{max-width:660px;margin-bottom:42px}
.shortcut-board{overflow:hidden;position:relative;padding:22px 24px 17px;border:1px solid rgba(233,236,242,.14);border-radius:20px;background:linear-gradient(145deg,rgba(37,42,51,.92),rgba(27,30,34,.96));box-shadow:0 28px 75px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.055)}
.shortcut-board:before{content:"";position:absolute;inset:0 0 auto;height:1px;background:linear-gradient(90deg,transparent,rgba(20,132,242,.54),transparent);opacity:.7}
.shortcut-topline{display:flex;align-items:center;gap:12px;padding:0 0 18px;border-bottom:1px solid rgba(233,236,242,.09)}
.shortcut-topline .mini-mark{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;color:#f5f9ff;font-size:13px;font-weight:800}
.shortcut-topline>div{display:flex;flex-direction:column;line-height:1.35}
.shortcut-topline strong{font-size:10px;letter-spacing:.15em;color:#dfe4e5}
.shortcut-topline small{font-size:10px;color:#8f989e}
.shortcut-live{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:.1em;color:#c9e4ff}
.shortcut-live i,.foot-pulse{width:6px;height:6px;border-radius:50%;background:#1684f2;box-shadow:0 0 11px rgba(20,132,242,.6);animation:dotGlow 2.8s ease-in-out infinite}
.shortcut-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;padding-top:20px}
.shortcut-step{min-width:0;position:relative;padding:3px 16px 13px;border-right:1px solid rgba(233,236,242,.075);transition:background .3s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.shortcut-step:first-child{padding-left:2px}.shortcut-step:last-child{border-right:0;padding-right:2px}
.shortcut-step:hover{transform:translateY(-3px)}
.shortcut-index{font-size:9px;letter-spacing:.13em;font-weight:700;color:#73b9ff}
.key-combo{height:70px;display:flex;align-items:center;gap:8px;margin:6px 0 5px}
.key-combo kbd,.arrow-keys kbd,.enter-demo kbd{min-width:43px;height:40px;display:grid;place-items:center;border:1px solid #454d55;border-bottom-width:3px;border-radius:9px;background:linear-gradient(180deg,#343a40,#282d32);box-shadow:0 5px 11px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.09);color:#e9ecf2;font:600 13px var(--font-body);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.key-combo kbd:last-child{min-width:65px}.key-combo b{color:#77817f;font-weight:500}
.step-open:hover .key-combo kbd{border-color:rgba(20,132,242,.45);box-shadow:0 0 20px rgba(20,132,242,.11),inset 0 1px rgba(255,255,255,.08)}
.shortcut-step h3{margin:16px 0 6px;font-size:14px;letter-spacing:-.02em}
.shortcut-step p{min-height:42px;margin:0;color:#9ea6ac;font-size:11px;line-height:1.6}
.palette-demo{height:128px;margin:8px 0 4px;padding:8px;border:1px solid rgba(20,132,242,.29);border-radius:11px;background:rgba(20,22,23,.95);box-shadow:0 8px 24px rgba(0,0,0,.22),0 0 18px rgba(20,132,242,.055);animation:paletteFloat 6s ease-in-out infinite}
.palette-title{display:flex;align-items:center;gap:6px;height:20px;font-size:8px;color:#e6ecea}.palette-title .mini-mark{width:15px;height:15px;display:grid;place-items:center;border-radius:4px;color:#eaf4ff;font-size:8px;font-weight:800}.palette-title i{margin-left:auto;width:21px;height:3px;border-radius:2px;background:#555b5e}
.palette-input{height:27px;display:flex;align-items:center;gap:7px;padding:0 7px;border:1px solid rgba(233,236,242,.15);border-radius:6px;background:#25292b;color:#dfe5e2;font-size:9px}
.search-glyph{flex:0 0 8px;width:8px;height:8px;border:1px solid #9ca9a2;border-radius:50%;position:relative}.search-glyph:after{content:"";position:absolute;width:4px;height:1px;right:-3px;bottom:-1px;background:#9ca9a2;transform:rotate(45deg)}
.typing-caret{height:12px;width:1px;background:#a1ceff;animation:caretBlink 1s steps(2,end) infinite}
.palette-result{height:28px;display:flex;align-items:center;gap:6px;padding:3px 5px;margin-top:4px;border-radius:5px;color:#bcc3c0}
.palette-result.is-top{background:rgba(20,132,242,.115);outline:1px solid rgba(20,132,242,.34);box-shadow:0 0 16px rgba(20,132,242,.07)}
.palette-result>span:nth-child(2){display:flex;flex-direction:column;line-height:1.2;min-width:0}.palette-result strong{font-size:8px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.palette-result small{font-size:7px;color:#8f9b95}.palette-result em{margin-left:auto;font-size:6px;letter-spacing:.08em;color:#aed8ff;font-style:normal;white-space:nowrap}.result-play{color:#a1ceff;font-size:8px}
.arrow-keys{height:38px;display:flex;align-items:center;gap:4px;margin:13px 0 8px}.arrow-keys kbd{min-width:25px;height:27px;border-radius:6px;font-size:11px}.arrow-keys kbd:last-of-type{animation:arrowTap 3s ease-in-out infinite}.arrow-keys span{margin-left:5px;color:#8d9792;font-size:8px}
.mini-match-list{display:flex;flex-direction:column;gap:4px;padding:7px;border:1px solid rgba(233,236,242,.08);border-radius:7px;background:rgba(15,17,18,.4)}
.mini-match-list span,.mini-match-list b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#9ba39f;font-size:7px;font-weight:500}
.mini-match-list b{padding:4px 5px;border-radius:4px;background:rgba(20,132,242,.11);color:#e7f3ff;font-weight:600}.mini-match-list i{float:right;color:#79bcff;font-size:6px;font-style:normal;letter-spacing:.08em}
.enter-demo{height:38px;display:flex;align-items:center;gap:8px;margin:13px 0 8px}.enter-demo kbd{min-width:70px;height:29px;border-radius:6px;font-size:10px}.enter-demo span{font-size:7px;letter-spacing:.1em;color:#91c8ff}
.mini-timeline{height:53px;position:relative;overflow:hidden;padding:4px 5px 4px 27px;border:1px solid rgba(233,236,242,.1);border-radius:6px;background:linear-gradient(180deg,#1d2023,#191b1d)}
.mini-ruler{height:12px;display:flex;justify-content:space-around;color:#7f8984;font-size:6px;border-bottom:1px solid rgba(233,236,242,.08)}
.mini-track{height:29px;display:flex;align-items:center;gap:5px}.mini-track>b{position:absolute;left:6px;color:#89918d;font-size:6px}
.timeline-insert{height:21px;flex:1;position:relative;overflow:hidden;display:flex;align-items:flex-start;padding:2px 4px;border:1px solid rgba(20,132,242,.38);border-radius:3px;background:linear-gradient(90deg,rgba(20,132,242,.23),rgba(20,132,242,.08));animation:clipArrive 1.2s cubic-bezier(.2,.8,.2,1) both;box-shadow:0 0 13px rgba(20,132,242,.1)}
.timeline-insert>strong{position:relative;z-index:1;color:#eff7ff;font-size:6px;font-weight:600;white-space:nowrap}
.insert-wave{position:absolute;inset:10px 4px 3px;background:repeating-linear-gradient(90deg,transparent 0 2px,rgba(116,184,255,.8) 2px 3px,transparent 3px 5px);opacity:.8;mask-image:linear-gradient(90deg,#000,transparent 92%)}
.mini-playhead{position:absolute;top:0;bottom:0;left:30%;width:1px;background:#f0cf87;box-shadow:0 0 6px rgba(240,207,135,.6);animation:playheadDrift 5s ease-in-out infinite alternate}
.step-connector{position:absolute;z-index:2;top:115px;right:-6px;width:11px;height:11px;border-top:1px solid rgba(20,132,242,.36);border-right:1px solid rgba(20,132,242,.36);transform:rotate(45deg);background:#20242a}
.shortcut-foot{display:flex;align-items:center;gap:8px;margin-top:15px;padding-top:13px;border-top:1px solid rgba(233,236,242,.075);color:#9aa39e;font-size:10px}
.foot-pulse{width:5px;height:5px;flex:0 0 auto}
.bank-hotkey-map{display:grid;grid-template-columns:1fr .9fr;gap:26px;align-items:center;margin-top:17px;padding:18px 5px 3px;border-top:1px solid rgba(233,236,242,.075)}
.bank-hotkey-copy{display:flex;flex-direction:column;align-items:flex-start}
.bank-hotkey-copy>strong{margin-top:6px;color:#e5ece8;font-size:13px;letter-spacing:-.02em}
.bank-hotkey-copy>p{max-width:420px;margin:5px 0 10px;color:#9ea6a2;font-size:10px;line-height:1.55}
.bank-pills{display:flex;gap:6px;flex-wrap:wrap}
.bank-pills span{padding:3px 8px;border:1px solid rgba(233,236,242,.1);border-radius:999px;background:rgba(255,255,255,.025);color:#aab6af;font-size:8px;transition:border-color .2s ease,color .2s ease,background .2s ease}
.bank-pills span:first-child{border-color:rgba(20,132,242,.26);background:rgba(20,132,242,.075);color:#b6dcff}
.bank-pills span:hover{border-color:rgba(20,132,242,.38);color:#e0efff;background:rgba(20,132,242,.06)}
.keypad-demo{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px;padding:12px 14px;border:1px solid rgba(233,236,242,.09);border-radius:12px;background:rgba(16,18,19,.38)}
.keypad-grid{display:grid;grid-template-columns:repeat(3,30px);gap:5px}
.keypad-grid kbd{height:27px;display:grid;place-items:center;border:1px solid #41484c;border-bottom-width:2px;border-radius:6px;background:linear-gradient(180deg,#30363a,#24292c);box-shadow:0 3px 6px rgba(0,0,0,.17);color:#dce5df;font:600 9px var(--font-body);transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.keypad-grid kbd:hover{transform:translateY(-2px);border-color:rgba(20,132,242,.45);box-shadow:0 0 13px rgba(20,132,242,.1)}
.keypad-caption{display:flex;flex-direction:column;gap:7px;color:#919b95;font-size:8px;line-height:1.4}
.keypad-caption b{display:inline-block;min-width:58px;color:#bfdfff;font-size:8px;font-weight:700}
.shortcut-step:nth-child(1){animation:stepSettle .8s .12s both}.shortcut-step:nth-child(2){animation:stepSettle .8s .22s both}.shortcut-step:nth-child(3){animation:stepSettle .8s .32s both}.shortcut-step:nth-child(4){animation:stepSettle .8s .42s both}
@keyframes ambientDrift{0%{filter:hue-rotate(-4deg);opacity:.84}100%{filter:hue-rotate(7deg);opacity:1}}
@keyframes dotGlow{0%,100%{opacity:.72;box-shadow:0 0 7px rgba(20,132,242,.32)}50%{opacity:1;box-shadow:0 0 13px rgba(20,132,242,.72)}}
@keyframes accentShimmer{0%,100%{background-position:0% center}50%{background-position:100% center}}
@keyframes stageGlow{0%{opacity:.55;transform:scale(.93)}100%{opacity:.9;transform:scale(1.08)}}
@keyframes waveShimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes paletteFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes caretBlink{0%,48%{opacity:1}49%,100%{opacity:0}}
@keyframes arrowTap{0%,72%,100%{transform:translateY(0)}80%{transform:translateY(2px)}88%{transform:translateY(0)}}
@keyframes clipArrive{0%{opacity:0;transform:translateX(-14px) scaleX(.84);transform-origin:left center}75%{opacity:1;transform:translateX(1px) scaleX(1.02);transform-origin:left center}100%{opacity:1;transform:translateX(0) scaleX(1);transform-origin:left center}}
@keyframes playheadDrift{0%{left:30%}100%{left:76%}}
@keyframes stepSettle{from{opacity:.72;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.shortcut-section{padding:91px 0 72px}.shortcut-board{padding:19px}.shortcut-step{padding-left:11px;padding-right:11px}.shortcut-step h3{font-size:13px}.shortcut-step p{font-size:10px}.palette-demo{padding:6px}.palette-result em{font-size:5px}}
@media(max-width:760px){.site-nav .nav-cta{border-color:rgba(20,132,242,.34);background:rgba(20,132,242,.08)}.menu-toggle{border-color:rgba(233,236,242,.16);background:rgba(255,255,255,.035)}.menu-toggle[aria-expanded="true"]{border-color:rgba(20,132,242,.42);box-shadow:0 0 14px rgba(20,132,242,.08)}.shortcut-section{padding:75px 0 61px}.shortcut-section .section-heading{margin-bottom:28px}.shortcut-board{padding:17px 15px 14px;border-radius:15px}.shortcut-steps{grid-template-columns:1fr 1fr;row-gap:18px}.shortcut-step{padding:4px 12px 13px!important;border-right:1px solid rgba(233,236,242,.075)}.shortcut-step:nth-child(2){border-right:0}.shortcut-step:nth-child(3),.shortcut-step:nth-child(4){padding-top:15px!important;border-top:1px solid rgba(233,236,242,.075)}.shortcut-step:nth-child(4){border-right:0}.shortcut-step h3{margin-top:12px}.shortcut-step p{min-height:47px}.step-connector{display:none}.palette-demo{max-width:260px}.arrow-keys{margin-top:15px}.mini-timeline{max-width:260px}.shortcut-foot{font-size:9px}.bank-hotkey-map{grid-template-columns:1fr;gap:12px;padding-top:15px}.keypad-demo{max-width:100%;justify-content:start}.product-breadcrumb{font-size:10px;margin-bottom:18px}.hero .eyebrow{flex-wrap:wrap;font-size:9px}.price-note{margin-top:14px}}
@media(max-width:420px){.shortcut-steps{grid-template-columns:1fr}.shortcut-step,.shortcut-step:nth-child(n){padding:13px 2px!important;border-right:0;border-top:1px solid rgba(233,236,242,.075)}.shortcut-step:first-child{border-top:0}.shortcut-step p{min-height:0}.palette-demo{max-width:none;height:128px}.mini-match-list,.mini-timeline{max-width:none}.key-combo,.arrow-keys,.enter-demo{margin-top:8px}.shortcut-board{padding-left:18px;padding-right:18px}.shortcut-topline small{font-size:9px}}
/* Keep every section and its grid/flex children inside narrow phone viewports. */
@media(max-width:760px){
  html,body{width:100%;min-width:100%;max-width:100%;overflow-x:clip}
  body>header.site-header,body>main,body>footer.site-footer{width:100vw;min-width:100vw;max-width:100vw;margin-left:0;margin-right:0}
  .section-shell,.proof-inner{min-width:0;max-width:100%}
  .hero>* , .feature-layout>* , .compat-card>* , .shortcut-board>*{min-width:0}
  .hero h1,.section-heading h2,.feature-copy h2,.compat-copy h2,.closing-content h2{max-width:100%;overflow-wrap:anywhere}
  .hero-copy{width:100%;min-width:0}
  .hero h1{font-size:clamp(34px,10vw,48px);line-height:1.08}
  .hero-lede,.hero-note,.price-note{max-width:100%;min-width:0;overflow-wrap:anywhere}
  .hero-note>span:last-child{min-width:0;overflow-wrap:anywhere}
  .hero-actions{align-items:stretch;flex-direction:column;max-width:100%}
  .hero-actions .button{width:100%;justify-content:space-between}
  .price-note{width:100%}
  .site-header{max-width:100%;min-width:0}
  .brand{min-width:0;max-width:calc(100% - 58px)}
  .brand>span:last-child{overflow:hidden;text-overflow:ellipsis}
  .product-stage{width:100%;max-width:100%;min-width:0}
  .shortcut-board,.keypad-demo,.bank-hotkey-map{min-width:0;max-width:100%}
  .keypad-caption,.keypad-caption>*{min-width:0;overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){body:before,.live-dot,.stage-glow,.closing-glow,.waveform-accent,.typing-caret,.arrow-keys kbd:last-of-type,.palette-demo,.mini-playhead,.shortcut-step{animation:none!important}.timeline-insert{animation:none!important;opacity:1;transform:none}.h1 span,h1 span,.section-heading h2 span,.feature-copy h2 span,.closing-content h2 span{animation:none!important}.step-card,.feature-list article{transition:none!important}}

.button-sandbox{color:#b8c9df;border:1px solid rgba(133,162,202,.25);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018));box-shadow:inset 0 1px rgba(255,255,255,.06)}.button-sandbox:hover{transform:translateY(-1px);border-color:rgba(114,168,255,.5);background:rgba(114,168,255,.08)}.button-sandbox:disabled{opacity:.55;cursor:not-allowed;transform:none}

button[hidden]{display:none!important}