/* =========================================================
   poem.css — 每日诗词卡
   配合 base.css + tool.css 使用。
   ========================================================= */

.tool{--a1:var(--violet);--a2:var(--pink)}
.tool .grad{background:linear-gradient(96deg,var(--violet),var(--pink) 55%,var(--amber));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- 当前诗标记 ---------- */
.card__flag{
  display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--a2);padding:.42em .9em;border-radius:999px;
  background:color-mix(in oklab,var(--a1) 14%,transparent);
  border:1px solid color-mix(in oklab,var(--a1) 34%,transparent);
}

/* ---------- 竖排诗卡 ---------- */
.pcard{
  display:flex;gap:clamp(14px,3vw,22px);align-items:stretch;
  padding:clamp(18px,4vw,28px);border-radius:var(--radius);overflow:hidden;
  background:
    radial-gradient(120% 80% at 100% 0%,color-mix(in oklab,var(--a1) 22%,transparent),transparent 62%),
    linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02) 55%,rgba(255,255,255,.05));
  border:1px solid var(--glass-brd);box-shadow:var(--shadow);
}
.pcard__side{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:16px}
.pcard__date{
  margin:0;writing-mode:vertical-rl;text-orientation:upright;
  font-size:.72rem;letter-spacing:.22em;color:var(--muted);
}
.pcard__seal{
  flex:none;width:40px;height:40px;border-radius:9px;display:grid;place-items:center;
  font-family:var(--font-kai);font-size:1.2rem;line-height:1;color:#fff;
  background:linear-gradient(140deg,#b8382c,#e0594a);
  box-shadow:0 8px 20px -10px rgba(224,89,74,.95), inset 0 0 0 1px rgba(255,255,255,.22);
}
.pcard__text{
  writing-mode:vertical-rl;text-orientation:upright;
  display:flex;flex-direction:column;justify-content:center;
  flex:1;min-width:0;height:clamp(330px,48vh,520px);
  font-family:var(--font-kai);font-size:var(--fs,30px);line-height:1.42;
  color:#f4f1ff;overflow:hidden;
}
.pcard__title{
  display:block;font-size:1.24em;font-weight:600;letter-spacing:.06em;
  color:var(--a2);margin:0 1.1em 0 0;
}
.pcard__who{
  display:block;font-size:.68em;letter-spacing:.14em;color:var(--muted);margin:0 .5em 0 0;
}
.pcard__body{display:block}
.pcard__body .ln{display:block;margin:0;text-indent:0}
.pcard__body .ln--sp{width:.45em}

/* 窄屏（≤380px）把边距让给诗文本身，长诗才不用缩到看不清 */
@media (max-width:380px){
  .pcard{padding:14px 12px;gap:10px}
  .pcard__seal{width:32px;height:32px;font-size:1rem;border-radius:8px}
  .pcard__date{font-size:.72rem;letter-spacing:.12em}
}

/* ---------- 释义 ---------- */
.prose{margin-top:clamp(20px,3.5vw,28px);display:grid;gap:6px}
.prose__title{
  margin:14px 0 2px;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  font-family:var(--font-mono);color:var(--a2);font-weight:600;
}
.prose p{margin:0;font-size:.95rem;line-height:1.85;color:var(--ink-2);max-width:42em}

/* ---------- 诗集列表 ---------- */
#eraSeg{margin-top:14px;flex-wrap:wrap}
.poems{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin-top:16px}
.poem{
  display:flex;flex-direction:column;gap:5px;align-items:flex-start;text-align:left;width:100%;
  padding:16px 18px;border-radius:var(--radius-sm);cursor:pointer;
  background:rgba(255,255,255,.04);border:1px solid var(--line);
  transition:transform .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease);
}
.poem:hover{transform:translateY(-3px);border-color:color-mix(in oklab,var(--a1) 55%,transparent);background:rgba(255,255,255,.07)}
.poem:active{transform:translateY(-1px)}
.poem__top{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.poem__t{font-family:var(--font-kai);font-size:1.08rem;font-weight:600;letter-spacing:.02em}
.poem__a{font-size:.76rem;color:var(--muted)}
.poem__line{font-size:.82rem;color:var(--ink-2);line-height:1.7}
.poem__tag{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;color:var(--a2);
  padding:.2em .5em;border-radius:5px;background:color-mix(in oklab,var(--a1) 16%,transparent);
}
.poem.is-fav .poem__t::after{content:"★";color:var(--amber);margin-left:6px;font-size:.8em}

/* ---------- 我的 ---------- */
.history li{grid-template-columns:minmax(0,1fr) auto}
#readList li{grid-template-columns:minmax(0,1fr)}
.hist__open{
  display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-width:44px;min-height:44px;
  padding:0;border:0;border-radius:6px;background:transparent;color:inherit;text-align:left;cursor:pointer;
  white-space:normal;overflow-wrap:anywhere;
}
.hist__open:hover .hist__poem{color:var(--a2)}
.hist__info{display:block;min-width:0}
.hist__poem{display:block;font-family:var(--font-kai);font-size:1.02rem;font-weight:600}
.hist__date{display:block}
.hist__del{grid-column:auto;width:44px;height:44px;min-width:44px;min-height:44px}
.history__empty{min-width:0;white-space:normal;overflow-wrap:anywhere}

/* ---------- 桌面 ---------- */
@media (min-width:761px){
  .pcard{padding:34px 40px}
  .pcard__text{height:clamp(420px,52vh,560px)}
  /* 多一颗「分享这张卡」时五颗并排，别让最后一颗自己占一行（手机上仍是两列，存图占满一行） */
  .poem__controls--share{grid-template-columns:repeat(5,1fr)}
}