#platecraft-app .platecraft-workspace{
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(280px, 23.5vw, 326px);
  gap: 14px;
  padding: 12px 18px 18px;
  align-items: start;
}
#platecraft-app .platecraft-surface,
#platecraft-app .platecraft-inspector{
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d6dde5;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .04);
}
#platecraft-app .platecraft-surface-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  min-height: 45px;
  padding: 0 14px;
  border-bottom: 1px solid #e4e9ee;
}
#platecraft-app .platecraft-tab-buttons{ gap: 6px; }
#platecraft-app .platecraft-tab-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 44px;
  padding: 0 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #64748b;
  font-size: 12.5px;
  font-weight: 700;
}
#platecraft-app .platecraft-tab-btn svg{ width: 14px; height: 14px; }
#platecraft-app .platecraft-tab-btn.platecraft-active{ border-color: var(--platecraft-brand-2); color: var(--platecraft-brand); }
#platecraft-app .platecraft-surface-meta{
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}
#platecraft-app .platecraft-zoom-group{
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border: 1px solid #d7dfe6;
  border-radius: 8px;
  background: #f5f7f9;
}
#platecraft-app .platecraft-zoom-btn{
  height: 24px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #52606d;
  font-size: 11px;
  font-weight: 700;
  transition: background .12s, color .12s, box-shadow .12s;
}
#platecraft-app .platecraft-zoom-btn:hover{ color: var(--platecraft-brand); background: rgba(255,255,255,.7); }
#platecraft-app .platecraft-zoom-btn.platecraft-active{
  background: #fff;
  color: var(--platecraft-brand);
  box-shadow: 0 1px 2px rgba(15,23,42,.1);
}
#platecraft-app .platecraft-metric{ color: #64748b; font-size: 11.5px; white-space: nowrap; }
#platecraft-app .platecraft-metric b{ color: #1e293b; font-weight: 800; }

/* Live Hover / Selection Readout Strip */
#platecraft-app .platecraft-readout-bar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 36px;
  padding: 6px 14px;
  border-bottom: 1px solid #e6ebf0;
  background: #f8fafc;
  font-size: 12px;
  color: #475569;
}
#platecraft-app .platecraft-readout-main{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 8px;
  min-width: 0;
  flex: 1;
}
#platecraft-app .platecraft-readout-dot{
  width: 9px;
  height: 9px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.18);
}
#platecraft-app .platecraft-readout-id{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 1px 6px;
  border-radius: 5px;
  background: #e2e8f0;
  color: #0f172a;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  flex-shrink: 0;
}
#platecraft-app .platecraft-readout-sample{
  color: #0f172a;
  font-weight: 750;
  word-break: break-word;
}
#platecraft-app .platecraft-readout-empty{ color: #64748b; font-weight: 600; }
#platecraft-app .platecraft-readout-detail{
  color: #52606d;
  font-size: 11.5px;
  line-height: 1.35;
  word-break: break-word;
}
#platecraft-app .platecraft-readout-hint{
  color: #64748b;
  font-size: 11.5px;
  line-height: 1.35;
}
#platecraft-app .platecraft-jump-btn{
  display: none;
  flex-shrink: 0;
  align-items: center;
  height: 26px;
  padding: 0 9px;
  border: 1px solid #2f7c82;
  border-radius: 6px;
  background: #eef7f7;
  color: var(--platecraft-brand);
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
#platecraft-app .platecraft-back-plate-btn{
  display: none;
  min-height: 28px;
  padding: 0 8px;
  font-size: 11px;
  font-weight: 700;
  color: var(--platecraft-brand-2);
}

/* Plate Stage & Ergonomic Physical Plate Sizing */
#platecraft-app .platecraft-plate-stage{
  position: relative;
  min-height: 430px;
  overflow-x: auto;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
  padding: 16px 14px;
  user-select: none;
  background: radial-gradient(circle at 50% 0%, #ffffff 0%, #f6f8fa 100%);
}
#platecraft-app .platecraft-plate-stage::-webkit-scrollbar{ height: 8px; width: 8px; }
#platecraft-app .platecraft-plate-stage::-webkit-scrollbar-track{ background: #eef2f5; border-radius: 4px; }
#platecraft-app .platecraft-plate-stage::-webkit-scrollbar-thumb{ background: #b0bcc6; border-radius: 4px; }
#platecraft-app .platecraft-plate-stage::-webkit-scrollbar-thumb:hover{ background: var(--platecraft-brand-2); }

