.api-keys-section{background:white;border-radius:8px;padding:24px;margin:20px 0;box-shadow:0 2px 4px rgba(0,0,0,.1)}.api-keys-header{margin-bottom:20px}.api-keys-header h3{margin:0 0 8px;color:#333}.api-keys-description{color:#666;font-size:14px;margin:0}.create-key-form{display:flex;gap:12px;margin-bottom:24px}.create-key-form input{flex:1;min-width:0;padding:10px 14px;border:1px solid #ddd;border-radius:4px;font-size:14px}.create-key-form button{padding:10px 20px;background:#007bff;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;white-space:nowrap}.create-key-form button:hover:not(:disabled){background:#0056b3}.create-key-form button:disabled{background:#ccc;cursor:not-allowed}.api-keys-list table{width:100%;min-width:640px;border-collapse:collapse}.api-keys-list{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.api-keys-list th{text-align:left;padding:12px;background:#f8f9fa;font-weight:600;font-size:13px;color:#333;border-bottom:2px solid #dee2e6}.api-keys-list td{padding:12px;border-bottom:1px solid #dee2e6;font-size:14px}.key-display{font-family:Monaco,Courier New,monospace;background:#f8f9fa;padding:4px 8px;border-radius:3px;font-size:13px}.status-badge{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.status-badge.active{background:#d4edda;color:#155724}.status-badge.inactive{background:#fef2f2;color:#b91c1c;opacity:.7}.revoke-btn{padding:6px 12px;background:#ef4444;color:white;border:none;border-radius:4px;cursor:pointer;font-size:12px;font-weight:600}.revoke-btn:hover{background:#dc2626}.no-keys-message{text-align:center;padding:40px;color:#666}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:white;border-radius:8px;max-width:600px;width:90%;max-height:90vh;overflow-y:auto}.modal-header{padding:24px;border-bottom:1px solid #dee2e6}.modal-header h2{margin:0;color:#333}.modal-body{padding:24px}.warning-box{background:#fff3cd;border:1px solid #ffc107;border-radius:4px;padding:16px;margin-bottom:20px}.warning-box strong{color:#856404;display:block;margin-bottom:4px}.warning-box p{color:#856404;margin:0;font-size:14px}.key-display-box{margin-bottom:20px}.key-display-box label{display:block;margin-bottom:8px;font-weight:600;color:#333}.key-value{display:flex;gap:8px;align-items:center}.key-value code{flex:1;background:#f8f9fa;padding:12px;border-radius:4px;font-family:Monaco,Courier New,monospace;font-size:13px;word-break:break-all}.copy-btn{padding:8px 16px;background:#28a745;color:white;border:none;border-radius:4px;cursor:pointer;font-size:13px;white-space:nowrap}.copy-btn:hover{background:#218838}.api-key-copy-error{margin-top:10px}.usage-hint{background:#f8f9fa;padding:16px;border-radius:4px}.usage-hint strong{display:block;margin-bottom:8px;color:#333}.usage-hint pre{margin:0;padding:12px;background:#2d3748;color:#e2e8f0;border-radius:4px;overflow-x:auto;font-size:12px;line-height:1.5}.modal-footer{padding:16px 24px;border-top:1px solid #dee2e6;text-align:right}.close-btn{padding:10px 24px;background:#007bff;color:white;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500}.close-btn:hover{background:#0056b3}.loading{text-align:center;padding:20px;color:#666}.error-message{background:#f8d7da;border:1px solid #f5c6cb;color:#721c24;padding:12px;border-radius:4px}@media (max-width:600px){.create-key-form{flex-direction:column}.create-key-form button{width:100%}}@media (prefers-color-scheme:dark){.api-keys-section{background:var(--card-color,#1a1a1a);box-shadow:0 2px 4px rgba(0,0,0,.3)}.api-keys-header h3{color:var(--text-color,#f5f5f5)}.api-keys-description{color:#d1d5db}.create-key-form input{background:var(--input-background-color,#2c2c2c);border-color:var(--input-border-color,#444);color:var(--text-color,#f5f5f5)}.create-key-form input::placeholder{color:#b0b5bd}.create-key-form button{background:var(--accent-primary,#60a5fa);color:#fff}.create-key-form button:hover:not(:disabled){background:#3b82f6}.create-key-form button:disabled{background:#444;color:#ccc}.api-keys-list th{background:#2d2d2d;color:#ffffff;font-weight:700;text-transform:uppercase;font-size:.75rem;letter-spacing:.05em;border-bottom:2px solid #444}.api-keys-list td{color:#e5e5e5;border-bottom-color:var(--card-border-color,#333)}.api-keys-list tbody tr:nth-child(odd),.api-keys-list tbody tr:nth-child(odd) td{background:#161616}.api-keys-list tbody tr:nth-child(2n),.api-keys-list tbody tr:nth-child(2n) td{background:#1c1c1c}.api-keys-list tbody tr:hover,.api-keys-list tbody tr:hover td{background:#222222}.key-display{background:var(--input-background-color,#2c2c2c);color:var(--text-color,#f5f5f5)}.status-badge.active{background:rgba(16,185,129,.15);color:#6ee7b7}.status-badge.inactive{background:rgba(239,68,68,.15);color:#fca5a5}.revoke-btn{background:#dc2626}.revoke-btn:hover{background:#b91c1c}.no-keys-message{color:#b0b5bd}.modal-content{background:var(--card-color,#1a1a1a);border:1px solid var(--card-border-color,#333)}.modal-header{border-bottom-color:var(--card-border-color,#333)}.modal-header h2{color:var(--text-color,#f5f5f5)}.warning-box{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.3)}.warning-box strong{color:#fbbf24}.warning-box p{color:#fcd34d}.key-display-box label{color:#d1d5db}.key-value code{background:var(--input-background-color,#2c2c2c);color:var(--text-color,#f5f5f5)}.copy-btn{background:#059669}.copy-btn:hover{background:#047857}.usage-hint{background:rgba(255,255,255,.08)}.usage-hint strong{color:var(--text-color,#f5f5f5)}.usage-hint pre{background:#1e1e1e;color:#e2e8f0}.modal-footer{border-top-color:var(--card-border-color,#333)}.close-btn{background:var(--accent-primary,#60a5fa)}.close-btn:hover{background:#3b82f6}.loading{color:#b0b5bd}.error-message{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.3);color:#fca5a5}}.dashboard{padding:40px 20px;max-width:var(--max-width);margin:0 auto}.dashboard-header{margin-bottom:40px}.dashboard-header h1{font-family:var(--font-mono);font-size:2em;color:var(--text-color);margin-bottom:10px}.loading,.login-prompt{text-align:center;padding:60px 20px}.loading-spinner{width:36px;height:36px;border-top:3px solid var(--card-border-color,#e5e7eb);border:3px solid var(--card-border-color,#e5e7eb);border-top-color:var(--accent-primary,#2563eb);border-radius:50%;animation:dashboard-spin .8s linear infinite;margin:0 auto 16px}@keyframes dashboard-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loading,.login-prompt h2{margin-bottom:15px}.loading,.login-prompt h2,.login-prompt p{font-family:var(--font-mono);color:var(--text-color)}.login-prompt p{opacity:.7}.dashboard-content{display:flex;flex-direction:column;gap:40px}.credit-section{background-color:var(--card-color);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:30px}.credit-balance h2{font-size:1.8em;margin-bottom:10px}.credit-balance h2,.credit-balance p{font-family:var(--font-mono);color:var(--text-color)}.credit-balance p{opacity:.8;font-size:1.1em;margin-bottom:20px}.dashboard-inline-error{font-family:var(--font-mono);color:var(--message-error-text);background-color:var(--message-error-bg);border:1px solid var(--message-error-text);border-radius:var(--border-radius);padding:12px 14px;margin:0 0 18px;line-height:1.45}.balance-breakdown{background-color:rgba(255,255,255,.05);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:20px;margin-bottom:20px}.balance-item{display:grid;grid-template-columns:100px 1fr auto;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}.balance-dollars{font-family:var(--font-mono);color:var(--text-color);opacity:.7;font-size:.9em;min-width:70px;text-align:right}.balance-item:last-child{border-bottom:none}.balance-item.available{font-weight:600;padding-top:16px;border-top:2px solid rgba(255,255,255,.2)}.balance-item.reserved .balance-amount{color:#ffd700}.balance-label{opacity:.8;font-size:.95em}.balance-amount,.balance-label{font-family:var(--font-mono);color:var(--text-color)}.balance-amount{font-size:1.3em;font-weight:700;letter-spacing:.5px}.balance-item.available .balance-amount{font-size:1.5em}.holds-badge{display:inline-block;background:rgba(255,215,0,.2);color:#ffd700;padding:4px 12px;border-radius:12px;font-size:.75em;font-weight:600;margin-left:12px}.screenshots-estimate{opacity:.7;font-size:.9em;margin-bottom:20px;text-align:center}.buy-credits-btn,.screenshots-estimate{font-family:var(--font-mono);color:var(--text-color)}.buy-credits-btn{display:inline-block;padding:12px 24px;font-size:1em;background-color:var(--card-hover-color);border:1px solid var(--card-hover-border);border-radius:var(--border-radius);text-decoration:none;transition:all .3s}.buy-credits-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(255,255,255,.1)}.recent-jobs-section{background-color:var(--card-color);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:25px}.recent-jobs-section h3{font-family:var(--font-mono);color:var(--text-color);font-size:1.3em;margin-bottom:20px}.recent-jobs-section .no-jobs{font-family:var(--font-mono);color:var(--text-color);opacity:.7;text-align:center;padding:20px}.recent-jobs-section .no-jobs a{color:var(--accent-color,#646cff)}.recent-jobs-section .jobs-error{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.jobs-retry-button{appearance:none;border:1px solid var(--message-error-text);border-radius:var(--border-radius);background:transparent;color:var(--message-error-text);cursor:pointer;font-family:var(--font-mono);font-size:.9em;font-weight:700;padding:8px 12px;transition:background-color .2s,color .2s,opacity .2s}.jobs-retry-button:focus-visible,.jobs-retry-button:hover:not(:disabled){background:var(--message-error-text);color:var(--card-color)}.jobs-retry-button:disabled{cursor:progress;opacity:.65}.jobs-list table{width:100%;min-width:620px;border-collapse:collapse;font-family:var(--font-mono)}.jobs-list{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.jobs-list td,.jobs-list th{padding:12px;text-align:left;border-bottom:1px solid var(--card-border-color)}.jobs-list th{font-weight:600;color:var(--text-color);opacity:.8;font-size:.85em;text-transform:uppercase}.jobs-list td{color:var(--text-color);font-size:.9em}.jobs-list code{background:rgba(255,255,255,.1);padding:2px 6px;border-radius:4px;font-size:.85em}.jobs-list .status-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:.8em;font-weight:600}.jobs-list .status-badge.verified{background:rgba(34,197,94,.2);color:#22c55e}.jobs-list .status-badge.completed{background:rgba(59,130,246,.2);color:#3b82f6}.jobs-list .status-badge.running{background:rgba(250,204,21,.18);color:#ca8a04}.jobs-list .status-badge.error,.jobs-list .status-badge.failed,.jobs-list .status-badge.timed_out,.jobs-list .status-badge.timeout{background:rgba(239,68,68,.16);color:#dc2626}.jobs-list .status-badge.canceled,.jobs-list .status-badge.cancelled{background:rgba(107,114,128,.18);color:#4b5563}.quick-actions h3,.stats-section h3{font-family:var(--font-mono);color:var(--text-color);font-size:1.3em;margin-bottom:20px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.stat-card{background-color:var(--card-color);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:25px;text-align:center;display:flex;flex-direction:column;align-items:center}.stat-value{font-size:2em;font-weight:700;margin-bottom:8px}.stat-label,.stat-value{font-family:var(--font-mono);color:var(--text-color)}.stat-label{opacity:.7;font-size:.9em}.actions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.action-card{background-color:var(--card-color);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:25px;text-decoration:none;color:var(--text-color);transition:all .3s;display:block}.action-card:hover{background-color:var(--card-hover-color);border-color:var(--card-hover-border);transform:translateY(-2px)}.action-card h4{font-size:1.1em;margin-bottom:8px}.action-card h4,.action-card p{font-family:var(--font-mono);color:var(--text-color)}.action-card p{opacity:.7;font-size:.9em;margin:0}.action-card.highlight{border-left:3px solid #2563eb;background:rgba(37,99,235,.06)}.action-card.highlight:hover{border-color:#2563eb;background:rgba(37,99,235,.1);box-shadow:0 4px 12px rgba(37,99,235,.15)}.use-cases-section h3{font-family:var(--font-mono);color:var(--text-color);font-size:1.3em;margin-bottom:20px}.mcp-token-section{background-color:var(--card-color);border:1px solid var(--card-border-color);border-radius:var(--border-radius);padding:25px}.mcp-token-header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:10px}.mcp-token-header h3{font-family:var(--font-mono);color:var(--text-color);font-size:1.3em}.mcp-token-link{color:var(--accent-primary);text-decoration:none;font-family:var(--font-mono);font-size:.9em}.mcp-token-subtitle{font-family:var(--font-mono);color:var(--text-color);opacity:.75;margin-bottom:18px}.mcp-token-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border-radius:var(--border-radius);border:1px solid var(--card-border-color);background:rgba(255,255,255,.04)}.mcp-token-value{flex:1;min-width:0;font-family:var(--font-mono);color:var(--text-color);font-size:.9em;overflow:hidden;text-overflow:ellipsis}.mcp-token-value code{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mcp-token-mask{letter-spacing:.2em;opacity:.6}.mcp-token-actions{display:flex;gap:10px}.mcp-token-btn{font-family:var(--font-mono);border:1px solid var(--card-border-color);background:transparent;color:var(--text-color);padding:10px 14px;border-radius:var(--border-radius);cursor:pointer;transition:all .2s ease}.mcp-token-btn:hover{border-color:var(--accent-primary);transform:translateY(-1px)}.mcp-token-btn.primary{background:linear-gradient(120deg,rgba(255,205,70,.2),rgba(255,110,80,.2));border-color:rgba(255,205,70,.4)}.mcp-token-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.mcp-token-error{color:#ff7a6b;margin-top:10px}.mcp-token-error,.mcp-token-note{font-family:var(--font-mono);font-size:.9em}.mcp-token-note{color:var(--text-color);opacity:.7;margin-top:14px}@media (max-width:1024px){.dashboard{padding:30px 20px}.actions-grid,.stats-grid{grid-template-columns:repeat(2,1fr)}.mcp-token-card{flex-direction:column;align-items:stretch}.mcp-token-actions{justify-content:flex-start}}@media (max-width:768px){.dashboard{padding:20px 15px}.actions-grid,.stats-grid{grid-template-columns:1fr;gap:15px}.action-card,.credit-section,.stat-card{padding:20px}}@media (max-width:480px){.dashboard{padding:15px 10px}.dashboard-header h1{font-size:1.75em}.action-card,.credit-section,.stat-card{padding:15px}}@media (prefers-color-scheme:dark){.dashboard,.dashboard-header h1,.loading,.login-prompt h2{color:var(--text-color,#f5f5f5)}.login-prompt p{color:#d1d5db}.credit-section{background-color:var(--card-color,#1a1a1a);border-color:var(--card-border-color,#333)}.credit-balance h2{color:var(--text-color,#f5f5f5)}.credit-balance p{color:#d1d5db}.balance-breakdown{background-color:rgba(255,255,255,.08);border-color:var(--card-border-color,#333)}.balance-item{border-bottom-color:rgba(255,255,255,.1)}.balance-item.available{border-top-color:rgba(255,255,255,.2)}.balance-label{color:#d1d5db}.balance-amount{color:var(--text-color,#f5f5f5)}.balance-dollars,.screenshots-estimate{color:#d1d5db}.buy-credits-btn{color:var(--text-color,#e5e7eb);background-color:var(--card-hover-color,#2c2c2c);border-color:var(--card-hover-border,#555)}.recent-jobs-section{background-color:var(--card-color,#1a1a1a);border-color:var(--card-border-color,#333)}.recent-jobs-section h3{color:var(--text-color,#f5f5f5)}.recent-jobs-section .no-jobs{color:#b0b5bd}.recent-jobs-section .no-jobs a{color:var(--accent-primary,#60a5fa)}.jobs-list th{background:#2d2d2d;color:#ffffff;font-weight:700;border-bottom:2px solid #444}.jobs-list td{color:#e5e5e5;border-bottom-color:var(--card-border-color,#333)}.jobs-list code{background:rgba(255,255,255,.1);color:var(--text-color,#f5f5f5)}.stat-card{background-color:var(--card-color,#1a1a1a);border-color:var(--card-border-color,#333)}.stat-value{color:var(--text-color,#f5f5f5)}.stat-label{color:#d1d5db}.action-card{background-color:var(--card-color,#1a1a1a);border-color:var(--card-border-color,#333);color:var(--text-color,#f5f5f5)}.action-card:hover{background-color:var(--card-hover-color,#2c2c2c);border-color:var(--card-hover-border,#444)}.action-card h4{color:var(--text-color,#f5f5f5)}.action-card p{color:#d1d5db}.action-card.highlight{background:rgba(96,165,250,.08);border-left-color:var(--accent-primary,#60a5fa)}.action-card.highlight:hover{background:rgba(96,165,250,.14);border-color:var(--accent-primary,#60a5fa);box-shadow:0 4px 12px rgba(96,165,250,.15)}.quick-actions h3,.stats-section h3,.use-cases-section h3{color:var(--text-color,#f5f5f5)}.mcp-token-section{background-color:var(--card-color,#1a1a1a);border-color:var(--card-border-color,#333)}.mcp-token-header h3{color:var(--text-color,#f5f5f5)}.mcp-token-link{color:var(--accent-primary,#60a5fa)}.mcp-token-subtitle{color:#d1d5db}.mcp-token-card{border-color:var(--card-border-color,#333);background:rgba(255,255,255,.06)}.mcp-token-btn,.mcp-token-value{color:var(--text-color,#f5f5f5)}.mcp-token-btn{border-color:var(--card-border-color,#333);background:transparent}.mcp-token-btn:hover{border-color:var(--accent-primary,#60a5fa)}.mcp-token-btn.primary{background:linear-gradient(120deg,rgba(255,205,70,.2),rgba(255,110,80,.2));border-color:rgba(255,205,70,.4)}.mcp-token-error{color:#fca5a5}.mcp-token-note{color:#b0b5bd}.loading-spinner{border-color:var(--card-border-color,#333);border-top-color:var(--accent-primary,#60a5fa)}}