/* cartesianecu.com/account/: the customer account's screens (assets/acct-*.js). On top of site.css (tokens, header,
   buttons, footer) and account.css (the page frame, the cards and states it shares with the profile link): the same
   panels, lines and orange, dark by default and light with the site's theme button. No inline style anywhere: every
   state is a class or an attribute. */

/* ---- frame ---- */
.ax{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin-bottom:18px}          /* the licence screen's cards follow it (#accProfile) */
.ax > *{min-width:0}                                     /* never wider than the column: a phone's row of tabs scrolls instead */
.acc-page main:focus{outline:none}
.ax-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.ax :focus-visible,.ax-dialog :focus-visible,.ax-foot-links a:focus-visible,.acc-page .skip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* a screen's heading takes the focus when the screen changes, and a card's heading after its action (a session signed out,
   the address changed, the erase asked for), for a screen reader to read it: a heading is no control, so it never draws a
   ring, whatever moved there; every control keeps its own ring for the keyboard */
.ax :is(h2,h3)[tabindex="-1"]:is(:focus,:focus-visible),.acc-card :is(h2,h3)[tabindex="-1"]:is(:focus,:focus-visible){outline:none}
/* ... and so does a message line that takes it after a removal's answer (acct-home.js focusAfterRemove()): no control either */
.ax p[tabindex="-1"]:is(:focus,:focus-visible){outline:none}
.acc-page .btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
/* the account's buttons say what they do ("Send a code to the new address"): they wrap on a phone instead of widening it */
.ax .btn,.ax-dialog .btn{white-space:normal;text-align:center;line-height:1.3}
.ax-sm{padding:8px 14px;font-size:14px;border-radius:10px}
.ax-muted,.ax-hint{color:var(--muted);font-size:14px}
.ax-hint{margin:10px 0 0}
.ax-intro{margin:8px 0 0;color:var(--muted);max-width:62ch}
/* a long address or licence holder's name in a sentence breaks rather than widens a phone's screen */
.ax-intro,.ax-ok,.ax-err,.ax-alert,.ax-hint,.ax-alt,.ax-dialog h2{overflow-wrap:anywhere}
.ax-opt{font-weight:400;color:var(--muted);font-size:13px}

/* the account's own message state, with the profile link's icon (account.css): an error = the sign */
#scrError::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l9.5 17h-19z' fill='none' stroke='%23ff8a3d' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M12 10v4M12 17v.5' fill='none' stroke='%23ff8a3d' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}

/* ---- the signed-in bar: the tabs, the address, sign out ---- */
.ax-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 18px;padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--radius);background:var(--panel)}
.ax-tabs{display:flex;flex-wrap:nowrap;gap:4px;list-style:none;margin:-4px;padding:4px;position:relative;min-width:0;max-width:calc(100% + 8px);
  overflow-x:auto;scrollbar-width:none}                  /* one row: a phone scrolls it sideways (the padding keeps the focus ring) */
.ax-tabs::-webkit-scrollbar{display:none}
.ax-tabs li{flex:none}
.ax-tabs a{display:inline-flex;align-items:center;min-height:38px;padding:6px 14px;border-radius:10px;color:var(--muted);font-weight:600;font-size:15px;white-space:nowrap}
@media (hover:hover){.ax-tabs a:hover{color:var(--text);background:var(--panel2)}}
.ax-tabs a[aria-current="page"]{color:var(--accent-text);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.ax-who{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-width:0}
.ax-who-t{color:var(--muted);font-size:14px;overflow-wrap:anywhere}

/* ---- banners: opened from the app, a success line ---- */
.ax-note,.ax-flash{margin:0;padding:12px 16px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));
  background:color-mix(in srgb,var(--accent) 8%,transparent);font-size:15px;overflow-wrap:anywhere}
