/* ==========================================================================
   RESOURCES + FEATURES V2
   A composable ledger: live counters stay fast; authorship detail recedes
   into the illuminated folio beneath each entry.
   ========================================================================== */
.features-v2{
  display:grid;
  gap:var(--s6);
}

.features-v2 .subhead{
  margin-top:0;
}
/* the two folios are grid items with their own --s6 gap — don't let the
   .subsection rhythm margin stack on top of it */
.features-v2 .subsection{margin-top:0}


/* ---------- resources: a rack of small illuminated ledgers ---------- */
.resource-grid-v2{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));
  gap:var(--s3);
}

.resource-card-v2{
  position:relative;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--rule);
  border-radius:var(--r-sm);
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--gold-hi) 10%,transparent),transparent 44%),
    var(--panel-2);
  box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--panel) 72%,transparent);
}

.resource-card-v2::before{
  content:"";
  position:absolute;
  inset:4px;
  border:1px solid color-mix(in srgb,var(--rule-soft) 60%,transparent);
  border-radius:var(--r-sm);
  pointer-events:none;
}

.resource-card-v2__head{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:var(--s2);
  min-height:7.5rem;
  padding:var(--s4);
}

.resource-card-v2__identity{
  min-width:0;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:var(--s2);
  padding-bottom:var(--s2);
  border-bottom:1px solid var(--rule-soft);
}

.resource-card-v2__name{
  min-width:0;
  margin:0;
  color:var(--ink);
  font:600 .86rem/1.25 var(--font-display);
  letter-spacing:.08em;
  text-transform:uppercase;
  overflow-wrap:anywhere;
}

.resource-card-v2__name .ink-field{
  min-height:var(--field);
  padding-inline:0;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
}

.resource-card-v2__source{
  flex:none;
  max-width:52%;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--ink-faint);
  font:italic .76rem/1.2 var(--font-scribal);
}

.tracker-play{
  min-width:0;
  display:flex;
  align-items:center;
  gap:var(--s1) var(--s2);
  flex-wrap:wrap;
}

.tracker-pips{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  margin-inline:-7px 0;
}

.tracker-pip{
  margin-inline:-2px;
}

.tracker-count{
  flex:none;
  color:var(--ink-soft);
  font:600 .78rem/1.2 var(--font-display);
  font-variant-numeric:tabular-nums;
  letter-spacing:.04em;
  white-space:nowrap;
}

.tracker-stepper{
  display:inline-grid;
  grid-template-columns:var(--field) minmax(5.5rem,auto) var(--field);
  align-items:center;
  min-height:var(--field);
  overflow:hidden;
  border:1px solid var(--rule-soft);
  border-radius:var(--r-pill);
}

.tracker-stepper button{
  width:var(--field);
  height:var(--field);
  color:var(--gold-deep);
  font:700 1rem/1 var(--font-display);
}

.tracker-stepper button:hover:not(:disabled){
  background:color-mix(in srgb,var(--gold-hi) 14%,transparent);
}

.tracker-stepper button:disabled{
  opacity:.35;
}

.tracker-stepper output{
  text-align:center;
  color:var(--ink);
  font:700 .82rem/1 var(--font-display);
  font-variant-numeric:tabular-nums;
}

.recovery-badges{
  display:inline-flex;
  align-items:center;
  gap:var(--s1);
  flex-wrap:wrap;
}

.recovery-badge{
  min-height:var(--field-chip);
  padding-inline:var(--s2);
}

.recovery-badge--custom{
  max-width:12rem;
  overflow:hidden;
  text-overflow:ellipsis;
  color:var(--ink-faint);
  text-transform:none;
  letter-spacing:.03em;
}

.resource-v2-notes{
  position:relative;
  z-index:1;
  margin:0;
  padding:0 var(--s4) var(--s4);
  color:var(--ink-soft);
  font:italic .84rem/1.4 var(--font-scribal);
  white-space:pre-wrap;
}

/* ---------- the authoring folio shared by resources + features ---------- */
.composable-editor{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s3);
  padding:var(--s4);
  border-top:1px dotted var(--rule);
  background:color-mix(in srgb,var(--panel) 64%,transparent);
}

.field-cluster{
  min-width:0;
  display:grid;
  align-content:start;
  gap:var(--s1);
}

