@charset "UTF-8";
  .merkliste-wrap {
    max-width: 1180px;
  }
  .merkliste-intro {
    max-width: 720px;
  }
  .mk-leiste {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin: 24px 0 18px;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
  }
  .mk-leiste[hidden], .mk-geteilt[hidden], .mk-leer[hidden] { display: none; }
  .mk-leiste__zahl {
    margin: 0;
    font-size: 14px;
    color: var(--ink-soft);
  }
  .mk-leiste__zahl b { color: var(--ink); }
  .mk-leiste__info {
    flex-basis: 100%;
    margin: 0;
    font-size: 13.5px;
    color: var(--ink-soft);
  }
  .mk-link {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    font: 13px 'JetBrains Mono', monospace;
    color: var(--ink);
    background: var(--paper);
  }
  .mk-knoepfe {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .mk-knopf {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    font: 600 13.5px 'Inter', sans-serif;
    color: var(--ink);
    cursor: pointer;
  }
  .mk-knopf:hover { border-color: var(--ink-soft); }
  .mk-knopf--haupt {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
  }
  .mk-knopf--haupt:hover { background: var(--stamp); border-color: var(--stamp); }
  .mk-geteilt {
    margin: 24px 0 18px;
    padding: 14px 18px;
    border-left: 4px solid #8FA073;
    border-radius: 12px;
    background: #EDF0E9;
  }
  .mk-geteilt__kopf { margin: 0 0 4px; font-size: 15px; }
  .mk-geteilt__text { margin: 0 0 12px; font-size: 14px; color: var(--ink-soft); }
  .mk-gruppe {
    margin: 0 0 26px;
  }
  .mk-gruppe__titel {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 12px;
    padding: 8px 14px;
    border-left: 4px solid var(--mk-akzent);
    border-radius: 10px;
    background: var(--mk-ton);
    font-family: 'Fraunces', serif;
    font-weight: 500;
    font-size: 1.2rem;
  }
  .mk-gruppe__zahl {
    margin-left: auto;
    font: 600 12.5px 'Inter', sans-serif;
    color: var(--ink-soft);
  }
  .mk-raster {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }
  @media (max-width: 1100px) {
    .mk-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 720px) {
    .mk-raster { grid-template-columns: minmax(0, 1fr); }
  }
  .mk-karte {
    position: relative;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-rows: auto 1fr auto;
    gap: 12px;
    padding: 14px 14px 14px 12px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--mk-akzent);
    border-radius: 14px;
    background: #fff;
  }
  .mk-bild {
    display: block;
    width: 96px;
    height: 64px;
    overflow: hidden;
    border-radius: 10px;
    background: var(--mk-ton);
  }
  .mk-bild svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  .mk-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    grid-row: span 2;
  }
  .mk-text > .mk-akt { margin-top: auto; }
  .mk-titel {
    margin: 0 0 4px;
    padding-right: 26px;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ink);
    overflow-wrap: break-word;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
  .mk-meta {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.45;
    color: var(--ink-soft);
  }
  .mk-meta b { color: var(--ink); font-weight: 600; }
  .mk-lage {
    display: block;
    margin: 6px 0 0;
    font: 400 14px 'JetBrains Mono', monospace;
    letter-spacing: .04em;
    white-space: nowrap;
  }
  .mk-lage__wort {
    margin-right: 10px;
    font: 700 10.5px 'JetBrains Mono', monospace;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-soft);
  }
  .mk-lage__an { color: var(--ink); font-weight: 700; }
  .mk-lage__aus { color: #C4B9A3; }
  .mk-legende {
    margin: -6px 0 18px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-soft);
  }
  .mk-etikett {
    display: inline-block;
    margin-bottom: 4px;
    font: 600 10.5px 'Inter', sans-serif;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--mk-akzent);
  }
  .mk-akt {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
  }
  .mk-werbung {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: end;
    margin: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9.5px;
    font-weight: 400;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ink-soft);
    opacity: 0.65;
  }
  .mk-cta {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    box-sizing: border-box;
    padding: 0 14px;
    border-radius: 4px;
    background: var(--ink);
    color: #fff;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
  }
  .mk-cta:hover { background: var(--stamp); }
  @media (max-width: 640px) {
    .mk-cta { min-height: 44px; }
  }
  .mk-seite {
    padding: 7px 0;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ink);
  }
  .mk-weg {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #fff;
    font-size: 15px;
    line-height: 1;
    color: var(--ink-soft);
    cursor: pointer;
  }
  .mk-weg:hover { color: var(--stamp); border-color: var(--stamp); }
  .mk-karte--thema { border-style: solid dashed dashed solid; }
  .mk-karte--unbekannt {
    grid-template-columns: minmax(0, 1fr);
    border-left-color: var(--line);
    border-style: dashed;
    background: var(--paper-dim, #F4F3F1);
  }
  .mk-karte--unbekannt .mk-etikett { color: var(--ink-soft); }
  .mk-karte--unbekannt .mk-meta { overflow-wrap: anywhere; }
  @media (max-width: 720px) {
    .mk-karte { grid-template-columns: 76px minmax(0, 1fr); }
    .mk-bild { width: 76px; height: 51px; }
  }
  .mk-leer {
    max-width: 640px;
    margin: 32px auto 0;
    text-align: center;
  }
  .mk-leer__herz {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    margin: 0 auto 12px;
    border-radius: 50%;
    background: #F1E0DE;
  }
  .mk-leer__herz svg { width: 30px; height: 30px; fill: var(--stamp); }
  .mk-leer h2 {
    margin: 0 0 6px;
    font-family: 'Fraunces', serif;
    font-weight: 500;
  }
  .mk-leer p {
    margin: 0 0 18px;
    font-size: 14.5px;
    color: var(--ink-soft);
  }
  .mk-einstiege {
    display: grid;
    gap: 10px;
    text-align: left;
  }
  .mk-einstieg {
    display: block;
    padding: 12px 16px;
    border-left: 4px solid var(--mk-akzent);
    border-radius: 12px;
    background: var(--mk-ton);
    color: var(--ink);
    text-decoration: none;
  }
  .mk-einstieg:hover { box-shadow: 0 0 0 1px var(--mk-akzent) inset; }
  .mk-einstieg b { display: block; font-size: 15px; }
  .mk-einstieg span { font-size: 13px; color: var(--ink-soft); }
  .mk-einstieg--bestenliste { --mk-ton: #F1E0DE; --mk-akzent: #A63D2F; }
  .mk-einstieg--geschenke { --mk-ton: #F3EEE6; --mk-akzent: #9A8466; }
  .mk-einstieg--vergleich { --mk-ton: #F6ECDD; --mk-akzent: #C98A2C; }
  @media print {
    .mk-leiste, .mk-weg, .mk-einstiege, .mk-knoepfe { display: none; }
  }
