:root{--bg: #f3f4f6;--panel: #ffffff;--muted: #6b7280;--text: #111827;--border: #e5e7eb;--brand: #f59e0b;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}html,body{height:100%}body{margin:0;min-width:320px;min-height:100vh;background:var(--bg);color:var(--text)}h1{font-size:var(--text-4xl);line-height:1.2;font-weight:700;margin-bottom:1rem}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.card{padding:2em}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:left}.field{display:flex;flex-direction:row;align-items:center;gap:12px;margin-bottom:16px;position:relative}.field .error{position:absolute;top:100%;left:132px;margin-top:4px}.label{font-weight:500;color:#374151;font-size:var(--text-base);min-width:120px;flex-shrink:0}.hint{font-size:var(--text-xs);color:var(--muted);margin-top:4px}.error{color:#b91c1c;font-size:var(--text-xs)}.input{padding:12px 16px;border:1px solid #d1d5db;border-radius:4px;flex:1;font-size:var(--text-base);background:#fff;transition:border-color .2s;min-height:44px;box-sizing:border-box}.input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}select.input{appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:40px}.row{display:flex;gap:12px;align-items:center}.row-center{display:flex;justify-content:center;margin-top:24px;gap:24px;align-items:center}.btn{padding:12px 24px;border-radius:4px;background:#3b82f6;color:#fff;border:none;cursor:pointer;font-size:var(--text-base);font-weight:500;min-width:100px;transition:background-color .2s}.btn:hover{background:#2563eb}.btn.secondary{background:#fff;color:#374151;border:1px solid #d1d5db}.btn.secondary:hover{background:#f9fafb}.btn.disabled{opacity:.5;cursor:not-allowed}.codebox{background:#f3f4f6;color:#374151;padding:12px;border-radius:8px;overflow:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);white-space:pre-wrap;word-break:break-word}.token-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.token-columns .codebox{height:240px}.token-vertical{display:flex;flex-direction:column;gap:8px}.token-vertical .codebox{max-height:160px}.accordion{border:1px solid var(--border);border-radius:8px;background:var(--panel)}.accordion+.accordion{margin-top:10px}.accordion summary{list-style:none;cursor:pointer;padding:10px 12px;font-weight:600;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border)}.accordion[open] summary{background:#f9fafb}.accordion summary::-webkit-details-marker{display:none}.accordion .accordion-body{padding:12px}.badge{font-size:12px;color:#6b7280;margin-left:auto}.divider{height:1px;background:linear-gradient(to right,#0000000f,#0000000a 40%,#00000005 60%,#0000);border:none;margin:16px 0}.tooltip{position:relative;display:inline-block;flex-shrink:0}.tooltip-icon{width:16px;height:16px;border-radius:50%;background:#6b7280;color:#fff;display:flex;align-items:center;justify-content:center;font-size:10px;cursor:help}.tooltip-content{position:absolute;bottom:125%;left:50%;transform:translate(-50%);background:#374151;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;white-space:nowrap;z-index:10;opacity:0;pointer-events:none;transition:opacity .2s}.tooltip:hover .tooltip-content{opacity:1}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--border);margin:12px 0}.tab{padding:8px 12px;border:1px solid var(--border);border-bottom:none;border-top-left-radius:8px;border-top-right-radius:8px;background:#f9fafb;cursor:pointer}.tab.active{background:#fff;font-weight:600}.tab.disabled{opacity:.5;cursor:not-allowed}.panel{border:1px solid var(--border);border-radius:0 8px 8px;padding:12px;background:#fff;overflow:hidden}.split{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.textarea{width:100%;min-height:240px;border:1px solid var(--border);border-radius:8px;padding:12px;background:#f3f4f6;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);overflow:auto;white-space:pre-wrap;word-break:break-all}.step3-container{display:flex;flex-direction:column;height:100%}.form-section{margin-bottom:16px}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:16px}.vertical-layout,.column{display:flex;flex-direction:column;gap:16px}.field{margin-bottom:16px}.checkbox-options{margin:24px 0}.checkbox-field{margin-bottom:16px}.checkbox-row{display:flex;align-items:center;gap:8px}.checkbox-label{margin:0;font-size:var(--text-base);color:#374151;font-weight:500}.checkbox-label.disabled{cursor:not-allowed;color:#9ca3af;opacity:.6}.checkbox-input{flex:1;margin-left:8px}.request-builder{flex:1;min-height:200px}.textarea{min-height:180px;max-height:300px}.auth-url-code{background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;padding:16px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-xl);line-height:1.5;color:#495057;white-space:pre-wrap;word-break:break-all;min-height:120px;overflow:auto;text-align:left}.scope-suggestions{margin-bottom:8px}.suggestion-label{font-size:12px;color:#6b7280;margin-bottom:6px;display:block}.suggestion-chips{display:flex;flex-wrap:wrap;gap:4px}.suggestion-chip{padding:3px 6px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:3px;font-size:11px;color:#374151;cursor:pointer;transition:all .2s}.suggestion-chip:hover{background:#e5e7eb;border-color:#9ca3af}.tag-input-container{display:flex;flex-wrap:wrap;align-items:center;gap:1px;padding:12px 16px;border:1px solid #d1d5db;border-radius:4px;background:#fff;position:relative;min-height:44px;box-sizing:border-box}.tag-input-container.with-suggestions{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.tag{display:inline-flex;align-items:center;gap:2px;padding:2px 4px;background:#f3f4f6;border-radius:2px;font-size:11px;color:#374151;transition:all .2s}.tag:hover{background:#e5e7eb}.tag-close{cursor:pointer;font-weight:700;color:#6b7280;font-size:10px;line-height:1;padding:1px;border-radius:1px;transition:all .2s}.tag-close:hover{color:#374151;background:#d1d5db}.tag-close:focus{outline:2px solid #3b82f6;outline-offset:1px}.tag-input{border:none;outline:none;background:transparent;flex:1;min-width:120px;font-size:14px}.tag-input::placeholder{color:#9ca3af}.suggestions-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d1d5db;border-radius:4px;box-shadow:0 4px 6px -1px #0000001a;z-index:50;max-height:200px;overflow-y:auto}.suggestion-item{padding:8px 12px;cursor:pointer;font-size:14px;color:#374151;transition:background-color .2s}.suggestion-item:hover,.suggestion-item.selected{background:#f3f4f6}.suggestion-item.selected{background:#e5e7eb}.input.error{border-color:#dc2626;box-shadow:0 0 0 3px #dc26261a}.error{color:#dc2626;font-size:12px;margin-top:4px}.checkbox-options{display:flex;gap:24px;margin-top:8px;flex-wrap:wrap}.checkbox-options .checkbox-field{margin-bottom:0}.pkce-explanation{margin-top:16px;padding:16px}.pkce-details{display:flex;flex-direction:column;gap:12px}.pkce-step{display:flex;flex-direction:column;gap:6px}.pkce-step strong{color:#374151;font-size:13px}.code-snippet{background:#1f2937;color:#f9fafb;padding:8px 12px;border-radius:4px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-sm);word-break:break-all}.exchange-btn{border:1px solid #3b82f6;background:#fff;color:#3b82f6;padding:12px 24px;font-weight:600}.exchange-btn:hover{background:#3b82f6;color:#fff}.token-section{margin-top:24px}.token-selection{display:flex;align-items:center;gap:12px;margin-bottom:16px}.token-label{font-weight:500;color:#374151;font-size:14px}.token-btn{padding:8px 16px;border:1px solid #000;border-radius:4px;background:#fff;color:#000;font-size:14px;cursor:pointer;transition:all .2s}.token-btn.active{border:2px solid #3b82f6;background:#f8fafc}.token-btn:hover:not(.disabled){background:#f3f4f6}.token-btn.disabled{opacity:.5;cursor:not-allowed}.decoded-token-parts{display:flex;flex-direction:column;gap:16px}.part-content .codebox{margin:0;padding:16px;background:transparent;border:none;min-height:80px;font-size:var(--text-xs);line-height:1.4}.token-part:nth-child(2) .part-content{min-height:200px}.token-part:nth-child(2) .part-content .codebox{min-height:200px}.part-content .vue-json-pretty{background:transparent!important;padding:16px;font-size:var(--text-xs);line-height:1.4;min-height:80px}.part-content .vue-json-pretty .vjs-tree,.part-content .vue-json-pretty .vjs-tree .vjs-tree-node{background:transparent!important}.no-data{padding:16px;color:#666;font-style:italic;text-align:left;min-height:80px;display:flex;align-items:center;justify-content:flex-start}.redirect-section{margin-bottom:24px}.redirect-label{margin-bottom:12px;font-size:var(--text-sm);color:#374151;line-height:1.5;text-align:left}.redirect-url-box{background:#f5f5f5;border:1px solid #e5e5e5;border-radius:6px;padding:16px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);color:#374151;word-break:break-all;line-height:1.5;text-align:left}.token-exchange-section{margin-bottom:24px}.token-exchange-label{margin-bottom:12px;font-size:var(--text-sm);color:#374151;line-height:1.5;text-align:left}.code-highlight{color:#dc2626;font-weight:600}.code-verifier{background-color:#fef3c7;color:#d97706;padding:2px 4px;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.9em;font-weight:600}.code-challenge{background-color:#dbeafe;color:#2563eb;padding:2px 4px;border-radius:3px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:.9em;font-weight:600}.exchange-btn{background:#60a5fa;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}.exchange-btn:hover{background:#3b82f6}.code-highlight-bg{background:#fbbf24;padding:2px 4px;border-radius:3px;font-weight:500}.token-response-section{margin-bottom:32px}.section-title{font-size:var(--text-base);font-weight:600;color:#111827;margin-bottom:8px}.response-box{background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;overflow:hidden}.response-header{display:flex;align-items:flex-start;position:relative}.json-response{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);color:#495057;white-space:pre-wrap;word-break:break-word;margin:0;line-height:1.4;padding:16px;flex:1;text-align:left}.copy-icon-btn{position:absolute;top:12px;right:12px;background:transparent;border:none;font-size:var(--text-base);cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s}.copy-icon-btn:hover{background:#0000001a}.paragraph{font-size:var(--text-lg);color:#374151;line-height:1.6;margin-bottom:16px;text-align:left}.paragraph:last-child{margin-bottom:0}.paragraph-large{font-size:var(--text-lg);color:#374151;line-height:1.6;margin-bottom:20px;text-align:left}.paragraph-small{font-size:var(--text-sm);color:#6b7280;line-height:1.5;margin-bottom:12px;text-align:left}.pkce-explanation{margin:16px 0}.intro-description,.decode-explanation,.nonce-explanation,.section-description{font-size:var(--text-base);color:#374151;line-height:1.6;margin-bottom:16px;text-align:left}.intro-description:last-child,.decode-explanation:last-child,.nonce-explanation:last-child,.section-description:last-child{margin-bottom:0}.token-type-highlight{background-color:#fef3c7;color:#92400e;padding:2px 6px;border-radius:4px;font-weight:600;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.nonce-explanation{margin-top:16px;font-size:var(--text-base);color:#374151;line-height:1.5}.nonce-value{background-color:#f1f5f9;color:#1e293b;padding:2px 6px;border-radius:4px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-sm);font-weight:500}.token-response-container{margin-bottom:16px}.decoded-tokens-container{width:100%}.decode-description{font-size:var(--text-sm);color:#374151;margin-bottom:16px;line-height:1.5;text-align:left}.token-buttons{display:flex;gap:12px;margin-bottom:24px}.token-btn:disabled{background:#9ca3af;cursor:not-allowed}.json-response-container{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);color:#495057;line-height:1.5;padding:16px;background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;position:relative}.json-line{display:flex;align-items:flex-start;gap:12px;margin-bottom:4px;word-break:break-all;flex-wrap:wrap}.json-line span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.decode-btn{background:none;border:none;color:#10b981;cursor:pointer;font-size:var(--text-xs);padding:2px 4px;transition:all .2s;white-space:nowrap;flex-shrink:0;margin-left:auto;font-weight:400}.decode-btn:hover{color:#059669}.decode-btn-inline{background:none;border:none;color:#10b981;cursor:pointer;font-size:var(--text-xs);padding:0;margin:0;transition:all .2s;white-space:nowrap;font-weight:400;display:inline}.decode-btn-inline:hover{color:#059669}.copy-btn-inline{background:none;border:none;color:#10b981;cursor:pointer;font-size:var(--text-xs);padding:0;margin-left:4px;text-decoration:underline;font-family:inherit}.copy-btn-inline:hover{color:#059669}.response-box{background:transparent;border:none;border-radius:6px;overflow:visible}.response-header{position:relative}.copy-icon-btn{position:absolute;top:8px;right:8px;background:#ffffffe6;border:1px solid #e5e5e5;font-size:var(--text-base);cursor:pointer;padding:6px;border-radius:4px;transition:background-color .2s;z-index:10}.copy-icon-btn:hover{background:#fff}.decoding-section{margin-bottom:24px}.decoding-title{font-size:var(--text-base);font-weight:600;color:#111827;margin-bottom:12px}.token-buttons{display:flex;gap:8px}.token-btn{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;background:#3b82f6;color:#fff}.token-btn.active{background:#1d4ed8}.token-btn:not(.active){background:#60a5fa}.token-btn:hover:not(:disabled){background:#2563eb}.token-btn:disabled{opacity:.5;cursor:not-allowed}.decoded-parts{display:flex;flex-direction:column;gap:16px}.token-part{margin-bottom:4px}.part-header{display:flex;justify-content:space-between;align-items:center;padding:4px 0}.part-label{font-size:14px;font-weight:500;color:#374151}.part-content{padding:8px 0}.json-display{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:var(--text-lg);line-height:1.4;color:#374151;margin:0;white-space:pre;background:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;padding:16px;text-align:left}.json-display .json-key{color:#dc2626}.json-display .json-string,.json-display .json-number,.json-display .json-boolean{color:#16a34a}.success-section{margin-top:24px;padding:16px;background:#d1fae5;border:1px solid #10b981;border-radius:6px;text-align:left}.success-message{color:#065f46;font-weight:500;font-size:14px}.error-section{background-color:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px;margin:16px 0;display:flex;align-items:center;justify-content:space-between}.error-message-container{display:flex;align-items:center;color:#dc2626;font-size:14px;font-weight:500;flex:1}.warning-icon{font-size:16px;margin-right:8px;color:#dc2626}.btn-close{background:none;border:none;font-size:18px;color:#6b7280;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s;margin-left:12px}.btn-close:hover{background-color:#f3f4f6;color:#374151}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.step5-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px;gap:16px}.step5-header .intro-description{margin-bottom:0;flex:1}.restart-btn{background:#3b82f6;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease;flex-shrink:0}.restart-btn:hover{background:#2563eb}.step-subtext[data-v-a558d727]{font-size:var(--text-sm);color:#6b7280;margin-top:2px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.subtext-item[data-v-a558d727]{margin:0}[data-v-96a4414d]{box-sizing:border-box}body[data-v-96a4414d]{background:#f3f4f6}a[data-v-96a4414d]{color:inherit;text-decoration:none}.tooltip[data-v-7bac0367]{position:relative;display:inline-block;margin-left:4px}.tooltip-icon[data-v-7bac0367]{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;background-color:#6b7280;color:#fff;border-radius:50%;font-size:10px;font-weight:700;cursor:help}.tooltip-content[data-v-7bac0367]{position:absolute;bottom:125%;left:50%;transform:translate(-50%);background-color:#1f2937;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:1000;max-width:300px;white-space:normal;text-align:center}.tooltip-content[data-v-7bac0367]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#1f2937}.tooltip:hover .tooltip-content[data-v-7bac0367]{opacity:1;visibility:visible}.field[data-v-1af93154]{display:flex;flex-direction:row;align-items:center;gap:12px;margin-bottom:16px;position:relative}.label[data-v-1af93154]{font-weight:500;color:#374151;font-size:var(--text-base);min-width:120px;flex-shrink:0;display:flex;align-items:center;gap:4px}.input[data-v-1af93154]{padding:12px 16px;border:1px solid #d1d5db;border-radius:4px;flex:1;font-size:var(--text-base);background:#fff;transition:border-color .2s;min-height:44px;box-sizing:border-box}.input[data-v-1af93154]:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.input.error[data-v-1af93154]{border-color:#dc2626}.input[data-v-1af93154]:disabled{background-color:#f9fafb;color:#6b7280;cursor:not-allowed}.error[data-v-1af93154]{color:#dc2626;font-size:var(--text-xs);position:absolute;top:100%;left:132px;margin-top:4px}.button-group[data-v-d13f57f0]{display:flex;gap:12px;align-items:center}.button-group.left[data-v-d13f57f0]{justify-content:flex-start}.button-group.center[data-v-d13f57f0]{justify-content:center}.button-group.right[data-v-d13f57f0]{justify-content:flex-end}.btn[data-v-d13f57f0]{padding:12px 24px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;min-width:80px}.btn.primary[data-v-d13f57f0]{background-color:#3b82f6;color:#fff}.btn.primary[data-v-d13f57f0]:hover:not(.disabled){background-color:#2563eb}.btn.secondary[data-v-d13f57f0]{background-color:#f3f4f6;color:#374151;border:1px solid #d1d5db}.btn.secondary[data-v-d13f57f0]:hover:not(.disabled){background-color:#e5e7eb}.btn.disabled[data-v-d13f57f0]{opacity:.6;cursor:not-allowed}