.field-cluster--wide{
  grid-column:1 / -1;
}

.field-cluster > .ink-field,
.field-cluster > .ink-sel{
  width:100%;
}

.field-cluster > .marginalia{
  margin:0;
  align-self:center;
}

.list-edit-field{
  white-space:normal;
}

.remove-card{
  grid-column:1 / -1;
  width:auto;
  justify-self:end;
  display:inline-flex;
  align-items:center;
  gap:var(--s1);
  padding-inline:var(--s2);
  font:600 .75rem/1 var(--font-display);
  letter-spacing:.06em;
  text-transform:uppercase;
}

.choice-strip{
  display:flex;
  align-items:center;
  gap:var(--s1);
  flex-wrap:wrap;
}

.choice-chip{
  min-height:var(--field-chip);
  padding:0 var(--s2);
  border:1px solid var(--rule-soft);
  border-radius:var(--r-pill);
  color:var(--ink-faint);
  font:700 .72rem/1 var(--font-display);
  letter-spacing:.08em;
}

.choice-chip.is-selected{
  border-color:var(--gold-deep);
  color:var(--gold-deep);
  background:color-mix(in srgb,var(--gold-hi) 15%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--gold-deep) 20%,transparent);
}

.recovery-editor{
  display:grid;
  grid-template-columns:auto minmax(7rem,.65fr) minmax(10rem,1.35fr);
  align-items:end;
  gap:var(--s1) var(--s2);
}

.recovery-editor > .label{
  grid-column:1 / -1;
}

.recovery-editor > .ink-field:last-child{
  grid-column:1 / -1;
}

/* ---------- feature ledger ---------- */
.feature-section-v2{
  min-width:0;
}

.feature-card-v2{
  border-top:1px dotted var(--rule-soft);
}

.feature-card-v2:first-of-type{
  border-top:none;
}

.feature-card-v2__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:var(--s2);
  min-height:var(--field);
}

.feature-card-v2__toggle{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
}

.feature-stamp{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  max-width:16rem;
  padding:0 .5em;
  overflow:hidden;
  border:1px solid var(--rule-soft);
  border-radius:var(--r-pill);
  color:var(--ink-faint);
  font:600 .68rem/1 var(--font-display);
  letter-spacing:.05em;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.feature-stamp--source{
  color:var(--ward);
  border-color:color-mix(in srgb,var(--ward) 52%,transparent);
}

.feature-stamp--category,
.feature-stamp--activation{
  color:var(--gold-deep);
}

.feature-stamp--frequency{
  color:var(--verdigris);
  border-color:color-mix(in srgb,var(--verdigris) 52%,transparent);
}

.feature-stamp--cost{
  color:var(--rubric);
  border-color:color-mix(in srgb,var(--rubric) 52%,transparent);
}

.feature-stamp--tag{
  color:var(--ink-soft);
  text-transform:none;
}

.feature-costs,

.feature-card-v2__row > .tracker-play{
  justify-content:flex-end;
  max-width:24rem;
}

.feature-card-v2__row > .tracker-play .recovery-badges{
  flex-basis:100%;
  justify-content:flex-end;
}

.feature-card-v2__detail{
  padding:var(--s3) var(--s4) var(--s4);
}

.feature-glance{
  margin:0 0 var(--s3);
  padding:var(--s3);
  border:1px solid var(--rule-soft);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel-2) 70%,transparent);
}

.feature-glance__title{
  margin:0 0 var(--s2);
  color:var(--gold-deep);
  letter-spacing:.14em;
}

.feature-glance__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--s2) var(--s4);
  margin:0;
}

.feature-glance__item{
  min-width:0;
  display:grid;
  grid-template-columns:5.5rem minmax(0,1fr);
  align-items:start;
  gap:var(--s2);
}

.feature-glance__item dt{
  padding-top:.35rem;
}

.feature-glance__item dd{
  min-width:0;
  margin:0;
}

.feature-glance__text{
  display:inline-block;
  padding-top:.16rem;
  color:var(--ink-soft);
  font:italic .84rem/1.35 var(--font-scribal);
}

.feature-glance .feature-tags{
  margin:0;
}

.feature-card-v2__detail > .ink-field--block{
  min-height:4.4rem;
  border-color:transparent;
  background:transparent;
}

