.cg { max-width: 1180px; margin: 0 auto; }
.cg__door {
  position: relative; border: 1px solid var(--rule); border-radius: 10px;
  overflow: hidden; background: var(--bg-card); margin: 0 0 22px;
}
.cg__door img { width: 100%; display: block; aspect-ratio: 16/9;
  object-fit: cover; object-position: center; }
.cg__door figcaption {
  position: absolute; inset: auto 0 0 0; padding: 14px 18px;
  background: linear-gradient(to top, rgba(8,10,14,.92), rgba(8,10,14,0));
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.cg__state { font: 700 12px/1.4 'Courier New', monospace; letter-spacing: .18em; }
.cg__state.shut { color: var(--bronze); }
.cg__state.open { color: #FF8A5C; }
.cg__lock {
  border: 1px solid var(--bronze); background: rgba(0,0,0,.45);
  color: var(--bronze); border-radius: 6px; padding: 9px 18px; cursor: pointer;
  font: 700 12px/1 'Courier New', monospace; letter-spacing: .14em;
}
.cg__lock:hover { background: var(--bronze); color: #0C0E12; }

.cg__grid { display: grid; grid-template-columns: 1fr 330px; gap: 22px; align-items: start; }
@media (max-width: 960px) { .cg__grid { grid-template-columns: 1fr; } }

.cg__shelves[hidden] { display: none; }
.cg__group h3 {
  font: 700 11px/1 'Courier New', monospace; letter-spacing: .2em;
  color: var(--bronze); margin: 20px 0 10px; text-transform: uppercase;
}
.cg__items { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 10px; }
.cg__it {
  background: var(--bg-card); border: 1px solid var(--rule); border-radius: 8px;
  padding: 8px 7px 9px; text-align: center; cursor: pointer; position: relative;
}
.cg__it:hover { border-color: var(--bronze); }
.cg__it img { width: 100%; height: 62px; object-fit: contain; display: block;
  background: #E9E6E0; border-radius: 4px; }
.cg__it b { display: block; font: 600 11px/1.25 'Segoe UI', sans-serif;
  color: var(--ink); margin: 6px 0 0; }
.cg__it i { display: block; font-style: normal; font: 400 10px/1.3 'Courier New', monospace;
  color: var(--muted); }
.cg__it .n {
  position: absolute; top: -7px; right: -7px; min-width: 21px; height: 21px;
  border-radius: 11px; background: var(--bronze); color: #0C0E12;
  font: 700 11px/21px 'Segoe UI', sans-serif;
}
.cg__it.need { box-shadow: inset 0 0 0 2px var(--bronze-glow); }

.cg__side { position: sticky; top: 92px; }
.cg__card { background: var(--bg-card); border: 1px solid var(--rule);
  border-radius: 10px; padding: 15px 16px; margin: 0 0 14px; }
.cg__card h4 { font: 700 11px/1 'Courier New', monospace; letter-spacing: .2em;
  color: var(--bronze); margin: 0 0 11px; text-transform: uppercase; }
.cg__req { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px;
  color: var(--ink-soft); margin: 0 0 7px; }
.cg__req s { text-decoration: none; font: 700 12px/1.3 'Courier New', monospace;
  color: var(--muted); min-width: 30px; }
.cg__req.ok s { color: #4ADE80; }
.cg__req.ok { color: var(--ink); }
.cg__score { font: 700 34px/1 Georgia, serif; color: var(--bronze); }
.cg__score small { display: block; font: 400 11px/1.4 'Courier New', monospace;
  letter-spacing: .14em; color: var(--muted); margin-top: 4px; }
.cg__log { list-style: none; margin: 10px 0 0; padding: 0; max-height: 190px;
  overflow: auto; }
.cg__log li { font: 400 11.5px/1.45 'Segoe UI', sans-serif; color: var(--ink-soft);
  padding: 6px 0; border-top: 1px solid var(--rule); }
.cg__log li u { text-decoration: none; color: #FF8A5C; font-weight: 700; }
.cg__log li u.plus { color: #4ADE80; }
.cg__warn {
  border: 1px solid var(--bronze); border-left-width: 3px; border-radius: 0 7px 7px 0;
  background: rgba(255,163,60,.07); padding: 11px 14px; margin: 0 0 14px;
  font-size: 12.5px; color: var(--ink-soft);
}
.cg__acts { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 12px; }
.cg__note { font-size: 11.5px; color: var(--muted); margin: 10px 0 0; line-height: 1.5; }