.ax-note p{margin:0}
.ax-flash{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 10%,transparent)}
.ax-flash[data-kind="warn"]{border-color:color-mix(in srgb,var(--accent) 45%,var(--line));background:color-mix(in srgb,var(--accent) 9%,transparent)}
.ax-link{display:inline;padding:0;border:0;background:none;color:var(--accent-text);font:inherit;font-weight:600;text-decoration:underline;
  text-underline-offset:3px;cursor:pointer}
.ax-link:disabled{color:var(--muted);text-decoration:none;cursor:default}
.ax-handoff .ax-link{white-space:nowrap}

/* ---- screens and cards ---- */
.ax-screen[hidden]{display:none!important}
.ax-screen:not(.acc-state){display:grid;gap:16px;align-content:start;min-width:0}
.ax-screen > *{min-width:0}
.ax-screen > .ax-back{justify-self:start}
.ax-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.ax-head h2{font-size:22px}
.ax-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px 28px 26px;min-width:0}
.ax-card h2{font-weight:600;letter-spacing:-.02em;font-size:clamp(21px,3vw,26px)}
.ax-auth .ax-card{max-width:500px;margin:0;width:100%}          /* on the title's left edge, like every card under it */
.ax-wide{max-width:680px}
.ax-block > h3{font-size:18px;margin:0}
.ax-block h4{font-size:14px;font-weight:600;color:var(--muted);margin:18px 0 8px}
.ax-block form{margin-top:16px}
.ax-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-weight:600;font-size:15px}
.ax-back::before{content:"";width:8px;height:8px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-right:2px}
@media (hover:hover){.ax-back:hover{color:var(--accent-text)}}
.ax-alt{margin:14px 0 0;font-size:15px;color:var(--muted)}
.ax-alt a,.ax-hint a,.ax-intro a{color:var(--accent-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ax-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.ax-done h2{color:var(--ok-text)}

/* ---- forms ---- */
.ax-field{margin-top:16px}
.ax-field > label{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
.ax-field input,.ax-field textarea{display:block;width:100%;min-height:46px;padding:10px 14px;border:1px solid var(--line2);border-radius:12px;background:var(--bg);
  color:var(--text);font:inherit;font-size:16px;line-height:1.4;transition:border-color .15s}
.ax-field textarea{resize:vertical;min-height:88px}
.ax-field input:focus,.ax-field textarea:focus{border-color:var(--accent);outline:2px solid color-mix(in srgb,var(--accent) 35%,transparent);outline-offset:0}
.ax-field input[aria-invalid="true"]{border-color:var(--bad)}
.ax-field input::placeholder,.ax-field textarea::placeholder{color:var(--muted);opacity:1}
.ax-field input.mono{font-family:ui-monospace,'Cascadia Mono',Consolas,monospace;font-size:15px}
.ax-code{font-family:ui-monospace,'Cascadia Mono',Consolas,monospace;font-size:22px!important;letter-spacing:.3em;max-width:16em}
.ax-pw{position:relative}
.ax-pw input{padding-right:52px}
.ax-eye{position:absolute;right:4px;top:4px;width:40px;height:38px;border:0;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer}
.ax-eye::before{content:"";position:absolute;inset:0;margin:auto;width:20px;height:20px;background:currentColor;
  -webkit-mask:no-repeat center/20px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  mask:no-repeat center/20px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")}
.ax-eye[aria-pressed="true"]::before{
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 5.1A10.8 10.8 0 0 1 12 5c6.4 0 10 7 10 7a17.6 17.6 0 0 1-3.2 4.2M6.6 6.6A17 17 0 0 0 2 12s3.6 7 10 7a9.7 9.7 0 0 0 5.4-1.6M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3l18 18M10.6 5.1A10.8 10.8 0 0 1 12 5c6.4 0 10 7 10 7a17.6 17.6 0 0 1-3.2 4.2M6.6 6.6A17 17 0 0 0 2 12s3.6 7 10 7a9.7 9.7 0 0 0 5.4-1.6M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3C/svg%3E")}
@media (hover:hover){.ax-eye:hover{color:var(--accent-text)}}
.ax-check{display:flex;align-items:flex-start;gap:10px;margin-top:16px;font-size:15px;cursor:pointer}
.ax-check input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--accent)}
.ax-check a{color:var(--accent-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ax-err{margin:6px 0 0;color:var(--bad-text);font-size:14px;font-weight:600}
.ax-form-err{margin:16px 0 0;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--bad) 45%,var(--line));
  background:color-mix(in srgb,var(--bad) 10%,transparent)}
.ax-ok{margin:14px 0 0;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--ok) 45%,var(--line));
  background:color-mix(in srgb,var(--ok) 10%,transparent);color:var(--ok-text);font-weight:600;font-size:15px}
.ax-alert{margin:14px 0 0;padding:10px 14px;border-radius:10px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));
  background:color-mix(in srgb,var(--accent) 9%,transparent);font-size:15px}
