:root{--color-bg: #0a0e12;--color-surface: #0f1419;--color-text: #e5e7eb;--color-muted: #94a3b8;--color-border: rgba(255, 255, 255, .1);--color-primary: #10b981;--radius: 12px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 6px 20px rgba(0, 0, 0, .08)}*{margin:0;padding:0;box-sizing:border-box}html{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,sans-serif}body{height:100vh;color:var(--color-text);background:radial-gradient(1200px 600px at 10% 5%,rgba(16,185,129,.08),transparent),radial-gradient(1000px 500px at 120% 10%,rgba(16,185,129,.06),transparent),var(--color-bg);overflow:hidden;margin:0;padding:0;display:flex;flex-direction:column}.topbar-actions{display:flex;align-items:center;gap:1rem;margin-left:auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.5rem 1rem;border-radius:.5rem;border:none;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease;font-family:inherit}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:0 2px 8px #10b9811f}.btn-primary:hover{background:#059669;box-shadow:0 4px 12px #10b98133}.btn-secondary{background:#ffffff1a;color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:#ffffff26;border-color:#ffffff40}.btn-danger{background:#ef4444;color:#fff}.btn-danger:hover{background:#dc2626}.btn-small{padding:.375rem .75rem;font-size:.8rem}.btn:disabled{opacity:.6;cursor:not-allowed}.btn svg{width:1.2em;height:1.2em}.page-header{margin-bottom:2rem}.page-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem;color:var(--color-text)}.page-header p{font-size:1rem;color:var(--color-muted)}.header-content{display:flex;justify-content:space-between;align-items:flex-start}.user-section{display:flex;align-items:center;gap:1rem}.user-info{text-align:right}.user-info p{margin:0}.user-id{font-size:.85rem;color:#666}.section-card{background:linear-gradient(135deg,#0f1419cc,#0f141999);border:1px solid var(--color-border);border-radius:var(--radius);padding:2rem;margin-bottom:1.5rem;transition:all .3s ease}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.section-header h2{font-size:1.5rem;font-weight:600;color:var(--color-text);margin:0}.section-description{color:var(--color-muted);font-size:.9rem;margin-bottom:1.5rem}.keys-section{display:grid;grid-template-columns:1fr;gap:1.5rem}.keys-list{display:flex;flex-direction:column;gap:1rem}.key-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#ffffff0d;border:1px solid var(--color-border);border-radius:.5rem;transition:all .2s ease}.key-info{flex:1}.key-actions{display:flex;gap:.5rem}.key-name{margin:0;font-weight:500;color:var(--color-text);font-family:Courier New,monospace;letter-spacing:.5px}.key-id,.key-created,.key-used{margin:.25rem 0 0;font-size:.85rem;color:var(--color-muted)}.error-message{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#fca5a5;padding:1rem;border-radius:6px;margin-bottom:2rem;font-size:.9rem}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 2rem;text-align:center;color:var(--color-muted)}.empty-state :global(svg){color:var(--color-primary);opacity:.6;margin-bottom:1rem}.empty-state p{font-size:1rem;line-height:1.6}.usage-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin-bottom:2rem}.stat-card{background:linear-gradient(135deg,#0f1419cc,#0f141999);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.5rem;display:flex;align-items:center;gap:1rem;transition:all .3s ease}.stat-card:hover{border-color:#06b6d44d;transform:translateY(-2px)}.stat-icon{display:flex;align-items:center;justify-content:center;width:60px;height:60px;background:#06b6d41a;border-radius:10px;color:var(--color-primary);flex-shrink:0}.stat-icon :global(svg){color:var(--color-primary)}.stat-content{flex:1}.stat-label{font-size:.875rem;color:var(--color-muted);margin:0 0 .5rem}.stat-value{font-size:1.75rem;font-weight:700;color:var(--color-text);margin:0}.stat-period{font-size:.75rem;color:var(--color-muted);margin:.25rem 0 0}.usage-section{margin-top:2rem}.usage-section h2{font-size:1.5rem;font-weight:600;color:var(--color-text);margin-bottom:.5rem}.billing-section{margin-bottom:3rem}.section-title{margin-bottom:1.5rem}.section-title h2{font-size:1.375rem;font-weight:700;color:var(--color-text);margin:0 0 .25rem}.section-title p{font-size:.875rem;color:var(--color-muted);margin:0}.pricing-options{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.pricing-card{background:linear-gradient(135deg,#0f1419cc,#0f141999);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.75rem;display:flex;flex-direction:column;transition:all .3s ease;position:relative;overflow:hidden}.pricing-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(6,182,212,.3),transparent)}.pricing-card:hover{border-color:#06b6d44d;transform:translateY(-4px);box-shadow:0 16px 32px #06b6d414}.pricing-card.highlight{border-color:var(--color-primary);box-shadow:0 0 32px #06b6d426;background:linear-gradient(135deg,#06b6d40d,#04788c08)}.pricing-card.cancelled{border-color:#f97316;box-shadow:0 0 32px #f9731626;background:linear-gradient(135deg,#f973160d,#b4530908)}.pricing-card.unavailable{opacity:.6;border-color:#6b728080}.pricing-card.unavailable:hover{border-color:#6b728080;transform:none;box-shadow:none}.pricing-card-tag{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;gap:.375rem;background:var(--color-primary);color:#fff;padding:.375rem .75rem;border-radius:9999px;font-size:.65rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;box-shadow:0 2px 8px #06b6d433;border:none}.pricing-card-tag.cancelled{background:#f97316;box-shadow:0 2px 8px #f9731633}.pricing-card-header{margin-bottom:1rem;min-height:80px;display:flex;flex-direction:column;justify-content:flex-start}.pricing-card-name{font-size:1.1rem;font-weight:700;margin:0 0 .5rem;color:#fff}.pricing-card-description{font-size:.8rem;color:var(--color-muted);line-height:1.4;margin:0}.pricing-card-price-section{margin-bottom:1.25rem;display:flex}.pricing-card-price{font-size:2rem;font-weight:700;color:var(--color-primary);line-height:1;margin-right:5px}.pricing-card-price-desc{font-size:.8rem;color:var(--color-muted);margin-top:.25rem}.pricing-card-features{flex:1;margin-bottom:1.25rem}.pricing-card-features ul{list-style:none;padding:0;margin:0}.pricing-card-features li{display:flex;align-items:flex-start;gap:.25rem;padding:.5rem 0;font-size:.75rem;line-height:1.25;color:var(--color-text)}.pricing-card-features li svg{color:var(--color-primary);flex-shrink:0;margin-top:1px}.pricing-card-features-label{font-weight:600;color:var(--color-text);margin-bottom:.5rem;padding:0}.pricing-card-action{width:100%;justify-content:center;padding:.625rem 1rem;font-size:.875rem}.token-packs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.5rem}.token-pack-card{background:linear-gradient(135deg,#0f1419cc,#0f141999);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.5rem;display:flex;flex-direction:column;transition:all .3s ease;position:relative;overflow:hidden}.token-pack-card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(6,182,212,.3),transparent)}.token-pack-card:hover{border-color:#06b6d44d;transform:translateY(-4px);box-shadow:0 16px 32px #06b6d414}.token-pack-header{margin-bottom:1.25rem}.token-pack-name{font-size:1.1rem;font-weight:700;color:#fff;margin:0}.token-pack-subtitle{font-size:.75rem;color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px;margin:.25rem 0 0}.token-pack-content{flex:1;margin-bottom:1.5rem;display:flex;flex-direction:column;align-items:center;text-align:center;padding:1rem 0}.token-pack-tokens{font-size:2.25rem;font-weight:700;color:var(--color-primary);line-height:1;margin-bottom:.25rem}.token-pack-tokens-label{font-size:.75rem;color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.75rem}.token-pack-price{font-size:1.5rem;font-weight:700;color:var(--color-text)}.token-pack-features{width:100%;margin-bottom:1rem}.token-pack-features ul{list-style:none;padding:0;margin:0;text-align:left}.token-pack-features li{display:flex;align-items:flex-start;gap:.5rem;padding:.4rem 0;font-size:.75rem;line-height:1.3;color:var(--color-text)}.token-pack-features li svg{color:var(--color-primary);flex-shrink:0;margin-top:1px}.token-pack-action{width:100%;justify-content:center;padding:.625rem 1rem;font-size:.875rem}.license-icon{color:var(--color-primary);margin-bottom:1rem;opacity:.8}.license-text{margin-bottom:.5rem}.license-description{font-size:.875rem;color:var(--color-muted);margin:0;line-height:1.4}.login-container{display:flex;flex-direction:column;min-height:100vh;color:#e5e7eb}.header{padding:1rem 1.5rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:100}.logo{display:inline-block}.login-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.login-box{width:100%;max-width:420px;padding:2rem;border-radius:.5rem;box-shadow:0 4px 8px #0000001a}.title{font-size:2rem;font-weight:700;color:#e5e7eb;text-align:center;margin-bottom:.75rem;letter-spacing:-.02em}.subtitle{color:#94a3b8;text-align:center;margin-bottom:2rem;font-size:.95rem}.providers{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem}.btn-github:hover:not(:disabled){background:#1f2937;border-color:#ffffff4d;box-shadow:0 4px 12px #0000004d;transform:translateY(-2px)}.btn-github{background:#1f2937;color:#fff;border:1px solid rgba(255,255,255,.2);box-shadow:0 2px 8px #0003;font-weight:600;font-size:.95rem;padding:.75rem 1.5rem}.btn-github:disabled{opacity:.7}.btn-github svg{width:18px;height:18px;margin-right:.25rem}.footer{padding:1.5rem 2rem;text-align:center;color:#fff9;font-size:.85rem;border-top:1px solid rgba(255,255,255,.15)}.footer p{margin:0}.footer a{color:#ffffffe6;text-decoration:underline;transition:opacity .2s}.footer a:hover{opacity:.8}.modal-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal{background:linear-gradient(135deg,#0f1419f2,#0f1419d9);border:1px solid var(--color-border);padding:2rem;border-radius:var(--radius);max-width:400px;width:100%;box-shadow:0 20px 25px #0000004d}.modal h3{margin:0 0 1.5rem;font-size:1.25rem;color:var(--color-text)}.input-field{width:100%;padding:.75rem;border:1px solid var(--color-border);border-radius:.5rem;margin-bottom:1.5rem;font-size:.875rem;background:#ffffff0d;color:var(--color-text);font-family:inherit;transition:all .2s ease}.input-field:focus{outline:none;border-color:var(--color-primary);background:#ffffff14;box-shadow:0 0 0 3px #06b6d41a}.input-field::placeholder{color:var(--color-muted)}.modal-buttons{display:flex;gap:.75rem;justify-content:flex-end}.key-display-modal{background:linear-gradient(135deg,#0f1419f2,#0f1419d9);border:1px solid var(--color-border);padding:2rem;border-radius:var(--radius);max-width:500px;width:100%;box-shadow:0 20px 25px #0000004d}.key-display-modal h3{margin:0 0 1rem;font-size:1.25rem;color:var(--color-text)}.key-display-modal p{color:var(--color-muted);margin-bottom:1.5rem;font-size:.9rem;line-height:1.5}.key-display-box{background:#06b6d41a;border:1px solid rgba(6,182,212,.3);border-radius:.5rem;padding:1rem;margin-bottom:1.5rem;word-break:break-all;font-family:Courier New,monospace;font-size:.85rem;color:var(--color-primary);line-height:1.5}.key-display-warning{background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:.5rem;padding:1rem;margin-bottom:1.5rem;font-size:.85rem;color:#fca5a5;line-height:1.5}.key-display-modal-buttons{display:flex;gap:.75rem;justify-content:flex-end}.modal-info{color:#666;font-size:.875rem;margin-bottom:1rem}.key-limit-badge{display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}.limit-text{font-size:.75rem;font-weight:600;color:var(--color-muted);text-transform:uppercase;letter-spacing:.5px}.limit-bar{width:200px;height:6px;background:#ffffff1a;border-radius:3px;overflow:hidden;border:1px solid rgba(255,255,255,.15)}.limit-fill{height:100%;background:var(--color-primary);transition:width .3s ease;border-radius:3px}.key-domain{margin:.5rem 0 0;font-size:.85rem;color:var(--color-muted);display:flex;align-items:center;gap:.5rem}.key-domain.unrestricted{color:#f97316}.key-domain.unrestricted :global(svg){color:#f97316;flex-shrink:0}.domain-value{color:var(--color-primary);font-family:Courier New,monospace;font-weight:500}.domains-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.input-group{margin-bottom:1.5rem}.input-error{border-color:#ef4444!important;background:#ef44440d!important}.input-error-text{font-size:.75rem;color:#fca5a5;margin-top:.375rem;margin-bottom:0}.input-warning{display:flex;align-items:flex-start;gap:.5rem;background:#f973161a;border:1px solid rgba(249,115,22,.3);border-radius:.375rem;padding:.75rem;margin-top:.75rem;font-size:.8rem;color:#fed7aa;line-height:1.4}.input-warning :global(svg){color:#f97316;flex-shrink:0;margin-top:2px}.table-container{width:100%;overflow-x:auto}.help-box{background:linear-gradient(135deg,#06b6d414,#10b9810d);border:2px solid rgba(16,185,129,.3);border-radius:var(--radius);padding:1.5rem;margin-bottom:1.5rem}.help-box.help-box-compact{background:#ffffff05;border:1px solid rgba(16,185,129,.15);padding:1rem;margin-bottom:1rem}.help-box.help-box-compact .help-box-header h3{font-size:.95rem}.help-box.help-box-compact .help-box-content{display:none}.help-box.help-box-compact .help-box-list{gap:.5rem}.help-box.help-box-compact .help-box-list li{font-size:.8rem}.help-box-header{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.help-box-header h3{margin:0;font-size:1.125rem;font-weight:600;color:var(--color-text)}.help-box-header :global(svg){color:var(--color-primary);flex-shrink:0}.help-box-content{color:var(--color-muted);font-size:.9rem;margin:0 0 1rem;line-height:1.5}.help-box-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.75rem}.help-box-list li{display:flex;align-items:flex-start;gap:.75rem;color:var(--color-text);font-size:.875rem;line-height:1.4}.help-box-list li a{color:var(--color-primary);text-decoration:none;font-weight:600;padding-bottom:2px}.help-box-list li a:hover,.help-box-list li a:focus{color:#059669;text-decoration:underline}@media(max-width:1200px){.pricing-options{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){:root{--radius: 8px}body{flex-direction:column}.topbar-actions{gap:.5rem}.btn{padding:.5rem .75rem;font-size:.8rem}.btn-small{padding:.375rem .5rem;font-size:.75rem}.page-header{margin-bottom:1.5rem}.page-header h1{font-size:1.5rem}.page-header p{font-size:.9rem}.header-content{flex-direction:column;gap:1rem}.user-section{width:100%;justify-content:space-between}.user-info{text-align:left}.section-card{padding:1.5rem;margin-bottom:1rem;border-radius:8px}.section-header{flex-direction:column;gap:1rem}.section-header h2{font-size:1.25rem}.keys-section{gap:1rem}.key-item{flex-direction:column;align-items:flex-start;gap:.75rem;padding:.75rem}.key-actions{width:100%;justify-content:flex-end}.usage-stats{grid-template-columns:1fr;gap:1rem;margin-bottom:1.5rem}.stat-card{gap:.75rem}.stat-icon{width:50px;height:50px}.stat-value{font-size:1.5rem}.pricing-options{grid-template-columns:1fr}.pricing-card{padding:1.25rem}.pricing-card-header{min-height:auto}.pricing-card-name{font-size:1rem}.pricing-card-price{font-size:1.5rem}.pricing-card-features li{font-size:.7rem}.token-packs-grid{grid-template-columns:1fr}.token-pack-card{padding:1.25rem}.modal,.key-display-modal{max-width:90%;padding:1.5rem;margin:1rem}.modal h3{font-size:1.1rem;margin-bottom:1rem}.modal-buttons,.key-display-modal-buttons{flex-direction:column-reverse}.modal-buttons button,.key-display-modal-buttons button{width:100%}.input-field{padding:.625rem;font-size:.8rem}.limit-bar{width:100%}.login-box{max-width:100%;padding:1.5rem;margin:0 1rem}.title{font-size:1.5rem}.providers{gap:.5rem}.btn-github{padding:.625rem 1rem;font-size:.85rem}.footer{padding:1rem 1.5rem;font-size:.75rem}.help-box{padding:1rem;margin-bottom:1rem}.help-box-header h3{font-size:1rem}.help-box-content{font-size:.85rem}.help-box-list li{font-size:.8rem}}@media(max-width:480px){.page-header h1{font-size:1.25rem}.section-card{padding:1rem;margin-bottom:.75rem}.section-header h2{font-size:1.1rem}.key-item{padding:.5rem}.key-name{font-size:.9rem}.key-id,.key-created,.key-used{font-size:.75rem}.stat-card{flex-direction:column;text-align:center}.stat-icon{margin:0 auto}.stat-content{text-align:center}.btn{padding:.5rem;font-size:.75rem}.pricing-card-price{font-size:1.25rem}.token-pack-tokens{font-size:1.75rem}.modal,.key-display-modal{max-width:95%;padding:1rem}.login-box{margin:0 .5rem;padding:1rem}.title{font-size:1.25rem;margin-bottom:.5rem}.subtitle{margin-bottom:1.5rem;font-size:.85rem}}.loading-spinner{animation:svelte-1a5pdw0-spin 1s linear infinite;color:#10b981;width:40px;height:40px}@keyframes svelte-1a5pdw0-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}