/* PlanWil — Markdown Viewer Styles */
::selection { background: rgba(15, 52, 96, 0.12); color: #0f172a; }
body {
  font-family: "Inter", "Avenir Next", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  line-height: 1.6;
  max-width: 780px;
  margin: 0 auto;
  padding: 2.5rem 1.1rem 3rem;
  color: #233041;
  background: linear-gradient(180deg, #f5f8fc 0%, #ffffff 20%);
}
h1, h2, h3 { color: #16243a; margin-top: 1.25em; }
h1 {
  margin-top: 0.25em;
  font-size: 1.65rem;
  padding-bottom: 0.3em;
  border-bottom: 1px solid rgba(16, 32, 59, 0.12);
  letter-spacing: -0.02em;
}
h2 {
  font-size: 1.25rem;
  padding-bottom: 0.2em;
  border-bottom: 1px solid rgba(16, 32, 59, 0.08);
  letter-spacing: -0.01em;
}
h3 { font-size: 1.05rem; }
ul, ol { padding-left: 1.25em; }
li { margin-bottom: 0.2em; }
code { background: #eef3f9; padding: 0.2em 0.42em; border-radius: 6px; font-size: 0.9em; }
pre code { background: none; padding: 0; }
pre { background: #f6f9fd; padding: 1em; border-radius: 10px; overflow-x: auto; border: 1px solid rgba(16, 32, 59, 0.08); }
blockquote { border-left: 4px solid #0f3460; margin: 0; padding: 0 1em; color: #526075; }

/* Regular content tables */
table { border-collapse: collapse; width: 100%; margin: 1em 0; }
th, td { border: 1px solid #ddd; padding: 0.5em; text-align: left; }
th { background: #0f3460; color: #fff; }

/* Metadata card */
.mc {
  display: grid;
  grid-template-columns: minmax(104px, 148px) minmax(0, 1fr);
  max-width: 560px;
  margin: 0 0 1rem;
  padding: 0.78rem 0.82rem;
  border: 1px solid rgba(15, 52, 96, 0.1);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), #ffffff);
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.06);
  border-left: 3px solid rgba(15, 52, 96, 0.08);
}
.mr {
  display: contents;
}
.ml {
  padding: 0.52rem 0.62rem 0.52rem 0;
  color: #788496;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}
.mv {
  padding: 0.52rem 0 0.52rem 0.72rem;
  color: #627083;
  font-family: "Inter", "Avenir Next", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-style: normal;
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.45;
  overflow-wrap: anywhere;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}
.mv--name,
.mv--description,
.mv--project,
.mv--category,
.mv--tags,
.mv--deadline,
.mv--url,
.mv--not-per {
  color: #627083;
}

.mv--status-idea,
.mv--idea {
  color: #6d28d9;
}
.mv--status-todo,
.mv--todo {
  color: #2563eb;
}
.mv--status-in-progress,
.mv--in-progress {
  color: #b45309;
}
.mv--status-done,
.mv--done {
  color: #15803d;
}
.mv--status-canceled,
.mv--canceled {
  color: #b42318;
}
.mv--priority-low,
.mv--low {
  color: #64748b;
}
.mv--priority-medium,
.mv--medium {
  color: #b45309;
}
.mv--priority-high,
.mv--high {
  color: #b42318;
  font-weight: 600;
}
.mv::before {
  content: ": ";
  color: currentColor;
}
.mv--name::before,
.mv--description::before,
.mv--project::before,
.mv--category::before,
.mv--tags::before,
.mv--deadline::before,
.mv--url::before,
.mv--not-per::before {
  color: inherit;
}
.mr:last-child .ml,
.mr:last-child .mv {
  border-bottom: 0;
}

@media (max-width: 500px) {
  body { padding: 1.35rem 0.9rem 2rem; }
  .mc {
    max-width: 100%;
    padding: 0.66rem 0.72rem;
    grid-template-columns: 1fr;
    row-gap: 0;
  }
  .ml {
    padding: 0.42rem 0 0.12rem;
    border-bottom: 0;
  }
  .mv {
    padding: 0 0 0.58rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
  }
  .mv::before { color: currentColor; }
  .mr:last-child .mv { padding-bottom: 0; border-bottom: 0; }
}

img { max-width: 100%; }
a { color: #0f3460; }
hr { border: none; border-top: 1px solid #ddd; }