.inf-rec-panel { margin-top: 1rem; }
.inf-rec-panel .sg-heading { margin-bottom: .4rem; }
.inf-rec-panel .sg-heading h2 { margin: .35rem 0 0; }
.inf-rec-intro { max-width: 64ch; color: var(--muted, #a8bec9); line-height: 1.65; margin: .65rem 0 1rem; }
.inf-rec-filters { margin-bottom: .85rem; }
.inf-rec-filters label { min-width: min(100%, 220px); }
.inf-rec-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; margin: .8rem 0 1.25rem; }
.inf-rec-card { min-width: 0; border: 1px solid rgba(133,216,222,.24); border-radius: 12px; background: rgba(10,28,33,.65); overflow: hidden; }
.inf-rec-card[open] { border-color: rgba(133,216,222,.5); }
.inf-rec-card summary { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: 1rem; cursor: pointer; list-style: none; }
.inf-rec-card summary::-webkit-details-marker { display: none; }
.inf-rec-card summary::after { content: '⌄'; font-size: 1.1rem; color: #8ddce0; }
.inf-rec-card[open] summary::after { transform: rotate(180deg); }
.inf-rec-head { display: grid; min-width: 0; gap: .3rem; flex: 1; }
.inf-rec-head strong { font-size: 1.06rem; overflow-wrap: anywhere; }
.inf-rec-head small,.inf-rec-progress small { color: #adc1c8; line-height: 1.35; }
.inf-rec-progress { display: grid; gap: .1rem; text-align: right; color: #bde9e9; white-space: nowrap; }
.inf-rec-progress strong { font-size: 1.13rem; }
.inf-rec-card > p { color: #bfd1d7; line-height: 1.58; margin: .8rem 1rem; }
.inf-rec-track { height: 5px; margin: 0 1rem; background: rgba(173,193,200,.22); border-radius: 5px; overflow: hidden; }
.inf-rec-track i { display: block; height: 100%; background: #8ddce0; border-radius: inherit; }
.inf-rec-units { margin: .85rem 1rem; border: 1px solid rgba(173,193,200,.17); border-radius: 8px; overflow: hidden; }
.inf-rec-unit { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .2rem .6rem; padding: .55rem .7rem; }
.inf-rec-unit + .inf-rec-unit { border-top: 1px solid rgba(173,193,200,.15); }
.inf-rec-unit > span { font-weight: 650; overflow-wrap: anywhere; }
.inf-rec-unit small { grid-column: 1; color: #abc1c8; }
.inf-rec-unit small b { color: #f8ca78; }
.inf-rec-unit button { grid-column: 2; grid-row: 1 / span 2; padding: .4rem .55rem; border: 1px solid rgba(141,220,224,.45); border-radius: 6px; background: transparent; color: #bde9e9; cursor: pointer; }
.inf-rec-unit button:hover,.inf-rec-unit button:focus-visible { background: rgba(141,220,224,.13); }
.inf-rec-links { display: flex; flex-wrap: wrap; gap: .75rem; margin: .8rem 1rem 1rem; }
.inf-rec-links a,.inf-rec-panel .sg-scope a { color: #bde9e9; }
@media (max-width: 760px) { .inf-rec-list { grid-template-columns: 1fr; } }
@media (max-width: 380px) { .inf-rec-card summary { padding: .8rem; } .inf-rec-progress strong { font-size: 1rem; } }