/* PosterForge v1 modular stylesheet. Cascade order is intentional. */
.setup-check-item { grid-template-columns: 24px minmax(0,1fr); align-items:center; }
.setup-check-item::before { display:none; }
.setup-check-item > span { width:20px; height:20px; display:grid; place-items:center; border:1px solid #505a6b; border-radius:50%; color:#aeb8c8; font-size:.66rem; font-weight:900; }
.setup-check-item.complete > span { border-color:var(--success); background:rgba(78,211,154,.18); color:var(--success); }
.mapping-confirm-card { width:min(780px,calc(100vw - 28px)); }
.mapping-confirm-list { display:grid; gap:8px; max-height:min(58vh,620px); overflow:auto; margin:12px 0; padding-right:4px; }
.mapping-confirm-row { display:grid; grid-template-columns:minmax(150px,.8fr) 28px minmax(220px,1.2fr); align-items:center; gap:10px; padding:10px; border:1px solid var(--border); border-radius:10px; background:#121821; }
.mapping-confirm-row > span { color:#748096; text-align:center; font-weight:900; }
.mapping-confirm-row strong { display:block; color:#eef3fb; font-size:.76rem; }
.mapping-confirm-row small { display:block; margin-top:3px; color:#96a2b5; font-size:.66rem; line-height:1.35; }
.mapping-confirm-row .mapping-required { display:inline-flex; width:max-content; margin-top:5px; padding:2px 6px; border:1px solid rgba(255,95,109,.35); border-radius:999px; color:#ffb4bb; font-size:.58rem; font-weight:900; text-transform:uppercase; letter-spacing:.05em; }
.generation-row-loader { display:grid; gap:9px; margin:10px 0; padding:11px; border:1px solid rgba(0,231,255,.3); border-radius:10px; background:rgba(0,231,255,.04); }
.generation-row-loader[hidden] { display:none; }
.generation-row-loader .button-row { margin:0; }
.generation-row-loader select { min-width:0; }
#generationLoadedRowStatus { display:grid; gap:3px; padding:8px 9px; border:1px solid var(--border); border-radius:8px; background:#11161e; color:#9aa6b8; font-size:.67rem; line-height:1.4; }
#generationLoadedRowStatus strong { color:#eaf0f8; font-size:.72rem; }
.import-split-note { grid-column:1/-1; border-color:rgba(255,184,77,.35)!important; background:rgba(255,184,77,.06); color:#ffd28a!important; }
.single-template-card .template-explainer { display:grid; gap:4px; margin:9px 0; padding:9px 10px; border:1px solid rgba(124,92,255,.25); border-radius:9px; background:rgba(124,92,255,.045); }
.single-template-card .template-explainer strong { color:#e9e4ff; font-size:.72rem; }
.single-template-card .template-explainer span { color:#9ca7ba; font-size:.67rem; line-height:1.4; }
.studio-shell[data-studio-mode="generate"] #studioDesignTools,
.studio-shell[data-studio-mode="generate"] #studioDesignInspector { border-color:rgba(255,184,77,.26); }
.studio-shell[data-studio-mode="generate"] #studioDesignTools::before { content:"TEMPORARY WORKING COPY"; display:block; margin:0 0 7px; color:#ffd28a; font-size:.59rem; font-weight:900; letter-spacing:.08em; }
#previewDataDetails { border:1px solid rgba(255,184,77,.26); background:rgba(255,184,77,.035); }
#previewDataDetails > summary { color:#ffe0a9; }
@media (max-width:760px) {
  .mapping-confirm-row { grid-template-columns:1fr; gap:5px; }
  .mapping-confirm-row > span { text-align:left; transform:rotate(90deg); width:max-content; }
}
.mapping-review-row { display:grid; grid-template-columns:minmax(160px,.85fr) 28px minmax(220px,1.15fr); align-items:center; gap:10px; padding:10px; border:1px solid var(--border); border-radius:10px; background:#121821; }
.mapping-review-row > div { display:grid; gap:3px; min-width:0; }
.mapping-review-row > div > strong { color:#eef3fb; font-size:.76rem; overflow-wrap:anywhere; }
.mapping-review-row > div > span { color:#96a2b5; font-size:.65rem; line-height:1.35; }
.mapping-review-row .mapping-arrow { display:block; color:#748096; text-align:center; font-size:1rem; font-weight:900; }
.mapping-review-row.unmapped { border-color:rgba(255,184,77,.28); background:rgba(255,184,77,.035); }
.mapping-review-row.unmapped > div:last-child > strong { color:#ffd28a; }
.mapping-review-row.unmapped .mapping-arrow { color:#c1934f; }
.mapping-review-summary { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:10px 11px; border:1px solid rgba(0,231,255,.25); border-radius:9px; background:rgba(0,231,255,.04); }
.mapping-review-summary strong { color:#eafcff; font-size:.76rem; }
.mapping-review-summary span { color:#aeb8c8; font-size:.67rem; text-align:right; }
.required-badge,.optional-badge { display:inline-flex; margin-left:5px; padding:2px 5px; border-radius:999px; font-size:.54rem; font-weight:900; letter-spacing:.04em; text-transform:uppercase; vertical-align:middle; }
.required-badge { border:1px solid rgba(255,95,109,.35); color:#ffb4bb; background:rgba(255,95,109,.07); }
.optional-badge { border:1px solid rgba(124,92,255,.34); color:#c9bcff; background:rgba(124,92,255,.07); }
.mapping-format-review { display:grid; gap:5px; padding:10px; border:1px solid rgba(0,231,255,.25); border-radius:9px; background:rgba(0,231,255,.04); color:#aeb8c8; font-size:.69rem; }
.mapping-format-review strong { color:#eafcff; }
@media (max-width:760px) { .mapping-review-row { grid-template-columns:1fr; } .mapping-review-row .mapping-arrow { text-align:left; } .mapping-review-summary { align-items:flex-start; flex-direction:column; } .mapping-review-summary span { text-align:left; } }

.studio-guide-statement {
  display: grid;
  gap: .35rem;
  padding: .8rem;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: .75rem;
  background: rgba(255,255,255,.035);
  line-height: 1.45;
}
.studio-guide-statement span { color: var(--muted, #aeb7c5); font-size: .86rem; }
.schedule-history-heading { margin-top: 1rem; }
.schedule-history-heading h5 { margin: 0 0 .2rem; }

.sheet-connection-note { display: grid; gap: 0.3rem; margin: 0.75rem 0 1rem; padding: 0.85rem 0.95rem; border: 1px solid var(--border); border-radius: 12px; background: color-mix(in srgb, var(--panel) 82%, var(--accent) 18%); }
.sheet-connection-note strong { color: var(--text); }
.sheet-connection-note span { color: var(--muted); line-height: 1.45; }

.guided-mapper,
.sheet-confirmation-preview,
.sheet-confirmation-preview > :not(summary),
.sheet-preview-wrap,
.detected-column-grid,
.detected-column-card,
.detected-column-heading,
.sample-value-list {
  min-width: 0;
  max-width: 100%;
}

.sheet-confirmation-preview { overflow: hidden; }
.sheet-preview-wrap { width: 100%; }
.detected-column-grid {
  width: 100%;
  grid-template-columns: repeat(auto-fit, minmax(min(235px, 100%), 1fr));
}
.detected-column-card {
  width: 100%;
  overflow: hidden;
}
.detected-column-heading strong {
  flex: 1 1 auto;
  display: -webkit-box;
  max-width: 100%;
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
.sample-value-list { overflow: hidden; }
.sample-value-list code {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}

.mapping-explanation-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.mapping-explanation-grid article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px 13px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: #11161e;
}
.mapping-explanation-grid strong {
  display: block;
  color: #eef3fb;
  font-size: .78rem;
}
.mapping-explanation-grid span {
  display: block;
  color: #9ba6b8;
  font-size: .72rem;
  line-height: 1.45;
}

.mapping-capacity-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(300px, .8fr);
  align-items: end;
  gap: 14px 18px;
}
.mapping-capacity-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.mapping-capacity-copy strong {
  color: #eef3fb;
  font-size: .88rem;
}
.mapping-capacity-copy span {
  color: #9ba6b8;
  font-size: .75rem;
  line-height: 1.5;
}
.mapping-capacity-row > label {
  min-width: 0;
  width: 100%;
}
.mapping-capacity-row > label > span {
  display: block;
  margin-bottom: 6px;
}
.mapping-capacity-row select { min-width: 0; width: 100%; }
.mapping-capacity-row .mapping-status {
  grid-column: 1 / -1;
  text-align: left;
  line-height: 1.4;
}

@media (max-width: 900px) {
  .mapping-explanation-grid,
  .mapping-capacity-row { grid-template-columns: 1fr; }
  .mapping-capacity-row .mapping-status { grid-column: 1; }
}

.detected-column-grid {
  display: grid;
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: minmax(220px, 220px);
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 2px 10px;
  scroll-snap-type: x proximity;
  scrollbar-gutter: stable;
}
.detected-column-card {
  min-height: 132px;
  align-content: start;
  grid-template-rows: auto minmax(30px, auto) auto;
  scroll-snap-align: start;
}
.detected-column-heading { min-height: 34px; align-items: flex-start; }
.detected-column-heading strong { line-height: 1.35; }
.sample-value-list { min-height: 29px; align-content: flex-start; }

.creator-mapping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: 12px;
  align-items: stretch;
}
.creator-mapping-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  min-width: 0;
}
.creator-mapping-identity {
  display: grid;
  align-content: start;
  gap: 5px;
  min-width: 0;
}
.creator-mapping-identity h6 { margin: 0; font-size: .85rem; }
.creator-mapping-identity > span {
  color: var(--muted);
  font-size: .75rem;
  line-height: 1.45;
  max-width: 52rem;
}
.creator-mapping-card .mapping-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
  min-width: 0;
  width: 100%;
}
.creator-mapping-card .mapping-pair > label.mapping-field {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 6px;
  align-content: start;
  min-width: 0;
  min-height: 100%;
}
.mapping-control-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  flex-wrap: wrap;
}
.mapping-control-label em {
  color: var(--muted);
  font-size: .66rem;
  font-style: normal;
  font-weight: 500;
  white-space: nowrap;
}
.creator-mapping-card select { width: 100%; min-width: 0; max-width: 100%; }
.creator-mapping-card .mapping-field-sample {
  min-height: 2.6em;
  line-height: 1.35;
  white-space: normal;
  overflow-wrap: anywhere;
}
.extra-creators-details .extra-creators-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  padding: 0;
  gap: 12px;
  min-width: 0;
}
.format-mapping-grid { grid-column: 1 / -1; width: 100%; }

.extra-creators-details {
  grid-column: 1 / -1;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
  min-width: 0;
  padding: 6px 0 0;
}
.extra-creators-details > summary {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 10px 0 8px;
  cursor: pointer;
  font-weight: 850;
  list-style: none;
}
.extra-creators-details > summary .extra-creators-summary-copy {
  min-width: 0;
  flex: 1 1 auto;
}
.extra-creators-details > summary .optional-badge {
  flex: 0 0 auto;
  margin-left: 0;
}
.extra-creators-details > summary::-webkit-details-marker { display: none; }
.extra-creators-details[open] > summary {
  border-bottom: 0;
  padding-bottom: 6px;
}
.extra-creators-details > .tiny.muted {
  margin: 0 0 14px;
  padding: 0;
  max-width: 52rem;
}
.general-purpose-creators {
  padding: 0;
  gap: 12px;
  min-width: 0;
}

.gp-column-mapping-host {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.gp-column-mapping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: 12px;
  align-items: stretch;
}

.gp-column-mapping-card {
  border: 1px solid #262c39;
  border-radius: 12px;
  padding: 14px 15px;
  background: #121720;
  display: grid;
  gap: 10px;
  min-width: 0;
}

.gp-column-mapping-card.mapped {
  border-color: rgba(67, 196, 132, 0.34);
}

.gp-column-mapping-card.unmapped {
  border-style: dashed;
}

.gp-column-identity {
  display: grid;
  gap: 4px;
}

.gp-column-identity strong {
  font-size: 0.9rem;
}

.gp-column-field-label,
.gp-column-field-type {
  display: grid;
  gap: 5px;
  min-width: 0;
  margin: 0;
}

.gp-column-field-label input,
.gp-column-field-type select {
  width: 100%;
  min-width: 0;
}

@media (max-width: 900px) {
  .gp-column-mapping-grid { grid-template-columns: minmax(0, 1fr); }
}

#sheetMapper .optional-mapping-details > .optional-mapping-body {
  margin-left: 15px;
  margin-right: 15px;
}

.optional-mapping-body > .format-mapping-grid {
  width: 100%;
}

@media (max-width: 1200px) {
  .extra-creators-details .extra-creators-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .creator-mapping-grid { grid-template-columns: minmax(0, 1fr); }
  .extra-creators-details .extra-creators-grid { grid-template-columns: minmax(0, 1fr); }
  .creator-mapping-card .mapping-pair { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .detected-column-grid { grid-auto-columns: minmax(205px, 82vw); }
}


.mapping-status {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px 13px;
  border: 1px solid rgba(239,111,108,.34);
  border-radius: 11px;
  background: rgba(239,111,108,.065);
  min-width: 0;
}
.mapping-status-indicator {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(239,111,108,.16);
  border: 1px solid rgba(239,111,108,.42);
  color: #ffb8b5;
  font-size: .78rem;
  font-weight: 950;
}
.mapping-status-content { display: grid; gap: 4px; min-width: 0; }
.mapping-status-kicker {
  color: #ffaaa6;
  font-size: .62rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.mapping-status-title { color: #f3f6fb; font-size: .86rem; line-height: 1.3; }
.mapping-status-copy { color: #aeb7c6; font-size: .75rem; line-height: 1.48; }
.mapping-status-missing-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }
.mapping-status-missing-list span {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(239,111,108,.28);
  background: rgba(239,111,108,.09);
  color: #ffd0ce;
  font-size: .68rem;
  font-weight: 800;
}
.mapping-status-guidance {
  margin-top: 4px;
  color: #aeb7c6;
  font-size: .72rem;
  line-height: 1.45;
}
.mapping-status-guidance strong { color: #e5eaf2; }
.mapping-status-guidance em { color: #cec6ff; font-style: normal; font-weight: 800; }
.mapping-status.complete {
  border-color: rgba(67,196,132,.34);
  background: rgba(67,196,132,.07);
}
.mapping-status.complete .mapping-status-indicator {
  background: rgba(67,196,132,.14);
  border-color: rgba(67,196,132,.38);
  color: #8ce4b5;
}
.mapping-status.complete .mapping-status-title { color: #b9f1d1; }
@media (max-width: 620px) {
  .mapping-status { grid-template-columns: 24px minmax(0,1fr); padding: 11px; }
  .mapping-status-indicator { width: 23px; height: 23px; }
}

.mapping-status-complete-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.mapping-status-complete-list span {
  display: inline-flex;
  align-items: center;
  min-height: 23px;
  padding: 3px 8px;
  border: 1px solid rgba(67,196,132,.28);
  border-radius: 999px;
  background: rgba(67,196,132,.09);
  color: #b9f1d1;
  font-size: .68rem;
  font-weight: 800;
}
.optional-mapping-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.optional-mapping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
  gap: 12px;
  align-items: stretch;
}
.optional-mapping-card {
  display: grid;
  align-content: start;
  gap: 9px;
  min-width: 0;
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255,255,255,.018);
}
.optional-mapping-card.unmapped { border-style: dashed; }
.optional-mapping-card.mapped { border-color: rgba(67,196,132,.34); }
.optional-mapping-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}
.optional-mapping-state {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  border: 1px solid rgba(246,184,91,.30);
  background: rgba(246,184,91,.08);
  color: #ffd89b;
  font-size: .62rem;
  font-weight: 850;
}
.optional-mapping-card.mapped .optional-mapping-state {
  border-color: rgba(67,196,132,.30);
  background: rgba(67,196,132,.08);
  color: #b9f1d1;
}
.optional-mapping-card label { display: grid; gap: 5px; min-width: 0; }
.optional-mapping-card select { width: 100%; min-width: 0; }
.optional-mapping-detection { min-height: 34px; line-height: 1.4; overflow-wrap: anywhere; }
.compact-button { justify-self: start; min-height: 32px; padding: 6px 9px; }

.format-detection-note {
  display: block;
  min-height: 30px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255,255,255,.018);
  color: var(--muted);
  font-size: .69rem;
  line-height: 1.4;
}
.format-detection-note.auto {
  border-color: rgba(67,196,132,.30);
  background: rgba(67,196,132,.07);
  color: #b9f1d1;
}
.format-detection-note.manual {
  border-color: rgba(109,94,252,.30);
  background: rgba(109,94,252,.07);
  color: #d9d4ff;
}
.format-detection-note.ambiguous,
.format-detection-note.unknown,
.format-detection-note.no-samples {
  border-color: rgba(246,184,91,.30);
  background: rgba(246,184,91,.07);
  color: #ffd89b;
}