/* meu-dia.css – „Meu dia / Mein Tag“ (js/meu-dia.js): Karte auf der Startseite (#meu-dia), Häkchen im Signatur-Formular,
   Hinweis in Etappe 1 (#md-teaser) und kleiner Kasten auf meu-kin.html (.md-mk). */

/* Häkchen „Datum merken“ im Formular #sig-form */
.md-save{display:flex;gap:10px;align-items:flex-start;margin:12px 0 4px;font-size:14px;line-height:1.45;color:var(--text);cursor:pointer}
.md-save input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--gold);cursor:pointer}

/* Hinweis in Etappe 1 */
.md-teaser{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:4px;padding:8px 14px;border-radius:999px;border:1px solid rgba(227,191,110,.45);background:rgba(227,191,110,.08);color:var(--gold);font:600 13.5px/1.35 var(--font);text-decoration:none;transition:.25s}
.md-teaser:hover{border-color:var(--gold);background:rgba(227,191,110,.14)}
.md-teaser[hidden]{display:none}

/* Karte */
.md-card{margin-top:34px;padding:28px 30px;border-color:rgba(227,191,110,.32);background:linear-gradient(135deg,rgba(227,191,110,.07),rgba(22,28,70,.55) 55%)}
.md-empty{display:grid;grid-template-columns:auto minmax(0,1fr);gap:22px;align-items:start}
.md-empty-ic{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;border:1px solid rgba(227,191,110,.4);color:var(--gold)}
.md-empty-ic svg{width:34px;height:34px}
.md-card h3{font-size:clamp(20px,2.3vw,25px);margin:8px 0 10px}
.md-card p{color:var(--muted);margin:0 0 .6em}
.md-note{font-size:13px;color:var(--faint)!important;margin:14px 0 0!important}
.md-msg{grid-column:1/-1;margin:6px 0 0;color:var(--gold);font-size:14px}

.md-top{display:grid;grid-template-columns:auto minmax(0,1fr);gap:30px;align-items:center}
.md-pair{display:flex;align-items:stretch;gap:10px}
.md-x{align-self:center}
.md-k{display:flex;flex-direction:column;align-items:center;gap:3px;width:136px;padding:12px 8px;border-radius:16px;border:1px solid var(--line);background:rgba(7,10,28,.45);text-align:center;text-decoration:none;transition:.25s}
.md-k:hover{border-color:var(--c,var(--gold));transform:translateY(-2px)}
.md-g{display:grid;place-items:center;width:84px;height:84px;margin-bottom:4px}
.md-g svg{width:84px;height:84px}
.md-k small{font:600 10.5px/1.3 var(--font);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.md-k b{font:700 16px/1.2 var(--display);color:var(--c,var(--text))}
.md-n{font-size:12.5px;line-height:1.3;color:var(--text)}
.md-x{font:300 30px/1 var(--font);color:var(--gold)}
.md-main{min-width:0}
.md-sp{font-size:14px;color:var(--gold)!important}
.md-day{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.md-day li{color:var(--muted);font-size:14.5px}
.md-day small{display:block;font:600 10.5px/1.3 var(--font);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.md-day b{color:var(--text);font-family:var(--display)}

.md-more{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.md-more h4{margin:0 0 10px;font:600 11.5px/1 var(--font);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.md-rels{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 22px}
.md-rels li{font-size:14px;line-height:1.5;color:var(--muted)}
.md-rels b{display:block;color:var(--text);font-family:var(--display);font-size:15px;margin-bottom:2px}
.md-next{margin:18px 0 0!important;font-size:14px;color:var(--text)!important}
.md-act{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:18px}
.md-del{padding:8px 4px;border:0;background:none;color:var(--faint);font:600 13px/1.3 var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.md-del:hover{color:var(--gold)}

/* meu-kin.html */
.md-mk{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:22px 0 0;padding:14px 18px;border-radius:14px;border:1px dashed rgba(227,191,110,.45);background:rgba(227,191,110,.05);font-size:14px;color:var(--muted)}
.md-mk p{margin:0}
.md-mk b{color:var(--text)}
.md-mk a{color:var(--gold);font-weight:600;text-decoration:none}
.md-mk small{flex:1 1 260px;font-size:13px;color:var(--faint)}
.md-mk .btn{padding:11px 18px;font-size:12px}

@media (max-width:760px){
  .md-top{grid-template-columns:minmax(0,1fr);gap:20px}
  .md-pair{justify-content:center}
}
@media (max-width:640px){
  .md-card{padding:22px 16px}
  .md-empty{grid-template-columns:minmax(0,1fr);gap:14px}
  .md-k{width:calc(50% - 22px);min-width:0}
  .md-g,.md-g svg{width:70px;height:70px}
  .md-rels{grid-template-columns:minmax(0,1fr)}
}