#platecraft-app .platecraft-physical-plate{
  position: relative;
  min-width: max-content;
  width: min(100%, var(--platecraft-plate-target, 100%));
  margin-inline: auto;
  padding: 16px 18px 18px;
  border: 1px solid #b5c0cb;
  border-radius: 16px;
  background: #fdfefe;
  box-shadow: 0 2px 10px rgba(15, 23, 42, .04), inset 0 1px 0 rgba(255,255,255,.95);
}
#platecraft-app .platecraft-physical-plate::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  background: linear-gradient(135deg, rgba(47,124,130,.22) 50%, transparent 50%);
  border-top-left-radius: 15px;
  pointer-events: none;
}

/* Per-format & per-zoom sizing tokens */
#platecraft-app .platecraft-physical-plate[data-format="6"]{
  --platecraft-plate-target: 620px; --platecraft-well-min: 92px; --platecraft-gap: 12px; --platecraft-axis-w: 24px;
}
#platecraft-app .platecraft-physical-plate[data-format="6"][data-zoom="125"]{ --platecraft-plate-target: 775px; --platecraft-well-min: 140px; }
#platecraft-app .platecraft-physical-plate[data-format="6"][data-zoom="150"]{ --platecraft-plate-target: 930px; --platecraft-well-min: 176px; }
#platecraft-app .platecraft-physical-plate[data-format="6"][data-zoom="200"]{ --platecraft-plate-target: 1180px; --platecraft-well-min: 224px; }

#platecraft-app .platecraft-physical-plate[data-format="12"]{
  --platecraft-plate-target: 700px; --platecraft-well-min: 74px; --platecraft-gap: 10px; --platecraft-axis-w: 24px;
}
#platecraft-app .platecraft-physical-plate[data-format="12"][data-zoom="125"]{ --platecraft-plate-target: 820px; --platecraft-well-min: 118px; }
#platecraft-app .platecraft-physical-plate[data-format="12"][data-zoom="150"]{ --platecraft-plate-target: 980px; --platecraft-well-min: 148px; }
#platecraft-app .platecraft-physical-plate[data-format="12"][data-zoom="200"]{ --platecraft-plate-target: 1240px; --platecraft-well-min: 186px; }

#platecraft-app .platecraft-physical-plate[data-format="24"]{
  --platecraft-plate-target: 800px; --platecraft-well-min: 60px; --platecraft-gap: 8px; --platecraft-axis-w: 24px;
}
#platecraft-app .platecraft-physical-plate[data-format="24"][data-zoom="125"]{ --platecraft-plate-target: 1000px; --platecraft-well-min: 94px; }
#platecraft-app .platecraft-physical-plate[data-format="24"][data-zoom="150"]{ --platecraft-plate-target: 1180px; --platecraft-well-min: 116px; }
#platecraft-app .platecraft-physical-plate[data-format="24"][data-zoom="200"]{ --platecraft-plate-target: 1480px; --platecraft-well-min: 148px; }

#platecraft-app .platecraft-physical-plate[data-format="48"]{
  --platecraft-plate-target: 100%; --platecraft-well-min: 52px; --platecraft-gap: 6px; --platecraft-axis-w: 22px;
}
#platecraft-app .platecraft-physical-plate[data-format="48"][data-zoom="125"]{ --platecraft-well-min: 76px; }
#platecraft-app .platecraft-physical-plate[data-format="48"][data-zoom="150"]{ --platecraft-well-min: 92px; }
#platecraft-app .platecraft-physical-plate[data-format="48"][data-zoom="200"]{ --platecraft-well-min: 118px; }

#platecraft-app .platecraft-physical-plate[data-format="96"]{
  --platecraft-plate-target: 100%; --platecraft-well-min: 40px; --platecraft-gap: 4px; --platecraft-axis-w: 20px;
}
#platecraft-app .platecraft-physical-plate[data-format="96"][data-zoom="125"]{ --platecraft-well-min: 62px; --platecraft-gap: 6px; }
#platecraft-app .platecraft-physical-plate[data-format="96"][data-zoom="150"]{ --platecraft-well-min: 76px; --platecraft-gap: 7px; }
#platecraft-app .platecraft-physical-plate[data-format="96"][data-zoom="200"]{ --platecraft-well-min: 96px; --platecraft-gap: 8px; }

