:root{ --bg:#0b0c10; --card:#1f2833; --text:#c5c6c7; --accent:#66fcf1; --soft:#45a29e; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:system-ui,Segoe UI,Arial; background:var(--bg); color:var(--text); }
header{ display:flex; justify-content:space-between; align-items:center; padding:16px 24px; }
h1{ margin:0; font-size:18px; color:var(--accent); }
.btn{ display:inline-block; padding:8px 12px; color:#000; background:var(--accent); text-decoration:none; border-radius:6px; border:none; cursor:pointer; font-size:14px; }
.btn.secondary{ background:var(--soft); color:#000; margin-right:8px; margin-top:4px; }
.btn.tiny{ padding:4px 8px; font-size:12px; margin-left:6px; }
.tag{ display:inline-block; padding:4px 8px; background:#26313f; color:#9ad7d3; border-radius:4px; margin-right:8px; }
main{ padding:24px; }
.card{ background:var(--card); padding:16px; border-radius:8px; margin-bottom:16px; }
.card-header{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.hint{ color:#8ca3a1; font-size:14px; margin:8px 0 0; }
.grid{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
label{ display:block; margin:8px 0; }
input[type="text"], textarea{ width:100%; padding:8px; border-radius:6px; border:1px solid #3a4756; background:#12161c; color:#e6e6e6; }
button{ padding:10px 14px; border:none; background:var(--soft); color:#000; border-radius:6px; cursor:pointer; }
.ocr{ max-height:400px; overflow:auto; background:#12161c; padding:8px; border-radius:6px; border:1px solid #3a4756; }
.error{ background:#5a1a1a; color:#ffd4d4; padding:8px; border-radius:6px; margin-bottom:12px; }
.toolbar .toolbar-actions{ display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px; }
.toolbar h2{ margin-top:0; }
.review-block{ margin-bottom:24px; }
.reorder-buttons .btn{ margin-left:4px; }
.skip-toggle{ display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.card.actions{ text-align:right; }
.card.actions button{ min-width:220px; font-weight:600; }
.result-item{ background:#16212d; border-radius:6px; padding:10px 12px; margin-bottom:12px; line-height:1.6; }
footer{ padding:16px 24px; color:#8ca3a1; }
@media (max-width: 960px){ .grid{ grid-template-columns:1fr; } }

.billing-summary .summary-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
.billing-summary .summary-meta{min-width:200px;font-size:14px;line-height:1.6;}
.billing-summary .summary-meta span{color:#9ad7d3;margin-right:6px;}
.summary-plan{margin:4px 0; font-size:16px;}
.summary-plan-hint{font-size:14px;color:#8ca3a1;margin:0;}
.status-banner{margin-top:12px;padding:10px 14px;border-radius:6px;font-size:14px;}
.status-banner.success{background:#1f4037;color:#b9f6ca;}
.status-banner.warning{background:#5a1a1a;color:#ffd4d4;}
.billing-option{display:flex;justify-content:space-between;gap:16px;align-items:center;flex-wrap:wrap;}
.billing-option .option-text{max-width:600px;}
.billing-option .option-actions{min-width:180px;text-align:right;}
.btn.disabled{background:#394855;color:#9aa6b2;cursor:not-allowed;}
.history-list{list-style:none;margin:0;padding:0;line-height:1.8;}
.history-list li{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #25313f;padding:6px 0;}
.history-list li:last-child{border-bottom:none;}
.history-time{color:#8ca3a1;font-size:13px;}
.history-note{flex:1;}


.billing-option .option-actions.wide{min-width:100%;}
.pack-form{display:flex;flex-direction:column;gap:12px;}
.pack-options{display:flex;flex-direction:column;gap:8px;}
.pack-option{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #394855;border-radius:6px;background:#121b29;}
.pack-option input{accent-color:var(--accent);} 
.pack-price{font-weight:600;color:var(--accent);} 
.pack-credits{color:#bfc7d5;}

