@media (max-width:620px) {
	body .company-filters { display:grid; gap:12px; margin-top:21px; }
	body .company-filters .search { margin-top:0; }
	body .company-filters .search input,body .company-filters .status-filter select { width:100%; }
	body .actions-cell { align-items:center; }
	body .actions-cell .row-actions { justify-content:flex-end; }
}
.table-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 21px; border-bottom:1px solid var(--line); background:var(--surface-alt); }.table-summary div { display:flex; align-items:baseline; gap:8px; }.table-summary strong { color:var(--heading); font-size:18px; }.table-summary span,.table-summary small { color:var(--muted); font-size:11px; }.table-summary small { font-family:DM Mono,monospace; text-transform:uppercase; letter-spacing:.3px; }.table-wrap .sort { position:relative; padding:4px 22px 4px 0; color:inherit; }.table-wrap .sort::after { content:'^v'; position:absolute; right:0; color:var(--muted); font-size:10px; }.table-wrap .sort[aria-sort='ascending']::after { content:'^'; color:var(--primary); }.table-wrap .sort[aria-sort='descending']::after { content:'v'; color:var(--primary); }.table-wrap .sort:hover { color:var(--heading); background:transparent; transform:none; }
@media (max-width:620px) { .table-summary { margin:0 -1px; padding:14px 16px; }.table-summary small { text-align:right; } }
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --success:#147a4b; --success-bg:#dff7e9; --danger:#c63a3a; --danger-bg:#fde8e6; --shadow:0 14px 34px rgba(32, 45, 35, .08); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--text); background:var(--page); font:14px/1.5 Manrope,sans-serif; }
button,input,select { font:inherit; }
.topbar { position:sticky; top:0; z-index:5; height:72px; display:flex; align-items:center; gap:42px; padding:0 max(26px,5vw); background:color-mix(in srgb,var(--surface) 94%,transparent); backdrop-filter:blur(18px); border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:8px; color:var(--heading); text-decoration:none; font-weight:800; font-size:16px; white-space:nowrap; }.brand b { display:grid; place-items:center; height:27px; width:27px; border-radius:8px 8px 8px 2px; color:#fff; background:var(--primary); font:800 20px Georgia,serif; }.brand small { color:var(--primary); font:500 9px/1 DM Mono,monospace; letter-spacing:1.1px; }
nav { display:flex; height:100%; gap:28px; } nav a { display:grid; place-items:center; position:relative; color:var(--muted); text-decoration:none; font-weight:700; } nav a:hover,nav a.active { color:var(--heading); } nav a.active::after { content:""; position:absolute; bottom:0; width:100%; height:3px; background:var(--primary); border-radius:3px 3px 0 0; }
.account { display:flex; align-items:center; gap:15px; margin-left:auto; }.account form { margin:0; }.user-name { color:var(--heading); font-weight:700; }.theme-picker { display:flex; align-items:center; gap:7px; padding-right:15px; border-right:1px solid var(--line); }.theme-picker label { color:var(--muted); font:10px DM Mono,monospace; text-transform:uppercase; }.theme-picker select { max-width:150px; color:var(--heading); background:transparent; border:0; cursor:pointer; font-size:12px; font-weight:700; outline:0; }
.shell { width:min(1320px,100%); margin:auto; padding:52px max(25px,4vw) 80px; }.page-heading { display:flex; align-items:end; justify-content:space-between; gap:28px; padding-bottom:27px; border-bottom:1px solid var(--line); margin-bottom:24px; }.eyebrow { margin:0 0 9px; color:var(--primary); font:500 10px DM Mono,monospace; letter-spacing:1.4px; }.page-heading h1,.auth-panel h1,dialog h2 { margin:0; color:var(--heading); font-size:31px; line-height:1.15; }.muted { color:var(--muted); margin:8px 0 0; }
.search { position:relative; display:block; }.search span { position:absolute; left:13px; top:50%; transform:translateY(-50%); color:var(--muted); font:10px DM Mono,monospace; }.search input { width:290px; padding:11px 12px 11px 65px; border:1px solid var(--line); border-radius:var(--element-radius); outline:none; background:var(--surface); color:var(--heading); }.search input:focus { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent); }.company-filters { display:flex; align-items:end; gap:10px; }.status-filter { display:block; }.status-filter span { display:block; margin:0 0 6px 2px; color:var(--muted); font:500 10px DM Mono,monospace; text-transform:uppercase; }.status-filter select { width:155px; padding:11px 12px; border:1px solid var(--line); border-radius:var(--element-radius); outline:none; background:var(--surface); color:var(--heading); cursor:pointer; }.status-filter select:focus { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent); }
.table-wrap,.profile,.empty,.metrics article { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }.table-wrap { overflow:auto; } table { width:100%; border-collapse:collapse; } th,td { padding:17px 21px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; } th { color:var(--muted); font:500 10px DM Mono,monospace; letter-spacing:.8px; text-transform:uppercase; } tbody tr { transition:background .18s ease; } tbody tr:hover { background:var(--surface-alt); } tbody tr:last-child td { border:0; } td strong { color:var(--heading); } td small { display:block; max-width:220px; overflow:hidden; color:var(--muted); text-overflow:ellipsis; }.sort { padding:0; color:inherit; border:0; background:transparent; cursor:pointer; font:inherit; text-transform:inherit; }
.credits { min-width:135px; color:var(--heading); font:500 11px DM Mono,monospace; }.credits i { display:block; height:5px; margin-top:7px; overflow:hidden; background:var(--line); border-radius:6px; }.credits b { display:block; height:100%; background:var(--primary); border-radius:inherit; }.badge { display:inline-flex; padding:5px 9px; border-radius:99px; font:700 11px Manrope,sans-serif; }.badge.active { color:var(--success); background:var(--success-bg); }.badge.suspended { color:var(--danger); background:var(--danger-bg); }.actions-cell { min-width:145px; text-align:center; }.status-action { width:125px; min-height:38px; }.status-action:focus-visible { outline:3px solid color-mix(in srgb,var(--primary) 28%,transparent); outline-offset:2px; } button { padding:9px 14px; border:1px solid transparent; border-radius:var(--element-radius); color:#fff; background:var(--primary); font-weight:800; cursor:pointer; transition:transform .15s ease,background .15s ease; } button:hover { background:var(--primary-hover); transform:translateY(-1px); } button:disabled { opacity:.55; cursor:wait; }.secondary { color:var(--heading); background:var(--surface-alt); border-color:var(--line); }.danger { background:transparent; color:var(--danger); border-color:color-mix(in srgb,var(--danger) 28%,transparent); }.danger:hover { color:#fff; background:var(--danger); }.link-button { padding:0; color:var(--muted); background:transparent; }.link-button:hover { color:var(--danger); background:transparent; }
.metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; }.metrics article { position:relative; padding:21px; overflow:hidden; }.metrics article::after { content:""; position:absolute; inset:auto -18px -24px auto; width:72px; height:72px; border-radius:50%; background:var(--surface-alt); }.metrics span,.metrics small { position:relative; z-index:1; display:block; color:var(--muted); font-size:11px; }.metrics strong { position:relative; z-index:1; display:block; margin:10px 0 4px; color:var(--heading); font-size:31px; line-height:1; }.profile { max-width:720px; padding:12px 25px; }.profile dl { margin:0; }.profile dl div { padding:16px 0; border-bottom:1px solid var(--line); }.profile dl div:last-child { border:0; }.profile dt { color:var(--muted); font:500 10px DM Mono,monospace; text-transform:uppercase; }.profile dd { margin:5px 0 0; color:var(--heading); font-weight:700; }.empty { padding:62px 24px; text-align:center; }.empty h2 { color:var(--heading); margin:0; }.empty p { color:var(--muted); }
.notice { padding:12px 15px; margin:0 0 23px; border-radius:var(--element-radius); font-weight:600; }.notice.error { color:#8c2727; background:var(--danger-bg); }.notice.success { color:#17633d; background:var(--success-bg); } dialog { width:min(410px,calc(100% - 32px)); padding:0; color:var(--text); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 22px 60px rgba(25,34,27,.27); } dialog::backdrop { background:rgba(20,28,22,.46); backdrop-filter:blur(3px); } dialog form { padding:26px; } dialog h2 { font-size:23px; } .dialog-actions { display:flex; justify-content:end; gap:9px; margin-top:25px; }
.auth-page { display:grid; min-height:100vh; place-items:center; padding:24px; background:radial-gradient(circle at 10% 20%,var(--surface-alt),transparent 27%),var(--page); }.auth-panel { width:min(440px,100%); padding:38px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }.auth-panel::before { content:""; display:block; width:39px; height:5px; margin-bottom:25px; border-radius:5px; background:var(--primary); }.auth-panel h1 { font-size:29px; }.form-stack { display:grid; gap:16px; margin-top:26px; }.form-stack label { color:var(--heading); font-size:12px; font-weight:800; }.form-stack input { display:block; width:100%; padding:11px 12px; margin-top:7px; color:var(--heading); background:var(--surface); border:1px solid var(--line); border-radius:var(--element-radius); outline:none; }.form-stack input:focus { border-color:var(--primary); }.compact { margin-top:13px; }.auth-panel details { margin-top:25px; color:var(--primary); font-weight:700; }.auth-panel summary { cursor:pointer; }
@media (max-width:840px) { .topbar { gap:20px; }.theme-picker label,.user-name { display:none; }.theme-picker { padding-right:4px; border:0; }.metrics { grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px) { .topbar { height:auto; min-height:64px; padding:12px 18px 0; flex-wrap:wrap; }.account { gap:10px; }.brand span { font-size:14px; } nav { order:3; width:100%; height:38px; gap:20px; overflow:auto; }.shell { padding:33px 16px 58px; }.page-heading { display:block; }.search { margin-top:21px; }.search input { width:100%; }.metrics { grid-template-columns:1fr; } .table-wrap { border:0; background:transparent; box-shadow:none; } table,tbody,tr,td { display:block; } table thead { display:none; } tbody { display:grid; gap:12px; } tr { padding:13px; background:var(--surface); border:1px solid var(--line); border-radius:var(--element-radius); box-shadow:0 5px 13px rgba(28,40,30,.04); } td { display:flex; justify-content:space-between; gap:14px; padding:6px 2px; border:0; text-align:right; white-space:normal; } td::before { content:attr(data-label); color:var(--muted); font:500 10px DM Mono,monospace; text-align:left; text-transform:uppercase; } td small { display:none; }.credits { text-align:right; }.auth-panel { padding:29px 24px; } }:root{--ink:#1e293b;--muted:#64748b;--paper:#f7fafc;--line:#dbe4ee;--accent:#0f766e;--danger:#be123c;--active:#15803d;--suspended:#b91c1c}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px Georgia,serif}button,input{font:inherit}.topbar{min-height:68px;padding:0 5vw;display:flex;align-items:center;gap:38px;background:#fff;border-bottom:1px solid var(--line)}.brand{font-family:Impact,Haettenschweiler,sans-serif;letter-spacing:1px;color:var(--ink);text-decoration:none}.brand span{color:var(--accent);font-size:12px}nav{display:flex;align-self:stretch;gap:22px}nav a{display:flex;align-items:center;color:var(--muted);text-decoration:none;border-bottom:3px solid transparent}nav a.active{color:var(--accent);border-color:var(--accent)}.account{margin-left:auto;display:flex;align-items:center;gap:15px;font-size:14px}.account form{margin:0}.link-button{border:0;background:transparent;color:var(--danger);cursor:pointer}.shell{max-width:1220px;margin:auto;padding:54px 28px}.page-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}h1,h2{font-family:Impact,Haettenschweiler,sans-serif;font-weight:400;letter-spacing:1px;margin:0 0 8px}h1{font-size:40px}.eyebrow{color:var(--accent);font:700 12px Arial,sans-serif;letter-spacing:1.4px;margin:0 0 9px}.muted{color:var(--muted);margin:0}.search{font:700 12px Arial,sans-serif;color:var(--muted)}.search span{display:block;margin-bottom:7px}.search input{width:280px;padding:10px 12px;border:1px solid var(--line);border-radius:4px}.table-wrap,.profile,.empty,.metrics article{background:#fff;border:1px solid var(--line);border-radius:6px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:17px 18px;text-align:left;border-bottom:1px solid var(--line)}th{font:700 12px Arial,sans-serif;color:var(--muted);letter-spacing:.8px;text-transform:uppercase}tbody tr:last-child td{border:0}tbody tr:hover{background:#f8fffd}td small{display:block;color:var(--muted);margin-top:4px}.sort{border:0;background:transparent;font:inherit;color:inherit;cursor:pointer;padding:0}.credits{min-width:118px;font:13px Arial,sans-serif}.credits i{display:block;height:5px;margin-top:7px;background:#e5e7eb;border-radius:4px;overflow:hidden}.credits b{display:block;height:100%;background:var(--accent)}.badge{display:inline-block;border-radius:999px;padding:5px 9px;font:700 12px Arial,sans-serif}.badge.active{background:#dcfce7;color:var(--active)}.badge.suspended{background:#ffe4e6;color:var(--suspended)}button{border:0;border-radius:4px;background:var(--accent);color:#fff;padding:10px 15px;cursor:pointer;font-weight:700}button:disabled{opacity:.6;cursor:wait}.secondary{background:#e2e8f0;color:var(--ink)}.danger{background:var(--danger)}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.metrics article{padding:22px}.metrics span,.metrics small{display:block;color:var(--muted);font:13px Arial,sans-serif}.metrics strong{display:block;font:38px Impact,Haettenschweiler,sans-serif;letter-spacing:1px;margin:11px 0}.profile{padding:25px;max-width:680px}.profile dl{margin:0}.profile dl div{padding:15px 0;border-bottom:1px solid var(--line)}.profile dl div:last-child{border:0}.profile dt{font:700 12px Arial,sans-serif;color:var(--muted);text-transform:uppercase}.profile dd{margin:6px 0 0}.empty{padding:54px;text-align:center}.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(135deg,#ecfdf5,#f8fafc)}.auth-panel{width:min(440px,100%);background:#fff;border:1px solid var(--line);border-top:5px solid var(--accent);padding:37px}.auth-panel h1{font-size:31px}.form-stack{display:grid;gap:16px;margin-top:26px}.form-stack label{font:700 13px Arial,sans-serif}.form-stack input{display:block;width:100%;margin-top:7px;padding:11px;border:1px solid var(--line);border-radius:4px}.compact{margin-top:10px}.auth-panel details{margin-top:25px;color:var(--accent)}.notice{padding:12px 14px;border-radius:4px;font:14px Arial,sans-serif}.notice.error{background:#ffe4e6;color:#9f1239}.notice.success{background:#dcfce7;color:#166534}dialog{border:0;border-radius:6px;box-shadow:0 20px 60px #0f172a44;max-width:390px;padding:0}dialog::backdrop{background:#0f172a88}dialog form{padding:25px}.dialog-actions{display:flex;justify-content:end;gap:10px;margin-top:25px}@media(max-width:720px){.topbar{padding:13px 20px;gap:15px;flex-wrap:wrap}.account{margin-left:auto}nav{order:3;width:100%;height:35px;gap:20px}.shell{padding:32px 16px}.page-heading{display:block}.search{margin-top:22px}.search input{width:100%}.metrics{grid-template-columns:repeat(2,1fr)}table thead{display:none}table,tbody,tr,td{display:block}tr{padding:12px;border-bottom:1px solid var(--line)}td{border:0;padding:6px 5px;display:flex;justify-content:space-between;gap:16px;text-align:right}td::before{content:attr(data-label);font:700 12px Arial,sans-serif;color:var(--muted);text-align:left}td small{display:none}.account span{display:none}}@media(max-width:420px){.metrics{grid-template-columns:1fr}.brand{font-size:14px}}
/* Acciones de empresa: botones con icono */
.actions-cell { min-width:220px; }
.row-actions { display:flex; align-items:center; justify-content:center; gap:8px; }
.row-actions .btn-action { display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:7px 12px; border:1px solid var(--line); border-radius:999px; color:var(--heading); background:var(--surface); font:700 12px Manrope,sans-serif; letter-spacing:.1px; box-shadow:0 1px 2px rgba(20,28,22,.06); transition:background .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.row-actions .btn-action svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.row-actions .btn-action:hover { transform:translateY(-1px); box-shadow:0 6px 14px rgba(20,28,22,.1); }
.row-actions .btn-action:focus-visible { outline:3px solid color-mix(in srgb,var(--primary) 30%,transparent); outline-offset:2px; }
.row-actions .btn-action:disabled { opacity:.55; cursor:wait; transform:none; box-shadow:none; }
.row-actions .credit-action { color:var(--primary); background:color-mix(in srgb,var(--primary) 9%,var(--surface)); border-color:color-mix(in srgb,var(--primary) 30%,transparent); }
.row-actions .credit-action:hover { color:#fff; background:var(--primary); border-color:var(--primary); }
.row-actions .status-action.is-suspend { color:var(--danger); border-color:color-mix(in srgb,var(--danger) 28%,transparent); }
.row-actions .status-action.is-suspend:hover { color:#fff; background:var(--danger); border-color:var(--danger); }
.row-actions .status-action.is-activate { color:var(--success); border-color:color-mix(in srgb,var(--success) 30%,transparent); }
.row-actions .status-action.is-activate:hover { color:#fff; background:var(--success); border-color:var(--success); }

/* Modal de abono */
#credits-dialog { width:min(430px,calc(100% - 32px)); max-width:none; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); color:var(--text); }
#credits-dialog form { padding:26px; }
#credits-dialog h2 { margin:0; color:var(--heading); font:800 23px/1.2 Manrope,sans-serif; letter-spacing:0; }
#credits-dialog .dialog-subtitle { margin:4px 0 20px; color:var(--muted); font-weight:600; }
#credits-dialog .field span { display:block; margin-bottom:7px; color:var(--heading); font-size:12px; font-weight:800; }
#credits-dialog .field input { width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--element-radius); outline:none; background:var(--surface); color:var(--heading); font:600 18px DM Mono,monospace; }
#credits-dialog .field input:focus { border-color:var(--primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 14%,transparent); }
#credits-dialog .field input[aria-invalid] { border-color:var(--danger); }
#credits-dialog .quick-amounts { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
#credits-dialog .quick-amounts button { padding:6px 12px; border:1px solid var(--line); border-radius:999px; color:var(--heading); background:var(--surface-alt); font:500 12px DM Mono,monospace; }
#credits-dialog .quick-amounts button:hover { color:#fff; background:var(--primary); border-color:var(--primary); }
#credits-dialog .field-error { margin:12px 0 0; color:var(--danger); font-size:13px; font-weight:600; }
#credits-dialog .dialog-actions button { border-radius:var(--element-radius); font-family:Manrope,sans-serif; }
#credits-dialog .dialog-actions button[type=submit] { background:var(--primary); color:#fff; }
#credits-dialog .dialog-actions .secondary { color:var(--heading); background:var(--surface-alt); border:1px solid var(--line); }

/* Toast */
.toast { position:fixed; right:24px; bottom:24px; z-index:20; max-width:min(380px,calc(100% - 32px)); padding:13px 16px; border-radius:var(--element-radius); box-shadow:0 14px 34px rgba(20,28,22,.18); font-weight:700; }
.toast.success { color:#17633d; background:var(--success-bg); border:1px solid color-mix(in srgb,var(--success) 25%,transparent); }
.toast.error { color:#8c2727; background:var(--danger-bg); border:1px solid color-mix(in srgb,var(--danger) 25%,transparent); }
@media (max-width:620px) { .actions-cell { min-width:0; } .toast { left:16px; right:16px; bottom:16px; } }

/* Bitacora de timbres */
.row-actions .log-action { position:relative; justify-content:center; width:34px; padding:7px 0; color:var(--heading); text-decoration:none; }
.row-actions .log-action:hover { color:#fff; background:var(--heading); border-color:var(--heading); }
.row-actions .log-action::after { content:attr(title); position:absolute; bottom:calc(100% + 8px); left:50%; z-index:3; padding:5px 9px; border-radius:6px; color:#fff; background:var(--heading); font:700 11px Manrope,sans-serif; white-space:nowrap; opacity:0; pointer-events:none; transform:translate(-50%,4px); transition:opacity .15s ease,transform .15s ease; }
.row-actions .log-action:hover::after,.row-actions .log-action:focus-visible::after { opacity:1; transform:translate(-50%,0); }
.link-back { color:var(--primary); font-weight:700; text-decoration:none; white-space:nowrap; }
.link-back:hover { text-decoration:underline; }
.log-metrics { margin-bottom:24px; }
.log-ledger { --log-yellow:#ffe45c; --log-yellow-hover:#ffd929; --log-blue:#1e40af; --log-blue-soft:#eef3ff; --log-blue-line:#dbe5ff; overflow:hidden; background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
.log-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 22px; border-bottom:1px solid var(--line); }
.log-toolbar strong { display:block; color:var(--heading); font:800 15px Manrope,sans-serif; }
.log-toolbar span { color:var(--muted); font-size:12px; }
.log-toolbar-actions { display:flex; gap:8px; }
.log-toolbar-actions button { padding:7px 13px; border:1px solid var(--line); border-radius:999px; color:var(--heading); background:#fff; font:700 12px Manrope,sans-serif; cursor:pointer; transition:background .15s ease,border-color .15s ease; }
.log-toolbar-actions button:hover { background:var(--surface-alt); border-color:var(--heading); }
.log-group + .log-group { border-top:1px solid rgba(0,0,0,.14); }
.log-credit { display:grid; grid-template-columns:32px minmax(170px,1fr) minmax(200px,1.3fr) auto; align-items:center; gap:18px; padding:16px 22px; color:#000; background:var(--log-yellow); cursor:pointer; list-style:none; transition:background .15s ease; }
.log-credit::-webkit-details-marker { display:none; }
.log-credit:hover { background:var(--log-yellow-hover); }
.log-credit:focus-visible { outline:3px solid #000; outline-offset:-3px; }
.log-chevron { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:rgba(0,0,0,.08); }
.log-chevron svg { width:16px; height:16px; fill:none; stroke:#000; stroke-width:2.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s ease; }
.log-group[open] .log-chevron { background:#000; }
.log-group[open] .log-chevron svg { stroke:var(--log-yellow); transform:rotate(90deg); }
.log-credit-main small { display:block; font:700 10px DM Mono,monospace; text-transform:uppercase; letter-spacing:.8px; opacity:.65; }
.log-credit-main strong { display:block; font:800 18px/1.25 Manrope,sans-serif; }
.log-meter { display:block; height:7px; overflow:hidden; background:rgba(0,0,0,.14); border-radius:99px; }
.log-meter b { display:block; height:100%; background:#000; border-radius:inherit; }
.log-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.log-chips span { padding:2px 9px; border-radius:99px; background:rgba(255,255,255,.55); font:700 11px Manrope,sans-serif; }
.log-credit-amount { min-width:84px; font:800 24px/1 Manrope,sans-serif; text-align:right; }
.log-credit-amount small { display:block; margin-top:3px; font:700 10px DM Mono,monospace; text-transform:uppercase; letter-spacing:.8px; opacity:.65; }
.log-panel { padding:6px 22px 16px 72px; background:#fff; border-left:4px solid var(--log-blue); animation:log-reveal .2s ease; }
@keyframes log-reveal { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
.log-panel-head,.log-usage { display:grid; grid-template-columns:40px minmax(130px,170px) 1fr 60px; align-items:center; gap:14px; }
.log-panel-head { padding:10px 12px 8px; color:#64748b; font:500 10px DM Mono,monospace; text-transform:uppercase; letter-spacing:.6px; border-bottom:1px solid var(--log-blue-line); }
.log-panel-head span:last-child,.log-usage .log-debit { justify-self:end; }
.log-list { max-height:420px; margin:0; padding:0; overflow:auto; list-style:none; }
.log-usage { padding:8px 12px; color:var(--log-blue); font:600 12px DM Mono,monospace; border-bottom:1px solid var(--log-blue-line); transition:background .12s ease; }
.log-usage:nth-child(even) { background:#fafcff; }
.log-usage:hover { background:var(--log-blue-soft); }
.log-usage:last-child { border-bottom:0; }
.log-index { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; color:var(--log-blue); background:var(--log-blue-soft); font:700 11px DM Mono,monospace; }
.log-uuid { display:flex; align-items:center; gap:8px; min-width:0; }
.log-uuid code { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:600 12px DM Mono,monospace; letter-spacing:.2px; }
.log-copy { display:grid; place-items:center; flex:none; width:26px; height:26px; padding:0; border:1px solid transparent; border-radius:6px; color:var(--log-blue); background:transparent; cursor:pointer; opacity:.7; transition:opacity .12s ease,background .12s ease,border-color .12s ease; }
.log-copy svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.log-usage:hover .log-copy,.log-copy:focus-visible { opacity:1; }
.log-copy:hover { background:#fff; border-color:var(--log-blue-line); }
.log-copy.is-copied { color:#fff; background:var(--log-blue); opacity:1; }
.log-debit { padding:2px 9px; border-radius:99px; color:var(--log-blue); background:var(--log-blue-soft); font:700 11px DM Mono,monospace; }
.log-none { display:flex; align-items:center; gap:8px; margin:0; padding:12px; color:#64748b; font-size:13px; }
.log-none svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
@media (max-width:820px) {
	.log-credit { grid-template-columns:32px 1fr auto; }
	.log-credit-progress { grid-column:2 / -1; grid-row:2; }
	.log-panel { padding-left:22px; }
}
@media (max-width:620px) {
	.log-toolbar { flex-direction:column; align-items:flex-start; }
	.log-credit { gap:12px; padding:14px 16px; }
	.log-credit-progress { grid-column:1 / -1; }
	.log-panel { padding:4px 12px 12px; }
	.log-panel-head { display:none; }
	.log-usage { grid-template-columns:26px 1fr auto; row-gap:4px; }
	.log-uuid { grid-column:2 / -1; grid-row:2; }
	.log-debit { grid-column:3; grid-row:1; }
}
.log-toolbar-actions button:focus-visible,.log-copy:focus-visible { outline:3px solid var(--log-blue); outline-offset:2px; }
@media (hover:none) { .log-copy { opacity:1; } }
@media (prefers-reduced-motion:reduce) {
	.log-panel { animation:none; }
	.log-credit,.log-chevron svg,.log-usage,.log-copy,.log-toolbar-actions button { transition:none; }
}