#platecraft-app .platecraft-physical-plate[data-format="384"]{
  --platecraft-plate-target: 100%; --platecraft-well-min: 38px; --platecraft-gap: 2px; --platecraft-axis-w: 16px;
  padding: 12px 12px 14px;
}
#platecraft-app .platecraft-physical-plate[data-format="384"][data-zoom="125"]{ --platecraft-well-min: 48px; --platecraft-gap: 4px; --platecraft-axis-w: 18px; padding: 14px 16px 16px; }
#platecraft-app .platecraft-physical-plate[data-format="384"][data-zoom="150"]{ --platecraft-well-min: 60px; --platecraft-gap: 5px; --platecraft-axis-w: 20px; padding: 16px 18px 18px; }
#platecraft-app .platecraft-physical-plate[data-format="384"][data-zoom="200"]{ --platecraft-well-min: 78px; --platecraft-gap: 6px; --platecraft-axis-w: 20px; padding: 16px 18px 18px; }

#platecraft-app .platecraft-plate-grid{
  display: grid;
  align-items: center;
  gap: var(--platecraft-gap, 5px);
}
#platecraft-app .platecraft-axis{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #525d68;
  font-size: 11px;
  font-weight: 700;
  transition: background .1s, color .1s;
}
#platecraft-app .platecraft-axis:hover{ background: #edf5f5; color: var(--platecraft-brand-2); }
#platecraft-app .platecraft-axis.platecraft-axis-active{ background: #dbeafe; color: #1d4ed8; font-weight: 800; }

/* Circular Wells & Multi-line Readable Well Content */
#platecraft-app .platecraft-well{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  padding: 0;
  aspect-ratio: 1;
  border: 1.5px solid var(--platecraft-well-color, #9aa3ad);
  border-radius: 50%;
  background: var(--platecraft-well-bg, #fff);
  outline: 0;
  overflow: hidden;
  touch-action: pan-x pan-y;
  transition: border-color .12s, box-shadow .12s;
}
#platecraft-app .platecraft-well.platecraft-moat{ border-style: dashed; opacity: .84; }
#platecraft-app .platecraft-well:hover{
  border-width: 2px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .14);
  z-index: 2;
}
#platecraft-app .platecraft-well.platecraft-selected{
  border-color: #1d4ed8;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #2563eb;
  z-index: 3;
}
#platecraft-app .platecraft-well.platecraft-editing{
  overflow: visible !important;
  z-index: 40 !important;
}

#platecraft-app .platecraft-well-ghost{
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
  opacity: .55;
  pointer-events: none;
}

#platecraft-app .platecraft-well-inner{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  width: 84%;
  max-height: 84%;
  overflow: hidden;
  text-align: center;
  pointer-events: none;
}
#platecraft-app .platecraft-well-top{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  max-width: 100%;
}
#platecraft-app .platecraft-well-id{
  font-size: 9.5px;
  font-weight: 800;
  color: #475569;
  letter-spacing: .02em;
}
#platecraft-app .platecraft-well-badge{
  padding: 1px 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(15,23,42,.1);
  color: #1e293b;
  font-size: 8.5px;
  font-weight: 800;
  text-transform: uppercase;
}
#platecraft-app .platecraft-well-title{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  max-width: 100%;
  color: #0f172a;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  word-break: normal;
}
#platecraft-app .platecraft-well-conc{
  display: inline-block;
  max-width: 96%;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  color: #0f172a;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#platecraft-app .platecraft-well-sub{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  max-width: 96%;
  color: #334155;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
}
#platecraft-app .platecraft-well-vol{
  color: #475569;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.1;
}

/* Format-specific well text typography */
#platecraft-app .platecraft-plate-grid[data-format="6"] .platecraft-well-inner{ width: 82%; gap: 4px; }
#platecraft-app .platecraft-plate-grid[data-format="6"] .platecraft-well-title{ -webkit-line-clamp: 3; font-size: 14.5px; }
#platecraft-app .platecraft-plate-grid[data-format="6"] .platecraft-well-title[data-len="lg"]{ font-size: 12.5px; }
#platecraft-app .platecraft-plate-grid[data-format="6"] .platecraft-well-conc{ font-size: 11px; padding: 2px 8px; }
#platecraft-app .platecraft-plate-grid[data-format="6"] .platecraft-well-sub{ font-size: 10.5px; }

