.gp-demo { color:#dbdee1; font-size:14px; min-width:0; }
.gp-demo [hidden] { display:none!important; }
.gp-demo-top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 22px; padding:14px 16px; border:1px solid #414249; border-radius:8px; background:#27282d; }
.gp-demo-top p { margin:4px 0 0; color:#b5bac1; font-size:12px; }
.gp-demo-badge { color:#a7ed78; font-size:10px; letter-spacing:1.4px; font-weight:800; }
.gp-demo .gp-button { display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:7px 13px; border:0; border-radius:4px; font-size:13px; font-weight:600; line-height:1.4; cursor:pointer; text-decoration:none; color:#fff; background:#4e5058; }
.gp-demo .gp-button.primary { background:#5865f2; }.gp-demo .gp-button.secondary { background:#4e5058; }.gp-demo .gp-button.danger { background:#da373c; }.gp-demo .gp-button.success { background:#248046; }
.gp-demo .gp-button:hover:not(:disabled) { filter:brightness(1.12); }
.gp-demo .gp-button:disabled { opacity:.46; cursor:not-allowed; }
.gp-demo .gp-button:focus-visible,.gp-demo summary:focus-visible,.gp-demo select:focus-visible,.gp-demo input:focus-visible,.gp-demo textarea:focus-visible,.gp-demo button:focus-visible { outline:2px solid #00a8fc; outline-offset:3px; }
.gp-demo .gp-field { box-sizing:border-box; display:block; width:100%; min-width:0; min-height:40px; padding:10px 12px; background:#1e1f22; border:1px solid #4e5058; border-radius:5px; color:#f2f3f5; font:inherit; }
.gp-demo select.gp-field { cursor:pointer; }.gp-demo .gp-field::placeholder { color:#969aa3; }
.gp-demo-voice-layout { display:grid; grid-template-columns:220px minmax(0,1fr); border:1px solid #404249; border-radius:8px; overflow:hidden; }
.gp-demo-voice-tree { padding:17px 12px; background:#2b2d31; min-width:0; }
.gp-demo-category { color:#949ba4; font-weight:750; font-size:10px; letter-spacing:.7px; margin:0 8px 10px; }
.gp-demo-generator { width:100%; display:flex; align-items:center; gap:9px; padding:10px 8px; color:#dbdee1; border:0; background:#35373c; border-radius:5px; font:inherit; font-weight:650; text-align:left; cursor:pointer; }
.gp-demo-generator:hover:not(:disabled) { background:#404249; color:#fff; }.gp-demo-generator:disabled { cursor:default; opacity:.65; }
.gp-demo-voice-icon { flex:0 0 20px; color:#949ba4; }
.gp-demo-plus { margin-left:auto; color:#b5bac1; font-size:19px; line-height:1; }
.gp-demo-hint { color:#a9adb5; font-size:12px; line-height:1.55; margin:10px 0; }.gp-demo a { color:#00a8fc; }
.gp-demo-room-row { display:flex; gap:8px; align-items:center; margin-top:22px; padding:8px 5px; background:#404249; border-radius:4px; }
.gp-demo-room-row strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.gp-demo-count { margin-left:auto; font-size:11px; color:#b5bac1; white-space:nowrap; }
.gp-demo-voice-members { padding:5px 0 5px 25px; display:grid; gap:6px; }.gp-demo-voice-members>div { display:flex; align-items:center; gap:7px; font-size:12px; }
.gp-demo-avatar { width:28px; height:28px; border-radius:50%; background:#5865f2; color:#fff; display:inline-grid; place-items:center; flex:0 0 28px; font-size:11px; font-weight:800; }
.gp-demo-avatar.alex { background:#9b59b6; }.gp-demo-avatar.morgan { background:#1d8d78; }.gp-demo-avatar.staff { background:#bc7e22; }
.gp-demo-crown { color:#f0b232; margin-left:auto; font-size:16px; }.gp-demo-access { display:block; margin:15px 6px 0; color:#949ba4; font-size:11px; line-height:1.5; }
.gp-demo-chat { padding:0 15px 15px; min-width:0; background:#313338; }
.gp-demo-chat-heading { display:flex; align-items:center; gap:8px; min-height:45px; border-bottom:1px solid #25262a; color:#f2f3f5; font-size:14px; margin:0 -15px 19px; padding:0 15px; flex-wrap:wrap; }
.gp-demo-chat-heading small { color:#949ba4; font-size:11px; margin-left:auto; }.gp-demo-chat-heading>span:first-child { color:#949ba4; font-size:20px; }
.gp-demo-message { display:grid; grid-template-columns:40px minmax(0,1fr); gap:13px; margin:18px 0; padding:0; min-width:0; align-items:start; }
.gp-demo-message .gp-message-body { min-width:0; }.gp-demo-bot-avatar { border-radius:50%; width:40px; height:40px; object-fit:cover; }
.gp-demo-author { display:flex; align-items:center; gap:6px; min-height:22px; flex-wrap:wrap; margin:0 0 5px; }.gp-demo-author>strong { color:#f2f3f5; font-size:14px; }
.gp-demo-app-tag { display:inline-flex; align-items:center; background:#5865f2; color:#fff; padding:1px 4px; font-size:9px; line-height:14px; font-weight:800; border-radius:3px; }
.gp-demo-author time { color:#949ba4; font-size:10px; margin-left:2px; }.gp-demo-message p { line-height:1.5; margin:7px 0; }
.gp-demo-embed { background:#2b2d31; border-left:4px solid var(--demo-embed-accent,#5865f2); border-radius:4px; padding:13px 15px; max-width:590px; box-sizing:border-box; overflow-wrap:anywhere; }
.gp-demo-embed h3 { color:#f2f3f5; font-size:16px; margin:0 0 8px; line-height:1.4; }.gp-demo-embed p { font-size:13px; }
.gp-demo-embed-field { margin-top:13px; font-size:13px; line-height:1.5; }.gp-demo-embed-field>strong { display:block; color:#f2f3f5; margin-bottom:3px; font-size:12px; }
.gp-demo-mention { background:rgba(88,101,242,.25); color:#c9cdfb; border-radius:3px; padding:0 2px; white-space:normal; }
.gp-demo-action-row { display:flex; flex-wrap:wrap; gap:7px; margin:8px 0; }
.gp-demo-select { max-width:590px; margin:8px 0; border-radius:5px; background:#1e1f22; border:1px solid #222327; }
.gp-demo-select>summary { cursor:pointer; color:#b5bac1; padding:11px 12px; font-size:13px; }.gp-demo-select>summary small { color:#a7ed78; margin-left:10px; }
.gp-demo-select form { padding:0 12px 12px; }.gp-demo-select form>div { display:grid; gap:7px; margin:6px 0 10px; }
.gp-demo-select label { display:flex; gap:9px; align-items:center; cursor:pointer; }.gp-demo-select label>input { width:17px; height:17px; accent-color:#5865f2; }
.gp-demo-action-select { display:block; max-width:590px; }.gp-demo-source { display:block; color:#969ba5; font-size:10px; line-height:1.5; margin-top:8px; }
.gp-demo-lfg { margin-top:20px; --demo-embed-accent:#5865f2; }
.gp-demo-empty { display:grid; justify-items:start; align-content:center; min-height:285px; padding:30px 20px; box-sizing:border-box; }
.gp-demo-empty>.gp-demo-voice-icon { width:40px; height:40px; background:#41434b; border-radius:50%; padding:12px; color:#dbdee1; }
.gp-demo-empty h3 { font-size:22px; max-width:320px; color:#f2f3f5; line-height:1.25; margin:18px 0 10px; }.gp-demo-empty p { color:#b5bac1; font-size:14px; line-height:1.6; max-width:440px; margin:0; }
.gp-demo-lab { background:#292b30; border:1px dashed #565963; border-radius:8px; margin:22px 0 0; padding:15px 17px; }
.gp-demo-lab>summary { cursor:pointer; color:#dce1e8; font-weight:700; font-size:13px; }.gp-demo-lab>p,.gp-demo-lab>small { color:#a9adb5; font-size:12px; line-height:1.5; }
.gp-demo-lab-grid { display:grid; grid-template-columns:minmax(140px,.65fr) minmax(240px,1.35fr); gap:25px; align-items:start; margin:16px 0 8px; }
.gp-demo-lab-grid>label { display:grid; gap:7px; color:#b5bac1; font-size:12px; font-weight:650; }.gp-demo-scenario-members { display:grid; gap:10px; }
.gp-demo-scenario-members>div { display:flex; align-items:center; gap:9px; }.gp-demo-scenario-members>div>span:not(.gp-demo-avatar) { display:grid; gap:3px; flex:1; }
.gp-demo-scenario-members strong { font-size:12px; color:#dbdee1; }.gp-demo-scenario-members small { font-size:10px; color:#949ba4; }.gp-demo-scenario-members .gp-button { min-height:30px; font-size:11px; padding:5px 9px; }
.gp-demo-feedback { padding:12px 15px; margin:0 0 16px; border:1px solid #4c567a; background:#30344c; color:#e0e3fd; border-radius:6px; line-height:1.5; }
.gp-demo-feedback p { margin:0; font-size:13px; }.gp-demo-feedback small { display:block; color:#b5bac1; font-size:10px; margin-top:3px; }
.gp-demo-feedback.error { background:#422f33; border-color:#a14850; color:#ffdade; }.gp-demo-feedback.success { background:#293c33; border-color:#38744c; color:#daf5df; }
.gp-demo-dialog { width:min(480px,calc(100% - 32px)); max-height:calc(100dvh - 44px); overflow:auto; padding:25px; background:#313338; color:#dbdee1; border:1px solid #4e5058; border-radius:8px; box-shadow:0 20px 80px #0008; box-sizing:border-box; }
.gp-demo-dialog::backdrop { background:rgba(0,0,0,.72); }.gp-demo-dialog h3 { color:#f2f3f5; font-size:20px; line-height:1.4; padding-right:24px; margin:0 0 18px; }
.gp-demo-dialog-close { position:absolute; right:13px; top:12px; border:0; background:transparent; color:#b5bac1; font:28px/1 Arial,sans-serif; cursor:pointer; width:30px; height:30px; }
.gp-demo-dialog form>label { display:grid; gap:8px; margin:16px 0; color:#f2f3f5; font-size:13px; font-weight:650; }.gp-demo-dialog textarea { resize:vertical; }
.gp-demo-dialog fieldset { border:0; margin:18px 0; padding:0; }.gp-demo-dialog legend { margin-bottom:11px; font-weight:650; font-size:13px; color:#f2f3f5; }
.gp-demo-radio { display:flex; align-items:center; gap:9px; margin:8px 0; border:1px solid #464950; padding:11px; border-radius:5px; background:#2b2d31; cursor:pointer; }.gp-demo-radio input { width:17px; height:17px; accent-color:#5865f2; }
.gp-demo-form-footer { display:flex; justify-content:flex-end; gap:9px; margin:24px -25px -25px; padding:17px 25px; background:#2b2d31; }
.gp-demo-ticket-entry { max-width:600px; box-sizing:border-box; background:#2b2d31; border:1px solid #45474f; border-radius:8px; padding:17px; }
.gp-demo .gp-v2 h3 { color:#f2f3f5; font-size:20px; margin:0 0 7px; }.gp-demo .gp-v2 p { color:#dbdee1; margin:8px 0; }.gp-demo-ticket-entry hr { border:0; border-top:1px solid #45474f; margin:16px 0; }
.gp-demo-ticket-room { background:#313338; border:1px solid #45474f; border-radius:8px; padding:0 18px 17px; margin-top:24px; }
.gp-demo-ticket-room>.gp-demo-chat-heading { margin:0 -18px 0; padding:0 18px; min-height:50px; }.gp-demo-status { color:#b5bac1; font-size:11px; background:#202226; padding:3px 7px; border-radius:4px; }
.gp-demo-private-note { color:#949ba4; font-size:11px; line-height:1.5; margin:12px 0 20px; }.gp-demo-text { white-space:pre-wrap; overflow-wrap:anywhere; }
.gp-demo-member-message>.gp-demo-avatar { width:40px; height:40px; font-size:14px; }
.gp-demo-confirm { border-left:3px solid #da373c; background:#3d3035; border-radius:4px; padding:12px 16px; margin:18px 0 18px 53px; }
.gp-demo-confirm>small { display:block; color:#b5bac1; font-size:10px; margin-bottom:6px; }.gp-demo-confirm>strong { color:#fff; }.gp-demo-confirm p { line-height:1.5; font-size:13px; }
.gp-demo-compose { display:flex; gap:10px; margin:20px 0 4px; }.gp-demo-compose .gp-field { flex:1; }
.gp-demo-policy { border:0; padding:0; margin:0; }.gp-demo-policy legend { color:#b5bac1; font-size:12px; font-weight:650; margin-bottom:10px; }
.gp-demo-check { display:flex; align-items:center; gap:10px; color:#dbdee1; font-size:12px; line-height:1.4; margin:12px 0; cursor:pointer; }.gp-demo-check input { width:17px; height:17px; accent-color:#5865f2; flex:0 0 17px; }
.gp-demo-closed { margin-top:23px; padding:22px; border:1px solid #3c6c4b; background:#29362f; border-radius:8px; }.gp-demo-closed h3 { color:#ecf6ef; margin:14px 0 8px; }.gp-demo-closed>p { color:#b9cebf; font-size:13px; line-height:1.6; }
.gp-demo-transcript { margin:18px 0; padding:14px; border:1px solid #4b5c51; border-radius:5px; background:#252d28; }.gp-demo-transcript summary { cursor:pointer; font-weight:650; }.gp-demo-transcript>p { color:#a7bdad; font-size:12px; }
.gp-demo-command-used { display:flex; align-items:center; gap:8px; color:#949ba4; font-size:12px; margin:20px 0 0; }.gp-demo-command-used strong { color:#dbdee1; }
.gp-demo-image-button { background:transparent; padding:0; border:0; margin:10px 0 0; display:block; width:min(100%,840px); border-radius:8px; overflow:hidden; cursor:zoom-in; }.gp-demo-image-button img { display:block; width:100%; height:auto; background:#202432; }
.gp-demo-sample-label { display:inline-block; color:#b9dba6; border:1px solid #576f48; border-radius:4px; background:#2e3a28; padding:4px 8px; font-size:10px; }
.gp-demo-image-dialog { width:min(1360px,calc(100% - 32px)); padding:42px 12px 12px; max-height:calc(100dvh - 28px); }.gp-demo-image-dialog img { width:100%; height:auto; display:block; }
.gp-server-chat { --gp-server-scroll-height:clamp(270px,45dvh,650px); min-width:0; border:1px solid #45474f; border-radius:10px; background:#313338; }
.gp-server-heading { display:flex; align-items:center; gap:10px; min-height:55px; padding:0 20px; border-bottom:1px solid #242529; box-shadow:0 2px 3px #0001; }
.gp-server-heading>strong { color:#f2f3f5; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gp-server-hash { color:#949ba4; font-size:27px; font-weight:500; }
.gp-server-clear { margin-left:auto; flex:none; min-height:40px; padding:6px 9px; border:0; border-radius:4px; background:transparent; color:#c8ccd2; font:inherit; font-size:12px; cursor:pointer; }
.gp-server-clear:hover:not(:disabled) { background:#41434b; color:#fff; }.gp-server-clear:disabled { opacity:.4; cursor:default; }
.gp-server-scroll { height:var(--gp-server-scroll-height); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#1e1f22 #2b2d31; padding:0 22px; }
.gp-server-scroll:focus-visible { outline:2px solid #00a8fc; outline-offset:-3px; }
.gp-server-empty { display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; box-sizing:border-box; min-height:100%; padding:28px 0; }
.gp-server-empty>span { display:grid; place-items:center; width:64px; height:64px; border-radius:50%; background:#41434b; color:#e8e9ed; font-size:43px; line-height:1; }
.gp-server-empty h3 { font-size:27px; line-height:1.2; color:#f2f3f5; margin:18px 0 10px; }
.gp-server-empty p { max-width:640px; color:#b5bac1; line-height:1.65; margin:0; }
.gp-server-composer-area { padding:14px 20px 13px; }
.gp-server-composer { position:relative; display:flex; align-items:center; gap:12px; min-width:0; border:1px solid #45474f; border-radius:8px; padding:0 7px 0 16px; background:#383a40; }
.gp-server-composer:focus-within { border-color:#729abd; box-shadow:0 0 0 1px #729abd33; }
.gp-app .gp-server-demo .gp-server-composer input[data-demo-server-input] { min-width:0; flex:1; width:100%; min-height:52px; border:0; border-radius:0; padding:10px 0; box-sizing:border-box; background:transparent; color:#f2f3f5; font:inherit; font-size:15px; caret-color:#f2f3f5; box-shadow:none; }
.gp-server-composer input::placeholder { color:#a4a8b0; }.gp-server-demo .gp-server-composer input:focus-visible { outline:none; }
.gp-server-composer input:disabled { opacity:.6; }.gp-server-composer input[aria-invalid="true"] { color:#ffb5bc; }
.gp-server-send { display:grid; place-items:center; flex:none; width:42px; height:42px; padding:0; border:0; border-radius:5px; color:#b9ef72; background:transparent; cursor:pointer; }
.gp-server-send:hover:not(:disabled) { background:#45494a; }.gp-server-send:disabled { color:#858991; opacity:.5; cursor:default; }
.gp-server-composer-hint { color:#a4a8b0; font-size:11px; line-height:1.6; margin:8px 2px 0; }
.gp-server-command-picker { position:absolute; z-index:3; bottom:calc(100% + 9px); left:-1px; right:-1px; padding:9px; border:1px solid #4d5059; border-radius:8px; background:#2b2d31; box-shadow:0 -6px 24px #0004; }
.gp-server-picker-heading { display:flex; align-items:center; gap:7px; padding:4px 8px 10px; color:#c5c9d0; font-size:12px; }.gp-server-picker-heading img { border-radius:50%; }
.gp-server-command-option { width:100%; display:flex; align-items:center; gap:12px; padding:12px; border:0; border-radius:5px; text-align:left; background:#404249; color:#f2f3f5; cursor:pointer; font:inherit; }
.gp-server-command-option:hover { background:#4a4d56; }.gp-server-command-option>span { flex:1; min-width:0; display:grid; gap:4px; }
.gp-server-command-option strong { font-size:14px; }.gp-server-command-option small { color:#c1c5cc; font-size:12px; line-height:1.45; }
.gp-server-command-option kbd { color:#c2c6ce; background:#25262b; border:1px solid #565963; border-radius:4px; padding:3px 5px; font-family:inherit; font-size:11px; line-height:1.2; }
.gp-server-exchange { margin:22px 0 26px; }
.gp-server-demo .gp-demo-command-used { position:relative; margin:0 0 4px 53px; gap:6px; font-size:12px; line-height:1.5; flex-wrap:wrap; }
.gp-server-demo .gp-demo-command-used::before { content:""; position:absolute; right:calc(100% + 8px); top:9px; width:24px; height:15px; border-top:2px solid #575963; border-left:2px solid #575963; border-radius:6px 0 0; }
.gp-server-command-avatar { display:inline-grid; place-items:center; width:17px; height:17px; border-radius:50%; background:#5865f2; color:#fff; font-size:9px; font-weight:750; }
.gp-server-command-name { padding:1px 5px; color:#a9b4ff; background:#5865f22b; border-radius:3px; font-weight:650; }
.gp-server-exchange .gp-demo-message { margin:5px 0 0; }.gp-server-exchange .gp-demo-image-button { width:min(100%,680px,calc((var(--gp-server-scroll-height) - 120px) * 1.41124)); margin:3px 0 0; border:1px solid #23252c; box-sizing:border-box; }
.gp-server-thinking { display:flex; align-items:center; gap:9px; color:#b5bac1; font-size:13px; }
.gp-server-thinking>span { display:flex; gap:3px; }.gp-server-thinking i { width:5px; height:5px; border-radius:50%; background:#b5bac1; animation:gp-server-thinking 1.2s infinite ease-in-out; }
.gp-server-thinking i:nth-child(2) { animation-delay:.15s; }.gp-server-thinking i:nth-child(3) { animation-delay:.3s; }
.gp-server-reply-error { color:#f4bbc0; font-size:13px; }
.gp-server-disclosure { display:flex; align-items:center; flex-wrap:wrap; gap:10px 18px; margin:13px 0 0; }.gp-server-disclosure>small { color:#a9adb5; font-size:11px; }
@keyframes gp-server-thinking { 0%,70%,100% { opacity:.4; transform:translateY(0); } 35% { opacity:1; transform:translateY(-3px); } }
@media(prefers-reduced-motion:reduce) { .gp-server-thinking i { animation:none; opacity:.7; } }
@media(max-width:480px) { .gp-server-chat { --gp-server-scroll-height:330px; }.gp-server-heading { padding:0 12px; gap:7px; }.gp-server-heading>strong { font-size:12px; }.gp-server-clear { padding:6px; font-size:11px; }.gp-server-scroll { padding:0 12px; }.gp-server-empty { padding:22px 0; }.gp-server-empty>span { width:50px; height:50px; font-size:34px; }.gp-server-empty h3 { font-size:22px; }.gp-server-composer-area { padding:10px 11px; }.gp-server-composer { gap:8px; padding-left:11px; }.gp-app .gp-server-demo .gp-server-composer input[data-demo-server-input] { font-size:16px; }.gp-server-send { width:34px; }.gp-server-composer-hint { font-size:10px; }.gp-server-command-option { padding:10px; }.gp-server-demo .gp-demo-command-used { margin-left:39px; font-size:11px; }.gp-server-demo .gp-demo-command-used::before { width:16px; }.gp-server-command-picker { padding:6px; } }
.gp-demo-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }.gp-demo[aria-busy="true"] { cursor:progress; }
@media(max-width:1100px) { .gp-demo-voice-layout { grid-template-columns:190px minmax(0,1fr); }.gp-demo-chat { padding-right:12px; padding-left:12px; }.gp-demo-chat-heading { margin-left:-12px; margin-right:-12px; padding-left:12px; padding-right:12px; }.gp-demo-embed { padding:12px; } }
@media(max-width:780px) { .gp-demo-voice-layout { grid-template-columns:1fr; }.gp-demo-voice-tree { border-bottom:1px solid #41434a; }.gp-demo-voice-tree>.gp-demo-hint { max-width:570px; }.gp-demo-voice-members { display:flex; flex-wrap:wrap; gap:12px; }.gp-demo-room-row { margin-top:13px; }.gp-demo-access { margin-top:8px; }.gp-demo-lab-grid { grid-template-columns:1fr; gap:18px; }.gp-demo-empty { min-height:200px; padding:24px 12px; }.gp-demo-top { align-items:flex-start; } }
@media(max-width:480px) { .gp-demo { font-size:13px; }.gp-demo-top { padding:12px; gap:10px; }.gp-demo-top .gp-button { font-size:11px; white-space:nowrap; padding:7px 9px; }.gp-demo-message { grid-template-columns:30px minmax(0,1fr); gap:9px; }.gp-demo-bot-avatar,.gp-demo-member-message>.gp-demo-avatar { width:30px; height:30px; }.gp-demo-author time { display:none; }.gp-demo .gp-button { font-size:12px; padding:7px 10px; }.gp-demo-embed { padding:11px; }.gp-demo-embed p,.gp-demo-embed-field { font-size:12px; }.gp-demo-confirm { margin-left:0; }.gp-demo-chat-heading small { display:none; }.gp-demo-compose { flex-wrap:wrap; }.gp-demo-compose .gp-field { flex-basis:100%; }.gp-demo-compose .gp-button { margin-left:auto; }.gp-demo-ticket-room { padding-left:12px; padding-right:12px; }.gp-demo-ticket-room>.gp-demo-chat-heading { margin-left:-12px; margin-right:-12px; padding-left:12px; padding-right:12px; }.gp-demo-dialog { padding:20px; }.gp-demo-form-footer { margin:24px -20px -20px; padding:16px 20px; } }
