.pueo-cs{--bg:#fff;--text:#16151c;--text-2:#161520a8;--text-3:#16152075;--text-4:#1615204d;--hairline:#1615201f;--hairline-2:#16152011;--indigo:#0d0620;--royal:#4c1d95;--violet:#7c3aed;--magenta:#a855f7;--pink:#6366f1;--hot:#c084fc;--cyan:#22d3ee;--teal:#4f46e5;--blue:#3b82f6;--white-soft:#f4f1ff;--accent:var(--cyan);--jmg-ember:#d85c3f;--jmg-teal:#1f8a8a;--jmg-navy:#16315a;--jmg-sand:#c9a46b;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-3xl:28px;--radius-pill:9999px;--font-sans:var(--font-inter), "Inter", "SF Pro Display", system-ui, -apple-system, helvetica, sans-serif;--font-mono:var(--font-jbm), "JetBrains Mono", "SF Mono", menlo, monospace;--page:1200px;--background:var(--bg);--foreground:var(--text);--card:#fff;--border:var(--hairline);--rule-soft:var(--hairline-2);--surface:#f5f5f7;--muted:var(--text-2);--pueo-midnight:#0f0f0f;--pueo-blood:#7a0606;--pueo-red:#c00;--pueo-red-text:#c00;color:var(--text);font-family:var(--font-sans);letter-spacing:-.14px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-weight:340;line-height:1.45}.pueo-cs .theme-dark{--bg:#0a0a10;--text:#fff;--text-2:#ffffffb8;--text-3:#ffffff80;--text-4:#ffffff52;--hairline:#ffffff1a;--hairline-2:#ffffff0f;--background:#0a0a10;--foreground:#fff;--card:#111119;--border:#ffffff1a;--rule-soft:#ffffff0f;--surface:#12121b;--muted:#ffffffb8;background:var(--bg);color:var(--text)}.pueo-cs img{max-width:100%;display:block}.pueo-cs a:not(.btn-pill){color:inherit;text-decoration:none}.pueo-cs ::selection{background:var(--accent);color:#04040d}.pueo-cs .t-body{letter-spacing:-.0085em;color:var(--text-2);font-size:16px;font-weight:380;line-height:1.55}.pueo-cs .hl{color:var(--accent);font-style:normal;font-weight:500}.pueo-cs .page{max-width:var(--page);margin:0 auto;padding:0 24px}.pueo-cs .pad{padding:120px 0}@media (max-width:640px){.pueo-cs .pad{padding:72px 0}}.pueo-cs .muted{color:var(--muted)}.pueo-cs .grad-strip{background:linear-gradient(105deg, var(--cyan), var(--violet) 30%, var(--pink) 55%, var(--hot) 80%, var(--cyan));width:100%;height:3px}.pueo-cs .chips{flex-wrap:wrap;gap:9px;display:flex}.pueo-cs .chip{border:1px solid var(--border);letter-spacing:-.008em;background:var(--card);border-radius:9999px;align-items:center;gap:7px;padding:8px 14px;font-size:13.5px;font-weight:400;display:inline-flex}.pueo-cs .chip .dot{background:var(--jmg-ember);border-radius:9999px;width:6px;height:6px;display:inline-block}.pueo-cs .hero{color:#fff;border-radius:var(--radius-2xl);position:relative;overflow:hidden}.pueo-cs .hero-inner{z-index:2;padding:60px 44px;position:relative}.pueo-cs .hero .eyebrow{color:#ffffffe6}.pueo-cs .hero h1{max-width:18ch;margin:20px 0 0}.pueo-cs .hero .lede{color:#fffffff0;max-width:60ch;margin:26px 0 0}.pueo-cs .hero-cta{flex-wrap:wrap;gap:12px;margin-top:36px;display:flex}.pueo-cs .hero-noise{z-index:1;opacity:.1;mix-blend-mode:overlay;background-image:radial-gradient(#ffffffe6 1px,#0000 1px);background-size:22px 22px;position:absolute;inset:0}.pueo-cs .hero-scrim{z-index:1;background:linear-gradient(#0000002e,#0000 30%,#0000001a);position:absolute;inset:0}@media (max-width:640px){.pueo-cs .hero-inner{padding:40px 22px}}.pueo-cs .meta-bar{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);margin-top:28px}.pueo-cs .meta-grid{grid-template-columns:repeat(3,1fr);gap:0;display:grid}.pueo-cs .meta-grid .cell{border-left:1px solid var(--rule-soft);padding:22px 24px}.pueo-cs .meta-grid .cell:first-child{border-left:0}.pueo-cs .meta-grid .k{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-size:10.5px}.pueo-cs .meta-grid .v{letter-spacing:-.008em;margin-top:8px;font-size:15px;font-weight:450;line-height:1.35}@media (max-width:720px){.pueo-cs .meta-grid{grid-template-columns:1fr}.pueo-cs .meta-grid .cell{border-left:0;border-top:1px solid var(--rule-soft)}.pueo-cs .meta-grid .cell:first-child{border-top:0}}.pueo-cs .sec-head{max-width:920px}.pueo-cs .sec-head h2{margin:20px 0 0}.pueo-cs .sec-head .sub{color:var(--muted);margin:18px 0 0}.pueo-cs .eyebrow-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.pueo-cs .prose p{margin:0 0 18px}.pueo-cs .prose p:last-child{margin-bottom:0}.pueo-cs .split{grid-template-columns:1fr 1fr;align-items:start;gap:48px;display:grid}@media (max-width:820px){.pueo-cs .split{grid-template-columns:1fr;gap:28px}}.pueo-cs .browser{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);overflow:hidden;box-shadow:0 1px 2px #0000000a,0 18px 44px #00000017}.pueo-cs .browser-bar{border-bottom:1px solid var(--border);background:#f6f6f6;align-items:center;gap:8px;height:38px;padding:0 14px;display:flex}.pueo-cs .theme-dark .browser-bar{background:#17171f}.pueo-cs .browser-bar .dots{gap:6px;display:flex}.pueo-cs .browser-bar .dots i{background:#dcdcdc;border-radius:9999px;width:10px;height:10px;display:block}.pueo-cs .browser-bar .url{border:1px solid var(--border);height:22px;font-family:var(--font-mono);color:#8a8a8a;letter-spacing:.02em;background:#fff;border-radius:9999px;flex:1;align-items:center;margin-left:8px;padding:0 12px;font-size:11px;display:flex}.pueo-cs .ba{aspect-ratio:62/43;--x:50%;-webkit-user-select:none;user-select:none;touch-action:pan-y;background:#0f0f0f;position:relative;overflow:hidden}.pueo-cs .ba img{object-fit:cover;object-position:top center;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.pueo-cs .ba .ba-old{clip-path:inset(0 calc(100% - var(--x)) 0 0);z-index:2}.pueo-cs .ba .ba-new{z-index:1}.pueo-cs .ba-divider{top:0;bottom:0;left:var(--x);z-index:3;background:#fff;width:2px;position:absolute;transform:translate(-1px);box-shadow:0 0 0 1px #0000001f}.pueo-cs .ba-handle{top:50%;left:var(--x);z-index:4;cursor:ew-resize;color:#111;background:#fff;border:none;border-radius:9999px;grid-auto-flow:column;place-items:center;width:46px;height:46px;margin:-23px 0 0 -23px;display:grid;position:absolute;box-shadow:0 2px 10px #00000047}.pueo-cs .ba-handle:focus-visible{outline-offset:3px;outline:2px dashed #000}.pueo-cs .ba-handle svg{width:20px;height:20px}.pueo-cs .ba-tag{z-index:5;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);border-radius:9999px;padding:5px 10px;font-size:10.5px;position:absolute;top:14px}.pueo-cs .ba-tag.before{color:#111;background:#ffffffdb;left:14px}.pueo-cs .ba-tag.after{color:#fff;background:#cc0000e6;right:14px}.pueo-cs .ba-hint{z-index:5;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:none;background:#00000073;border-radius:9999px;padding:5px 12px;font-size:10.5px;transition:opacity .3s;position:absolute;bottom:14px;left:50%;transform:translate(-50%)}.pueo-cs .ba.touched .ba-hint{opacity:0}.pueo-cs .ba-caption{flex-wrap:wrap;align-items:baseline;gap:20px;margin-top:18px;display:flex}.pueo-cs .ba-caption .ttl{letter-spacing:-.01em;font-size:17px;font-weight:540}.pueo-cs .ba-caption .dsc{color:var(--muted);flex:1;min-width:260px;font-size:14.5px;line-height:1.5}.pueo-cs .ba-stack{gap:44px;display:grid}.pueo-cs .pivot{grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;margin-top:14px;display:grid}@media (max-width:720px){.pueo-cs .pivot{grid-template-columns:1fr}.pueo-cs .pivot .arrow{justify-self:start;transform:rotate(90deg)}}.pueo-cs .pivot .from,.pueo-cs .pivot .to{border:1px solid var(--border);border-radius:8px;padding:16px 18px}.pueo-cs .pivot .from{background:#fafafa}.pueo-cs .pivot .to{color:#fff;background:#000;border-color:#000}.pueo-cs .pivot .lab{font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;opacity:.65;font-size:10px}.pueo-cs .pivot .val{letter-spacing:-.01em;margin-top:8px;font-size:16px;font-weight:450;line-height:1.3}.pueo-cs .pivot .arrow{color:var(--muted);font-size:20px}.pueo-cs .pivot-list{gap:12px;margin-top:16px;display:grid}.pueo-cs .comp-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;display:grid}@media (max-width:820px){.pueo-cs .comp-grid{grid-template-columns:1fr}}.pueo-cs .comp{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);padding:22px 20px}.pueo-cs .comp .name{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:11px}.pueo-cs .comp .pillar{letter-spacing:-.01em;margin-top:12px;font-size:17px;font-weight:540}.pueo-cs .comp .move{color:var(--muted);margin-top:12px;font-size:14px;line-height:1.5}.pueo-cs .comp .move b{color:var(--text);font-weight:540}.pueo-cs .pueo-panel{background:var(--pueo-midnight);color:#fff;border:1px solid #241416;border-radius:14px;padding:40px 34px;position:relative;overflow:hidden}.pueo-cs .pueo-strip{background:linear-gradient(90deg,#000,#7a0606,#c00,#7a0606,#000) 0 0/200% 100%;height:3px;animation:20s ease-in-out infinite pueo-strip-drift;position:absolute;top:0;left:0;right:0}.pueo-cs .pueo-panel .lbl{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--pueo-red-text);font-size:11px}.pueo-cs .ds-grid{grid-template-columns:repeat(2,1fr);gap:20px;margin-top:26px;display:grid}@media (max-width:820px){.pueo-cs .ds-grid{grid-template-columns:1fr}}.pueo-cs .ds-tile{background:#161314;border:1px solid #2a1c1e;border-radius:10px;padding:22px}.pueo-cs .ds-tile h4{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:#b9b0b1;margin:0 0 16px;font-size:11px;font-weight:400}.pueo-cs .swatches{flex-wrap:wrap;gap:10px;display:flex}.pueo-cs .sw{border:1px solid #ffffff14;border-radius:8px;flex:1;min-width:90px;overflow:hidden}.pueo-cs .sw .chip-c{height:52px}.pueo-cs .sw .meta{background:#0f0d0e;padding:8px 10px}.pueo-cs .sw .meta .nm{font-size:12px;font-weight:500}.pueo-cs .tac-primary{background:var(--pueo-red);color:#fff;cursor:default;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);border:none;align-items:center;gap:9px;padding:13px 20px;font-size:12px;display:inline-flex}.pueo-cs .tac-primary .sdot{background:#fff;border-radius:9999px;width:7px;height:7px;box-shadow:0 0 8px #fff}.pueo-cs .tac-secondary{color:#fff;cursor:default;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;background:0 0;border:1px solid #ffffff29;align-items:center;gap:9px;padding:13px 20px;font-size:12px;display:inline-flex;position:relative}.pueo-cs .tac-secondary:before,.pueo-cs .tac-secondary:after{content:"";border-color:var(--pueo-red);border-style:solid;width:12px;height:12px;position:absolute}.pueo-cs .tac-secondary:before{border-width:2px 0 0 2px;top:-1px;left:-1px}.pueo-cs .tac-secondary:after{border-width:0 2px 2px 0;bottom:-1px;right:-1px}.pueo-cs .btnrow{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.pueo-cs .type-demo .big{letter-spacing:-.02em;font-size:34px;font-weight:400;line-height:1.05}.pueo-cs .type-demo .big em{color:var(--pueo-red-text);font-style:normal}.pueo-cs .type-demo .mono{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:#8a8082;margin-top:14px;font-size:12px}.pueo-cs .type-demo .body{color:#c9c2c3;margin-top:12px;font-size:15px;font-weight:320;line-height:1.5}.pueo-cs .motifs{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px;display:grid}@media (max-width:720px){.pueo-cs .motifs{grid-template-columns:repeat(2,1fr)}}.pueo-cs .motif{aspect-ratio:1;background:#0d0b0c;border:1px solid #2a1c1e;border-radius:10px;position:relative;overflow:hidden}.pueo-cs .motif .cap{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:#9a9092;z-index:3;font-size:9.5px;position:absolute;bottom:9px;left:10px}.pueo-cs .m-radar{background:radial-gradient(circle,#cc000029,#0000 62%)}.pueo-cs .m-radar .ring{border:1px solid #cc000059;border-radius:50%;margin:auto;position:absolute;inset:0}.pueo-cs .m-radar .r1{width:34%;height:34%}.pueo-cs .m-radar .r2{border-color:#cc000038;width:62%;height:62%}.pueo-cs .m-radar .r3{border-color:#cc00001f;width:90%;height:90%}.pueo-cs .m-radar .sweep{background:conic-gradient(#cc00008c,#0000 22%);border-radius:50%;animation:4s linear infinite pueo-spin;position:absolute;inset:0;-webkit-mask:radial-gradient(circle,#0000 8%,#000 9%);mask:radial-gradient(circle,#0000 8%,#000 9%)}.pueo-cs .m-grid{background-color:#0000;background-image:linear-gradient(#cc000024 1px,#0000 1px),linear-gradient(90deg,#cc000024 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:16px 16px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box}.pueo-cs .m-hud .br{border:2px solid var(--pueo-red);width:20px;height:20px;position:absolute}.pueo-cs .m-hud .tl{border-width:2px 0 0 2px;top:14px;left:14px}.pueo-cs .m-hud .tr{border-width:2px 2px 0 0;top:14px;right:14px}.pueo-cs .m-hud .bl{border-width:0 0 2px 2px;bottom:14px;left:14px}.pueo-cs .m-hud .brr{border-width:0 2px 2px 0;bottom:14px;right:14px}.pueo-cs .m-hud .cross{background:#c009;width:2px;height:22px;margin:auto;position:absolute;inset:0}.pueo-cs .m-hud .cross:after{content:"";background:#c009;width:22px;height:2px;margin:auto;position:absolute;inset:0}.pueo-cs .m-grad{background:linear-gradient(135deg,#000,#7a0606 45%,#c00 60%,#7a0606 80%,#000) 0 0/200% 200%;animation:16s ease-in-out infinite pueo-grad-drift}.pueo-cs .sys-list{grid-template-columns:repeat(2,1fr);gap:14px 34px;margin-top:8px;display:grid}@media (max-width:720px){.pueo-cs .sys-list{grid-template-columns:1fr}}.pueo-cs .sys-list .it{border-top:1px solid var(--border);gap:12px;padding:14px 0;display:flex}.pueo-cs .sys-list .it .kk{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);flex-shrink:0;width:120px;padding-top:2px;font-size:10.5px}.pueo-cs .sys-list .it .vv{letter-spacing:-.008em;font-size:15px;line-height:1.45}.pueo-cs .gal{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px;display:grid}@media (max-width:900px){.pueo-cs .gal{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.pueo-cs .gal{grid-template-columns:1fr}}.pueo-cs .gcard{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);color:var(--text);cursor:pointer;text-align:left;font:inherit;flex-direction:column;padding:0;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.pueo-cs .gcard:hover{transform:translateY(-3px);box-shadow:0 12px 30px #0000001a}.pueo-cs .gcard .shot{background:#0f0f0f;height:230px;position:relative;overflow:hidden}.pueo-cs .gcard .shot img{object-position:top;width:100%;height:auto}.pueo-cs .gcard .cap{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:10px;padding:15px 16px;display:flex}.pueo-cs .gcard .cap .nm{letter-spacing:-.008em;font-size:14.5px;font-weight:500}.pueo-cs .gcard .cap .ex{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);align-items:center;gap:5px;font-size:10px;display:flex}.pueo-cs .gcard .badge{z-index:2;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#cc0000e6;border-radius:5px;padding:4px 8px;font-size:9.5px;position:absolute;top:12px;left:12px}.pueo-cs .gcard .badge.newpage{background:#000000d1}.pueo-cs .out-grid{grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px;display:grid}@media (max-width:720px){.pueo-cs .out-grid{grid-template-columns:1fr}}.pueo-cs .out{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);padding:24px 22px}.pueo-cs .out .ic{background:var(--pueo-red);color:#fff;border-radius:8px;place-items:center;width:34px;height:34px;margin-bottom:16px;display:grid}.pueo-cs .out .ic svg{width:18px;height:18px}.pueo-cs .out h4{letter-spacing:-.011em;margin:0 0 8px;font-size:17px;font-weight:700}.pueo-cs .out p{color:var(--muted);margin:0;font-size:14.5px;line-height:1.55}@keyframes pueo-strip-drift{0%,to{background-position:0 0}50%{background-position:100% 0}}@keyframes pueo-grad-drift{0%,to{background-position:0 0}50%{background-position:100% 100%}}@keyframes pueo-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.pueo-cs .pueo-strip,.pueo-cs .m-grad,.pueo-cs .m-radar .sweep{animation:none}}
