.pl-hero { padding: 14px 2px 6px; }
.pl-h { margin: 0; font-size: var(--fs-9); font-weight: 800; letter-spacing: -0.04em; }
.pl-hsub { margin: 6px 0 0; font-size: var(--fs-2); color: var(--muted); }
.pl-sec { margin: 22px 2px 10px; font-size: var(--fs-5); font-weight: 800; letter-spacing: -0.02em; }
.pl-trial {
  display: grid; grid-template-columns: auto 1fr; gap: 10px 12px; align-items: center; margin: 10px 0 14px; padding: 16px;
  border-radius: var(--r-tile, 22px); background: linear-gradient(135deg, var(--info-bg), var(--card)); box-shadow: inset 0 0 0 1px var(--rim), var(--sh-2);
}
.pl-trial > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pl-trial b { font-size: var(--fs-5); font-weight: 800; letter-spacing: -0.02em; }
.pl-trial span { font-size: var(--fs-2); color: var(--muted); overflow-wrap: anywhere; }
.pl-trial .pl-btn { grid-column: 1 / -1; }
.pl-trial.on { background: linear-gradient(135deg, var(--ok-bg), var(--card)); }
.pl-trial.end { background: linear-gradient(135deg, var(--warn-bg), var(--card)); }
.pl-trial-ic { font-size: 30px; line-height: 1; }
.pl-tiers { display: grid; gap: 12px; }
.pl-tier {
  position: relative; padding: 18px; border-radius: var(--r-tile, 22px); background: var(--card-grad, var(--card));
  box-shadow: inset 0 0 0 1px var(--rim), var(--sh-2);
}
.pl-tier.best { box-shadow: inset 0 0 0 2px var(--accent), var(--sh-2); }
.pl-tier.cur { box-shadow: inset 0 0 0 2px var(--ok), var(--sh-2); }
.pl-tag {
  position: absolute; top: 14px; right: 14px; padding: 4px 10px; border-radius: 999px;
  background: var(--accent); color: var(--on-accent); font-size: var(--fs-1); font-weight: 800;
}
.pl-tn { margin: 0; font-size: var(--fs-5); font-weight: 800; }
.pl-price { margin: 6px 0 0; display: flex; align-items: baseline; gap: 4px; }
.pl-price b { font-size: var(--fs-10); font-weight: 800; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.pl-price span { font-size: var(--fs-2); color: var(--muted); }
.pl-desc { margin: 4px 0 14px; font-size: var(--fs-3); color: var(--muted); }
.pl-btn {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 52px; border: 0; border-radius: 16px;
  background: var(--accent); color: var(--on-accent); font: inherit; font-size: var(--fs-4); font-weight: 700; cursor: pointer; text-decoration: none;
  transition: transform .18s cubic-bezier(.2, .8, .2, 1);
}
.pl-btn:active { transform: scale(.97); }
.pl-btn[disabled] { background: var(--neutral-bg); color: var(--muted); cursor: default; transform: none; }
.pl-btn-a { margin-top: 2px; }
.pl-cur {
  display: flex; align-items: center; justify-content: center; min-height: 52px; border-radius: 16px;
  background: var(--ok-bg); color: var(--ok); font-size: var(--fs-4); font-weight: 800;
}
.pl-cmp-w { overflow-x: auto; border-radius: var(--r-tile, 22px); background: var(--card-grad, var(--card)); box-shadow: inset 0 0 0 1px var(--rim), var(--sh-1); }
.pl-tbl { width: 100%; border-collapse: collapse; font-size: var(--fs-2); }
.pl-tbl th, .pl-tbl td { padding: 12px 6px; text-align: center; border-bottom: 1px solid var(--line); white-space: nowrap; }
.pl-tbl tr:last-child th, .pl-tbl tr:last-child td { border-bottom: 0; }
.pl-tbl thead th { font-weight: 800; color: var(--text); }
.pl-tbl tbody th { text-align: left; padding-left: 14px; font-weight: 600; white-space: normal; min-width: 92px; }
.pl-ok { color: var(--ok); font-weight: 900; font-size: var(--fs-4); }
.pl-no { color: var(--muted); opacity: .6; }
.pl-sm { font-size: var(--fs-1); color: var(--text); font-weight: 700; }
.pl-foot { margin: 14px 2px 4px; font-size: var(--fs-1); color: var(--muted); }
.pl-band {
  display: flex; align-items: center; gap: 12px; margin: 0 0 12px; padding: 12px 14px; border-radius: 18px; text-decoration: none; color: var(--text);
  background: linear-gradient(135deg, var(--ok-bg), var(--card)); box-shadow: inset 0 0 0 1px var(--rim), var(--sh-1);
}
.pl-band-end { background: linear-gradient(135deg, var(--warn-bg), var(--card)); }
.pl-band-new { background: linear-gradient(135deg, var(--info-bg), var(--card)); }
.pl-band-ic { font-size: 24px; line-height: 1; flex: none; }
.pl-band-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.pl-band-t b { font-size: var(--fs-4); font-weight: 800; }
.pl-band-t span { font-size: var(--fs-1); color: var(--muted); }
.pl-band-t span:empty { display: none; }
.pl-band-go { font-size: var(--fs-6); color: var(--muted); flex: none; }
.pl-me-v { margin-left: auto; font-size: var(--fs-2); color: var(--muted); font-weight: 700; white-space: nowrap; }
.pl-me-v.on { color: var(--ok); }
.pl-lock { position: relative; margin: 0 0 12px; border-radius: var(--r-tile, 22px); overflow: hidden; background: var(--card-grad, var(--card)); box-shadow: inset 0 0 0 1px var(--rim), var(--sh-1); }
.pl-lock-g { padding: 12px 14px; filter: blur(3px); opacity: .55; }
.pl-ghost { display: flex; gap: 10px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.pl-ghost:last-child { border-bottom: 0; }
.pl-ghost span { display: block; height: 14px; border-radius: 7px; background: var(--skel); }
.pl-ghost span:first-child { width: 46%; }
.pl-ghost span:last-child { width: 22%; margin-left: auto; }
.pl-lock-c {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 12px; text-align: center;
  background: linear-gradient(180deg, transparent, var(--card) 70%);
}
.pl-lock-c b { font-size: var(--fs-4); font-weight: 800; }
.pl-lock-c > span { font-size: var(--fs-2); color: var(--muted); }
.pl-lock-ic { font-size: 22px; line-height: 1; }
.pl-lock-btn {
  margin-top: 6px; padding: 10px 18px; border-radius: 999px; background: var(--accent); color: var(--on-accent);
  font-size: var(--fs-2); font-weight: 800; text-decoration: none;
}
.pl-toast {
  position: fixed; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  max-width: calc(100% - 32px); padding: 12px 18px; border-radius: 14px; background: var(--text); color: var(--bg); font-size: var(--fs-2); font-weight: 700;
  transition: opacity .2s, transform .2s; z-index: 60;
}
.pl-toast.show { opacity: 1; transform: translate(-50%, 0); }
.pl-toast.bad { background: var(--bad); color: #FFFFFF; }
@media (prefers-reduced-motion: reduce) { .pl-btn, .pl-toast { transition: none; } }
