:root{--ink: #242f54;--ink-soft: #5e638c;--ink-faint: #8a90a8;--brand: #4b73ff;--brand-strong: #315ee8;--brand-pressed: #2a4fd8;--brand-tint: #eaf0ff;--page: #f5f8ff;--surface: #ffffff;--surface-sunken: #eef2fb;--line: #e7edfb;--line-strong: #d9e1f5;--input-border: #b4bedc;--danger: #d93848;--console-bg: #171f3b;--console-tray: #121933;--console-line: rgba(255, 255, 255, .09);--console-text: #dbe1f8;--console-muted: #8d96c0;--console-accent: #8ea6ff;--font-sans: "Ubuntu", system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "Ubuntu Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--radius-panel: 16px;--radius-control: 10px;--focus-ring: 0 0 0 4px rgba(75, 115, 255, .18);--bs-body-font-family: var(--font-sans);--bs-body-font-size: .9375rem;--bs-body-line-height: 1.5;--bs-body-color: var(--ink);--bs-body-bg: var(--page);--bs-secondary-color: var(--ink-soft);--bs-border-color: var(--line);--bs-link-color: var(--brand-strong);--bs-link-color-rgb: 49, 94, 232;--bs-link-hover-color: var(--brand-pressed);--bs-link-hover-color-rgb: 42, 79, 216;--bs-primary: var(--brand);--bs-primary-rgb: 75, 115, 255;--bs-code-color: var(--ink)}body{font-family:var(--font-sans);background-color:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:var(--font-mono);font-size:1em}.fill-current{fill:currentColor}.btn{--bs-btn-padding-y: .5rem;--bs-btn-padding-x: 1rem;--bs-btn-font-size: .9375rem;--bs-btn-font-weight: 500;--bs-btn-border-radius: var(--radius-control);--bs-btn-focus-box-shadow: var(--focus-ring);display:inline-flex;align-items:center;justify-content:center;gap:.5rem}.btn-primary{--bs-btn-bg: var(--brand);--bs-btn-border-color: var(--brand);--bs-btn-hover-bg: var(--brand-strong);--bs-btn-hover-border-color: var(--brand-strong);--bs-btn-active-bg: var(--brand-pressed);--bs-btn-active-border-color: var(--brand-pressed);--bs-btn-disabled-bg: var(--brand);--bs-btn-disabled-border-color: var(--brand);--bs-btn-disabled-opacity: .75}.btn-ghost{--bs-btn-color: var(--ink-soft);--bs-btn-hover-color: var(--ink);--bs-btn-hover-bg: var(--surface-sunken);--bs-btn-active-color: var(--ink);--bs-btn-active-bg: var(--line-strong);--bs-btn-disabled-color: var(--ink-faint);--bs-btn-disabled-opacity: .6;--bs-btn-border-color: transparent;--bs-btn-hover-border-color: transparent;--bs-btn-active-border-color: transparent;--bs-btn-disabled-border-color: transparent}.btn-sm-ghost{--bs-btn-padding-y: .3rem;--bs-btn-padding-x: .65rem;--bs-btn-font-size: .875rem;gap:.375rem}.app-header{height:64px;background-color:var(--surface);border-bottom:1px solid var(--line)}.app-header-logo{display:block;height:20px}@media(max-width:575.98px){.app-header-logo{height:15px}.btn-header{--bs-btn-padding-x: .625rem}}.app-header-tag{margin:0 0 0 .25rem;padding:.25rem .5rem;border-radius:6px;background-color:var(--brand-tint);font-family:var(--font-mono);font-size:.9375rem;font-weight:700;line-height:1.1;color:var(--brand-pressed)}.playground-container{padding:1rem .75rem}@media(min-width:576px){.playground-container{padding:1.25rem 1.5rem}}@media(min-width:992px){.playground-container{height:calc(100vh - 64px);overflow:hidden}.panel-height{height:100%}}.panel{background-color:var(--surface);border:1px solid var(--line);border-radius:var(--radius-panel);box-shadow:0 1px 2px #242f540a,0 12px 32px -16px #242f5424;min-height:0}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid var(--line)}.panel-title{margin:0;font-family:var(--font-mono);font-size:1.25rem;font-weight:700;color:var(--ink)}.panel-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:1.5rem}.panel-footer{padding:1rem 1.5rem;border-top:1px solid var(--line)}@media(max-width:575.98px){.panel-header,.panel-body,.panel-footer{padding-left:1.125rem;padding-right:1.125rem}}.field{margin-bottom:1.25rem}.form-label{display:block;margin-bottom:.375rem;font-size:.875rem;font-weight:500;color:var(--ink)}.form-text{margin-top:.375rem;font-size:.84375rem;line-height:1.45;color:var(--ink-soft)}.form-text code,.section-intro code{padding:.05em .3em;border-radius:4px;background-color:var(--surface-sunken);font-size:.95em}.field-error{margin-top:.375rem;font-size:.84375rem;font-weight:500;color:var(--danger)}.field-note{margin-top:-.75rem;margin-bottom:1.25rem}.section-intro{margin-top:0;margin-bottom:1rem}.form-control,.form-select{min-height:44px;padding:.5625rem .875rem;font-size:.9375rem;color:var(--ink);background-color:var(--surface);border:1px solid var(--input-border);border-radius:var(--radius-control);transition:border-color .15s ease,box-shadow .15s ease}.form-select{padding-right:2.5rem}.form-control::placeholder{color:#9aa1bf}.form-control:hover,.form-select:hover{border-color:#98a4c9}.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:var(--focus-ring)}.form-control.is-invalid,.form-control.is-invalid:focus{border-color:var(--danger);background-image:none;padding-right:.875rem}.form-control.is-invalid:focus{box-shadow:0 0 0 4px #d9384826}input[type=number]{appearance:textfield;-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-affix{position:relative}.input-affix>.form-control{padding-right:2.75rem}.input-affix-unit{position:absolute;top:50%;right:.875rem;transform:translateY(-50%);font-size:.875rem;color:var(--ink-faint);pointer-events:none}.input-affix-button{position:absolute;top:50%;right:.375rem;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink-soft)}.input-affix-button:hover{background-color:var(--surface-sunken);color:var(--ink)}.input-affix-button:focus-visible{outline:none;box-shadow:var(--focus-ring)}.api-key-box{margin-bottom:1.5rem;padding:1rem 1rem .125rem;background-color:var(--page);border:1px solid var(--line);border-radius:12px}.api-key-box .field{margin-bottom:.875rem}.segmented{display:flex;gap:4px;padding:4px;background-color:var(--surface-sunken);border-radius:12px}.segmented-option{flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:36px;padding:0 .75rem;border:0;border-radius:8px;background:transparent;font-size:.9375rem;font-weight:500;color:var(--ink-soft);white-space:nowrap;transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}.segmented-option:hover{color:var(--ink)}.segmented-option[aria-pressed=true]{background-color:var(--surface);color:var(--ink);box-shadow:0 1px 2px #242f5424,0 0 0 1px #242f540a}.segmented-option[aria-pressed=true] svg{color:var(--brand)}.segmented-option:focus-visible{outline:none;box-shadow:var(--focus-ring)}.chip-group{display:flex;flex-wrap:wrap;gap:.5rem}.toggle-chip{min-height:36px;padding:0 .875rem;border:1px solid var(--input-border);border-radius:999px;background-color:var(--surface);font-size:.875rem;font-weight:500;color:var(--ink-soft);transition:background-color .15s ease,color .15s ease,border-color .15s ease}.toggle-chip:hover{border-color:var(--brand);color:var(--ink)}.toggle-chip[aria-pressed=true]{background-color:var(--brand-tint);border-color:var(--brand);color:var(--brand-pressed)}.toggle-chip:focus-visible{outline:none;box-shadow:var(--focus-ring)}.form-section{border-top:1px solid var(--line)}.form-section:last-child{border-bottom:1px solid var(--line)}.form-section-heading{margin:0;font-size:1rem}.form-section-toggle{display:flex;align-items:center;gap:.75rem;width:100%;padding:1rem .25rem;border:0;border-radius:8px;background:transparent;text-align:left;font-size:1rem;font-weight:500;color:var(--ink)}.form-section-toggle:focus-visible{outline:none;box-shadow:var(--focus-ring)}.form-section-icon{display:inline-flex;color:var(--brand)}.form-section-title{flex-shrink:0}.form-section-summary{min-width:0;margin-left:auto;padding:.125rem .625rem;overflow:hidden;border-radius:999px;background-color:var(--brand-tint);font-size:.8125rem;color:var(--brand-pressed);text-overflow:ellipsis;white-space:nowrap}.form-section-chevron{flex-shrink:0;margin-left:auto;color:var(--ink-faint);transition:transform .2s ease}.form-section-summary+.form-section-chevron{margin-left:0}.form-section.is-expanded .form-section-chevron{transform:rotate(180deg)}.form-section-body{padding:.25rem .25rem .5rem}.btn-generate{--bs-btn-padding-y: .75rem;--bs-btn-font-size: 1rem;position:relative;width:100%;min-height:52px;gap:.625rem}.btn-kbd{position:absolute;right:.875rem;top:50%;transform:translateY(-50%);padding:.125rem .5rem;border-radius:6px;background-color:#ffffff2e;font-family:var(--font-mono);font-size:.875rem;color:#fff;box-shadow:none}.console{display:flex;flex-direction:column;min-height:0;overflow:hidden;background-color:var(--console-bg);border-radius:var(--radius-panel);box-shadow:0 1px 2px #171f3b33,0 16px 40px -20px #171f3b8c;color:var(--console-text)}.console-code{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}.console-bar,.console-tabs,.console-note{flex-shrink:0}.console-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.875rem 1.25rem}.console-title{margin:0;font-family:var(--font-mono);font-size:1.25rem;font-weight:700;color:#fff}.console-tabs{display:flex;gap:.25rem;padding:0 .75rem;overflow-x:auto;border-bottom:1px solid var(--console-line);scrollbar-width:thin}.console-tab{flex-shrink:0;padding:.5rem .75rem .625rem;border:0;border-bottom:2px solid transparent;background:transparent;font-size:.9375rem;font-weight:500;color:var(--console-muted);transition:color .15s ease,border-color .15s ease}.console-tab:hover{color:var(--console-text)}.console-tab[aria-selected=true]{color:#fff;border-bottom-color:var(--console-accent)}.console-tab:focus-visible{outline:2px solid var(--console-accent);outline-offset:-2px;border-radius:6px 6px 0 0}.console-code-body{flex:1 1 auto;min-height:0;overflow:auto}.console-code-body:focus-visible,.response-json:focus-visible{outline:2px solid var(--console-accent);outline-offset:-2px}.console-pre{margin:0;padding:1.125rem 1.25rem 1.25rem;font-family:var(--font-mono);font-size:.96875rem;line-height:1.6;white-space:pre;tab-size:4;color:var(--console-text)}.console-note{margin:0;padding:.625rem 1.25rem;border-top:1px solid var(--console-line);font-size:.8125rem;color:var(--console-muted)}.console-note code{color:var(--console-text)}.btn-console{--bs-btn-padding-y: .375rem;--bs-btn-padding-x: .875rem;--bs-btn-font-size: .875rem;--bs-btn-color: var(--console-text);--bs-btn-bg: rgba(255, 255, 255, .06);--bs-btn-border-color: rgba(255, 255, 255, .14);--bs-btn-hover-color: #fff;--bs-btn-hover-bg: rgba(255, 255, 255, .12);--bs-btn-hover-border-color: rgba(255, 255, 255, .22);--bs-btn-active-color: #fff;--bs-btn-active-bg: rgba(255, 255, 255, .16);--bs-btn-active-border-color: rgba(255, 255, 255, .22);--bs-btn-focus-box-shadow: 0 0 0 3px rgba(142, 166, 255, .45)}.btn-console.is-done{--bs-btn-color: #7ee2a8;--bs-btn-hover-color: #7ee2a8;--bs-btn-border-color: rgba(126, 226, 168, .4)}.btn-console-primary{--bs-btn-padding-y: .375rem;--bs-btn-padding-x: .875rem;--bs-btn-font-size: .875rem;--bs-btn-focus-box-shadow: 0 0 0 3px rgba(142, 166, 255, .45)}.console-response{display:flex;flex-direction:column;flex:0 0 auto;max-height:45%;min-height:0;background-color:var(--console-tray);border-top:1px solid var(--console-line)}.response-meta{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.375rem}.response-chip{display:inline-flex;align-items:center;gap:.375rem;padding:.125rem .625rem;border-radius:999px;background-color:#ffffff12;font-family:var(--font-mono);font-size:.9375rem;color:var(--console-text);white-space:nowrap}.response-chip-dot{width:7px;height:7px;border-radius:50%;background-color:currentColor}.response-chip-ok{color:#7ee2a8}.response-chip-info{color:var(--console-accent)}.response-chip-error{color:#ff9a9a}.response-body{min-height:0;overflow-y:auto;padding:0 1.25rem 1.125rem}.response-message{display:flex;align-items:center;gap:.625rem;margin:0;font-size:.9375rem;color:var(--console-text)}.response-message-muted{color:var(--console-muted)}.response-message-error{align-items:flex-start;color:#ffb4b4}.response-message-error svg{margin-top:.125rem}.response-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.875rem}.response-json{margin-top:.75rem;padding:.875rem 1rem;overflow-x:auto;border-radius:10px;background-color:#00000038;font-size:.875rem}@media(max-width:991.98px){.console-code-body{max-height:480px}.console-response{max-height:none}.response-json{max-height:320px}}pre[class*=language-]{margin:0!important;padding:0!important;background:transparent!important;text-shadow:none!important;box-shadow:none!important;border:none!important}code[class*=language-]{font-family:inherit!important}.console pre code[class*=language-]{color:var(--console-text);text-shadow:none;background:none}.console .token{background:none!important}.console .token.comment,.console .token.prolog,.console .token.doctype,.console .token.cdata{color:#6c77a6;font-style:italic}.console .token.punctuation{color:#97a0c8}.console .token.property,.console .token.tag,.console .token.constant,.console .token.symbol,.console .token.attr-name{color:#8fd3ff}.console .token.boolean,.console .token.number{color:#ffb38a}.console .token.string,.console .token.char,.console .token.attr-value,.console .token.inserted{color:#a6e3bf}.console .token.operator,.console .token.entity,.console .token.url{color:#c7cdea}.console .token.keyword,.console .token.atrule,.console .token.selector,.console .token.builtin{color:#a9b9ff}.console .token.function,.console .token.class-name{color:#ffd580}.console .token.variable,.console .token.regex,.console .token.important{color:#ffb38a}.code-editor-wrapper{position:relative;border:1px solid var(--input-border);border-radius:var(--radius-control);background-color:var(--surface);overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease}.code-editor-wrapper:hover{border-color:#98a4c9}.code-editor-wrapper:focus-within{border-color:var(--brand);box-shadow:var(--focus-ring)}.code-editor-wrapper.is-invalid{border-color:var(--danger)}.line-numbers{position:absolute;top:0;left:0;width:40px;height:100%;background-color:var(--page);border-right:1px solid var(--line);color:var(--ink-faint);font-family:var(--font-mono)!important;font-size:14px!important;line-height:1.5!important;text-align:right;padding:10px 8px 10px 0;box-sizing:border-box;overflow:hidden;z-index:3;-webkit-user-select:none;user-select:none;white-space:pre!important}.code-editor-textarea,.code-editor-pre{margin:0!important;padding:10px 12px 10px 52px!important;border:0!important;width:100%!important;height:100%!important;box-sizing:border-box!important;font-family:var(--font-mono)!important;font-size:14px!important;line-height:1.5!important;tab-size:2!important;white-space:pre!important;word-break:keep-all!important}.code-editor-textarea{position:absolute;top:0;left:0;z-index:2;color:transparent!important;background:transparent!important;caret-color:var(--ink);resize:none;outline:none;overflow:auto!important}.code-editor-textarea::placeholder{color:#9aa1bf}.code-editor-pre{position:absolute;top:0;left:0;z-index:1;pointer-events:none;background:transparent!important;overflow:hidden!important}.code-editor-pre code[class*=language-]{color:var(--ink);text-shadow:none}.custom-scrollbar::-webkit-scrollbar{width:8px;height:8px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:4px}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--input-border)}.custom-scrollbar-dark::-webkit-scrollbar-thumb{background:#ffffff29}.custom-scrollbar-dark::-webkit-scrollbar-thumb:hover{background:#ffffff47}.custom-scrollbar-dark::-webkit-scrollbar-corner{background:transparent}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important}}