#platecraft-app .platecraft-plate-grid[data-format="12"] .platecraft-well-inner{ width: 84%; gap: 2.5px; }
#platecraft-app .platecraft-plate-grid[data-format="12"] .platecraft-well-title{ font-size: 12.5px; }
#platecraft-app .platecraft-plate-grid[data-format="12"] .platecraft-well-title[data-len="lg"]{ font-size: 11px; }
#platecraft-app .platecraft-plate-grid[data-format="12"] .platecraft-well-sub{ -webkit-line-clamp: 1; font-size: 9.5px; }

#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-inner{ width: 86%; gap: 1.5px; }
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-top{ display: none; }
#platecraft-app .platecraft-plate-grid[data-format="24"]:not([data-zoom="auto"]) .platecraft-well-top{ display: inline-flex; }
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-title{ font-size: 11px; }
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-title[data-len="md"],
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-title[data-len="lg"]{ font-size: 9.8px; }
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-conc{ font-size: 9px; padding: 1px 5px; }
#platecraft-app .platecraft-plate-grid[data-format="24"] .platecraft-well-sub{ -webkit-line-clamp: 1; font-size: 8.5px; }

#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-inner{ width: 88%; gap: 1px; }
#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-title{ font-size: 10px; line-height: 1.08; }
#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-title[data-len="xs"]{ font-size: 11px; }
#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-title[data-len="md"],
#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-title[data-len="lg"]{ font-size: 8.8px; }
#platecraft-app .platecraft-plate-grid[data-format="48"] .platecraft-well-conc{ font-size: 8.2px; padding: 0 4px; background: rgba(255,255,255,.65); }

#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-inner{ width: 90%; max-height: 88%; gap: 1px; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-title{ font-size: 9.5px; line-height: 1.08; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-title[data-len="xs"]{ font-size: 10.5px; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-title[data-len="sm"]{ font-size: 9.5px; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-title[data-len="md"]{ font-size: 8.5px; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-title[data-len="lg"]{ font-size: 7.8px; -webkit-line-clamp: 3; }
#platecraft-app .platecraft-plate-grid[data-format="96"] .platecraft-well-conc{ display: none; }
#platecraft-app .platecraft-plate-grid[data-format="96"]:not([data-zoom="auto"]) .platecraft-well-conc{
  display: block;
  font-size: 8px;
  padding: 0 3px;
  background: rgba(255,255,255,.65);
}
#platecraft-app .platecraft-plate-grid[data-format="96"]:not([data-zoom="auto"]) .platecraft-well-title{ font-size: 10.5px; }
#platecraft-app .platecraft-plate-grid[data-format="96"]:not([data-zoom="auto"]) .platecraft-well-title[data-len="md"],
#platecraft-app .platecraft-plate-grid[data-format="96"]:not([data-zoom="auto"]) .platecraft-well-title[data-len="lg"]{ font-size: 9.2px; }

#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-axis{ font-size: 9.5px; min-height: 16px; padding: 1px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well{ border-width: 1.25px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-inner{ width: 92%; max-height: 90%; gap: 0.5px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-title{
  font-size: 7.4px;
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -.02em;
  -webkit-line-clamp: 2;
}
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-title[data-len="xs"]{ font-size: 8.5px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-title[data-len="sm"]{ font-size: 7.5px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-title[data-len="md"],
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-title[data-len="lg"]{ font-size: 6.4px; }
#platecraft-app .platecraft-plate-grid[data-format="384"] .platecraft-well-conc{ display: none; }

#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="125"] .platecraft-well-title{ font-size: 8.4px; }
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="125"] .platecraft-well-title[data-len="md"],
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="125"] .platecraft-well-title[data-len="lg"]{ font-size: 7.4px; }
#platecraft-app .platecraft-plate-grid[data-format="384"]:not([data-zoom="auto"]) .platecraft-well-conc{
  display: block;
  font-size: 6.2px;
  padding: 0 2px;
  line-height: 1.15;
  background: rgba(255,255,255,.7);
}
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="150"] .platecraft-well-title{ font-size: 9px; line-height: 1.06; }
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="150"] .platecraft-well-conc{ font-size: 7.4px; padding: 0 3px; }
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="200"] .platecraft-well-title{ font-size: 10px; line-height: 1.08; font-weight: 800; }
#platecraft-app .platecraft-plate-grid[data-format="384"][data-zoom="200"] .platecraft-well-conc{ font-size: 8px; padding: 0 4px; }

