.studio-grid {
  grid-template-columns: minmax(430px, 1.45fr) minmax(270px, 0.7fr) 280px;
}

.feature-rail {
  grid-column: 3;
  grid-row: 1 / span 3;
  align-self: stretch;
  border-left: 1px solid var(--line);
  padding: 4px 0 4px 20px;
}

.feature-heading {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: flex-start;
}

.feature-heading h2 { font-size: 16px; margin: 2px 0; }
.feature-heading .eyebrow { margin: 0; }
.feature-helper { font-size: 11px; line-height: 1.45; color: var(--muted); margin: 10px 0 13px; }

.icon-button {
  width: 31px;
  height: 31px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}

.icon-button:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.icon-button:disabled { cursor: wait; opacity: 0.45; }
.feature-list { display: grid; gap: 8px; }

.feature-card {
  display: grid;
  width: 100%;
  gap: 5px;
  padding: 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #171d24;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.feature-card:hover { border-color: #6d9750; background: #1b232b; }
.feature-card strong { font-size: 13px; }
.feature-card > span:last-child { color: var(--muted); font-size: 11px; line-height: 1.35; }
.feature-category { color: var(--accent); font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.status.busy { border-color: var(--accent); color: var(--accent); }
.generation-progress { display: flex; align-items: center; gap: 9px; margin-top: 13px; color: var(--accent); font-size: 12px; }
.spinner { width: 15px; height: 15px; border: 2px solid #3f4e3c; border-top-color: var(--accent); border-radius: 50%; animation: studio-spin 0.75s linear infinite; }

@keyframes studio-spin { to { transform: rotate(360deg); } }

@media (max-width: 1240px) {
  .studio-grid { grid-template-columns: minmax(400px, 1fr) minmax(250px, 0.7fr); }
  .feature-rail { grid-column: 1 / span 2; grid-row: auto; border-top: 1px solid var(--line); border-left: 0; padding: 20px 0 0; }
  .feature-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1050px) {
  .studio-grid { grid-template-columns: 1fr; }
  .feature-rail { grid-column: 1; grid-row: auto; }
}

@media (max-width: 620px) { .feature-list { grid-template-columns: 1fr; } }