.feature-card-v2__detail > .ink-field--block:hover,
.feature-card-v2__detail > .ink-field--block:focus{
  border-color:var(--rule-soft);
}



.feature-tags{
  display:flex;
  align-items:center;
  gap:var(--s1);
  flex-wrap:wrap;

  margin-bottom:var(--s2);
}

.feature-v2-editor{
  margin:var(--s3) calc(-1 * var(--s4)) calc(-1 * var(--s4));
}

.feat-line .feature-v2-editor > .feature-delete{
  grid-column:1 / -1;
  grid-row:auto;
}

.tracker-editor-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--s3);
  padding:var(--s3);
  border:1px solid var(--rule-soft);
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--panel-2) 72%,transparent);
}

.tracker-editor-grid > .recovery-editor,
.tracker-editor-grid > .tracker-remove{
  grid-column:1 / -1;
}

.tracker-empty,
.legacy-tracker-editor{
  display:flex;
  align-items:center;
  gap:var(--s2);
  flex-wrap:wrap;
  padding:var(--s2) var(--s3);
  border:1px dotted var(--rule-soft);
}

.feature-cost-editor{
  padding:var(--s3);
  border:1px solid var(--rule-soft);
  border-radius:var(--r-sm);
}

.feature-cost-row{
  display:grid;
  grid-template-columns:minmax(8rem,1fr) 5rem minmax(9rem,1.25fr) var(--row-tail);
  align-items:center;
  gap:var(--s2);
  border-top:1px dotted var(--rule-soft);
}

.feature-cost-row:first-of-type{
  border-top:none;
}

.feature-cost-row > .ink-field,
.feature-cost-row > .ink-sel{
  width:100%;
}

@media (max-width:760px){
  .resource-card-v2__head{
    min-height:0;
  }

  .feature-card-v2__row{
    grid-template-columns:minmax(0,1fr);
  }

  .feature-card-v2__row > .tracker-play{
    grid-column:1 / -1;
    grid-row:2;
    justify-content:flex-start;
    padding:0 var(--s2) var(--s2);
  }

  .feature-card-v2__row > .tracker-play .recovery-badges{
    flex-basis:auto;
    justify-content:flex-start;
  }

  .composable-editor{
    grid-template-columns:1fr;
  }

  .feature-glance__grid{
    grid-template-columns:1fr;
  }

  .field-cluster--wide{
    grid-column:1;
  }

  .tracker-editor-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .tracker-editor-grid > .recovery-editor,
  .tracker-editor-grid > .tracker-remove{
    grid-column:1 / -1;
  }

  .recovery-editor{
    grid-template-columns:1fr;
  }

  .recovery-editor > .label,
  .recovery-editor > .ink-field:last-child{
    grid-column:1;
  }

  .feature-cost-row{
    grid-template-columns:minmax(0,1fr) 4.5rem var(--row-tail);
  }

  .feature-cost-row > .ink-field:nth-of-type(2){
    grid-column:1 / 3;
    grid-row:2;
  }
}

@media (max-width:480px){
  .features-v2{
    gap:var(--s5);
  }

  .resource-card-v2__head,
  .resource-v2-notes{
    padding-inline:var(--s3);
  }

  .resource-card-v2__identity{
    align-items:flex-start;
    flex-direction:column;
  }

  .resource-card-v2__source{
    max-width:100%;
  }

  .tracker-play{
    align-items:flex-start;
  }

  .tracker-pips{
    flex-basis:100%;
  }

  .feature-glance .feature-stamp{
    max-width:10rem;
  }

  .feature-glance__item{
    grid-template-columns:4.75rem minmax(0,1fr);
  }

  .feature-card-v2__detail{
    padding-inline:var(--s3);
  }

  .feature-v2-editor{
    margin-inline:calc(-1 * var(--s3));
  }

  .tracker-editor-grid{
    grid-template-columns:1fr;
  }

  .tracker-editor-grid > .recovery-editor,
  .tracker-editor-grid > .tracker-remove{
    grid-column:1;
  }
}

@media (prefers-reduced-motion:reduce){
  .resource-card-v2 *,
  .feature-card-v2 *{
    scroll-behavior:auto;
    transition-duration:.01ms !important;
  }
}