/* SeenPal UI Kit v0.1 -> seo-geo-service. Reference copy: docs/design/seenpal-ui-kit-v0.1/.
   Tokens come from SeenPal.tokens.json. Radius 0, no shadows, 1px lines.
   No inline styles anywhere: the service CSP is style-src 'self'. */

@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/plex-mono-400.woff") format("woff")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/plex-mono-500.woff") format("woff")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/plex-sans-400.woff") format("woff")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/plex-sans-500.woff") format("woff")}
@font-face{font-family:"Sofia Sans Extra Condensed";font-style:normal;font-weight:800;font-display:swap;src:url("fonts/sofia-extra-condensed-800.woff") format("woff")}

/* ---- Tokens ---- */
:root{
  color-scheme:light dark;
  --paper:#f7f7f5;--panel:#ffffff;--ink:#111112;--muted:#5b5b66;--line:#dadadd;
  --purple:#7635da;--acid:#d6ff3f;--red:#a62b37;--wash:#f0e9fc;
  --on-acid:#111112;--solid:#111112;--on-solid:#ffffff;--on-purple:#ffffff;
  --display:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#141416;--panel:#1b1b1e;--ink:#f2f2ed;--muted:#ababba;--line:#38383f;
    --purple:#b28aff;--red:#ff9da4;--wash:#2d233e;
    --solid:#f2f2ed;--on-solid:#141416;--on-purple:#141416;
  }
}
:root[data-theme="light"]{color-scheme:light}
:root[data-theme="dark"]{
  color-scheme:dark;
  --paper:#141416;--panel:#1b1b1e;--ink:#f2f2ed;--muted:#ababba;--line:#38383f;
  --purple:#b28aff;--red:#ff9da4;--wash:#2d233e;
  --solid:#f2f2ed;--on-solid:#141416;--on-purple:#141416;
}

/* ---- Base ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.5 var(--sans);overflow-wrap:break-word}
[hidden]{display:none!important}
h1,h2,h3,p,ul,ol,dl,figure{margin:0}
a{color:var(--purple);text-underline-offset:3px}
a:hover{color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}
button,a,input,select,textarea,summary{touch-action:manipulation}
:focus-visible{outline:2px solid var(--purple);outline-offset:3px}
strong{font-weight:500}
code,pre,kbd{font-family:var(--mono)}
code{font-size:13px;overflow-wrap:anywhere}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:8px;top:-60px;z-index:10;background:var(--solid);color:var(--on-solid);padding:12px 16px;font:500 13px var(--mono);text-decoration:none}
.skip:focus{top:8px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}

/* ---- Headings ---- */
h1{font:800 clamp(40px,6.5vw,56px)/.95 var(--display);text-transform:uppercase;letter-spacing:-.9px;margin-bottom:var(--s5);overflow-wrap:anywhere}
h2{font:500 14px/1.4 var(--mono);text-transform:uppercase;margin:0 0 var(--s4)}
h3{font:500 14px/1.4 var(--mono);color:var(--purple);margin:var(--s5) 0 var(--s3)}
h3:first-child{margin-top:0}
.code{font:13px/1.4 var(--mono);letter-spacing:.3px;color:var(--purple);text-transform:uppercase}
.summary{font:14px/1.6 var(--mono);border-left:2px solid var(--purple);background:var(--wash);padding:13px 14px;margin:var(--s4) 0 var(--s5);max-width:60rem}
.hint,.help{font:13px/1.5 var(--mono);color:var(--muted)}
p+p,p+.table-wrap,.table-wrap+p{margin-top:var(--s3)}