/* Expanded pill input for double-click inline editing even on tiny wells */
#platecraft-app .platecraft-inline-well-input{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: max(126px, 108%);
  height: 30px;
  padding: 0 9px;
  border: 0;
  border-radius: 8px;
  background: #fff;
  color: #0f172a;
  text-align: center;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 6px 20px rgba(15,23,42,.22), 0 0 0 2px var(--platecraft-brand-2);
  z-index: 40;
}
#platecraft-app .platecraft-inline-well-input:focus{ outline: none; }
#platecraft-app .platecraft-selection-box{ position: absolute; z-index: 20; border: 1px solid #2e78dc; background: rgba(65,145,238,.18); pointer-events: none; }

#platecraft-app .platecraft-map-footer{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 46px;
  padding: 8px 14px;
  border-top: 1px solid #e4e9ee;
}
#platecraft-app .platecraft-legend{ display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
#platecraft-app .platecraft-legend-item{ display: flex; align-items: center; gap: 5px; color: #52606d; font-size: 11px; white-space: nowrap; }
#platecraft-app .platecraft-legend-item i{ width: 9px; height: 9px; border-radius: 2px; flex-shrink: 0; }
#platecraft-app .platecraft-legend-item b{ color: #1e293b; }

/* Well Table View */
#platecraft-app .platecraft-table-tab{ display: none; min-height: 480px; }
#platecraft-app .platecraft-table-tools{ display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #e4e9ee; font-size: 12px; color: #64748b; }
#platecraft-app .platecraft-search{ width: min(360px, 72%); }
#platecraft-app .platecraft-table-wrap{ max-height: 520px; overflow: auto; -webkit-overflow-scrolling: touch; }
#platecraft-app table{ width: 100%; border-collapse: collapse; min-width: 640px; }
#platecraft-app th, #platecraft-app td{ padding: 9px 11px; border-bottom: 1px solid #e7eaed; text-align: left; font-size: 12px; }
#platecraft-app th{ position: sticky; top: 0; z-index: 2; background: #f8fafc; color: #475569; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
#platecraft-app tbody tr{ cursor: pointer; }
#platecraft-app tbody tr:hover, #platecraft-app tbody tr.platecraft-selected{ background: #eef6f7; }
#platecraft-app .platecraft-type-pill{ display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
#platecraft-app .platecraft-type-pill i{ width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
#platecraft-app .platecraft-table-notes{ max-width: 240px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #64748b; }
#platecraft-app .platecraft-empty-table{ padding: 80px 20px; text-align: center; color: #7d8792; }
#platecraft-app .platecraft-empty-table b{ display: block; margin-bottom: 5px; color: #4d5863; }

