@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap";:root{color:#eaf3f2;font-synthesis:none;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--mint:#9de8cd;--muted:#91a4ac;background:#0b151c;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:5px;outline:2px solid #b3f8df}button{transition:background .15s,transform .15s,border-color .15s}button:active{transform:translateY(1px)}.site-shell{max-width:1256px;margin:auto;padding:0 44px}.site-header{border-bottom:1px solid #1d2c34;justify-content:space-between;align-items:center;height:104px;display:flex}.wordmark{letter-spacing:-.7px;align-items:center;gap:11px;font-size:20px;font-weight:700;display:flex}.wordmark-muted{color:#a4b9bc;font-weight:450}.brand-icon{width:27px;height:28px;display:inline-block;position:relative}.brand-icon i{background:#9de8cd;border-radius:50%;width:14px;height:14px;position:absolute;bottom:0;left:0}.brand-icon i:nth-child(2){background:#5ca492;width:11px;height:11px;bottom:10px;left:16px}.brand-icon i:nth-child(3){background:#d7f7e9;width:7px;height:7px;bottom:21px;left:5px}.version{color:#afc3c8;letter-spacing:0;border:1px solid #33454d;border-radius:5px;margin-left:4px;padding:4px 6px;font-size:10px;font-weight:500}nav{color:#b8c7cb;align-items:center;gap:28px;font-size:12px;display:flex}nav a:hover{color:var(--mint)}nav a span{color:#748e97;margin-left:6px}.open-source{color:#a8c9b9;letter-spacing:.8px;border:1px solid #29403e;border-radius:20px;padding:8px 11px;font-size:9px}.hero{justify-content:space-between;align-items:center;gap:30px;padding:53px 0 46px;display:flex}.eyebrow{letter-spacing:1.5px;color:#a2bcb7;align-items:center;gap:8px;font-size:9px;font-weight:650;display:flex}.eyebrow>span{background:var(--mint);border-radius:50%;width:5px;height:5px}h1{letter-spacing:-2.3px;margin:18px 0 16px;font-family:Manrope,system-ui,sans-serif;font-size:52px;font-weight:650;line-height:1.14}h1>span{color:#9de8cd}.hero p{color:var(--muted);margin:0;font-size:13px;line-height:1.9}.install{text-align:left;background:#101f27;border:1px solid #2b3b43;border-radius:11px;min-width:315px;margin-top:48px;padding:20px 22px 17px;box-shadow:0 15px 40px #0000001c}.install:hover{background:#14272e;border-color:#638379}.install-caption{color:#8d9fa7;letter-spacing:1.4px;font-size:8px;display:block}.install code{letter-spacing:-.2px;color:#e1e9e8;margin:16px 0 19px;font-size:12px;display:block}.install code>span{color:#73a88f;margin-right:7px}.install-bottom{color:#a2b7b8;border-top:1px solid #28373f;justify-content:space-between;padding-top:12px;font-size:9px;display:flex}.install-bottom>span{color:#adc5c4;font-size:13px}.playground-heading{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.playground-heading h2{margin:0;font-size:13px;font-weight:550}.playground-heading h2>span{color:#9dc9bb;margin-right:8px}.playground-heading>span{color:#839aa1;font-size:11px}.playground-grid{grid-template-columns:minmax(0,1fr) 285px;gap:20px;display:grid}.room{background:radial-gradient(at 50% 36%,#1c4b4c22,#11232c00 70%),#10252e;border:1px solid #2a424a;border-radius:14px;min-width:0;position:relative;overflow:hidden}.room-top{letter-spacing:1px;color:#a5bebf;z-index:1;justify-content:space-between;align-items:center;padding:21px 23px;font-size:9px;display:flex;position:relative}.live-dot{background:#93e4c4;border-radius:50%;width:5px;height:5px;margin-right:7px;display:inline-block;box-shadow:0 0 10px #89eac459}.room-counter{letter-spacing:0;color:#839da4;font-variant-numeric:tabular-nums;font-size:9px}.canvas{background-image:radial-gradient(#608b8320 .6px,#0000 .6px);background-size:22px 22px;height:309px;position:relative;overflow:hidden}.canvas:before{content:"";background:radial-gradient(#68bd9012,#0000 70%);width:300px;height:260px;position:absolute;top:0;left:50%;transform:translate(-50%)}.orbit{pointer-events:none;border:1px solid #8cceaa0d;border-radius:50%;position:absolute;top:65%;left:50%;transform:translate(-50%,-50%)}.orbit-one{width:240px;height:240px}.orbit-two{width:370px;height:370px}.orbit-three{width:510px;height:510px}.canvas-hint{text-align:center;color:#78959c;letter-spacing:.4px;width:100%;font-size:10px;position:absolute;top:22px}.star{color:#92c0a8;opacity:.45;pointer-events:none;position:absolute}.star-a{font-size:13px;top:82px;left:26%}.star-b{font-size:18px;top:147px;right:25%}.star-c{font-size:28px;top:63px;right:32%}.player{pointer-events:none;flex-direction:column;align-items:center;width:100%;display:flex;position:absolute;bottom:22px}.avatar-trigger{pointer-events:auto;background:0 0;border:0;border-radius:50%;margin-bottom:13px;padding:0;position:relative}.avatar-trigger:before{content:"";border:1px solid #8ce7cd23;border-radius:50%;position:absolute;inset:-8px}.avatar-trigger:hover{transform:translateY(-3px)}.avatar{background:linear-gradient(135deg,#d6bbd8,#929ac4);border:2px solid #b9d0c242;border-radius:50%;width:82px;height:82px;overflow:hidden;box-shadow:0 5px 25px #0004}.avatar svg{width:100%;height:100%;display:block}.avatar.variant-1{background:linear-gradient(135deg,#dbb294,#b8d295)}.online-indicator{background:#99edc7;border:3px solid #10252e;border-radius:50%;width:13px;height:13px;position:absolute;bottom:2px;right:3px}.player strong{color:#e1eeec;font-size:13px;font-weight:550}.player>span{color:#94aeb2;margin-top:5px;font-size:9px}.reaction-controls{background:linear-gradient(#0000,#10252e 12%);padding:0 24px 20px;position:relative}.emoji-bar{background:#0b1c25;border:1px solid #2c424a;border-radius:12px;justify-content:center;align-items:center;gap:6px;width:max-content;max-width:100%;margin:0 auto;padding:9px 11px;display:flex;box-shadow:0 5px 17px #00000020}.emoji-button{background:0 0;border:0;border-radius:8px;width:41px;height:37px;padding:3px;font-size:24px;line-height:1}.emoji-button:hover{background:#284248;transform:translateY(-3px)scale(1.12)}.bar-divider{background:#2b3e48;width:1px;height:25px;margin:0 6px}.say-button{white-space:nowrap;color:#d0dfde;background:0 0;border:0;border-radius:6px;padding:7px 8px;font-size:11px}.say-button:hover{background:#284248}.say-button>span{vertical-align:-1px;color:#99bbb5;margin-right:7px;font-size:17px}.action-row{justify-content:center;gap:8px;margin-top:14px;display:flex}.primary,.secondary,.custom-button{white-space:nowrap;border-radius:7px;height:36px;padding:0 15px;font-size:10px;font-weight:550}.primary{color:#163d35;background:#a3e8cb;border:1px solid #a3e8cb}.primary:hover{background:#c5f7e1}.primary>span:first-child{margin-right:7px}.primary>span:last-child{margin-left:9px}.secondary{color:#cbdad9;background:#16313b;border:1px solid #3a525b}.secondary:hover{background:#204450}.secondary>span{margin-left:8px;font-size:13px}.custom-button{color:#acc1c5;background:0 0;border:0;padding:0 8px}.custom-button:hover{color:#d9f4e9}.custom-button>span{margin-left:5px}.room-bottom{color:#91abb1;border-top:1px solid #253b43;justify-content:space-between;align-items:center;margin-top:24px;padding-top:15px;font-size:9px;display:flex}.toggle-label{cursor:pointer;align-items:center;gap:8px;display:flex;position:relative}.toggle-label input{opacity:0;width:27px;height:16px;margin:0;position:absolute}.toggle{background:#2b444e;border-radius:15px;width:27px;height:16px;display:block;position:relative}.toggle:after{content:"";background:#9bb3ba;border-radius:50%;width:10px;height:10px;transition:transform .15s;position:absolute;top:3px;left:3px}.toggle-label input:checked+.toggle{background:#3c7e67}.toggle-label input:checked+.toggle:after{background:#b8f3d7;transform:translate(11px)}.toggle-label input:focus-visible+.toggle{outline:2px solid var(--mint);outline-offset:4px}.text-button{color:#a6bcbc;background:0 0;border:0;padding:0;font-size:10px}.text-button:hover{color:#d4f4e5}.settings{background:#111f27;border:1px solid #2a3b43;border-radius:14px;padding:22px}.settings-heading{justify-content:space-between;align-items:center;display:flex}.settings-heading h2{margin:0;font-size:14px;font-weight:550}.settings-heading button{font-size:9px}.settings-heading button span{margin-left:4px}.settings-description{color:#91a6ad;margin:8px 0 24px;font-size:10px}.control-section h3{color:#9baeb4;letter-spacing:1.3px;margin:0 0 17px;font-size:8px;font-weight:500}.range-label{margin:0 0 14px;display:block}.range-label>span{color:#c3d2d3;justify-content:space-between;margin-bottom:7px;font-size:10px;display:flex}.range-label output{color:#a5beb8;font-variant-numeric:tabular-nums;font-size:9px}input[type=range]{appearance:none;background:linear-gradient(to right, #9adebf var(--progress), #2d424b var(--progress));cursor:pointer;border-radius:5px;width:100%;height:3px;margin:10px 0 0;display:block}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#b6ebd4;border:2px solid #13262c;border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 1px #96c9b8}input[type=range]::-moz-range-thumb{background:#b6ebd4;border:2px solid #13262c;border-radius:50%;width:7px;height:7px}.select-label{color:#c3d2d3;justify-content:space-between;align-items:center;margin-top:20px;font-size:10px;display:flex}select{color:#c7d9d8;background:#172b34;border:1px solid #354852;border-radius:5px;padding:6px 9px;font-size:10px}.appearance{border-top:1px solid #293a42;margin-top:20px;padding-top:19px}.message-label{color:#c3d2d3;margin:17px 0;font-size:10px;display:block}.message-label input{color:#c9dbd9;background:#0d1c24;border:1px solid #32454e;border-radius:5px;width:100%;margin-top:8px;padding:8px 10px;font-size:10px;display:block}.color-control{color:#c3d2d3;justify-content:space-between;align-items:center;font-size:10px;display:flex}.color-control>div{gap:6px;display:flex}.swatch{border:1px solid #ffffff20;border-radius:50%;width:17px;height:17px;padding:0}.swatch.selected{outline-offset:2px;outline:1px solid #8ab6a7}.motion-label{color:#a7bec1;border-top:1px solid #293a42;justify-content:space-between;align-items:center;gap:5px;margin-top:22px;padding-top:17px;font-size:9px;display:flex}.motion-label select{max-width:132px;padding:5px;font-size:9px}.settings-note{color:#8ea7ad;margin-top:16px;font-size:8px}.settings-note>span{color:#9acbb7;margin-right:6px}.feature-strip{color:#a1b5bb;justify-content:center;gap:37px;margin:25px 0 54px;font-size:10px;display:flex}.feature-strip>span{align-items:center;gap:8px;display:flex}.feature-strip i{color:#8fb2a7;font-size:13px;font-style:normal}.below-grid{border-top:1px solid #23333b;grid-template-columns:1fr 1.3fr;gap:55px;padding-top:48px;scroll-margin-top:30px;display:grid}.quick-start>.eyebrow{font-size:8px}.quick-start h2{letter-spacing:-1px;margin:18px 0 12px;font-family:Manrope,system-ui,sans-serif;font-size:30px;font-weight:600;line-height:1.3}.quick-start p{color:#94a9ae;font-size:12px;line-height:1.9}.code-card{background:#101e27;border:1px solid #2a3d46;border-radius:10px;overflow:hidden}.code-card>div{color:#b6cac9;border-bottom:1px solid #2a3d46;justify-content:space-between;align-items:center;padding:15px 19px;font-size:10px;display:flex}.code-card>div>span:last-child{letter-spacing:.8px;color:#879fa9;font-size:8px}pre{color:#a8d1c2;tab-size:2;margin:0;padding:20px;font-size:10px;line-height:1.9;overflow-x:auto}.friends{flex-direction:column;gap:10px;max-width:320px;margin-top:27px;display:flex}.friend{text-align:left;background:#12242c;border:1px solid #2a4148;border-radius:10px;align-items:center;gap:12px;width:100%;padding:12px 14px;display:flex}.friend:hover{background:#183039;border-color:#6ba08d}.avatar.small{border-width:1px;flex-shrink:0;width:39px;height:39px}.friend>span>strong{font-size:11px;font-weight:550;display:block}.friend>span>span{color:#9bb5b8;margin-top:4px;font-size:9px;display:block}.friend-arrow{color:#93bcae;margin-left:auto}.friends-caption{color:#879da4;margin-top:14px;font-size:9px;display:block}.custom-bubble{color:#3b3062;white-space:nowrap;background:#e2d7ff;border:1px solid #c7b7ff;border-radius:10px;align-items:center;padding:10px 14px;font-weight:650;display:inline-flex;box-shadow:0 4px 22px #0003}footer{color:#93a8ae;border-top:1px solid #23333b;justify-content:space-between;margin-top:48px;padding:25px 0 30px;font-size:9px;display:flex}footer>a>span{color:#b5dcc7;margin-left:5px}@media (width>=1400px){.site-shell{padding:0 40px}h1{font-size:58px}.hero{padding-top:60px;padding-bottom:50px}.canvas{height:330px}}@media (width<=1000px){.site-shell{padding:0 28px}.playground-grid{grid-template-columns:minmax(0,1fr) 265px;gap:14px}.settings{padding:19px}.hero{gap:20px}h1{font-size:44px}.install{min-width:280px;padding:18px}.install code{font-size:10px}.reaction-controls{padding-left:14px;padding-right:14px}.emoji-bar{gap:2px;padding:8px}.emoji-button{width:34px;font-size:23px}.primary,.secondary,.custom-button{padding:0 10px;font-size:9px}.bar-divider{margin:0 4px}.say-button{padding:5px}.below-grid{gap:25px}}@media (width<=760px){.site-shell{padding:0 20px}.site-header{height:80px}.wordmark{gap:8px;font-size:18px}.version{display:none}nav{gap:18px;font-size:11px}.open-source{display:none}.hero{padding:35px 0 33px;display:block}h1{font-size:45px}.hero p{font-size:12px}.install{width:100%;margin-top:25px;padding:15px 18px;display:block}.install-caption{display:none}.install code{margin:0 0 13px;font-size:12px}.install-bottom{padding-top:11px}.playground-grid{grid-template-columns:1fr;gap:16px}.playground-heading>span{font-size:9px}.playground-heading h2{font-size:12px}.canvas{height:300px}.settings{padding:22px}.settings-description{margin-bottom:22px}.settings .control-section{display:block}.range-label{margin-bottom:20px}.range-label>span,.select-label,.message-label,.color-control{font-size:12px}.range-label output{font-size:11px}.control-section h3{font-size:9px}input[type=range]{height:4px;margin-top:15px}input[type=range]::-webkit-slider-thumb{width:15px;height:15px}.settings select{padding:8px;font-size:12px}.message-label input{padding:11px;font-size:12px}.color-control>div{gap:11px}.swatch{width:21px;height:21px}.motion-label{font-size:11px}.motion-label select{max-width:180px;font-size:11px}.settings-note{font-size:10px}.feature-strip{flex-wrap:wrap;gap:15px 24px;margin:24px 0 35px;font-size:9px}.below-grid{grid-template-columns:1fr;gap:28px;padding-top:32px}.quick-start h2{font-size:30px}.friends{max-width:none}pre{padding:17px;font-size:9px}footer{gap:20px;margin-top:35px;font-size:8px;line-height:1.9}footer>span{text-align:right;max-width:115px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}.avatar-trigger:hover,.emoji-button:hover{transform:none}}