/* ---- Buttons ---- */
button,a.button{
  display:inline-flex;justify-content:center;align-items:center;gap:12px;min-height:46px;padding:13px 18px;
  border:1px solid var(--solid);border-radius:0;background:var(--solid);color:var(--on-solid);
  font:500 13px/1.25 var(--mono);text-transform:uppercase;letter-spacing:.3px;text-align:left;text-decoration:none;cursor:pointer;
  transition:background .16s,color .16s,transform .16s;
}
button:hover:not(:disabled),a.button:hover{background:var(--purple);border-color:var(--purple);color:var(--on-purple)}
button:active:not(:disabled),a.button:active{transform:translate(1px,1px)}
button:disabled{opacity:.38;cursor:not-allowed}
.button.secondary,button.secondary{background:transparent;color:var(--ink);border-color:var(--line)}
.button.secondary:hover,button.secondary:hover:not(:disabled){background:var(--purple);border-color:var(--purple);color:var(--on-purple)}
.button.violet{background:var(--purple);border-color:var(--purple);color:var(--on-purple)}
.button.violet:hover{background:var(--solid);border-color:var(--solid);color:var(--on-solid)}
button.small{min-height:36px;padding:7px 12px}
.arrow{font-size:22px;line-height:.7;font-weight:400;color:var(--purple)}
button:hover:not(:disabled) .arrow,a.button:hover .arrow{color:var(--acid)}
.button.violet .arrow{color:var(--acid)}
.textlink{font:13px/1.4 var(--mono);text-transform:uppercase;color:var(--ink);text-decoration:none;padding:8px 0;min-height:40px;display:inline-flex;align-items:center}
.textlink:hover{color:var(--purple)}
.separator{color:var(--purple);font:14px var(--mono)}
.theme-toggle{min-height:36px;padding:7px 10px;background:transparent;color:var(--ink);border-color:var(--line);font:13px/1.25 var(--mono);text-transform:none;letter-spacing:0}

/* ---- Logo ---- */
.mark{display:block;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;width:40px;height:40px;flex-shrink:0}
.brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--ink);font:500 24px/1 var(--sans);letter-spacing:-1px;text-decoration:none}
.brand:hover{color:var(--ink)}
.brand .pal{color:var(--purple)}

/* ---- Cabinet header ---- */
.appbar{background:var(--panel);border-bottom:1px solid var(--line)}
.appbar-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--s3) var(--s5);padding:var(--s3) var(--s5);max-width:1280px;margin:0 auto}
.account{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s3) var(--s4);min-width:0}
.account form{margin:0}
.balance{font:13px/1.5 var(--mono);color:var(--muted);min-width:0;overflow-wrap:anywhere}
.balance strong{color:var(--ink)}
.tabs{display:flex;flex-wrap:wrap;max-width:1280px;margin:0 auto;padding:0 var(--s4)}
.tabs a{font:14px/1.2 var(--mono);color:var(--muted);text-decoration:none;padding:13px 15px;min-height:46px;display:inline-flex;align-items:center;border-bottom:2px solid transparent}
.tabs a:hover{color:var(--purple)}
.tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--purple);background:var(--wash)}
.appbar-nav{border-top:1px solid var(--line)}

/* ---- Content ---- */
main{max-width:1280px;margin:0 auto;padding:var(--s6) var(--s5) var(--s7);min-width:0}
main.bleed{max-width:none;padding:0}
main>section:not(:first-child),main section section{margin-top:var(--s6)}
main section section{padding-top:var(--s5);border-top:1px solid var(--line)}
.lead-hint{margin-bottom:var(--s5)}
form+.hint{margin-top:var(--s5)}
section>p+form,section>.notice+form{margin-top:var(--s4)}

/* ---- Forms ---- */
.stack{display:grid;gap:var(--s4);max-width:36rem}
.stack>*{min-width:0}
label{font:13px/1.4 var(--mono)}
label{display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.check{flex-direction:row;align-items:center;gap:10px;font:14px/1.4 var(--mono);min-height:44px}
.check:has(input:disabled){color:var(--muted)}
input[type="checkbox"]{width:17px;height:17px;margin:0;flex-shrink:0;accent-color:var(--purple)}
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea{
  display:block;width:100%;min-height:46px;padding:12px;border:1px solid var(--line);border-radius:0;
  background:var(--panel);color:var(--ink);font:14px/1.4 var(--mono);
}
textarea{resize:vertical;min-height:120px}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--red)}
input:disabled,select:disabled,textarea:disabled{opacity:.45}
input:-webkit-autofill{-webkit-text-fill-color:var(--ink);box-shadow:0 0 0 100px var(--panel) inset}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
fieldset{border:1px solid var(--line);margin:0;padding:var(--s3) var(--s4) var(--s4);min-width:0}
legend{font:500 13px/1.4 var(--mono);text-transform:uppercase;padding:0 var(--s2)}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:0 var(--s4)}
.error{font:13px/1.5 var(--mono);color:var(--red)}
.filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s3) var(--s4);margin-bottom:var(--s4)}
.filters label{min-width:min(100%,180px)}
.filters input[type="search"]{min-width:220px}
details{border:1px solid var(--line);padding:0 var(--s3)}
details[open]{padding-bottom:var(--s3)}
summary{cursor:pointer;font:500 13px/1.4 var(--mono);text-transform:uppercase;padding:var(--s3) 0;min-height:44px;display:flex;align-items:center}
details .hint{margin-bottom:var(--s3)}

