.mk-live-demo{gap:28px;max-width:1120px;margin-inline:auto;display:grid}.mk-page-intro-demo{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);align-items:end;column-gap:clamp(34px,6vw,88px);padding-block:42px 30px;display:grid}.mk-page-intro-demo .mk-eyebrow{grid-column:1/-1;animation:.55s ease-out both mk-demo-rise}.mk-page-intro-demo h1{margin:0;font-size:clamp(44px,5.4vw,76px);line-height:.98;animation:.68s cubic-bezier(.2,.75,.25,1) 60ms both mk-demo-rise}.mk-page-intro-demo .mk-lead{margin:0 0 4px;font-size:16px;line-height:1.65;animation:.68s cubic-bezier(.2,.75,.25,1) .14s both mk-demo-rise}@media (min-width:1000px){.mk-live-demo{grid-template-columns:minmax(250px,.34fr) minmax(0,.66fr);align-items:start;column-gap:30px}.mk-live-demo-controls{grid-area:1/1}.mk-live-demo-stage{grid-area:1/2}.mk-live-demo-footer,.mk-live-demo-other{grid-column:1/-1}.mk-live-demo-controls .mk-chip-group{gap:7px}.mk-live-demo-controls .mk-chip-btn{padding-inline:11px}}.mk-live-demo-controls{border:1px solid var(--mk-line);background:var(--mk-surface);border-radius:14px;gap:18px;padding:22px;animation:.72s cubic-bezier(.2,.75,.25,1) .16s both mk-demo-panel-in;display:grid}.mk-live-demo-controls fieldset{border:0;min-width:0;margin:0;padding:0}.mk-live-demo-controls legend{letter-spacing:.08em;text-transform:uppercase;color:var(--mk-muted);margin-bottom:6px;font-size:11px;font-weight:700}.mk-live-demo-controls .mk-chip-btn{position:relative}.mk-live-demo-controls .mk-chip-btn:focus-within{outline:2px solid var(--mk-input-focus-border);outline-offset:2px}.mk-live-demo-radio{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}.mk-live-demo-submit{flex-wrap:wrap;align-items:center;gap:12px 18px;display:flex}.mk-live-demo-submit .mk-button{gap:10px}.mk-live-demo-role-hint,.mk-live-demo-hint{color:var(--mk-muted);margin:0;font-size:13px;line-height:1.5}.mk-live-demo-hint{background:var(--mk-subtle);border-radius:10px;padding:10px 14px}.mk-live-demo-stage{isolation:isolate;align-items:center;min-height:610px;display:flex;position:relative}.mk-live-demo-glow{filter:blur(50px);pointer-events:none;background:radial-gradient(circle,#0d634433 0%,#b6f35b1a 45%,#0000 72%);animation:5.5s ease-in-out infinite mk-demo-glow;position:absolute;inset:10% 20% 10% 10%}.dark .mk-live-demo-glow{background:radial-gradient(circle,#b6f35b33 0%,#0d634424 50%,#0000 75%)}.mk-live-demo-laptop{filter:drop-shadow(0 25px 45px #00000038);width:calc(100% - 210px);margin-left:auto;transition:transform .45s cubic-bezier(.2,.75,.25,1),filter .45s;animation:.9s cubic-bezier(.2,.8,.2,1) .68s both mk-demo-laptop-in;position:relative}.mk-live-demo-stage:hover .mk-live-demo-laptop{filter:drop-shadow(0 32px 55px #00000042);transform:translateY(-4px)rotateX(.5deg)}.mk-live-demo-laptop-lid{background:#0f172a;border:11px solid #1e293b;border-bottom-width:8px;border-radius:20px 20px 6px 6px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1f}.mk-live-demo-laptop-lid:after{content:"";opacity:0;pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff29,#0000);width:18%;position:absolute;inset:-40% auto -40% -28%;transform:skew(-15deg)}.mk-live-demo-stage.is-running .mk-live-demo-laptop-lid:after{animation:1s ease-out .18s both mk-demo-screen-sheen}.mk-live-demo-laptop-bar{background:#111827;border-bottom:1px solid #ffffff14;align-items:center;gap:10px;padding:7px 10px 7px 14px;display:flex}.mk-live-demo-url{color:#94a3b8;text-overflow:ellipsis;white-space:nowrap;background:#ffffff0f;border-radius:5px;flex:1;min-width:0;padding:3px 10px;font-size:11px;font-weight:500;overflow:hidden}.mk-site .mk-live-demo-open{color:#e2e8f0;font:inherit;white-space:nowrap;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff29;border-radius:6px;align-items:center;gap:6px;padding:4px 10px;font-size:11px;font-weight:600;transition:background .16s;display:inline-flex}.mk-site .mk-live-demo-open:hover{background:#ffffff24}.mk-live-demo-laptop-screen{aspect-ratio:16/10;background:#09120f;position:relative;overflow:hidden}.mk-live-demo-phone{z-index:2;background:#09120f;border:8px solid #1e293b;border-radius:42px;width:300px;transition:transform .42s cubic-bezier(.2,.75,.25,1),box-shadow .42s;animation:.78s cubic-bezier(.16,.9,.24,1) .18s both mk-demo-phone-in;position:absolute;bottom:0;left:0;overflow:hidden;box-shadow:0 30px 60px #0000006b,inset 0 0 0 1px #ffffff26}.mk-live-demo-stage:hover .mk-live-demo-phone{transform:translateY(-7px)rotate(-.7deg);box-shadow:0 38px 70px #00000075,inset 0 0 0 1px #ffffff2e}.mk-live-demo-sync-trace{z-index:3;pointer-events:none;align-items:center;gap:7px;display:flex;position:absolute;bottom:27%;left:245px}.mk-live-demo-sync-trace span{background:var(--mk-green);opacity:0;border-radius:50%;width:5px;height:5px}.mk-live-demo-stage.is-running .mk-live-demo-sync-trace span{animation:1.35s ease-in-out infinite mk-demo-sync-pulse}.mk-live-demo-stage.is-running .mk-live-demo-sync-trace span:nth-child(2){animation-delay:.16s}.mk-live-demo-stage.is-running .mk-live-demo-sync-trace span:nth-child(3){animation-delay:.32s}.mk-live-demo-phone-notch{z-index:3;pointer-events:none;background:#000;border-radius:10px;width:74px;height:18px;position:absolute;top:8px;left:50%;transform:translate(-50%)}.mk-live-demo-phone-screen{aspect-ratio:390/844;background:var(--mk-surface);border-radius:34px;position:relative;overflow:hidden}.mk-live-demo-phone-indicator{z-index:3;pointer-events:none;background:#7f7f7f80;border-radius:999px;width:84px;height:4px;position:absolute;bottom:7px;left:50%;transform:translate(-50%)}.mk-live-demo-stage iframe{background:var(--mk-surface);transform-origin:0 0;border:0;position:absolute;top:0;left:0}.mk-live-demo-poster{object-fit:cover;object-position:top center;transition:filter .3s,opacity .3s}.mk-live-demo-poster.is-waiting{filter:blur(3px);opacity:.6}.mk-live-demo-placeholder{z-index:2;background:linear-gradient(180deg, var(--mk-subtle), var(--mk-surface));color:var(--mk-ink);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:40px 26px;display:flex;position:absolute;inset:0}.mk-live-demo-placeholder strong{font-size:19px;line-height:1.25}.mk-live-demo-placeholder p{color:var(--mk-muted);margin:0;font-size:13px;line-height:1.5}.mk-live-demo-placeholder svg{color:var(--mk-accent-text)}.mk-live-demo-fallback{padding:34px 6px 18px;position:absolute;inset:0;overflow-y:auto}.mk-live-demo-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.mk-live-demo-page>.mk-actions{margin-top:clamp(38px,5vw,64px)}.mk-live-demo-footer p{color:var(--mk-muted);align-items:center;gap:8px;margin:0;font-size:13px;display:inline-flex}.mk-site .mk-live-demo-fullscreen{display:none}.mk-live-demo-other{border:1px solid var(--mk-line);background:var(--mk-subtle);border-radius:14px;gap:16px;padding:24px;display:grid}.mk-live-demo-other.is-prominent{border-color:var(--mk-green)}.mk-live-demo-other h2{margin:8px 0 6px;font-size:clamp(20px,2.4vw,26px);line-height:1.2}.mk-live-demo-other p{color:var(--mk-muted);margin:0}.mk-live-demo-other ul{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.mk-live-demo-other li a{border:1px solid var(--mk-line);background:var(--mk-surface);height:100%;color:var(--mk-ink);border-radius:10px;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:14px 16px;text-decoration:none;transition:border-color .16s;display:flex}.mk-live-demo-other li a:hover,.mk-live-demo-other li a[aria-current]{border-color:var(--mk-green)}.mk-live-demo-other li a span{color:var(--mk-muted);font-size:12px}.mk-live-demo-other li a svg{color:var(--mk-accent-text);margin-left:auto}@media (max-width:1100px){.mk-live-demo-laptop{width:calc(100% - 150px)}.mk-live-demo-stage{min-height:600px}.mk-live-demo-phone{width:260px}.mk-live-demo-sync-trace{left:215px}}@media (max-width:999px){.mk-page-intro-demo{grid-template-columns:1fr;gap:18px}.mk-page-intro-demo .mk-lead{max-width:720px}}@media (max-width:900px){.mk-live-demo-controls{padding:16px}.mk-live-demo-stage{justify-content:center;min-height:0}.mk-live-demo-laptop,.mk-live-demo-sync-trace{display:none}.mk-live-demo-phone{width:min(340px,100%);position:relative}.mk-site .mk-live-demo-fullscreen{display:inline-flex}}@media (max-width:600px){.mk-page-intro-demo{padding-block:34px 22px}.mk-page-intro-demo h1{font-size:clamp(38px,12vw,54px)}}@media (prefers-reduced-motion:reduce){.mk-page-intro-demo .mk-eyebrow,.mk-page-intro-demo h1,.mk-page-intro-demo .mk-lead,.mk-live-demo-controls,.mk-live-demo-glow,.mk-live-demo-laptop,.mk-live-demo-phone,.mk-live-demo-stage.is-running .mk-live-demo-laptop-lid:after,.mk-live-demo-stage.is-running .mk-live-demo-sync-trace span,.mk-live-demo-poster,.mk-site .mk-live-demo-open,.mk-live-demo-other li a{transition:none;animation:none}}@keyframes mk-demo-rise{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes mk-demo-panel-in{0%{opacity:0;transform:translate(-20px,12px)}to{opacity:1;transform:translate(0,0)}}@keyframes mk-demo-laptop-in{0%{opacity:0;transform:translate(48px,28px)scale(.94)}to{opacity:1;transform:translate(0,0)scale(1)}}@keyframes mk-demo-phone-in{0%{opacity:0;transform:translate(-24px,34px)rotate(-2deg)scale(.96)}to{opacity:1;transform:translate(0,0)rotate(0)scale(1)}}@keyframes mk-demo-glow{0%,to{opacity:.72;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}@keyframes mk-demo-screen-sheen{0%{opacity:0;left:-28%}25%{opacity:1}to{opacity:0;left:115%}}@keyframes mk-demo-sync-pulse{0%,to{opacity:.16;transform:scale(.7)}48%{opacity:.95;transform:scale(1.12)}}.mk-demo-desktop-discovery{border-block:1px solid var(--mk-line);color:var(--mk-ink);justify-content:space-between;align-items:center;gap:20px;padding:18px 20px;text-decoration:none;display:none}.mk-demo-desktop-discovery>span{gap:4px;display:grid}.mk-demo-desktop-discovery>span>span{color:var(--mk-accent-text);font-size:13px}.mk-demo-desktop{border:1px solid var(--mk-line);background:var(--mk-subtle);border-radius:18px;grid-column:1/-1;gap:20px;min-width:0;padding:clamp(20px,4vw,40px);display:grid}.mk-demo-desktop-intro{align-items:start;gap:16px;display:flex}.mk-demo-desktop-intro>svg{color:var(--mk-accent-text);flex-shrink:0;margin-top:5px}.mk-demo-desktop h2{margin:0 0 10px;font-size:clamp(26px,4vw,38px);line-height:1.1}.mk-demo-desktop p{color:var(--mk-muted);margin:0}.mk-demo-desktop-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.mk-demo-desktop-toolbar>span{letter-spacing:.05em;text-transform:uppercase;font-size:12px;font-weight:700}.mk-demo-desktop-preview{border:1px solid var(--mk-line);width:100%;min-width:0;color:var(--mk-ink);background:var(--mk-surface);cursor:zoom-in;text-align:start;border-radius:10px;padding:0;display:block;overflow:hidden}.mk-demo-desktop-crop{width:100%;max-height:450px;display:block;overflow:hidden}.mk-demo-desktop-crop img{width:100%;height:auto;display:block}.mk-demo-desktop-open{font:inherit;align-items:center;gap:8px;padding:16px;font-size:14px;font-weight:600;display:flex}.mk-demo-desktop .mk-demo-desktop-caption{font-size:12px;line-height:1.6}.mk-demo-desktop-full{max-width:100%;max-height:70dvh;overflow:auto}.mk-demo-desktop-full img{width:1280px;max-width:none;height:auto}.mk-demo-desktop-preview:focus-visible,.mk-demo-desktop-full:focus-visible,.mk-demo-desktop-discovery:focus-visible{outline:2px solid var(--mk-input-focus-border);outline-offset:4px}.mk-live-demo-unavailable{border:1px solid var(--mk-line);background:var(--mk-subtle);border-radius:18px;justify-items:start;gap:20px;max-width:800px;padding:clamp(24px,5vw,64px);display:grid}.mk-live-demo-unavailable h2{margin:0;font-size:clamp(30px,5vw,48px);line-height:1.1}.mk-live-demo-unavailable p{color:var(--mk-muted);margin:0}@media (max-width:900px){.mk-demo-desktop-discovery{display:flex}}@media (max-width:600px){.mk-demo-desktop-crop{height:250px}.mk-demo-desktop-crop img{width:720px;max-width:none;transform:translate(-35px)}}