/*
 * 07-trpg.css  —  TRPG LOG 個別ページ
 *
 * このファイル群は読み込み順がそのままカスケードになる。
 * functions.php の ichika_style_parts() が順番を持っている。
 * 並べ替える前に tools/vr の回帰テストを走らせること。
 */

/* v0.4.6: TRPG LOG player characters */
.trpg-pc-section{
  margin:28px 0 34px;
}
.trpg-pc-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.trpg-pc-card{
  padding:15px 18px;
  border:1px solid rgba(17,11,35,.14);
  background:#fff;
}
.trpg-pc-ho{
  margin-bottom:3px;
  font-size:.76rem;
  line-height:1.3;
  color:var(--wine);
}
.trpg-pc-name{
  font-size:1.18rem;
  line-height:1.35;
  font-weight:800;
  color:var(--deep-red);
}
@media(max-width:560px){
  .trpg-pc-list{grid-template-columns:1fr}
}
/* v1.1.51: canonical individual TRPG LOG metadata.
   Consolidates the duplicate v0.4.17 / v0.4.18 rules and the later
   mobile PL wrapping rule into one current definition. */
.trpg-single-meta{
  margin-top:2rem;
  margin-bottom:1.25rem;
}
.trpg-single-meta-row{
  display:grid;
  grid-template-columns:7.5rem minmax(0,1fr);
  column-gap:.45rem;
  align-items:start;
  margin:.28rem 0;
}
.trpg-single-played{
  margin-top:.7rem;
}
.trpg-single-played-dates{
  line-height:1.8;
}
.trpg-single-days-count{
  display:inline-block;
  margin-left:.65em;
  white-space:nowrap;
}
.trpg-pc-heading{
  margin:2rem 0 .8rem;
  font-size:.9rem;
  letter-spacing:.04em;
  line-height:1.4;
}
.trpg-single-pl-list{
  min-width:0;
}
.trpg-single-pl-name:not(:last-child)::after{
  content:" / ";
}
@media (max-width:900px){
  .trpg-single-pl-name{
      display:block;
    }
  .trpg-single-pl-name:not(:last-child)::after{
      content:"";
    }
}
@media (max-width:700px){
  .trpg-single-meta-row{
      grid-template-columns:6.5rem minmax(0,1fr);
      column-gap:.35rem;
    }
}
/* v0.4.19: TRPG report share controls */
.trpg-share-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}
.trpg-share-button{
  appearance:none;
  border:1px solid var(--wine);
  border-radius:0;
  padding:.65rem 1rem;
  font:inherit;
  line-height:1.2;
  text-decoration:none;
  cursor:pointer;
  transition:opacity .15s ease, transform .15s ease;
}
.trpg-share-button:hover{
  opacity:.82;
}
.trpg-share-button-primary{
  background:var(--wine);
  color:#fff;
}
.trpg-share-status{
  min-height:1.4em;
  margin:.45rem 0 0;
  font-size:.8rem;
  text-align:left;
}
/* v0.4.26: TRPG report image generator */
.trpg-report-image-preview{
  margin-top:1rem;
  max-width:760px;
}
.trpg-report-image-preview[hidden]{
  display:none;
}
.trpg-report-image-preview-img{
  display:block;
  width:100%;
  height:auto;
  border:1px solid rgba(45,29,93,.22);
}
.trpg-report-image-preview-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
  margin-top:.65rem;
}
.trpg-report-image-download{
  background:var(--wine);
  color:#fff;
}
.trpg-pc-name{overflow-wrap:anywhere;word-break:break-word}
@media(max-width:560px){
  .trpg-share-actions,.trpg-report-image-preview-actions{display:grid;grid-template-columns:1fr}
  .trpg-share-button,.trpg-report-image-download{width:100%;min-height:44px;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .trpg-share-button{transition:none}
}
/* v0.5.12: TRPG participant privacy redaction */
.trpg-private-bar{
  display:inline-block;
  width:7.5em;
  max-width:100%;
  height:.92em;
  vertical-align:-.05em;
  background:#111;
  border-radius:1px;
}
@media (min-width:901px){
  body.single-trpg-log .trpg-single-meta{
      color:var(--wine);
    }
}
@media (min-width:901px){
  body.single-trpg-log .trpg-pc-card{
      background:#fff;
      border:1px solid rgba(17,11,35,.16);
    }
}
.trpg-single-meta{
  line-height:var(--meta-leading);
}
.trpg-single-days-count,
.single-trpg-log .trpg-single-days-count{
  color:var(--gold);
  font-weight:700;
}
/* v1.0.6: a rule above the share actions, and softened button corners.

   The share buttons sat directly under the end of the article with only
   margin between them, so they read as part of the text rather than as a
   separate step. A rule marks the break.

   Corners: things you press are rounded; things made of paper are not.
   The filing tabs, cards, index-card headings and paper sheets keep their
   square corners on purpose — a rounded tab would stop looking like paper. */
.trpg-share-actions{
  margin-top:2.4rem;
  padding-top:1.5rem;
  border-top:1px solid rgba(45,29,93,.22);
}
.trpg-share-button{
  border-radius:6px;
}
/* v1.1.92: .trpg-single-page is the <main>; the sheet is article.entry. */
.trpg-pc-ho{
  font-size:.8rem;
}