/* ---- Messages, tags, empty ---- */
.notice{padding:13px 14px;font:13px/1.6 var(--mono);background:var(--wash);border-left:2px solid var(--purple);margin-bottom:var(--s4);max-width:60rem}
.notice.success{background:var(--acid);color:var(--on-acid);border-left-color:var(--on-acid)}
.notice.danger{color:var(--red);background:var(--panel);border:1px solid var(--line);border-left:2px solid var(--red)}
.tag{display:inline-block;padding:4px 7px;font:12px/1.4 var(--mono);border:1px solid var(--line);white-space:nowrap}
.tag.urgent{color:var(--red);border-color:var(--red)}
.empty{border:1px dashed var(--line);padding:var(--s5);text-align:center;background:var(--panel)}
.empty .mark{width:65px;height:65px;margin:0 auto 12px}
.empty p{font:14px/1.5 var(--mono);color:var(--muted);margin:0 0 var(--s4)}

/* ---- Metrics ---- */
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);margin-bottom:var(--s5);background:var(--panel)}
.metric{padding:20px 22px;min-width:0}
.metric+.metric{border-left:1px solid var(--line)}
.metric-label{font:13px/1.4 var(--mono);text-transform:uppercase;color:var(--muted)}
.value{font:800 clamp(34px,5vw,56px)/1 var(--display);margin:10px 0;letter-spacing:-1px;overflow-wrap:anywhere}
.value small{font:14px var(--mono);color:var(--muted);letter-spacing:0}
.metric-note{font:13px/1.5 var(--mono);color:var(--muted)}

/* ---- Tables ---- */
/* Visible scrollbar plus fades at the edges that still have content to scroll to. */
.table-wrap{overflow-x:auto;border:1px solid var(--line);max-width:100%;scrollbar-width:thin;scrollbar-color:var(--purple) var(--line);
  background:linear-gradient(to right,var(--panel) 30%,transparent) left center/40px 100% no-repeat local,
    linear-gradient(to left,var(--panel) 30%,transparent) right center/40px 100% no-repeat local,
    linear-gradient(to right,var(--line),transparent) left center/16px 100% no-repeat scroll,
    linear-gradient(to left,var(--line),transparent) right center/16px 100% no-repeat scroll;
  background-color:var(--panel)}
.table-wrap::-webkit-scrollbar{height:10px}
.table-wrap::-webkit-scrollbar-track{background:var(--line)}
.table-wrap::-webkit-scrollbar-thumb{background:var(--purple)}
.table-wrap details{margin-top:var(--s2);min-width:0}
.table-wrap details .stack{min-width:min(22rem,70vw);padding-bottom:var(--s3)}
table{border-collapse:collapse;width:100%}
.wide table{min-width:max-content}
th,td{padding:10px 12px;text-align:left;vertical-align:top;border-top:1px solid var(--line);overflow-wrap:break-word}
thead th{border-top:0;border-bottom:1px solid var(--line);font:500 12px/1.4 var(--mono);text-transform:uppercase;color:var(--muted);white-space:nowrap}
tbody tr:first-child td{border-top:0}
td{font-size:14px;max-width:26rem}
tr[data-verdict]:not([data-verdict="accessible"]) td:first-child{box-shadow:none;border-left:2px solid var(--red)}
.pager{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s4);margin-top:var(--s4);font:13px/1.4 var(--mono)}
.pager a{display:inline-flex;align-items:center;min-height:36px;padding:7px 12px;border:1px solid var(--line);color:var(--ink);text-decoration:none}
.pager a:hover{background:var(--purple);border-color:var(--purple);color:var(--on-purple)}

