/* Extracted App Blueprint layer from styles.css. Keep this file loaded after styles.css. */

/* App Blueprint refinement */
.blueprint-head { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(520px, 1.1fr); align-items: start; }
.blueprint-head > div:first-child h2:empty { display: none; }
.blueprint-actions.rich { max-width: none; display: grid; grid-template-columns: minmax(280px, .9fr) minmax(360px, 1.1fr); gap: 14px; align-items: stretch; }
.blueprint-switch-card, .blueprint-add-card { border: 1px solid var(--line); border-radius: 20px; background: #fffaf8; padding: 14px; display: grid; gap: 10px; }
.blueprint-switch-card .field, .blueprint-add-card .field { margin: 0; }
.blueprint-add-card > b { color: var(--brand); font-size: 13px; letter-spacing: 0; text-transform: none; }
.blueprint-add-card .blueprint-custom-form { display: grid; grid-template-columns: minmax(160px, .75fr) minmax(260px, 1fr) auto; gap: 10px; align-items: end; padding: 0; border: 0; background: transparent; }
.blueprint-add-card .blueprint-custom-form textarea { min-height: 74px; }
.blueprint-top-buttons { grid-column: 1 / -1; justify-content: flex-start; padding-top: 2px; }
.blueprint-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.blueprint-toolbar .blueprint-legend { margin: 0; }
.blueprint-zoom { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fffaf8; border-radius: 999px; padding: 6px; }
.blueprint-zoom span { min-width: 46px; text-align: center; color: var(--brand); font-weight: 900; font-size: 12px; }
.blueprint-canvas { min-width: 0; min-height: 560px; overflow: auto; cursor: grab; overscroll-behavior: contain; }
.blueprint-canvas.panning { cursor: grabbing; }
.blueprint-stage { position: relative; min-width: 100%; min-height: 100%; }
.blueprint-stage-inner { position: absolute; left: 0; top: 0; width: 1240px; height: 560px; transform-origin: 0 0; }
.blueprint-stage-inner svg { position: absolute; inset: 0; width: 1240px; height: 500px; pointer-events: none; }
.blueprint-stage-inner .blueprint-node { position: absolute; }
@media (max-width: 1180px) {
  .blueprint-head { grid-template-columns: 1fr; }
  .blueprint-actions.rich { grid-template-columns: 1fr; }
  .blueprint-add-card .blueprint-custom-form { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .blueprint-toolbar { align-items: stretch; }
  .blueprint-zoom { justify-content: center; width: 100%; }
}

/* Blueprint dirty-field visibility */
.blueprint-node.dirty {
  background: #fff1b8 !important;
  border-color: #d99000 !important;
  box-shadow: 0 0 0 3px rgba(217,144,0,.18), 0 18px 42px rgba(120,76,0,.18) !important;
}
.blueprint-node .dirty-field,
.blueprint-detail-panel .dirty-field,
.blueprint-note-editor.dirty-field {
  background: #fff1b8 !important;
  color: #6d4300 !important;
  border: 1px solid #d99000 !important;
  border-radius: 10px;
  padding: 6px 8px;
}
.blueprint-detail-panel.dirty {
  background: #fff8dc !important;
  border-color: #d99000 !important;
  box-shadow: 0 0 0 3px rgba(217,144,0,.14), 0 18px 42px rgba(120,76,0,.12) !important;
}
.blueprint-detail-panel.dirty .blueprint-edit-hint::after {
  content: '  •';
  color: #a86600;
}

/* Blueprint add-node dirty visibility */
.blueprint-add-card.dirty {
  background: #fff8dc !important;
  border-color: #d99000 !important;
  box-shadow: 0 0 0 3px rgba(217,144,0,.14), 0 18px 42px rgba(120,76,0,.10) !important;
}
.blueprint-add-card input.dirty-field,
.blueprint-add-card textarea.dirty-field {
  background: #fff1b8 !important;
  color: #6d4300 !important;
  border-color: #d99000 !important;
}
.blueprint-add-card.dirty > b::after {
  content: ' •';
  color: #a86600;
  text-transform: none;
  letter-spacing: 0;
}

/* Blueprint line/node layering + no text overlap */
.blueprint-stage-inner svg { z-index: 1; }
.blueprint-stage-inner .blueprint-node { z-index: 2; }
.blueprint-edge { opacity: .72; }

/* Stable Blueprint canvas architecture */
.blueprint-shell { position: relative; }
.blueprint-canvas { position: relative; min-width: 0 !important; min-height: 560px; overflow: auto; cursor: grab; overscroll-behavior: contain; }
.blueprint-stage { position: relative; min-width: 100%; min-height: 100%; }
.blueprint-stage-inner { position: relative !important; left: auto !important; top: auto !important; transform: none !important; transform-origin: 0 0; }
.blueprint-stage-inner svg { position: absolute; inset: 0; width: 100% !important; height: 100% !important; pointer-events: auto !important; z-index: 1; }
.blueprint-stage-inner .blueprint-node { position: absolute; z-index: 2; width: 168px; height: 78px; overflow: hidden; cursor: grab; }
.blueprint-edge { fill: none; stroke-width: 2.4; marker-end: url(#bpArrow); stroke-linecap: round; stroke-linejoin: round; pointer-events: stroke; cursor: pointer; opacity: .82; }
.blueprint-edge:hover, .blueprint-edge.hovered, .blueprint-edge.selected-edge { stroke-width: 4; opacity: 1; filter: drop-shadow(0 0 4px rgba(143,79,95,.28)); }
.blueprint-edge-tooltip { position: absolute; z-index: 20; min-width: 160px; max-width: 260px; padding: 9px 11px; border: 1px solid rgba(143,79,95,.25); border-radius: 14px; background: rgba(255,250,248,.96); box-shadow: 0 14px 34px rgba(78,37,48,.16); display: none; pointer-events: none; }
.blueprint-edge-tooltip.show { display: grid; gap: 3px; }
.blueprint-edge-tooltip b { color: var(--brand); font-size: 12px; }
.blueprint-edge-tooltip span { color: var(--muted); font-size: 12px; }
.blueprint-edge-note { border: 1px solid rgba(143,72,80,.24); background: #fff8fb; border-radius: 14px; padding: 10px; display: grid; gap: 4px; }
.blueprint-edge-note b { color: var(--brand); font-size: 12px; }
.blueprint-edge-note span, .blueprint-edge-note small { color: var(--muted); }
.blueprint-zoom span { display: none; }
.blueprint-overlap-warning { position: sticky; top: 10px; left: 10px; z-index: 12; width: fit-content; max-width: 320px; display: none; align-items: center; gap: 8px; margin: 10px; border: 1px solid rgba(198,88,38,.32); border-radius: 999px; background: rgba(255,243,232,.94); color: #7a3c13; padding: 8px 11px; box-shadow: 0 10px 26px rgba(122,60,19,.14); backdrop-filter: blur(8px); pointer-events: none; }
.blueprint-overlap-warning.show { display: inline-flex; }
.blueprint-overlap-warning b { color: #9b4415; font-size: 11px; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.blueprint-overlap-warning span { font-size: 11px; line-height: 1.25; }
.blueprint-node.overlap-warning { border-color: #d95f1f !important; background: #fff0e5 !important; box-shadow: 0 0 0 4px rgba(217,95,31,.20), 0 18px 42px rgba(122,60,19,.20) !important; }
.blueprint-node.overlap-warning em { color: #b54815; }
.blueprint-node.overlap-warning::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: repeating-linear-gradient(135deg, rgba(217,95,31,.12) 0, rgba(217,95,31,.12) 6px, transparent 6px, transparent 12px); }
