@font-face{font-family:Bebas Neue;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/BebasNeue-Regular.woff2) format("woff2")}@font-face{font-family:Lato;font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/Lato-Light.woff2) format("woff2")}@font-face{font-family:Lato;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/Lato-Regular.woff2) format("woff2")}@font-face{font-family:Lato;font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/Lato-Italic.woff2) format("woff2")}@font-face{font-family:Lato;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/Lato-Bold.woff2) format("woff2")}@font-face{font-family:Lato;font-style:italic;font-weight:700;font-display:swap;src:url(/fonts/Lato-BoldItalic.woff2) format("woff2")}:root{--bg: #141414;--text: #fafafa;--muted: #505050;--accent: #825078;--accent2: #326478;--gold: #be960a;--font-display: "Bebas Neue", "Impact", "Haettenschweiler", "Arial Narrow Bold", sans-serif;--font-body: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--bg-card: #1c1c1c;--bg-elevated: #242424;--bg-hover: #2a2a2a;--border: var(--muted);--border-light: #2a2a2a;--text-muted: color-mix(in srgb, var(--text) 60%, var(--bg));--text-heading: var(--text);--primary: var(--accent);--primary-hover: #9a6290;--primary-bg: rgba(130, 80, 120, .18);--accent-text: color-mix(in srgb, var(--accent) 55%, var(--text));--success: var(--accent2);--success-bg: color-mix(in srgb, var(--accent2) 15%, transparent);--warning: #d29922;--warning-bg: rgba(210, 153, 34, .15);--danger: #f85149;--danger-bg: rgba(248, 81, 73, .15);--shadow: 0 3px 12px rgba(0, 0, 0, .4);--radius: 6px;--radius-sm: 4px;--transition: all .15s ease}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);font-size:14px;line-height:1.5;background:var(--bg);color:var(--text)}a{color:var(--accent-text);text-decoration:none}a:hover{color:var(--primary-hover);text-decoration:underline}code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px}h1,h2,h3{color:var(--text-heading);margin:0}h1,h2{font-family:var(--font-display)}h1{font-size:22px;font-weight:600}h2{font-size:16px;font-weight:600}p{margin:0}.muted{color:var(--text-muted)}.small{font-size:12px}.auth-shell{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:32px 16px;background:var(--bg)}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:var(--bg-card);border-right:1px solid var(--border);padding:20px 16px;display:flex;flex-direction:column;gap:24px}.sidebar-brand{display:flex;flex-direction:column;gap:2px;padding:0 8px}.brand-mark{font-size:16px;font-weight:700;color:var(--text-heading)}.brand-sub{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.sidebar-nav{display:flex;flex-direction:column;gap:2px}.nav-item{display:block;padding:8px 12px;border-radius:var(--radius-sm);color:var(--text);font-size:14px;transition:var(--transition)}.nav-item:hover{background:var(--bg-hover);color:var(--text-heading);text-decoration:none}.nav-item.active{background:var(--primary-bg);color:var(--primary)}.main{display:flex;flex-direction:column;min-width:0}.topbar{height:56px;border-bottom:1px solid var(--border);background:var(--bg-card);display:flex;align-items:center;padding:0 24px;gap:16px}.topbar-spacer{flex:1}.content{flex:1;padding:24px 32px;overflow-y:auto}.page{max-width:960px;margin:0 auto;display:flex;flex-direction:column;gap:24px}.page-header{display:flex;flex-direction:column;gap:4px}.section{display:flex;flex-direction:column;gap:12px}.section-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.loading,.empty{padding:24px;text-align:center;color:var(--text-muted);background:var(--bg-card);border:1px dashed var(--border);border-radius:var(--radius)}.error{color:var(--danger);background:var(--danger-bg);border:1px solid var(--danger);border-radius:var(--radius);padding:12px 16px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;gap:8px}.card-title{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}.card-value{font-size:22px;font-weight:600;color:var(--text-heading)}.card-value.text-gold{color:var(--gold)}.plan-card{gap:12px;position:relative}.plan-card-highlight{border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}.plan-flag{position:absolute;top:-10px;right:16px;background:var(--gold);color:var(--bg);font-size:11px;font-weight:600;padding:3px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em}.feature-list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;color:var(--text-muted)}.cadence-toggle{display:inline-flex;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:4px;gap:4px;width:fit-content}.toggle-option{background:transparent;border:none;color:var(--text-muted);padding:6px 14px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;transition:var(--transition);font-family:inherit;display:inline-flex;align-items:center;gap:8px}.toggle-option:hover{color:var(--text)}.toggle-option.active{background:var(--bg-elevated);color:var(--text-heading)}.topup-card{gap:8px;align-items:flex-start}.topup-price{margin-top:auto;font-size:20px;font-weight:600;color:var(--text-heading);padding-top:8px}.callout{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;background:var(--bg-card);border:1px solid var(--border);border-left:3px solid var(--primary);border-radius:var(--radius);padding:16px 20px}.callout.warn{border-left-color:var(--warning);background:var(--warning-bg)}.callout.good{border-left-color:var(--success);background:var(--success-bg)}.callout-actions{display:flex;gap:8px;flex-shrink:0}.token-display{display:block;margin-top:8px;padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);word-break:break-all;-webkit-user-select:all;user-select:all}.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:500;width:fit-content}.badge.tone-good{background:var(--success-bg);color:var(--success)}.badge.tone-warn{background:var(--warning-bg);color:var(--warning)}.badge.tone-bad{background:var(--danger-bg);color:var(--danger)}.badge.tone-neutral{background:var(--bg-elevated);color:var(--text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:6px 14px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;border:1px solid transparent;cursor:pointer;transition:var(--transition);font-family:inherit}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--text)}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--bg-elevated);color:var(--text);border-color:var(--accent2)}.btn-secondary:hover:not(:disabled){background:var(--bg-hover);border-color:var(--accent2)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--border)}.btn-ghost:hover:not(:disabled){background:var(--bg-hover)}.btn-danger{background:transparent;color:var(--danger);border-color:var(--danger)}.btn-danger:hover:not(:disabled){background:var(--danger-bg)}.btn-sm{padding:4px 10px;font-size:12px}.form{display:flex;flex-direction:column;gap:16px;max-width:420px}.field{display:flex;flex-direction:column;gap:6px}.field span{font-size:12px;font-weight:500;color:var(--text-muted)}.input{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;color:var(--text);font-size:14px;font-family:inherit;transition:var(--transition)}.input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-bg)}.input.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;letter-spacing:.05em}.inline-form{display:flex;gap:8px;align-items:stretch}.inline-form .input{flex:1;min-width:0}.form-actions{display:flex;gap:8px}.table{width:100%;border-collapse:collapse;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.table th,.table td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--border-light)}.table th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);font-weight:500;background:var(--bg-elevated)}.table tr:last-child td{border-bottom:none}.row-actions{text-align:right}