/* ---- Operation ---- */
.meta{font:13px/1.5 var(--mono);color:var(--muted);margin-bottom:var(--s4)}
.stages{list-style:none;padding:0;border:1px solid var(--line);background:var(--panel)}
.stages li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);padding:14px 16px;font:14px/1.4 var(--mono)}
.stages li+li{border-top:1px solid var(--line)}
.stages .count{color:var(--muted)}
progress{appearance:none;-webkit-appearance:none;display:block;flex:1 0 100%;width:100%;height:4px;border:0;background:var(--line);color:var(--purple);overflow:hidden}
progress::-webkit-progress-bar{background:var(--line)}
progress::-webkit-progress-value{background:var(--purple)}
progress::-moz-progress-bar{background:var(--purple)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3) var(--s4);margin:var(--s5) 0}
.actions p,.actions form{margin:0}
pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel);border:1px solid var(--line);padding:var(--s3) var(--s4);font:13px/1.6 var(--mono);max-width:100%;overflow-x:auto}
ul,ol{padding-left:1.25em}
li+li{margin-top:var(--s1)}
main section>ul li{overflow-wrap:anywhere}

/* ---- Public pages: frame, site header, hero ---- */
.frame{max-width:1100px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;border-inline:1px solid var(--line)}
.frame main{flex:1;width:100%;padding:0}
.frame main>section:not(:first-child){margin-top:0}
.sitehead{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);padding:13px 28px;border-bottom:1px solid var(--line)}
.sitenav{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s5)}
.head-actions{display:flex;align-items:center;gap:var(--s3)}
.hero{display:grid;grid-template-columns:1.1fr 1fr;min-height:430px;border-bottom:1px solid var(--line);overflow:hidden}
.hero-copy{padding:35px 20px 32px 38px;min-width:0}
.display{font:800 clamp(66px,9.3vw,104px)/.88 var(--display);text-transform:uppercase;letter-spacing:-1.7px;margin:19px 0 20px}
.lead{font:500 14px/1.6 var(--mono);color:var(--purple);text-transform:uppercase;margin-bottom:var(--s3)}
.description{max-width:380px;color:var(--muted);font:14px/1.6 var(--sans)}
.hero .actions{margin:25px 0 0}
.scene{position:relative;min-height:430px;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;background-position:center;isolation:isolate;min-width:0}
.scene::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 15%,var(--paper) 76%);z-index:0;pointer-events:none}
.heropal{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);background:var(--paper);color:var(--ink);border:0;border-radius:50%;padding:8px;z-index:1;width:208px;height:208px;display:block}
.heropal .mark{width:100%;height:100%}
.scene-label{position:absolute;left:22px;top:24px;font:12px/1.6 var(--mono);z-index:2}
.scene-end{position:absolute;bottom:20px;right:24px;font:12px var(--mono);z-index:2}
.cross{position:absolute;color:var(--purple);font:22px var(--mono);z-index:2}
.cross-a{left:18%;bottom:19%}
.cross-b{right:13%;top:16%;color:var(--on-acid);background:var(--acid);line-height:1}
.scene-chip{position:absolute;right:18px;bottom:55px;background:var(--acid);color:var(--on-acid);font:12px/1.6 var(--mono);padding:10px 12px;z-index:2;max-width:70%}
.strip{display:flex;align-items:center;justify-content:space-between;gap:var(--s4) 20px;padding:18px 30px;border-bottom:1px solid var(--line);font:13px/1.5 var(--mono);flex-wrap:wrap}
.section{padding:26px 30px;border-bottom:1px solid var(--line)}
.sectionhead{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s4);margin-bottom:22px;flex-wrap:wrap}
.sectionhead h2{margin:0}
.sectionhead .code{margin-right:12px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.feature{padding:2px 24px 0 0;min-width:0}
.feature+.feature{border-left:1px solid var(--line);padding-left:24px}
.feature-index{display:flex;align-items:center;justify-content:space-between;font:14px var(--mono);color:var(--purple);margin-bottom:18px}
.feature h3{font:800 34px/.95 var(--display);text-transform:uppercase;margin:0 0 12px;letter-spacing:-.3px;color:var(--ink)}
.feature p{font:14px/1.65 var(--mono);color:var(--muted);max-width:290px}
.bottomcta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:23px 30px;background:var(--acid);color:var(--on-acid)}
.bottomcta .code{color:var(--on-acid);margin-bottom:10px}
.bottomcta h2{font:800 clamp(32px,5vw,39px)/.95 var(--display);text-transform:uppercase;letter-spacing:-.4px;margin:0}
.bottomcta .button{background:#111112;border-color:#111112;color:#fff}
.bottomcta .button:hover{background:#fff;border-color:#fff;color:#111112}
.sitefooter{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s3);padding:14px 30px;border-top:1px solid var(--line);font:12px/1.5 var(--mono);color:var(--muted)}
.status-dot{display:inline-block;width:6px;height:6px;margin-right:7px;background:currentColor;border-radius:50%}

/* ---- Sign-in and service pages ---- */
.authpage{display:grid;grid-template-columns:1fr 1fr;min-height:520px}
.authpage .scene{min-height:0;border-right:1px solid var(--line)}
.authbox{padding:35px 38px 40px;min-width:0;align-self:center}
.authbox h1{margin-bottom:var(--s4)}
.authbox .stack{max-width:none}
.authbox .alt{margin-top:var(--s5);padding-top:var(--s5);border-top:1px solid var(--line)}
.authbox .alt .button{width:100%;background:transparent;color:var(--ink);border-color:var(--line)}
.authbox .alt .button:hover{background:var(--purple);border-color:var(--purple);color:var(--on-purple)}
.authbox .actions{margin:var(--s4) 0}
.msgpage{padding:35px 38px 48px;max-width:640px}

/* ---- Breakpoints (tokens: 1000 / 760 / 600) ---- */
@media (min-width:1000px){.display{font-size:104px}}
@media (max-width:760px){
  .sitehead{padding:12px 20px}
  .sitenav{gap:12px}
  .sitenav .separator{display:none}
  .hero-copy{padding-left:25px}
  .display{font-size:clamp(64px,10.8vw,80px)}
  .scene-chip{right:12px}
  main{padding:var(--s5) var(--s4) var(--s6)}
  .appbar-row{padding:var(--s3) var(--s4)}
  .authpage{grid-template-columns:1fr}
  .authpage .scene{display:none}
  .authbox,.msgpage{padding:28px 22px 36px}
}
@media (max-width:600px){
  .sitenav{display:none}
  .sitehead{gap:4px 12px;padding:8px 18px;flex-wrap:wrap}
  .sitehead .brand{font-size:21px}
  .brand .mark{width:34px;height:34px}
  .hero{grid-template-columns:1fr}
  .hero-copy{padding:30px 22px}
  .display{font-size:clamp(56px,17vw,84px);letter-spacing:-1px}
  .scene{min-height:340px}
  .heropal{width:180px;height:180px}
  .grid3{grid-template-columns:1fr}
  .feature{padding:0 0 22px}
  .feature+.feature{border-left:0;border-top:1px solid var(--line);padding:22px 0}
  .feature:last-child{padding-bottom:0}
  .feature p{max-width:none}
  .feature-index{margin-bottom:12px}
  .section{padding:24px 22px}
  .strip{padding:18px 22px}
  .bottomcta{align-items:flex-start;flex-direction:column;padding:25px 22px}
  .sitefooter{padding:16px 22px}
  .metrics{grid-template-columns:1fr}
  .metric+.metric{border-left:0;border-top:1px solid var(--line)}
  .metric{padding:16px}
  .tabs{padding:0}
  .tabs a{padding:12px 10px}
  .head-actions .button{padding:10px 12px;min-height:42px}
  .filters label,.filters button,.filters input[type="search"]{width:100%;min-width:0}
  .filters button{justify-content:center}
}
@media (pointer:coarse){
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea{font-size:16px}
  .theme-toggle,button.small,.pager a{min-height:44px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* ---- GEO project tabs ---- */
.subtabs{display:flex;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:var(--s4) 0 var(--s5)}
.subtabs a{font:14px/1.2 var(--mono);color:var(--muted);text-decoration:none;padding:12px 15px;min-height:44px;display:inline-flex;align-items:center;border-bottom:2px solid transparent}
.subtabs a:hover{color:var(--purple)}
.subtabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--purple);background:var(--wash)}
td form{margin:0}

/* Prompt rows fold into cards on a narrow screen: text first, small meta under it, buttons in a row; the page never scrolls sideways. */
@media (max-width:760px){
  table.cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  table.cards,table.cards tbody,table.cards tr,table.cards td{display:block;width:100%;max-width:none}
  table.cards tr{padding:var(--s3) var(--s4)}
  table.cards tr+tr{border-top:1px solid var(--line)}
  table.cards td{border:0;padding:var(--s1) 0}
  table.cards td[data-label]{display:inline-block;width:auto;margin-right:var(--s4);font:12px/1.4 var(--mono);color:var(--muted)}
  table.cards td[data-label]::before{content:attr(data-label) ": "}
  table.cards td[data-label]:empty{display:none}
  table.cards td.row-actions{padding-top:var(--s2)}
  table.cards details .stack{min-width:0}
}