markdown-styles.css

    /* Aquí pega todo el contenido de tu hoja de estilos de Obsidian */
    body {
  --background-primary: #fbfbfb;
  --background-primary-alt: #fbfbfb;
  --background-secondary: #fbfbfb;
  --background-secondary-alt: #2e3236;
  --text-normal: #333;
  --text-faint: #b2b2b2;
  --text-title-h1: #333;
  --text-title-h2: #333;
  --text-title-h3: #333;
  --text-title-h4: #333;
  --text-title-h5: #333;
  --text-link: #b4b4b4;
  --text-a: #db4d52;
  --text-a-hover: #db4d52;
  --text-mark: #d3ffa4;
  --pre-code: #ffffff;
  --interactive-accent: #92a1a1;
  --interactive-before: #5e6565;
  --background-modifier-border: #92a1a17a;
  --blockquote-border: #d6555f;
  --tag-background: rgba(14, 210, 247, 0.15);
  --interactive-accent-rgb: 61, 215, 251;
  --font-family-editor: Avenir, 'Avenir Next';
  --font-family-preview: Avenir, 'Avenir Next';

  background-color: var(--background-primary);
  color: var(--text-normal);
}

.markdown-preview ul > li.task-list-item {
  text-indent: -3em;
}

.markdown-preview .list-collapse-indicator {
  margin-left: -80px !important;
  box-sizing: border-box;
}

.markdown-preview ul > li.task-list-item.is-checked {
  text-decoration: line-through !important;
  color: var(--interactive-accent) !important;
}

.markdown-preview ul > li.task-list-item.is-checked ul > li:not(.is-checked) {
  text-decoration: none !important;
  color: var(--text-normal) !important;
}

h1,
.cm-header-1 {
  font-size: 34px;
  color: var(--text-title-h1);
}

h2,
.cm-header-2 {
  font-size: 26px;
  color: var(--text-title-h2);
}

h3,
.cm-header-3 {
  font-size: 22px;
  color: var(--text-title-h3);
}

h4,
.cm-header-4 {
  font-size: 18px;
  color: var(--text-title-h4);
}

h5,
.cm-header-5 {
  font-size: 18px;
  color: var(--text-title-h5);
}

h6,
.cm-header-6 {
  font-size: 18px;
  color: var(--text-title-h5);
}

/** headings */
h2,
h3,
h4,
h5,
h6 {
  /* padding-top: 1.25rem; */
  margin: 45px 0 20px 0;
  position: relative;
  padding-bottom: 10px;
  border-bottom: 1px solid;
  border-width: 35%;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--text-sub-accent), #100e17, #100e17, #100e17);
}

strong {
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  padding: 0;
  color: #7aa2f7;
  background-color: #7aa2f7;
  background-image: linear-gradient(62deg, #87c2fd 0%, #dcb9fc 100%) !important;
}

/**-------------------**
| HR STYLES
**--------------------**/

/** hr styles -- PREVIEW MODE */
hr {
  margin-block-start: 4em;
  margin-block-end: 4em;
  border: none;
  height: 0;
  border-bottom: 1px solid;
  border-image-slice: 1;
  border-width: 1px;
  border-image-source: linear-gradient(to right, transparent, var(--text-accent), transparent);
}

hr::after {
  content: '§';
  display: inline-block;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%) rotate(60deg);
  transform-origin: 50% 50%;
  padding: 0.5rem;
  color: var(--text-sub-accent);
  background-color: var(--background-primary);
}

/* blockquote style overwrite */

blockquote {
  position: relative;
  padding: 1rem 2rem 1rem 3rem;
  color: #bdbdbd;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  margin-bottom: 2em;
  margin-right: 0 !important;
  border-left: 3px rgba(14, 210, 247, 0.5) solid;
  border-top: transparent;
  border-bottom: transparent;
  border-right: transparent;
  background: linear-gradient(135deg, rgba(32, 28, 41, 0.45), #100e17);
}

blockquote::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0px;
  height: 2px;
  width: 60%;
  background: linear-gradient(90deg, rgba(13, 185, 215, 0.5), #13111a);
}

blockquote::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0px;
  height: 2px;
  width: 25%;
  background: linear-gradient(90deg, rgba(13, 185, 215, 0.5), #15131c);
}

blockquote p {
  position: relative;
}

blockquote p:first-of-type::before {
  content: '!!';
  font-style: italic;
  font-weight: 700;
  font-size: 18px;
  color: var(--text-accent);
  position: absolute;
  top: 0.1rem;
  left: -1.8rem;
}

code {
  overflow-wrap: break-word;
  background-color: rgba(14, 210, 247, 0.05);
  word-wrap: break-word;
  padding: 0 5px;
  border-radius: 0.3rem;
  color: rgba(14, 210, 247, 0.9) !important;
}

img {
  border-radius: 8px;
}

table {
    margin: 1em 0; /* Adds some spacing above and below the table */
    border-collapse: collapse; /* Merges borders */
}
/* Styles for table headers (th) and data cells (td) */
table :is(td, th) {
    border: 1px solid #ccc !important; /* Adds a light gray border */
    padding: 0.5em 1em; /* Adds padding inside cells */
    color: #333 !important;
}
thead th {
    background-color: #f4f4f4; /* Light background for headers */
}

/* Forzar saltos de página al exportar o previsualizar */
.page-break {
    page-break-after: always;
}

.center-block {
    display: block;
    text-align: center;
}

.dossier-ukiyoe {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
}

.dossier-ukiyoe::before,
.dossier-ukiyoe:before {
  content: " ";
  background-image: url('https://www.fujiarts.com/japanese-prints/DUP6/GV56_150f.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0.4;
  z-index: -1;
}