.tools-project{display:grid;grid-template-columns:1fr;align-items:center;gap:35px;padding:80px 0 90px;position:relative}.tools-project::before{content:"";position:absolute;inset:5% -4%;background:radial-gradient(ellipse at 80% 50%,#7432b91a,transparent 65%);pointer-events:none;z-index:-1}.tools-copy h3{margin:22px 0 18px;font:500 clamp(40px, 4.4vw, 66px)/1 var(--display);letter-spacing:-.065em}.tools-copy h3 em{font-style:normal;color:var(--violet)}.tools-copy>p{color:var(--muted);font-size:12px;line-height:1.85;max-width:390px}.tools-copy>.tools-lead{color:#eee3f7;font-size:17px;margin-bottom:12px}.tools-features{list-style:none;padding:0}.tools-features li{display:flex;gap:14px;padding:13px 0;border-top:1px solid var(--line)}.tools-features li>span{color:#b995e3;font-size:9px;padding-top:3px}.tools-features strong{display:block;font-size:12px;font-weight:500}.tools-features p{color:var(--muted);font-size:11px;line-height:1.7;margin-top:5px}.tools-stack{display:block;color:#ac96bf;font-size:9px;margin-bottom:19px}.tools-showcase{min-width:0}.tools-display{transform:none;isolation:isolate;scroll-margin-top:112px}.tools-copy{display:grid;grid-template-columns:1fr 1.1fr;column-gap:70px}.tools-copy>.eyebrow,.tools-copy>.text-link,.tools-copy>h3,.tools-copy>p,.tools-stack{grid-column:1}.tools-features{grid-column:2;grid-row:2/6;align-self:center;margin:0}.tools-copy h3 br{display:none}.tools-copy h3 em{margin-left:.18em}.tools-window{border:1px solid #bc80ed59;border-radius:12px;overflow:hidden;background:#100917;box-shadow:0 10px 0 -3px #291538,0 11px 0 -3px #8861a9,0 35px 70px #07020d70}.tools-window-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 20px;background:#24152f;border-bottom:1px solid #c565f41f}.tools-window-bar>span{display:flex;align-items:center;gap:10px;font:500 12px var(--display)}.tools-window-bar i{width:7px;height:7px;background:#cb92f3;box-shadow:0 0 14px #c565f455;border-radius:50%}.tools-window-bar small{font-size:8px;letter-spacing:.12em;color:#b9a0cc}.tools-frame-host{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden}.tools-real-frame{display:block;position:absolute;inset:0;width:1280px;height:800px;max-width:none;border:0;transform-origin:top left;transform:scale(var(--preview-scale,1));opacity:0;transition:opacity .35s}.tools-real-frame.is-loaded{opacity:1}.tools-frame-loading{position:absolute;inset:0;display:grid;place-items:center;color:#bba3d1;font-size:13px}@media (min-width:801px){.tools-frame-host{aspect-ratio:auto;height:clamp(400px,calc(100svh - 180px),800px)}.tools-real-frame{width:100%;height:100%;transform:none}}.tools-preview-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:30px;color:#d5bce9;font-size:11px}.tools-credit{color:#9986a6;font-size:10px;line-height:1.8;margin:12px 0 0;max-width:680px}@media (max-width:800px){.tools-copy{display:block}.tools-copy>p{max-width:560px}.tools-features{margin:25px 0}.tools-preview-caption{align-items:flex-start;flex-direction:column;gap:12px}}@media (max-width:600px){.tools-project{padding:50px 0 65px}.tools-copy h3{font-size:40px}.tools-window-bar{padding:12px 10px}.tools-window-bar>span{font-size:10px;gap:6px}.tools-window-bar small{font-size:6px;letter-spacing:.02em}.tools-frame-loading{font-size:9px}}.tools-preview-toggle{margin:0 0 8px;cursor:pointer}#tools-preview-panel{overflow:hidden;padding:24px 0 14px}#tools-preview-panel[hidden],.tools-frame-loading[hidden]{display:none}.tools-frame-loading::before{content:"";width:32px;height:32px;border:2px solid #c996f32b;border-top-color:#d5a2ff;border-radius:50%;animation:tools-loading-spin 1s linear infinite}.tools-frame-loading{align-content:center;gap:16px}@keyframes tools-loading-spin{to{transform:rotate(360deg)}}.tools-preview-toggle{display:inline-flex;align-items:center;gap:16px;width:min(100%,350px);padding:16px 20px 16px 14px;border:1px solid #b99adc55;border-radius:16px;background:linear-gradient(120deg,#392644,#1a1225);box-shadow:inset 0 1px 0 #e4c5ff15,0 8px 24px #08050d40;color:#f3e9ff;font:500 15px var(--display);text-align:left;transition:border-color .25s,box-shadow .25s,background .25s}.preview-play{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid #dac2ff55;border-radius:50%;background:#c59af018;color:#d9b9ff}.preview-play svg{width:24px;height:24px;transition:transform .25s}.preview-toggle-copy{display:grid;gap:5px}.preview-toggle-copy small{font:500 8px var(--body);letter-spacing:.16em;color:#bc9dce}.preview-toggle-arrow{margin-left:auto;color:#c7a5ea;transition:transform .25s}.tools-preview-toggle:hover{border-color:#cca7f3;box-shadow:inset 0 1px 0 #e4c5ff25,0 8px 30px #9765bc20}.tools-preview-toggle:hover .preview-play svg{transform:scale(1.12)}.tools-preview-toggle:hover .preview-toggle-arrow{transform:translate(2px,-2px)}.tools-preview-toggle:focus-visible{outline:2px solid #e0c1ff;outline-offset:5px}.tools-preview-toggle[aria-expanded=true] .preview-toggle-arrow{transform:rotate(-135deg)}.preview-pause-symbol,.tools-preview-toggle[aria-expanded=true] .preview-play-symbol{display:none}.tools-preview-toggle[aria-expanded=true] .preview-pause-symbol{display:block}