:root{--chat-font-size:.875rem;--chat-line-height:1.5;--chat-padding:.25rem .5rem;--chat-gap:.125rem;--tw-color:#9147ff;--sp-color:#8a2be2}.chat-overlay,.chat-overlay *{box-sizing:border-box;margin:0;padding:0}html:has(.chat-overlay){width:100vw;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--chat-font-size);line-height:var(--chat-line-height);-webkit-font-smoothing:antialiased;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border:none;margin:0;padding:0;overflow:hidden;background:0 0!important}html:has(.chat-overlay) body{width:100vw;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--chat-font-size);line-height:var(--chat-line-height);-webkit-font-smoothing:antialiased;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border:none;margin:0;padding:0;overflow:hidden;background:0 0!important}html:has(.chat-overlay) #root{width:100vw;height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:var(--chat-font-size);line-height:var(--chat-line-height);-webkit-font-smoothing:antialiased;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border:none;margin:0;padding:0;overflow:hidden;background:0 0!important}.chat-overlay{pointer-events:none;-webkit-user-select:none;user-select:none;flex-direction:column;width:100%;height:100%;display:flex}.chat-overlay.direction-down{justify-content:flex-start}.chat-overlay.direction-up{justify-content:flex-end}.chat-overlay.theme-transparent{color:#fff;text-shadow:0 0 .1875rem #000000e6,0 0 .125rem #000;background:0 0}.chat-overlay.theme-dark{color:#efeff1;background:#0e0e10}.chat-overlay.theme-light{color:#1f1f23;text-shadow:none;background:#fff}.chat-pin-region{padding:var(--chat-padding);background:#ffffff14;border-bottom:.0625rem solid #ffffff26;border-radius:.25rem;flex-shrink:0;align-items:flex-start;gap:.375rem;margin-bottom:.25rem;display:flex}.pin-label{color:gold;flex-shrink:0;padding-top:.125rem;font-size:.6563rem;font-weight:700}.chat-debug{z-index:9999;pointer-events:auto;position:fixed;top:.25rem;right:.25rem}.debug-status{color:#ccc;background:#000000b3;border-radius:.25rem;gap:.5rem;padding:.25rem .5rem;font-family:monospace;font-size:.6125rem;display:flex}.status-twitch,.status-sp{border-radius:.1875rem;padding:.0625rem .25rem}.status-connected{color:#4ade80}.status-connecting,.status-reconnecting{color:#fbbf24}.status-disconnected,.status-error{color:#f87171}.debug-error{color:#f87171;background:#000c;border-radius:.25rem;padding:.5rem .75rem;font-size:.7rem}.chat-messages{gap:var(--chat-gap);padding:var(--chat-padding);text-align:left;flex-direction:column;flex:1;justify-content:flex-end;display:flex;overflow:hidden auto}.direction-up .chat-messages{flex-direction:column-reverse;justify-content:flex-start}.chat-row{max-width:100%;line-height:var(--chat-line-height);text-align:left;padding:.125rem 0;animation:.15s ease-out fadeInUp;display:block}.chat-row.fade-enabled{animation:.15s ease-out fadeInUp,1s ease-out forwards fadeOut;animation-delay:0s, var(--hide-after,60s)}.chat-row>*{vertical-align:baseline;margin-right:.25rem;display:inline}.chat-row>:last-child{margin-right:0}.badge-row{vertical-align:baseline;align-items:baseline;gap:.125rem;display:inline-flex!important}.platform-marker{opacity:.85;vertical-align:baseline;justify-content:center;align-items:baseline;display:inline-flex!important}.direction-up .chat-row{animation:.15s ease-out fadeInDown}.platform-marker{vertical-align:middle;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.platform-marker svg{width:.875rem;height:.875rem}.platform-marker.platform-twitch{color:#9147ff}.platform-marker.platform-streamplace{color:#8a2be2}.badge-row{vertical-align:middle;flex-shrink:0;align-items:start;gap:.125rem;display:inline-flex}.badge-icon{border-radius:.125rem;width:.875rem;height:.875rem}.badge-text{color:#fff;border-radius:.125rem;justify-content:center;align-items:center;width:.875rem;height:.875rem;font-size:.4813rem;font-weight:bolder;display:inline-flex}.badge-twitch{background:var(--tw-color)}.badge-streamplace{background:var(--sp-color)}.author-name{flex-shrink:0;font-weight:700}.message-fragments{word-break:break-word;overflow-wrap:anywhere}.frag-text{white-space:pre-wrap}.frag-emote{vertical-align:middle;width:auto;height:1.225rem;display:inline-block}.frag-mention{color:var(--sp-color);background:#8a2be226;border-radius:.125rem;padding:0 .125rem;font-weight:600}.frag-link{color:#3ba6f5;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.frag-cheermote{align-items:center;gap:.125rem;display:inline-flex}.frag-cheermote img{width:auto;height:1.225rem}.reply-context{opacity:.6;width:100%;padding-left:1.25rem;font-size:.7rem;font-style:italic;display:block}.chat-empty{color:#888;justify-content:center;align-items:center;height:100%;font-size:.7rem;display:flex}@keyframes fadeInUp{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-.5rem)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.chat-row{animation:none}}::-webkit-scrollbar{display:none}*{scrollbar-width:none;-ms-overflow-style:none}.test-page{pointer-events:auto;-webkit-user-select:auto;user-select:auto;width:100%;min-height:100vh;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:.875rem;line-height:1.5}.test-page.theme-dark{color:#efeff1;background:#0e0e10}.test-page.theme-light{color:#1f1f23;background:#fff}.test-page.theme-transparent{color:#fff;text-shadow:0 0 .1875rem #000000e6;background:#1a1a2e}.test-header{z-index:100;background:inherit;border-bottom:.0625rem solid #ffffff1a;padding:1.25rem 1.5rem 1rem;position:sticky;top:0}.test-page.theme-dark .test-header{background:#0e0e10}.test-page.theme-light .test-header{background:#fff;border-bottom-color:#0000001a}.test-page.theme-transparent .test-header{background:#1a1a2e}.test-header h1{margin-bottom:.25rem;font-size:1.225rem;font-weight:700}.test-header p{opacity:.6;margin-bottom:.75rem;font-size:.7438rem}.test-header code{background:#ffffff1a;border-radius:.1875rem;padding:.0625rem .25rem;font-family:monospace;font-size:.7875rem}.test-page.theme-light .test-header code{background:#0000000f}.test-controls{align-items:center;gap:1.25rem;font-size:.7438rem;display:flex}.test-controls label{cursor:pointer;align-items:center;gap:.375rem;display:flex}.test-controls select{background:inherit;color:inherit;font-size:inherit;cursor:pointer;border:.0625rem solid #fff3;border-radius:.1875rem;padding:.125rem .375rem}.test-page.theme-light .test-controls select{border-color:#0003}.test-controls a{color:#9147ff;margin-left:auto;font-size:.7438rem;text-decoration:none}.test-controls a:hover{text-decoration:underline}.test-pin{background:#ffffff14;border-bottom:.0625rem solid #ffffff26;align-items:flex-start;gap:.375rem;padding:.5rem 1.5rem;display:flex}.test-page.theme-light .test-pin{background:#0000000a;border-bottom-color:#0000001a}.test-pin .pin-label{color:gold;flex-shrink:0;padding-top:.125rem;font-size:.6563rem;font-weight:700}.test-sections{flex-direction:column;gap:1.5rem;padding:1rem 1.5rem 3rem;display:flex}.test-section{border:.0625rem solid #ffffff14;border-radius:.375rem;overflow:hidden}.test-page.theme-light .test-section{border-color:#00000014}.test-section-header{background:#ffffff0a;border-bottom:.0625rem solid #ffffff0f;align-items:baseline;gap:.625rem;padding:.625rem .875rem;display:flex}.test-page.theme-light .test-section-header{background:#00000005;border-bottom-color:#0000000f}.test-section-header h2{font-size:.8313rem;font-weight:600}.test-section-desc{opacity:.5;font-size:.6563rem}.test-message-list{flex-direction:column;gap:.125rem;padding:.5rem .875rem;display:flex}.test-page .chat-overlay,.test-page .chat-messages{pointer-events:auto;-webkit-user-select:auto;user-select:auto}.test-page ::-webkit-scrollbar{width:.5rem;height:.5rem;display:block}.test-page ::-webkit-scrollbar-track{background:0 0}.test-page ::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:.25rem}.test-page.theme-light ::-webkit-scrollbar-thumb{background:#00000026}.test-page .chat-row.fade-enabled{animation:.15s ease-out fadeInUp}.builder{width:100%;min-height:100vh;color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:1rem;line-height:1.5}.builder-nav{border-bottom:.0625rem solid var(--border);align-items:center;gap:.75rem;padding:.75rem 1.5rem;display:flex}.builder-nav .brand{color:var(--text-h);align-items:center;gap:.375rem;font-size:.875rem;font-weight:600;text-decoration:none;display:flex}.builder-title{color:var(--text-dim);background:var(--surface);border-radius:var(--radius);padding:.125rem .5rem;font-size:.75rem}.builder-main{flex-direction:column;gap:1rem;max-width:34rem;margin:0 auto;padding:1.5rem 1.5rem 3rem;display:flex}.builder-section{border:.0625rem solid var(--border);border-radius:var(--radius);overflow:hidden}.builder-section-header{background:var(--surface);border-bottom:.0625rem solid var(--border);align-items:center;gap:.375rem;padding:.5rem .75rem;display:flex}.builder-section-icon{color:var(--accent);align-items:center;display:flex}.builder-section-header h2{color:var(--text-h);margin:0;font-size:.8125rem;font-weight:600}.builder-section-body{flex-direction:column;gap:.25rem;padding:.5rem .75rem;display:flex}.builder-field{justify-content:space-between;align-items:center;gap:.75rem;min-height:2rem;padding:.25rem 0;display:flex}.builder-field-label{color:var(--text-dim);white-space:nowrap;flex-shrink:0;font-size:.8125rem}.builder-field-control{flex:1;justify-content:flex-end;align-items:center;display:flex}.builder-field input[type=text],.builder-field input[type=number]{font:inherit;background:var(--surface);border:.0625rem solid var(--border);border-radius:var(--radius);color:var(--text-h);text-align:right;outline:none;width:8rem;padding:.3125rem .5rem;font-size:.8125rem;transition:border-color .15s}.builder-field input[type=text]:focus,.builder-field input[type=number]:focus{border-color:var(--accent)}.builder-field input[type=range]{width:8rem;accent-color:var(--accent)}.seg-group{border:.0625rem solid var(--border);border-radius:var(--radius);display:inline-flex;overflow:hidden}.seg{font:inherit;background:var(--surface);color:var(--text-dim);border:none;border-right:.0625rem solid var(--border);cursor:pointer;padding:.25rem .625rem;font-size:.75rem;transition:all .12s}.seg:last-child{border-right:none}.seg:hover{color:var(--text-h)}.seg-active{background:var(--accent);color:#fff}.toggle{cursor:pointer;background:0 0;border:none;align-items:center;gap:.375rem;padding:0;display:inline-flex}.toggle-icon{color:var(--text-dim);align-items:center;display:flex}.toggle-track{background:var(--border);border-radius:6.25rem;width:2rem;height:1.125rem;transition:background .15s;position:relative}.toggle-thumb{background:var(--text-h);border-radius:50%;width:.875rem;height:.875rem;transition:transform .15s;position:absolute;top:.125rem;left:.125rem}.toggle-on .toggle-track{background:var(--accent)}.toggle-on .toggle-thumb{background:#fff;transform:translate(.875rem)}.url-preview{border:.0625rem solid var(--border);border-radius:var(--radius);background:var(--surface);flex-direction:column;gap:.5rem;padding:.75rem;display:flex}.url-preview-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:.25rem;font-size:.6875rem;font-weight:600;display:flex}.url-preview-code{font-family:var(--mono);background:var(--bg);border:.0625rem solid var(--border);border-radius:var(--radius);color:var(--text-h);word-break:break-all;padding:.5rem .625rem;font-size:.75rem}.url-preview-actions{gap:.5rem;display:flex}.copy-btn{background:var(--bg);border:.0625rem solid var(--border);border-radius:var(--radius);color:var(--text-h);font:inherit;cursor:pointer;align-items:center;gap:.25rem;padding:.3125rem .625rem;font-size:.8125rem;transition:border-color .15s;display:inline-flex}.copy-btn:hover{border-color:var(--accent)}:root{--text:#b4b0c0;--text-h:#f3f0fa;--text-dim:#8a8599;--bg:#0e0e12;--surface:#1a1a22;--border:#2a2a35;--accent:#9147ff;--accent-soft:#9147ff1f;--tw:#9147ff;--sp:#8a2be2;--radius:.625rem;--sans:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, "SF Mono", Consolas, monospace;font:1rem/1.55 var(--sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:light){:root{--text:#4a4556;--text-h:#1a1726;--text-dim:#7a7488;--bg:#fff;--surface:#f5f4f8;--border:#e0dde8;--accent:#7c2bd6;--accent-soft:#7c2bd614}}body{margin:0}#root{text-align:left;flex-direction:column;max-width:42.5rem;min-height:100svh;margin:0 auto;padding:0 1.5rem;display:flex}.landing-nav{justify-content:space-between;align-items:center;padding:1.25rem 0;display:flex}.brand{color:var(--text-h);align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;display:flex}.brand-mark{color:var(--accent);font-size:1.125rem}.landing-nav nav{gap:1.25rem;font-size:.875rem;display:flex}.landing-nav nav a{color:var(--text-dim);align-items:center;gap:.3125rem;text-decoration:none;transition:color .15s;display:flex}.landing-nav nav a:hover{color:var(--text-h)}.landing-hero{padding:3.75rem 0 3rem}.landing-hero h1{letter-spacing:-.03em;color:var(--text-h);margin:0 0 1.25rem;font-size:clamp(2.125rem,7vw,3.25rem);font-weight:600;line-height:1.1}.tagline{max-width:28.75rem;margin:0 0 2rem;font-size:1.0625rem}.overlay-url{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.url-editor{font-family:var(--mono);background:var(--surface);border:.0625rem solid var(--border);border-radius:var(--radius);color:var(--text-dim);align-items:center;padding:.5rem .875rem;font-size:.8125rem;display:inline-flex}.url-static{white-space:nowrap}.url-editable{font:inherit;font-family:var(--mono);color:var(--text-h);background:0 0;border:none;outline:none;width:auto;min-width:.5rem;padding:0}.open-btn{background:var(--accent);color:#fff;border-radius:var(--radius);align-items:center;gap:.375rem;padding:.5rem 1rem;font-size:.875rem;font-weight:500;text-decoration:none;transition:opacity .15s;display:inline-flex}.open-btn:hover{opacity:.88}.platforms{gap:.625rem;display:flex}.platform-badge{color:var(--text-dim);background:var(--surface);border:.0625rem solid var(--border);border-radius:6.25rem;align-items:center;gap:.375rem;padding:.3125rem .75rem;font-size:.8125rem;display:inline-flex}.features{background:var(--border);border:.0625rem solid var(--border);border-radius:var(--radius);grid-template-columns:1fr 1fr;gap:.0625rem;margin-bottom:3rem;display:grid;overflow:hidden}.feature{background:var(--bg);gap:.875rem;padding:1.25rem;display:flex}.feature-icon{color:var(--accent);flex-shrink:0;padding-top:.0625rem}.feature h3{color:var(--text-h);margin:0 0 .25rem;font-size:.9375rem;font-weight:500}.feature p{color:var(--text-dim);margin:0;font-size:.8125rem}@media (width<=35rem){.features{grid-template-columns:1fr}}