/* Daily cards and the Gold day (docs/superpowers/specs/2026-10-20-monetization-v2-design.md sections D, E). */
.month-card.cards-block { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:10px; }
.month-card.cards-block > .card-line { display:grid; grid-template-columns:56px minmax(0,1fr) auto; flex-direction:initial; flex:none; }
.card-line { display:grid; grid-template-columns:56px 1fr auto; gap:10px; align-items:center; }
/* Only the card art: the Stars mark inside the price button stays 18 px (it grew to 56 and pushed the button over the text). */
.card-line > img { width:56px; height:56px; object-fit:contain; }
.card-line .btn { white-space:nowrap; }
.card-line .btn .star-mark { width:18px; height:18px; vertical-align:-3px; }
.card-line > div { display:grid; gap:2px; min-width:0; }
.card-line small { opacity:.85; }
.card-line.is-active strong::after { content:" ✓"; color:#2fbf71; }
.card-perks { display:flex; gap:6px; align-items:center; margin:0; font-size:13px; opacity:.75; }
.card-perks.is-on { opacity:1; color:#ffd77d; }
.card-perks .icon { width:18px; height:18px; flex:none; }
.cards-block .card-sub { display:flex; flex-direction:row; flex-wrap:wrap; gap:6px 8px; align-items:center; margin:0; font-size:13px; opacity:.9; }
.cards-block .card-sub span { flex:1 1 160px; }
.card-sub .icon { width:16px; height:16px; }

.gold-lane { display:grid; gap:8px; margin-top:12px; padding:10px; border-radius:14px;
  background:linear-gradient(160deg,#ffd84d1f,#c99a1214); box-shadow:inset 0 0 0 1px #ffd84d40; }
.gold-lane.is-compact { margin:8px 0 0; }
.gold-lane__cells { display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.gold-cell { height:12px; border-radius:6px; background:#ffd84d26; display:grid; place-items:center; }
.gold-cell.is-on { background:linear-gradient(90deg,#ffe27a,#f2b51b); }
.gold-cell.is-milestone { height:18px; box-shadow:0 0 0 1px #ffd84d; }
.gold-cell b { font-size:10px; color:#3a2a00; }
.gold-cell.is-milestone:not(.is-on) b { color:#ffd84d; }
.gold-lane__line { display:flex; gap:6px; align-items:center; margin:0; font-size:13px; }
.gold-lane__line img { width:22px; height:22px; flex:none; }
.gold-lane__note { opacity:.7; font-size:12px; }
.btn.gold { display:inline-flex; gap:6px; align-items:center; justify-content:center; border:0; font-weight:800;
  background:linear-gradient(180deg,#ffe27a,#f2b51b); color:#3a2300; box-shadow:0 3px 0 #a8730c; }
.btn.gold .gold-ico { width:22px; height:22px; }
.gold-done { margin:0; }
.day-modal { display:grid; gap:10px; width:100%; max-width:460px; margin:0 auto; text-align:left; }
.day-modal .day-card { margin:0; }