/* Inspector Panel */
#platecraft-app .platecraft-inspector{ min-height: 515px; }
#platecraft-app .platecraft-inspector-head{ display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 14px 16px; border-bottom: 1px solid #e4e9ee; }
#platecraft-app .platecraft-inspector-head > div:first-child{ min-width: 0; }
#platecraft-app .platecraft-inspector-head-btns{ display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
#platecraft-app .platecraft-eyebrow{ color: #64748b; font-size: 9.5px; font-weight: 800; letter-spacing: .12em; }
#platecraft-app .platecraft-inspector-head h2{ margin: 4px 0 0; font-size: 17px; color: #0f172a; }
#platecraft-app .platecraft-inspector-empty{ display: grid; place-items: center; padding: 72px 24px; text-align: center; color: #64748b; }
#platecraft-app .platecraft-inspector-empty .platecraft-cursor{ display: grid; width: 46px; height: 46px; margin-bottom: 14px; place-items: center; border: 1px solid #cad4d8; border-radius: 50%; color: var(--platecraft-brand-2); }
#platecraft-app .platecraft-inspector-empty .platecraft-cursor svg{ width: 22px; height: 22px; }
#platecraft-app .platecraft-inspector-empty b{ color: #1e293b; font-size: 13.5px; }
#platecraft-app .platecraft-inspector-empty p{ max-width: 100%; margin: 6px 0 0; font-size: 12px; line-height: 1.55; }
#platecraft-app .platecraft-inspector-form{ display: flex; flex-direction: column; gap: 11px; padding: 14px 16px; min-width: 0; }
#platecraft-app .platecraft-notice{ display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid #c8dfdc; border-radius: 7px; background: #f0f8f7; color: #3d5d5a; font-size: 11px; line-height: 1.4; }
#platecraft-app .platecraft-notice svg{ width: 14px; height: 14px; flex-shrink: 0; }
#platecraft-app .platecraft-field-row{ gap: 8px; min-width: 0; }
#platecraft-app .platecraft-field-row > *{ flex: 1; min-width: 0; }
#platecraft-app .platecraft-field-row > .platecraft-field-grow{ flex: 1.55; }
#platecraft-app .platecraft-field-row > .platecraft-field-compact{ flex: 0.75; }
#platecraft-app .platecraft-color-row{ display: flex; flex-wrap: wrap; gap: 7px; }
#platecraft-app .platecraft-color{ display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; border: 2px solid #fff; border-radius: 50%; outline: 1px solid #ccd3d9; color: #fff; cursor: pointer; }
#platecraft-app .platecraft-color.platecraft-active{ outline: 2px solid #233b44; }
#platecraft-app .platecraft-color svg{ width: 13px; height: 13px; }
#platecraft-app .platecraft-custom-color-btn{ background: conic-gradient(red, yellow, lime, aqua, blue, magenta, red); position: relative; }
#platecraft-app .platecraft-custom-color-btn input[type="color"]{ opacity: 0; position: absolute; inset: 0; width: 100%; height: 100%; cursor: pointer; }
#platecraft-app .platecraft-custom-color-btn svg{ position: absolute; z-index: 2; }
#platecraft-app .platecraft-inspector-actions{ gap: 7px; padding-top: 4px; }
#platecraft-app .platecraft-inspector-actions .platecraft-primary{ flex: 1; min-height: 36px; }

/* Dialogs & Toast */
#platecraft-app dialog{ width: min(500px, calc(100% - 28px)); margin: auto; padding: 0; border: 1px solid #cdd4da; border-radius: 12px; background: #fff; color: var(--platecraft-ink); box-shadow: 0 22px 70px rgba(21,31,46,.24); }
#platecraft-app dialog::backdrop{ background: rgba(20,30,42,.38); }
#platecraft-app .platecraft-dialog-body{ padding: 20px; }
#platecraft-app .platecraft-dialog-body h3{ margin: 0 0 7px; font-size: 17px; }
#platecraft-app .platecraft-dialog-body > p{ margin: 0 0 16px; color: #64748b; line-height: 1.55; font-size: 12.5px; }
#platecraft-app .platecraft-dialog-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
#platecraft-app .platecraft-dialog-actions{ display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
#platecraft-app .platecraft-preview{ margin-top: 14px; padding: 10px; border: 1px solid #d9e1e4; border-radius: 7px; background: #f5f8f8; }
#platecraft-app .platecraft-preview span{ display: block; color: #64748b; font-size: 11px; }
#platecraft-app .platecraft-preview b{ display: block; margin-top: 4px; }
#platecraft-app .platecraft-toast{ position: fixed; left: 50%; bottom: 22px; z-index: 100050; transform: translate(-50%,18px); padding: 10px 15px; border-radius: 8px; background: #17252d; color: #fff; box-shadow: 0 8px 25px rgba(0,0,0,.2); font-size: 12.5px; font-weight: 600; opacity: 0; pointer-events: none; transition: .18s; max-width: calc(100vw - 28px); text-align: center; }
#platecraft-app .platecraft-toast.platecraft-show{ transform: translate(-50%,0); opacity: 1; }
#platecraft-app .platecraft-toast.platecraft-error{ background: #9f2f3c; }
#platecraft-app .platecraft-guide-list{ font-size: 12px; color: #475569; line-height: 1.65; margin: 0 0 15px; padding-left: 20px; }