.ax-alert[data-kind="ok"]{border-color:color-mix(in srgb,var(--ok) 45%,var(--line));background:color-mix(in srgb,var(--ok) 10%,transparent)}
.ax-submit{width:100%;margin-top:20px}
.ax-block .ax-submit,.ax-wide .ax-submit{width:auto}
.ax-resend{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:16px;font-size:15px}
.ax-resend .ax-muted{margin:0}
.ax-radios{border:0;margin:0;padding:0;display:grid;gap:8px}
.ax-radios legend{padding:0;margin-bottom:6px}
.ax-radios label{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:12px;cursor:pointer;font-weight:600}
.ax-radios label:has(input:checked){border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.ax-radios input{width:18px;height:18px;margin:0;accent-color:var(--accent)}
.ax-danger{color:var(--bad-text);border-color:color-mix(in srgb,var(--bad) 55%,var(--line2))}
@media (hover:hover){.ax-danger:hover{color:var(--bad-text);border-color:var(--bad)}}
/* the "yes" of a question whose action cannot be undone here (a computer removed): red, its words in the page's dark ink
   (4.8:1 on the red, both themes) */
.ax-danger-fill{background:var(--bad);color:var(--accent-ink);border-color:var(--bad)}
@media (hover:hover){.ax-danger-fill:hover{background:color-mix(in srgb,var(--bad) 82%,#fff);border-color:color-mix(in srgb,var(--bad) 82%,#fff)}}

/* "write to us" in a text: the link to the site's contact (account-i18n.js {contact}); an error line keeps its own colour */
.ax a[data-slot="contact"],.ax-dialog a[data-slot="contact"]{color:var(--accent-text);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ax .ax-err a[data-slot="contact"],.ax-dialog .ax-err a[data-slot="contact"]{color:inherit}

/* ---- the password rule, line by line ---- */
.ax-rules{margin-top:10px;font-size:14px;color:var(--muted)}
.ax-rules p{margin:0 0 4px}
.ax-rules ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.ax-rules li{display:flex;align-items:flex-start;gap:8px}
.ax-rules li::before{content:"";flex:none;width:16px;height:16px;margin-top:3px;border-radius:50%;border:2px solid var(--line2)}
.ax-rules li[data-st="ok"]{color:var(--ok-text)}
.ax-rules li[data-st="ok"]::before{border:0;background:var(--ok) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
.ax-rules li[data-st="no"]{color:var(--bad-text)}
.ax-rules li[data-st="no"]::before{border:0;background:var(--bad) no-repeat center/10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}

/* ---- lists: licences, requests, sessions, consents ---- */
.ax-list{display:grid;gap:18px}
.ax-list[aria-busy="true"]:empty::before{content:"";display:block;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--line),var(--line2),var(--line));
  background-size:200% 100%;animation:ax-wait 1.2s linear infinite}
@keyframes ax-wait{to{background-position:-200% 0}}
.ax-co > h3{font-weight:600;letter-spacing:-.02em;font-size:clamp(19px,2.6vw,23px);overflow-wrap:anywhere}
.ax-co > .ax-note{margin-top:14px}                       /* an expired licence's renew note under its row */
/* the distributor card of a reseller's customer (account.js resellerCard(), Faz 4 of the reseller plan): on the home (h3)
   and after the profile's licence card (h2); its values break inside the card on a phone */
.ax-rsl > h3{font-weight:600;letter-spacing:-.02em;font-size:clamp(19px,2.6vw,23px);margin-bottom:10px}
.ax-rsl-who{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;min-width:0}
.ax-rsl-name{font-size:17px;font-weight:600;overflow-wrap:anywhere}
.ax-rsl-country{color:var(--muted);font-size:14px}
.ax-rsl .acc-grid{margin-top:14px}
.ax-rsl .acc-grid dd{font-size:15px}
.ax-rsl .acc-grid a{color:var(--accent-text);text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.ax-rsl .acc-grid .ax-rsl-tel{white-space:nowrap}                 /* a phone number stays on one line */
.ax-rsl-d{margin:14px 0 0;color:var(--muted);font-size:14px}
.ax-addown{margin-top:14px;max-width:62ch}               /* Add a computer: a sign-in on it adds it (owner user) */
/* the owner's "Remove" on a computer of the licence's cards (account.css .acc-pc: name and seen on the left, open now on
   the right): a small button in the right column under the state, never a bar across the card */
.acc-pc .ax-rm{grid-column:2;justify-self:end}
.ax-lics,.ax-rows{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.ax-lic,.ax-row{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2);min-width:0}
.ax-lic-main,.ax-row-main{min-width:0;flex:1 1 15em}     /* narrower than that: the button goes under it */
.ax-lic-top,.ax-row-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.ax-lic-key{font-weight:700;font-size:15px}
.ax-lic-grid{display:flex;flex-wrap:wrap;gap:4px 22px;margin:8px 0 0}
.ax-lic-grid div{min-width:0}
.ax-lic-grid dt{display:inline;font-size:13px;color:var(--muted)}
.ax-lic-grid dt::after{content:": "}
.ax-lic-grid dd{display:inline;margin:0;font-size:14px;font-weight:600}
.ax-row-head b{overflow-wrap:anywhere}
.ax-row-head .acc-tag{margin-left:0}
.ax-row-meta{display:flex;flex-wrap:wrap;gap:2px 16px;margin-top:4px;color:var(--muted);font-size:13.5px}
.ax-row-main > .ax-muted{display:block;margin-top:2px;font-size:13.5px}
.ax-state{flex:none;font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px;color:var(--accent-text);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.ax-state[data-st="done"]{color:var(--ok-text);background:color-mix(in srgb,var(--ok) 14%,transparent)}
.ax-state[data-st="rejected"],.ax-state[data-st="cancelled"]{color:var(--muted);background:var(--line)}
.ax-empty h3{font-size:19px}
.ax-empty p{color:var(--muted);max-width:62ch}
.ax-steps{margin:16px 0 0;padding-left:22px;display:grid;gap:6px;color:var(--text)}
.ax-steps li::marker{color:var(--accent-text);font-weight:700}

/* ---- dialogs: the password asked again, a question ---- */
.ax-dialog{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:26px 24px 22px;border:1px solid var(--line2);
  border-radius:var(--radius);background:var(--panel);color:var(--text);box-shadow:var(--shadow)}
.ax-dialog::backdrop{background:rgba(8,10,12,.62)}
:root[data-theme="light"] .ax-dialog::backdrop{background:rgba(20,30,45,.38)}
.ax-dialog h2{font-size:20px}
.ax-dialog .ax-actions{justify-content:flex-end}

/* ---- the footer's links ---- */
.ax-foot-links{display:flex;flex-wrap:wrap;gap:6px 18px}

/* ---- phones ---- */
@media (max-width:760px){
  .ax-card{padding:22px 18px 20px}
  .ax-bar{padding:8px}
  .ax-lic,.ax-row{flex-wrap:wrap}
}
@media (max-width:420px){
  .acc-pc .ax-rm{grid-column:1;justify-self:start}      /* the card is one column on a phone (account.css) */
  .ax-rsl .acc-grid{grid-template-columns:minmax(0,1fr)} /* the distributor's e-mail, phone, website one under the other */
  .ax-block .ax-submit,.ax-wide .ax-submit,.ax-block > .btn{width:100%}
  .ax-tabs a{padding:6px 10px;font-size:14px}
  .ax-who{width:100%;justify-content:space-between}
  .ax-code{letter-spacing:.2em;font-size:20px!important}
  .ax-actions .btn{flex:1 1 auto}
}

/* ---- the Database page (acct-db.js; docs/api/customer-database.md): the search row, the file button, the results table ---- */
.ax-db-allow{margin:-6px 0 18px}
.ax-db-row{display:flex;gap:10px;align-items:stretch}
.ax-db-row input{flex:1;min-width:0}
.ax-db-row .btn{flex:none}
.ax-db-file{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.ax-db-file > .ax-muted{margin:0 0 10px}
.ax-db-filebtn{display:inline-block;cursor:pointer}
.ax-db-filebtn[aria-disabled="true"]{opacity:.6;pointer-events:none}
.ax-db-file #dbFileMsg,.ax-db-file #dbPick{margin-top:12px}
.ax-db-head{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;margin-bottom:12px}
.ax-db-head h3{margin:0;overflow-wrap:anywhere}
.ax-db-bulk{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.ax-db-bulk .ax-muted{margin:0;font-size:12.5px}
.ax-db-head > *{min-width:0}
.ax-db-bulk .btn{white-space:normal;text-align:start;line-height:1.3}   /* a long sentence on a narrow screen wraps instead of widening the page */
#scrDatabase,#dbResults{min-width:0;max-width:100%}
.ax-db-tablewrap{overflow-x:auto;min-width:0;max-width:100%}
.ax-db-table{width:100%;border-collapse:collapse;font-size:14.5px}
.ax-db-table th,.ax-db-table td{padding:9px 10px;text-align:start;border-bottom:1px solid var(--line);vertical-align:top}
.ax-db-table th{font-size:12.5px;font-weight:500;color:var(--muted);white-space:nowrap}
.ax-db-table td b{display:block;font-weight:600}
.ax-db-table td .ax-muted{display:block;font-size:12.5px;margin-top:2px}
.ax-db-table td.ax-mono{font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;font-size:13.5px;white-space:nowrap}
.ax-db-table .ax-tick{width:28px;padding-inline-end:0}
.ax-db-table .ax-tick input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent)}
.ax-db-table .ax-get{text-align:end;white-space:nowrap}
.ax-db-table tbody tr:last-child td{border-bottom:0}
@media (max-width:600px){
  .ax-db-row{flex-direction:column}
  .ax-db-head{flex-direction:column;align-items:stretch}
  .ax-db-bulk{align-items:stretch}
  .ax-db-bulk .btn{width:100%}
  /* a phone: each row as a block (the head row gone), the box at its start, the numbers with their labels, the download under them:
     seven columns never fit 320 px, and a table wider than the screen widens the page in a phone browser */
  .ax-db-table thead{display:none}
  .ax-db-table,.ax-db-table tbody,.ax-db-table tr,.ax-db-table td{display:block;width:auto}
  .ax-db-table tr{position:relative;padding:10px 0 10px 30px;border-bottom:1px solid var(--line)}
  .ax-db-table tbody tr:last-child{border-bottom:0}
  .ax-db-table td{padding:1px 0;border:0;white-space:normal;overflow-wrap:anywhere}
  .ax-db-table td.ax-tick{position:absolute;left:0;top:11px;width:auto;padding:0}
  .ax-db-table td.ax-mono{font-size:13.5px}
  .ax-db-table td.ax-mono::before{content:attr(data-l) ": ";font-family:"IBM Plex Sans",system-ui,sans-serif;font-size:12.5px;color:var(--muted)}
  .ax-db-table td.ax-get{text-align:start;padding-top:8px}
}