@font-face{font-family:NotoSans;src:url('assets/fonts/noto-sans.ttf');font-display:swap}
@font-face{font-family:Mono;src:url('assets/fonts/noto-sans-mono.ttf');font-display:swap}
:root{color-scheme:dark;--red:#e7474f;--text:#f4f1ef;--muted:#9d989b;--line:#ffffff16}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#000;color:var(--text);font:16px/1.6 NotoSans,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #fa8e95;outline-offset:6px}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-weight:500;letter-spacing:-.055em;line-height:1.03}h1,h2,h3,h4,h5,h6{-webkit-user-select:none;user-select:none}em{font-style:normal;color:var(--red)}img{display:block;max-width:100%}.eyebrow{font:11px/1.6 Mono,monospace;letter-spacing:.15em;color:#dc767d}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.topbar{height:76px;display:flex;align-items:center;gap:60px;padding:0 max(24px,calc((100vw - 1200px)/2));border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;background:#000d;backdrop-filter:blur(20px)}.brand{display:flex;align-items:center;gap:10px;font:600 12px Mono;letter-spacing:.13em}.brand img{width:28px;height:28px}.brand .brand-wordmark{width:108px;height:auto}.top-actions>a:not(.top-button){color:var(--muted);font-size:13px}.top-actions{display:flex;align-items:center;gap:20px;margin-left:auto;flex-shrink:0}.topbar nav{display:flex;gap:30px;color:var(--muted);font-size:13px;flex:1}.topbar a:hover{color:#fff}.top-button{font-size:13px;padding:9px 15px;border:1px solid #433538;border-radius:6px}.top-button span{color:var(--red);margin-left:10px}
.hero{max-width:1320px;margin:auto;position:relative;isolation:isolate;padding:70px 56px 0}.hero-copy{text-align:center;position:relative;z-index:2;max-width:920px;margin:auto}h1{font-size:clamp(60px,7.6vw,104px);margin:18px 0 24px}.intro{max-width:655px;margin:auto;color:#a9a3a5;font-size:18px;line-height:1.6}.scope-note{margin:15px 0 0;color:#817c80;font:11px Mono}.hero-stage{position:relative;margin:50px auto 0;isolation:isolate}/* Light lives behind the preview; the app pixels are never tinted. */
/* Fade the lighting out behind the solid app area, before its lower edge. */
.light-stage:before,.light-stage:after{content:'';position:absolute;pointer-events:none;z-index:-1;mask-image:linear-gradient(transparent,#000 65px,#000 35%,transparent 60%)}
.light-stage:before{inset:-100px -70px -40px;background:radial-gradient(ellipse at 56% 45%,#e7474f48,transparent 68%);filter:blur(48px)}
.light-stage:after{inset:-100px -12% -48px;transform:rotate(-10deg);background:linear-gradient(108deg,transparent 34%,#cbd4de08 40%,#e8e9ed52 47%,#eb4c567d 50%,#ef7c8826 54%,transparent 62%);filter:blur(30px);opacity:.78}
.preview-frame{position:relative;overflow:hidden;background:#080809;mask-image:linear-gradient(#000 94%,transparent);border-radius:8px}.preview-frame img{width:100%;height:auto;min-height:280px;object-fit:contain;object-position:top;pointer-events:none}.hero-stage .preview-frame{max-height:730px;mask-image:linear-gradient(#000 88%,transparent)}
/* One glass installation surface; fixed feedback space prevents layout shifts. */
.install-control{max-width:490px;margin:25px auto 0}
.hero-install{position:relative;isolation:isolate;min-height:76px;padding:10px 18px;text-align:left;border:1px solid #ffffff2b;border-radius:13px;background:linear-gradient(125deg,#ffffff12,#ffffff03 55%,#e7474f0a);box-shadow:inset 0 1px 0 #ffffff15;backdrop-filter:blur(18px);overflow:hidden;scroll-margin-top:120px;display:grid;align-items:center}
.install-label{display:block;color:#aaa1a6;letter-spacing:.12em;font:9px/1.5 Mono;margin-bottom:5px}
.install-command-row{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:12px}
.install-command-copy{min-width:0}
.hero-install code{display:block;font:12px/1.7 Mono;color:#f4f1ef;margin:0;overflow-wrap:anywhere}
.install-meta{display:grid;place-items:center;font:11px/18px NotoSans,Arial,sans-serif;color:#8f898d;min-height:20px;margin-top:9px}
.install-meta>span{grid-area:1/1;transition:opacity .16s ease}
.hero-install[data-copy-state]:not([data-copy-state="idle"]) + .install-meta>span:not([data-copy-feedback]){opacity:0}
.hero-install[data-copy-state]:not([data-copy-state="idle"]) + .install-meta [data-copy-feedback]{opacity:1}
.install-meta [data-copy-feedback]{text-align:center;color:#b8b0b4;font-weight:500;opacity:0}
.hero-install:before{content:'';position:absolute;top:0;left:9%;width:60%;height:1px;background:linear-gradient(90deg,transparent,#ffffff90,transparent);pointer-events:none}
.hero-install:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 54%,#ffffff05 65%,#ffffff0d 70%,transparent 80%);pointer-events:none}
/* Keep the action close to the command, with a centered, stable status line. */
.copy-icon{position:relative;width:44px;height:44px;padding:0;display:grid;place-items:center;border:1px solid #ffffff1a;border-radius:11px;background:#ffffff05;color:#d9cdd1;z-index:2;transition:background .2s ease,color .2s ease;-webkit-tap-highlight-color:transparent}
.copy-icon svg{grid-area:1/1;width:19px;height:19px;transition:opacity .16s ease,transform .2s ease}
.copy-check,.copy-error{opacity:0;transform:scale(.65)}
.copy-icon:hover{background:#ffffff12;border-color:#ffffff38;color:#fff}
.copy-icon:active{background:#e7474f12}
.copy-icon:active svg{transform:scale(.88)}
.copy-icon:focus-visible{outline-offset:-3px;border-radius:6px}
.copy-icon[data-state="copying"] .copy-symbol{opacity:.45}
.copy-icon[data-state="copied"]{color:#b7e9d2;background:#74cba30a}
.copy-icon[data-state="error"]{color:#f6c68c}
.copy-icon[data-state="copied"] .copy-symbol,.copy-icon[data-state="error"] .copy-symbol{opacity:0;transform:scale(.65)}
.copy-icon[data-state="copied"] .copy-check,.copy-icon[data-state="error"] .copy-error{opacity:1;transform:scale(1)}
.hero-install[data-copy-state="error"] + .install-meta [data-copy-feedback]{color:#f6c68c}
/* Split contour remains on the outside perimeter, without glow or rotation. */
#hero-install{overflow:visible}
.hero-install:after{border-radius:inherit}
.install-border-motion{position:absolute;left:-1px;top:-1px;width:calc(100% + 2px);height:calc(100% + 2px);pointer-events:none;overflow:visible;opacity:0;z-index:3}
.install-border-motion path{fill:none;stroke:#f6f0ef;stroke-width:1.4;stroke-linecap:butt;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.compatibility{max-width:1000px;margin:45px auto 0;padding:40px 24px 0;text-align:center}.compatibility>.eyebrow{color:#817c80}.compatibility-row{display:flex;align-items:center;justify-content:center;gap:85px;margin:28px 0 32px}.compatibility-row span{display:grid;gap:6px}.compatibility-row b{font-size:29px;font-weight:500;letter-spacing:-.04em}.compatibility-row small{font-size:12px;color:#827d80}.compatibility-row i{height:35px;width:1px;background:var(--line)}details{max-width:680px;margin:auto}summary{list-style:none;cursor:pointer;font-size:12px;color:#b3aeb0}summary::-webkit-details-marker{display:none}summary span{display:inline-block;margin-left:10px;color:var(--red)}details[open] summary span{transform:rotate(45deg)}.requirements-body{text-align:left;margin-top:18px;padding:24px;border:1px solid var(--line);border-radius:10px;background:#0a090a;color:var(--muted);font-size:14px}.requirements-body p+p{margin-top:12px}
.feature{max-width:1240px;margin:auto;padding:145px 30px 0;position:relative;isolation:isolate}.section-heading{max-width:800px;margin:0 auto 50px;text-align:center}.section-heading h2{font-size:clamp(45px,5.4vw,72px);margin:18px 0 24px}.section-heading>p:last-child{max-width:560px;margin:auto;color:var(--muted);font-size:17px}.product-stage{position:relative}.stars-stage{isolation:isolate}.stars{position:absolute;inset:-36px -45px 40px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 45%,#76849714,transparent 70%)}.stars:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 1% 14%,#cbd7ef99 0 .7px,transparent 1.4px),radial-gradient(circle at 98% 30%,#aec9ed80 0 .7px,transparent 1.5px),radial-gradient(circle at 4% 90%,#dde3ef80 0 .6px,transparent 1.3px),radial-gradient(circle at 90% 3%,#dfeaff66 0 .7px,transparent 1.4px),radial-gradient(circle at 7% 3%,#e8778566 0 .7px,transparent 1.4px),radial-gradient(circle at 97% 93%,#aebac980 0 .8px,transparent 1.8px)}.feature-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin:25px 20px 0;padding-top:30px;border-top:1px solid var(--line)}.feature-notes p{font-size:14px}.feature-notes b{font-weight:500;display:block;color:#e7e2e4}.feature-notes span{display:block;margin-top:8px;color:var(--muted);line-height:1.6}
.capture-section{margin-top:90px;padding-top:95px;border-top:1px solid var(--line)}.capture-section .section-heading h2{line-height:1.2}.insights-section{margin-top:110px;padding-top:110px;border-top:1px solid var(--line)}.closing-cta{position:relative;isolation:isolate;text-align:center;padding:160px 24px 100px;margin:auto;max-width:1200px}.closing-cta:before{content:'';position:absolute;inset:20% 18% 5%;pointer-events:none;background:radial-gradient(ellipse,#e7474f13,transparent 70%);z-index:-1}.closing-cta h2{font-size:clamp(50px,7vw,88px);margin:22px 0}.closing-cta>p:not(.eyebrow){color:var(--muted);font-size:17px}.closing-cta .install-control{margin:30px auto 26px}.trust-line{display:flex;justify-content:center;gap:26px;color:#8b8289;font-size:12px}.trust-line a{color:#c6bbbf;text-decoration:underline;text-underline-offset:4px}footer{max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:28px 24px;font-size:12px;color:#8b8289}
.footer-links{display:flex;align-items:center;gap:24px}.footer-social{display:inline-flex;align-items:center;gap:7px;color:#a29b9f}.footer-social .footer-social-icon{width:17px;height:17px;flex-shrink:0}
/* Original Redunar polygon language. Motion translates without spinning. */
.shard{position:absolute;display:block;pointer-events:none;z-index:-1;background:linear-gradient(140deg,#f0f5ff80,#6c748214 42%,#e7474f55 72%,#f9dde061);clip-path:polygon(var(--poly));opacity:.46;animation:shard-float 12s ease-in-out infinite;rotate:var(--angle,0deg)}.shard-a{width:100px;height:160px;right:0;top:150px;--poly:50% 0,100% 27%,64% 100%,0 70%,14% 22%;--angle:-15deg}.shard-a:after{content:'';position:absolute;left:53%;top:8%;width:1px;height:80%;background:linear-gradient(transparent,#fff8,transparent);rotate:20deg}.shard-b{width:63px;height:94px;left:0;top:450px;--poly:48% 0,100% 32%,70% 100%,8% 72%,0 18%;--angle:12deg;animation-delay:-4s}.shard-c{width:30px;height:48px;right:25%;top:35px;--poly:50% 0,100% 40%,64% 100%,0 76%,8% 20%;animation-delay:-7s;opacity:.3}.shard-d{width:80px;height:50px;left:-12px;top:230px;--poly:8% 14%,88% 0,100% 72%,24% 100%,0 46%;--angle:-16deg;opacity:.32}.shard-e{width:45px;height:75px;right:25px;top:240px;--poly:40% 0,100% 18%,76% 100%,0 68%;--angle:15deg;opacity:.36}.shard-e:after{content:'';position:absolute;right:30%;top:0;width:1px;height:32%;background:#fff6;rotate:22deg}@keyframes shard-float{50%{translate:6px -13px}}
/* Hero-only drift: fixed orientation, staggered phases, and soft turnarounds. */
.hero .shard{animation-name:hero-shard-float;will-change:translate}
.hero .shard-a{--drift-x:12px;--drift-y:-28px;opacity:.57;animation-duration:11s;animation-delay:-2s}
.hero .shard-b{--drift-x:-10px;--drift-y:22px;opacity:.52;animation-duration:13s;animation-delay:-6s}
.hero .shard-c{--drift-x:8px;--drift-y:-18px;opacity:.38;animation-duration:12s;animation-delay:-9s}
@keyframes hero-shard-float{0%,100%{translate:0 0}50%{translate:var(--drift-x) var(--drift-y)}}
@media(max-width:800px){.hero .shard-a{--drift-x:7px;--drift-y:-20px;opacity:.36}.hero .shard-b{--drift-x:-6px;--drift-y:16px}.hero .shard-c{--drift-x:5px;--drift-y:-13px}}

@media(max-width:800px){.topbar{gap:20px;padding:0 20px}.topbar nav{gap:16px}.hero{padding:55px 24px 0}.hero-stage{margin-top:35px}.hero-stage .preview-frame{max-height:none}.compatibility-row{gap:35px}.feature{padding:100px 22px 0}.stars{inset:-20px -16px}.feature-notes{gap:22px;margin-left:0;margin-right:0}.capture-section,.insights-section{margin-top:75px;padding-top:80px}.closing-cta{padding-top:120px}.shard-a{right:4px;top:155px;width:60px;height:100px;opacity:.28}.shard-b{left:0;top:330px;width:35px;height:60px}.shard-d,.shard-e{display:none}}
@media(min-width:521px) and (max-width:680px){.topbar nav a{display:none}}
@media(max-width:520px){.topbar{height:64px;gap:12px;padding:0 14px}.topbar nav{display:none}.topbar .brand{gap:8px}.topbar .brand img{width:24px;height:24px}.topbar .brand .brand-wordmark{width:88px;height:auto}.top-actions{gap:12px}.top-actions>a:not(.top-button){font-size:11px}.top-button{font-size:11px;padding:8px 10px}.top-button span{margin-left:6px}h1{font-size:58px}.intro{font-size:16px}.hero{padding-top:44px}.hero-install{padding:10px 12px}.hero-install code{font-size:11px}.install-label{font-size:9px}.install-command-row{gap:12px}.install-meta{font-size:10px}.scope-note{font-size:10px}.copy-icon{width:44px;height:44px}.preview-frame img{min-height:0}.compatibility{margin-top:15px}.compatibility-row{gap:18px}.compatibility-row b{font-size:23px}.compatibility-row small{font-size:10px}.compatibility-row i{height:27px}.section-heading h2{font-size:43px}.section-heading>p:last-child{font-size:16px}.feature-notes{grid-template-columns:1fr;gap:24px}.trust-line{flex-wrap:wrap;gap:12px 20px}footer{flex-wrap:wrap;gap:18px}footer p{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.hero-media .hero-poster{width:100%;height:auto;min-height:0;aspect-ratio:1717/980}.overview-recording{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:top;pointer-events:none;opacity:0}.hero-media.is-playing .overview-recording{opacity:1}
@media(min-width:521px) and (max-width:680px){.topbar nav a{display:none}}

/* Keep decorative light outside the layout without creating a sideways scroll area. */
main{overflow:clip}
@media(min-width:521px) and (max-width:680px){.topbar nav a{display:none}}
@media(max-width:520px){h1{font-size:48px}.hero .shard-a{right:14px;top:180px;opacity:.28}.light-stage:before{inset:-35px -15px}}