:root{color:#f2f1ed;font-synthesis:none;text-rendering:optimizelegibility;background:#090b13;font-family:Avenir Next,Avenir,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0}a{color:inherit;text-decoration:none}button,textarea{font:inherit}body:before{z-index:-3;content:"";background:radial-gradient(circle at 72% 30%,#6d52ff29,#0000 29rem),radial-gradient(circle at 18% 76%,#27bcaa17,#0000 28rem),linear-gradient(135deg,#080a11 0%,#0c0f1b 48%,#090b13 100%);position:fixed;inset:0}body:after{z-index:-2;opacity:.12;content:"";background-image:linear-gradient(#ffffff0d 1px,#0000 1px),linear-gradient(90deg,#ffffff0d 1px,#0000 1px);background-size:64px 64px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 92%);mask-image:linear-gradient(#000,#0000 92%)}main{min-height:100vh;position:relative;overflow:hidden}.topbar{z-index:5;justify-content:space-between;align-items:center;width:min(1180px,100% - 48px);height:96px;margin:auto;display:flex;position:relative}.brand{letter-spacing:-.04em;align-items:center;gap:11px;font:600 18px SFMono-Regular,Consolas,monospace;display:flex}.brand-mark{color:#9b8cff;background:#ffffff0a;border:1px solid #ffffff2e;border-radius:10px;place-items:center;width:34px;height:34px;display:grid}.nav-links{color:#aaaebc;align-items:center;gap:34px;font-size:14px;display:flex}.nav-links a:hover{color:#fff}.github-link{border:1px solid #ffffff21;border-radius:999px;padding:10px 15px}.page-grid{grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);align-items:center;gap:clamp(60px,8vw,120px);width:min(1180px,100% - 48px);min-height:calc(100vh - 150px);margin:0 auto;padding:70px 0 90px;display:grid}.eyebrow{color:#999eaf;letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px;font:500 11px SFMono-Regular,Consolas,monospace}.hero-kicker{color:#8c82d8;align-items:center;gap:10px;display:flex}.hero-kicker span{background:#7567dc;width:26px;height:1px}.hero h1{letter-spacing:-.065em;margin:24px 0 28px;font-size:clamp(58px,6.5vw,92px);font-weight:500;line-height:.93}.hero h1 em{color:#a99cff;font-family:Iowan Old Style,Palatino Linotype,Georgia,serif;font-weight:600}.hero-copy{color:#a8abb7;max-width:490px;font-size:17px;line-height:1.7}.hero-actions{align-items:center;gap:28px;margin:38px 0 55px;display:flex}.primary-action{color:#10111a;background:#e9e7e0;border-radius:8px;align-items:center;gap:24px;padding:15px 20px;font-size:14px;font-weight:700;display:flex}.primary-action:hover{background:#fff;transform:translateY(-2px)}.text-action{color:#b7b9c4;font-size:14px}.text-action span{color:#8e80ff;margin-left:10px}.alphabet-ribbon{color:#767b8d;gap:clamp(14px,2vw,25px);font-size:clamp(19px,2vw,28px);display:flex}.alphabet-ribbon span{animation:4s ease-in-out infinite ribbon-pulse;animation-delay:calc(var(--index) * .14s)}.console-card{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:linear-gradient(150deg,#191c2bf0,#0d0f19e0);border:1px solid #ffffff1f;border-radius:24px;padding:clamp(28px,4vw,46px);position:relative;box-shadow:0 36px 100px #0000006b,inset 0 1px #ffffff0f}.console-card:before{filter:blur(100px);opacity:.23;content:"";background:#7968f7;border-radius:50%;width:150px;height:150px;position:absolute;top:-45px;right:-35px}.console-heading{justify-content:space-between;gap:20px;margin-bottom:34px;display:flex}.console-heading h2{letter-spacing:-.035em;max-width:370px;margin:0;font-size:clamp(23px,3vw,31px);line-height:1.25}.window-controls{gap:6px;padding-top:5px;display:flex}.window-controls i{background:#555a6c;border-radius:50%;width:7px;height:7px}.input-label{color:#9fa3b3;text-transform:uppercase;letter-spacing:.1em;margin-bottom:9px;font:400 11px SFMono-Regular,Consolas,monospace;display:block}.input-shell{position:relative}.input-shell textarea{resize:none;color:#fff;background:#04060c7a;border:1px solid #ffffff1c;border-radius:12px;outline:none;width:100%;min-height:96px;padding:19px 20px 38px;font:400 17px SFMono-Regular,Consolas,monospace}.input-shell textarea:focus{border-color:#9180ffb3;box-shadow:0 0 0 3px #7563ea1a}.input-shell textarea::placeholder{color:#505565}.key-hint{color:#64697b;font:400 10px SFMono-Regular,Consolas,monospace;position:absolute;bottom:12px;right:13px}.geometry-output{overflow-wrap:anywhere;color:#eeeef6;background:#090b12;border-radius:12px;align-items:center;gap:14px;min-height:110px;margin-top:16px;padding:26px 23px;font:400 clamp(21px,3.3vw,35px)/1.45 SFMono-Regular,Consolas,monospace;display:flex}.terminal-mark{color:#7768e8}.beam{background:#a89aff;flex:none;width:2px;height:1.1em;animation:1s step-end infinite blink}.decoded-row{opacity:0;color:#777c8d;text-transform:uppercase;grid-template-columns:auto 1fr;gap:20px;max-height:0;margin-top:0;font:400 11px SFMono-Regular,Consolas,monospace;transition:all .3s;display:grid;overflow:hidden}.decoded-row.is-visible{opacity:1;max-height:80px;margin-top:18px}.decoded-row output{color:#c4c5cd;text-transform:none;overflow-wrap:anywhere;font-size:13px}.translate-control{margin-top:24px;padding-top:30px;position:relative}.language-options{opacity:0;pointer-events:none;color:#aeb2c2;align-items:center;gap:10px;font:600 11px SFMono-Regular,Consolas,monospace;transition:opacity .22s,transform .22s;display:flex;position:absolute;top:0;right:0;transform:translateY(8px)}.translate-control:hover .language-options,.translate-control:focus-within .language-options{opacity:1;pointer-events:auto;transform:translateY(0)}.language-options button{color:inherit;cursor:pointer;font:inherit;background:0 0;border:0;padding:0}.language-options button:hover,.language-options button:focus-visible,.language-options button.is-active{color:#f3f1ff}.language-options button:focus-visible{outline-offset:4px;outline:2px solid #a89affb3}.encode-button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#7062e8,#8f7cf7);border:0;border-radius:9px;justify-content:space-between;width:100%;padding:15px 20px;font-size:13px;font-weight:700;display:flex}.encode-button:hover{filter:brightness(1.1)}.triangle-field{z-index:-1;pointer-events:none;position:fixed;inset:0;overflow:hidden}.floating-triangle{left:var(--left);top:var(--top);color:#afa2ff;font-size:var(--size);opacity:var(--opacity);animation:float-triangle var(--duration) ease-in-out var(--delay) infinite alternate;will-change:transform;position:absolute}footer{color:#626675;border-top:1px solid #ffffff14;justify-content:space-between;width:min(1180px,100% - 48px);margin:auto;padding:25px 0 35px;font:400 11px SFMono-Regular,Consolas,monospace;display:flex}@keyframes float-triangle{0%{transform:translateY(30px)rotate(-18deg)}to{transform:translate3d(var(--drift), -110px, 0) rotate(42deg)}}@keyframes ribbon-pulse{50%{color:#a59aef;transform:translateY(-4px)}}@keyframes blink{50%{opacity:0}}@media (width<=880px){.page-grid{grid-template-columns:1fr;padding-top:45px}.hero{max-width:680px}}@media (width<=560px){.topbar,.page-grid,footer{width:min(100% - 32px,1180px)}.topbar{height:76px}.nav-links{gap:12px}.nav-links>a:first-child{display:none}.page-grid{gap:55px;padding:42px 0 65px}.hero h1{font-size:clamp(52px,17vw,70px)}.hero-actions{flex-direction:column;align-items:flex-start}.console-card{border-radius:18px}footer{flex-direction:column;gap:20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
