/* Foundry page. Rows, parts and meters come from mastery.css and style.css. */

.top .summary { margin: 0; color: var(--muted); font: 500 var(--step-0) var(--num); font-variant-numeric: tabular-nums; }
.group .panel-head .group-summary { margin-left: auto; font: 400 var(--step--1) var(--num); }

/* Favorite star before the thumbnail: gold when set */
button.star {
  flex: none;
  padding: 0 0.15rem;
  border: 0;
  background: none;
  color: var(--muted);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
}
button.star:hover { color: var(--gold-hi); }
button.star[aria-pressed="true"] { color: var(--gold); text-shadow: 0 0 6px var(--gold-soft); }
button.star:disabled { opacity: 0.5; cursor: progress; }

table.foundry tr.ready td:first-child { box-shadow: inset 2px 0 0 var(--ok); }
.notice.error { margin: 0 0 var(--sp-3); color: var(--danger); }
#flags select { min-width: 7rem; }

/* Craft notifications (rules saved per player, app/craft_notifications.py); the panel opens and closes smoothly */
.craft-notifications { margin-bottom: var(--sp-4); font-size: var(--step--1); interpolate-size: allow-keywords; }
.craft-notifications::details-content { height: 0; overflow: clip; transition: height var(--mid) var(--ease), content-visibility var(--mid) allow-discrete; }
.craft-notifications[open]::details-content { height: auto; }
.craft-notifications > summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-1) var(--sp-3); }
.craft-notifications .cn-title { font: 400 var(--step-1)/1.3 var(--display); color: var(--gold-hi); }
.craft-notifications[open] > summary { margin-bottom: var(--sp-3); }
.craft-notifications fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: var(--sp-3); }
.craft-notifications [hidden] { display: none; }
.cn-toggles { display: grid; gap: var(--sp-2); justify-items: start; }
.cn-rules { display: grid; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; }
.cn-rules:empty { display: none; }
.cn-rules li { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-3); padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-soft); border-radius: var(--r-ctl); transition: opacity var(--fast) ease; }
.cn-rules li.off { opacity: 0.6; }
.cn-rules .cn-what { flex: 1 1 14rem; display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1) var(--sp-2); color: var(--muted); }
.cn-rules .notification-actions { margin-left: auto; }
.cn-form { display: grid; gap: var(--sp-3); padding-top: var(--sp-3); border-top: 1px solid var(--line-soft); }
.cn-form h3, .cn-crafts h3 { margin: 0; font: 400 var(--step-0) var(--display); color: var(--ivory); }
.cn-form p { margin: 0; }
.cn-fields { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr)); }
.cn-fields label { display: grid; gap: var(--sp-1); }
.cn-fields :is(input, select) { width: 100%; min-width: 0; }
.cn-kinds legend { margin-bottom: var(--sp-2); }
.cn-kinds > div { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); }
.cn-crafts h3 { margin-bottom: var(--sp-2); }
.cn-crafts ol { display: grid; gap: var(--sp-1); margin: 0; padding: 0; list-style: none; }
.cn-crafts li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: var(--sp-1) var(--sp-3); }
.cn-crafts .cn-how { min-width: 9rem; text-align: right; }
.notification-actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
@media (max-width: 40rem) {
  .cn-crafts li { grid-template-columns: minmax(0, 1fr) auto; }
  .cn-crafts .cn-how { grid-column: 1 / -1; min-width: 0; text-align: left; }
}