:root{--bg: #f6f7f9;--panel: #ffffff;--panel-hover: #fafbfc;--border: #e4e7eb;--border-strong: #cfd4da;--text: #1a1f2b;--text-muted: #5b6472;--text-subtle: #8a94a3;--accent: #635bff;--accent-hover: #4f46e5;--accent-contrast: #ffffff;--danger: #d9354b;--danger-bg: #fdecee;--success: #0e8a5f;--success-bg: #e6f6ef;--code-bg: #0f172a;--code-fg: #e2e8f0;--code-accent: #8ab4ff;--radius: 8px;--radius-sm: 6px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);--shadow-md: 0 4px 16px rgba(15, 23, 42, .06);--mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;font-family:var(--sans);color:var(--text);background:var(--bg);color-scheme:light;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;line-height:1.5}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg)}#root{min-height:100vh}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}code,pre,.mono{font-family:var(--mono)}button{font-family:inherit;font-size:.9375rem;font-weight:500;line-height:1;cursor:pointer;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--panel);color:var(--text);padding:.625rem 1rem;transition:background .12s ease,border-color .12s ease,color .12s ease}button:hover{background:var(--panel-hover)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.55;cursor:not-allowed}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}input[type=text],input[type=url]{width:100%;font-family:inherit;font-size:.9375rem;padding:.625rem .75rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--panel);color:var(--text)}input[type=text]:focus,input[type=url]:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}.app-shell{max-width:960px;margin:0 auto;padding:2rem 1.5rem 4rem}.app-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:1.5rem;margin-bottom:2rem;border-bottom:1px solid var(--border)}.app-header h1{font-size:1.125rem;font-weight:600;margin:0;letter-spacing:-.01em}.app-header .subtitle{margin:.125rem 0 0;font-size:.8125rem;color:var(--text-muted)}.brand-mark{display:inline-flex;align-items:center;gap:.625rem}.brand-mark .dot{width:10px;height:10px;border-radius:50%;background:var(--accent)}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.panel+.panel{margin-top:1.25rem}.panel-header{padding:1rem 1.25rem;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.panel-header h2{font-size:.9375rem;font-weight:600;margin:0}.panel-header p{margin:.125rem 0 0;font-size:.8125rem;color:var(--text-muted)}.panel-body{padding:1.25rem}.onboarding{max-width:540px;margin:3rem auto 0}.onboarding .panel-body{display:flex;flex-direction:column;gap:1rem}.field{display:flex;flex-direction:column;gap:.375rem}.field label{font-size:.8125rem;font-weight:500;color:var(--text-muted)}.field .hint{font-size:.75rem;color:var(--text-subtle)}.form-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.5rem}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.segmented{display:inline-flex;padding:3px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm)}.segmented button{border:none;background:transparent;padding:.375rem .875rem;font-size:.8125rem;font-weight:500;color:var(--text-muted);border-radius:4px}.segmented button[data-active=true]{background:var(--panel);color:var(--text);box-shadow:var(--shadow-sm)}.toolbar-actions{display:flex;gap:.5rem}.toolbar-actions button{font-size:.8125rem;padding:.5rem .75rem}.card-field{padding:.25rem .5rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--panel);min-height:44px;display:flex;align-items:center}.card-field>*{width:100%}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:520px){.grid-2{grid-template-columns:1fr}}.inline-error{padding:.625rem .75rem;background:var(--danger-bg);color:var(--danger);border:1px solid #f4c3c9;border-radius:var(--radius-sm);font-size:.8125rem}.credentials-summary{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.8125rem;color:var(--text-muted)}.credentials-summary .key{font-family:var(--mono);color:var(--text)}.credentials-summary>button{margin-left:auto;padding:.375rem .625rem;font-size:.75rem}.credentials-summary .session-row{display:flex;align-items:center;flex-wrap:wrap;gap:.375rem}.credentials-summary .session-row button{padding:.25rem .5rem;font-size:.6875rem}.credentials-summary .session-row input[type=text]{width:auto;flex:1 1 220px;min-width:0;padding:.25rem .5rem;font-size:.75rem;font-family:var(--mono)}.credentials-summary .session-row .muted{color:var(--text-muted);font-style:italic}.code-block{position:relative;background:var(--code-bg);color:var(--code-fg);border-radius:var(--radius-sm);font-family:var(--mono);font-size:.8125rem;line-height:1.6;overflow:hidden}.code-block pre{margin:0;padding:1rem 1.25rem;overflow-x:auto;white-space:pre}.code-block .copy-btn{position:absolute;top:.5rem;right:.5rem;padding:.3125rem .625rem;font-size:.75rem;background:#ffffff14;color:var(--code-fg);border:1px solid rgba(255,255,255,.12)}.code-block .copy-btn:hover{background:#ffffff24}.result-panel .panel-header .badge{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--success);background:var(--success-bg);padding:.1875rem .5rem;border-radius:999px}.token-highlight{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem .875rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:1rem}.token-highlight .label{font-size:.6875rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.token-highlight .value{font-family:var(--mono);font-size:.875rem;word-break:break-all}.token-highlight button{font-size:.75rem;padding:.375rem .625rem}.order-summary{padding:1rem 1.125rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm)}.order-summary-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.875rem}.order-summary-header h3{font-size:.875rem;font-weight:600;margin:0}.order-summary-header button{font-size:.75rem;padding:.375rem .625rem}.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:0 0 .875rem}@media(max-width:520px){.summary-grid{grid-template-columns:1fr}}.summary-grid div{display:flex;flex-direction:column;gap:.25rem}.summary-grid dt{font-size:.6875rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-subtle)}.summary-grid dd{margin:0;font-size:.8125rem;color:var(--text)}.checkout-status{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);background:#eef0ff;padding:.1875rem .5rem;border-radius:999px}.order-items,.saved-instruments{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.375rem}.order-items li{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.5rem .625rem;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:.8125rem}.order-items .key{font-family:var(--mono);color:var(--text)}.payment-methods{margin-top:.875rem}.saved-instruments{margin-top:.625rem}.saved-instruments li{font-size:.8125rem;font-family:var(--mono);color:var(--text-muted)}.purpose-row .hint,.purpose-result .hint,.next-step .hint{font-size:.75rem;color:var(--text-subtle);margin:.375rem 0 0}.purpose-result{margin-top:1rem;font-size:.8125rem}.notice{margin-top:.5rem;padding:.625rem .75rem;background:#fff7e6;color:#8a5a00;border:1px solid #f5d9a3;border-radius:var(--radius-sm);font-size:.8125rem}.next-steps{margin:1.25rem 0}.next-steps h3{font-size:.875rem;margin:0 0 .5rem}.next-step+.next-step{margin-top:1rem}.next-step-title{font-size:.8125rem;font-weight:600}.next-step .code-block{margin-top:.5rem}.purpose-result .key{font-family:var(--mono)}