/* K-TATTOO STANDARD v1.7.1 — project / multi-session / linked retouch UI */
.record-project-meta {
  margin: 8px 0 2px;
}
.record-project-meta span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 5px 8px;
  border: 1px solid rgba(15, 118, 110, .22);
  border-radius: 999px;
  background: rgba(15, 118, 110, .08);
  color: #0f5f58;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-session-summary,
.project-session-editor {
  border-color: rgba(15, 118, 110, .28) !important;
  background: linear-gradient(180deg, rgba(240, 253, 250, .72), rgba(255,255,255,.98));
}
.project-session-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
.project-session-heading h3 {
  margin-bottom: 4px;
}
.project-status-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 7px 10px;
  border-radius: 999px;
  background: #0f766e;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.project-session-stats {
  display: grid;
  grid-template-columns: minmax(0, 2fr) repeat(3, minmax(84px, 1fr));
  gap: 8px;
  margin: 12px 0;
}
.project-session-stats span {
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid rgba(15, 23, 42, .09);
  border-radius: 12px;
  background: rgba(255,255,255,.86);
}
.project-session-stats b,
.project-session-stats em {
  display: block;
}
.project-session-stats b {
  overflow: hidden;
  color: #0f172a;
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-session-stats em {
  margin-top: 3px;
  color: #64748b;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
}
.project-session-timeline {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}
.project-session-item {
  display: grid;
  grid-template-columns: minmax(90px, .75fr) minmax(0, 2fr);
  gap: 10px;
  align-items: center;
  width: 100%;
  padding: 9px 11px;
  border: 1px solid #dbe4ea;
  border-radius: 10px;
  background: #fff;
  color: #0f172a;
  text-align: left;
  cursor: pointer;
}
.project-session-item:hover {
  border-color: #5eead4;
  background: #f0fdfa;
}
.project-session-item.active {
  border-color: #0f766e;
  box-shadow: 0 0 0 2px rgba(15, 118, 110, .10);
  background: #f0fdfa;
}
.project-session-item b {
  font-size: 12px;
}
.project-session-item span {
  overflow: hidden;
  color: #64748b;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-session-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.project-session-actions small {
  flex: 1 1 280px;
  color: #64748b;
  font-size: 11px;
  line-height: 1.45;
}
.project-schema-warning {
  border-style: dashed !important;
  background: #fff7ed !important;
}
.kts-command-project {
  margin-top: 4px !important;
  color: #0f766e !important;
  font-size: 11px !important;
  font-weight: 800;
}

@media (max-width: 760px) {
  .project-session-heading {
    gap: 10px;
  }
  .project-session-stats {
    grid-template-columns: 1fr 1fr;
  }
  .project-session-stats span:first-child {
    grid-column: 1 / -1;
  }
  .project-session-item {
    grid-template-columns: 1fr;
    gap: 2px;
  }
  .project-session-item span {
    white-space: normal;
  }
  .project-session-actions .btn {
    width: 100%;
  }
}


/* v1.7.0.1 — session navigation UX hotfix */
.project-session-summary {
  position: relative;
  scroll-margin-top: 12px;
}
.project-session-heading h3 {
  margin: 0 0 4px;
  font-size: clamp(18px, 2.2vw, 24px);
}
.project-current-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  margin: 12px 0 10px;
  padding: 14px 16px;
  border: 1px solid rgba(15,118,110,.25);
  border-radius: 14px;
  background: #fff;
}
.project-current-banner > div { min-width: 0; }
.project-current-banner span,
.project-current-banner small { display: block; }
.project-current-banner span { color:#64748b; font-size:11px; font-weight:800; }
.project-current-banner strong { display:inline-block; margin-top:2px; color:#0f766e; font-size:24px; line-height:1.1; }
.project-current-banner small { margin-top:4px; overflow:hidden; color:#334155; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.project-current-banner p { margin:0; color:#475569; font-size:12px; line-height:1.45; text-align:right; }
.project-current-banner p b { color:#0f766e; }
.project-session-stats {
  grid-template-columns: repeat(2, minmax(90px, 1fr));
  max-width: 340px;
  margin: 8px 0 14px;
}
.project-session-guide {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:12px;
  margin:4px 0 8px;
}
.project-session-guide > div b,
.project-session-guide > div span { display:block; }
.project-session-guide > div b { color:#0f172a; font-size:13px; }
.project-session-guide > div span { margin-top:2px; color:#64748b; font-size:11px; }
.project-session-guide-current { color:#0f766e; font-size:11px; font-weight:900; white-space:nowrap; }
.project-session-timeline {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(132px, 1fr));
  gap:8px;
  margin-top:0;
}
.project-session-item {
  display:flex;
  min-width:0;
  min-height:64px;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  padding:10px 12px;
}
.project-session-item-head {
  display:flex !important;
  width:100%;
  align-items:center;
  gap:6px;
  color:#0f172a !important;
  overflow:visible !important;
  white-space:normal !important;
}
.project-session-item-head b { font-size:14px; }
.project-session-item-head em {
  padding:2px 6px;
  border-radius:999px;
  background:#0f766e;
  color:#fff;
  font-size:9px;
  font-style:normal;
  font-weight:900;
}
.project-session-item > span:last-child {
  width:100%;
  color:#64748b;
  font-size:10px;
  line-height:1.35;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.project-session-actions { margin-top:10px; }
.current-session-record-divider {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:16px 0 10px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(15,118,110,.08);
}
.current-session-record-divider span { color:#0f766e; font-size:13px; font-weight:900; }
.current-session-record-divider b { color:#475569; font-size:11px; font-weight:700; text-align:right; }
@media (max-width:760px) {
  .project-current-banner { grid-template-columns:1fr; gap:8px; padding:12px; }
  .project-current-banner p { text-align:left; }
  .project-session-stats { max-width:none; grid-template-columns:1fr 1fr; }
  .project-session-stats span:first-child { grid-column:auto; }
  .project-session-guide { align-items:flex-start; }
  .project-session-timeline {
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding:1px 1px 6px;
    scroll-snap-type:x proximity;
    scrollbar-width:thin;
  }
  .project-session-item {
    flex:0 0 138px;
    min-height:68px;
    scroll-snap-align:start;
  }
  .project-session-item span { white-space:nowrap; }
  .project-session-actions .btn { width:100%; }
  .current-session-record-divider { align-items:flex-start; flex-direction:column; gap:2px; }
  .current-session-record-divider b { text-align:left; }
}


/* v1.7.1 — linked retouch session */
.record-project-meta { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.record-retouch-badge {
  display:inline-flex; align-items:center; padding:4px 7px; border-radius:999px;
  background:#fff7ed; border:1px solid #fdba74; color:#9a3412; font-size:10px; font-weight:900;
}
.project-session-item.retouch { border-style:dashed; border-color:#fdba74; background:#fffaf5; }
.project-session-item.retouch:hover { border-color:#f97316; background:#fff7ed; }
.project-session-item.retouch.active { border-color:#ea580c; background:#fff7ed; box-shadow:0 0 0 2px rgba(234,88,12,.10); }
.project-session-item-head i {
  padding:2px 6px; border-radius:999px; background:#ffedd5; color:#9a3412; font-size:9px; font-style:normal; font-weight:900;
}
.retouch-create-button { border-color:#fb923c !important; color:#9a3412 !important; background:#fff7ed !important; }
.retouch-link-button { border-color:#fed7aa !important; color:#9a3412 !important; background:#fffaf5 !important; }
.project-current-banner strong { max-width:100%; }
@media (max-width:760px) {
  .project-session-stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .project-session-stats span { padding:9px 8px; }
  .project-session-stats b { font-size:12px; }
  .project-session-stats em { font-size:9px; }
}