:root{--bg: #0b1220;--surface: #121a2b;--surface-elevated: #182235;--border: #2a3650;--text: #e8edf7;--text-muted: #9aa8c2;--accent: #3b82f6;--accent-hover: #2563eb;--success: #22c55e;--error: #ef4444;--warning: #f59e0b;--radius: 12px;--shadow: 0 18px 48px rgba(0, 0, 0, .35);font-family:IBM Plex Sans,system-ui,sans-serif;color:var(--text);background:var(--bg);line-height:1.5}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,rgba(59,130,246,.18),transparent 28%),radial-gradient(circle at bottom right,rgba(34,197,94,.12),transparent 24%),var(--bg)}button,input{font:inherit}#app{min-height:100vh}.layout{max-width:960px;margin:0 auto;padding:2rem 1.25rem 3rem}.header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:2rem}.brand{display:flex;flex-direction:column;gap:.2rem}.brand h1{margin:0;font-size:1.35rem;font-weight:700}.brand p{margin:0;color:var(--text-muted);font-size:.95rem}.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .7rem;border-radius:999px;border:1px solid var(--border);background:#ffffff08;color:var(--text-muted);font-size:.82rem}.badge.authenticated{color:#bbf7d0;border-color:#22c55e59;background:#22c55e14}.card{background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 120px),var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.5rem}.card+.card{margin-top:1rem}.card h2{margin:0 0 .5rem;font-size:1.15rem}.card p{margin:0 0 1rem;color:var(--text-muted)}.actions{display:flex;flex-wrap:wrap;gap:.75rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:10px;padding:.7rem 1rem;cursor:pointer;font-weight:600;transition:transform .15s ease,background .15s ease,opacity .15s ease}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{background:var(--surface-elevated);color:var(--text);border:1px solid var(--border)}.btn-ghost{background:transparent;color:var(--text-muted);border:1px solid var(--border)}.nav{display:flex;gap:.5rem;margin-bottom:1rem}.nav button.active{background:#3b82f629;border-color:#3b82f673;color:#dbeafe}.grid{display:grid;gap:1rem}@media(min-width:720px){.grid.two{grid-template-columns:1fr 1fr}}.field{display:flex;flex-direction:column;gap:.4rem}.field label{font-size:.9rem;color:var(--text-muted)}.field input{width:100%;border:1px solid var(--border);border-radius:10px;background:var(--surface-elevated);color:var(--text);padding:.7rem .85rem}.status{margin-top:1rem;padding:.85rem 1rem;border-radius:10px;border:1px solid var(--border);background:#ffffff05;font-size:.92rem}.status.success{border-color:#22c55e59;color:#bbf7d0}.status.error{border-color:#ef444459;color:#fecaca}.status.info{border-color:#3b82f659;color:#bfdbfe}pre.output{margin:1rem 0 0;padding:1rem;border-radius:10px;background:#060a12;border:1px solid var(--border);overflow:auto;max-height:320px;font-size:.82rem;color:#d7e3f4;word-break:break-word;white-space:pre-wrap}.token-block{margin-top:1rem}.token-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.btn-sm{padding:.45rem .75rem;font-size:.85rem}.footer-note.warning{color:#fcd34d}.api-test-grid{display:grid;gap:1rem;margin-top:1rem}@media(min-width:720px){.api-test-grid{grid-template-columns:repeat(3,1fr)}}.api-test-card{padding:1rem;border:1px solid var(--border);border-radius:10px;background:var(--surface-elevated)}.api-test-card h3{margin:0 0 .4rem;font-size:.95rem}.api-test-card p{margin:0 0 .85rem;font-size:.88rem;color:var(--text-muted)}.api-result-block{margin-top:1.25rem}.validation-summary{margin-top:.75rem;padding:.6rem .85rem;border-radius:8px;font-weight:600}.validation-summary.success{background:#22c55e1a;color:#bbf7d0}.validation-summary.error{background:#ef44441a;color:#fecaca}.validation-steps{display:grid;gap:.75rem;margin-top:.75rem}.validation-step{padding:.85rem;border-radius:10px;border:1px solid var(--border);background:#ffffff05}.validation-step.success{border-color:#22c55e59}.validation-step.error{border-color:#ef444459}.validation-step.info{border-color:#3b82f659}.step-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.35rem;font-size:.82rem}.step-number{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;border-radius:999px;background:#ffffff14;font-weight:700}.step-phase{font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted)}.step-status{margin-left:auto;text-transform:uppercase;font-size:.75rem}.step-message{margin:0;font-size:.92rem}pre.output.step-details{margin-top:.6rem;max-height:160px;font-size:.78rem}.response-details{margin-top:1rem}.response-details summary{cursor:pointer;color:var(--text-muted);font-size:.9rem}.hidden{display:none!important}.config-error{border-color:#f59e0b73;background:#f59e0b14}.config-error code{color:#fde68a}.footer-note{margin-top:1.5rem;color:var(--text-muted);font-size:.85rem}.footer-note code{color:#cbd5e1}