:root {
  --c-blue: #0089c8;
  --c-dark: #07558c;
  --c-red: #d51b24;
  --c-orange: #ef8b23;
  --c-violet: #983db3;
  --c-green: #158653;
  --c-yellow: #edcf2d;
  --c-soft: #eaf7fc;
  --c-ink: #12325b;
  --grid-gap: .28mm;
  --card-radius: .85mm;
}
.print-card {
  width: var(--card-width);
  height: var(--card-height);
  flex: 0 0 auto;
  background: #fff;
  color: var(--c-ink);
  padding: .75mm;
  display: grid;
  grid-template-rows: 6.15mm minmax(0, 1fr);
  gap: .4mm;
  font-family: Arial, Helvetica, sans-serif;
  overflow: hidden;
  print-color-adjust: exact;
  -webkit-print-color-adjust: exact;
}
.editor-card { box-shadow: 0 1.2mm 5mm #15324738; }
.card-masthead {
  min-width: 0;
  display: grid;
  grid-template-columns: 5.1mm .28mm minmax(0, 1fr);
  align-items: center;
  gap: .8mm;
  padding: .25mm .7mm;
  background: var(--c-dark);
  color: #fff;
  border-radius: .7mm;
}
.card-logo { width: 4.7mm; height: 4.7mm; object-fit: contain; display: block; background: #fff; border-radius: .2mm; }
.brand-rule { width: .22mm; height: 4mm; background: #fff; opacity: .8; }
.card-masthead div { min-width: 0; display: grid; align-content: center; }
.card-masthead b { font-size: 2.1mm; line-height: 1; white-space: nowrap; }
.card-masthead small { margin-top: .35mm; font-size: 1.1mm; line-height: 1; letter-spacing: .02em; opacity: .95; }

.card-content { min-width: 0; min-height: 0; }
.layout-grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--grid-cols), minmax(0, 1fr));
  grid-template-rows: repeat(var(--grid-rows), minmax(0, 1fr));
  gap: var(--grid-gap);
  border-radius: .5mm;
}
.layout-grid.show-grid {
  background-color: #f7fbfd;
  background-image:
    linear-gradient(to right, #168fc326 1px, transparent 1px),
    linear-gradient(to bottom, #168fc326 1px, transparent 1px);
  background-size: calc(100% / var(--grid-cols)) calc(100% / var(--grid-rows));
}
.module {
  --accent: var(--c-blue);
  --bg: #fff;
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: .22mm solid var(--accent);
  border-radius: var(--card-radius);
  background: var(--bg);
  container-type: size;
}
.module.selected { z-index: 3; outline: .45mm solid #ffb72d; outline-offset: .22mm; }
.module.is-interacting { z-index: 5; opacity: .9; filter: drop-shadow(0 .8mm 1.2mm #0004); }
.module.placement-valid { outline-color: #16a15b; background-image: linear-gradient(#dff7e9aa, #dff7e9aa); }
.module.placement-invalid { outline: .55mm solid #d51b24; background-image: repeating-linear-gradient(135deg, #ffd9dd99 0 1.5mm, transparent 1.5mm 3mm); }
.module.has-overflow { outline: .45mm solid #d51b24; }
.module.has-overflow::before { content: "!"; position: absolute; z-index: 12; right: .3mm; bottom: .3mm; width: 2.8mm; height: 2.8mm; display: grid; place-items: center; border-radius: 50%; background: #d51b24; color: #fff; font-size: 1.7mm; font-weight: 900; }

.module-title {
  height: 3.65mm;
  min-width: 0;
  background: var(--accent);
  color: #fff;
  display: flex;
  align-items: center;
  gap: .55mm;
  padding: 0 .55mm;
  font-weight: 800;
  font-size: 1.38mm;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  cursor: grab;
}
.module-title:active { cursor: grabbing; }
.module-title > span:not(.module-icon):not(.unit-heading) { overflow: hidden; text-overflow: ellipsis; }
.module-icon { width: 2.15mm; height: 2.15mm; flex: none; }
.module-icon:empty { display: none; }
.module-icon svg, .vital-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.module-icon .fill, .vital-icon .fill { fill: currentColor; stroke: none; }

.layout-badge {
  position: absolute; z-index: 10; right: .35mm; bottom: .25mm; padding: .2mm .4mm; border-radius: .55mm;
  background: #fffde8e8; color: #725113; border: .12mm solid currentColor; font-size: .62mm; font-weight: 900; letter-spacing: .03em;
  pointer-events: none;
}
.layout-auto .layout-badge { color: #12678f; background: #edfaffea; }
.interaction-origin { opacity: .22 !important; }
.drop-preview {
  z-index: 20; min-width: 0; min-height: 0; display: grid; place-items: center; overflow: hidden;
  border: .4mm dashed #1786b8; border-radius: .7mm; background: #dff5ffdd; color: #07558c; font-size: 1.05mm; font-weight: 900; text-align: center; pointer-events: none;
}
.drop-preview.placement-valid { border-color: #138b50; background: #daf6e6dd; color: #0c683b; }
.drop-preview.placement-invalid { border-color: #d51b24; background: #ffd9dddd; color: #98202a; }
.resize-handle {
  position: absolute; z-index: 11; border: 0; padding: 0; background: transparent;
}
.resize-handle:hover, .resize-handle:focus-visible { background: #ffbf3f66; outline: .2mm solid #17365d; }
.resize-n, .resize-s { left: 3mm; width: calc(100% - 6mm); height: 1.2mm; cursor: ns-resize; }
.resize-n { top: 0; } .resize-s { bottom: 0; }
.resize-e, .resize-w { top: 3mm; height: calc(100% - 6mm); width: 1.2mm; cursor: ew-resize; }
.resize-e { right: 0; } .resize-w { left: 0; }
.resize-n::after, .resize-s::after { content: ""; position: absolute; left: 50%; width: 4mm; height: .32mm; transform: translateX(-50%); border-radius: 1mm; background: #17365d; }
.resize-n::after { top: .2mm; } .resize-s::after { bottom: .2mm; }
.resize-e::after, .resize-w::after { content: ""; position: absolute; top: 50%; width: .32mm; height: 4mm; transform: translateY(-50%); border-radius: 1mm; background: #17365d; }
.resize-e::after { right: .2mm; } .resize-w::after { left: .2mm; }
.resize-nw, .resize-ne, .resize-se, .resize-sw { width: 3.4mm; height: 3.4mm; }
.resize-nw { left: 0; top: 0; cursor: nwse-resize; }
.resize-ne { right: 0; top: 0; cursor: nesw-resize; }
.resize-se { right: 0; bottom: 0; cursor: nwse-resize; }
.resize-sw { left: 0; bottom: 0; cursor: nesw-resize; }
.resize-nw::after, .resize-ne::after, .resize-se::after, .resize-sw::after {
  content: ""; position: absolute; inset: .8mm; border: .28mm solid #17365d; border-radius: 50%; background: #fff;
}
.output-card .layout-badge, .output-card .resize-handle { display: none; }

.acronym-rows { height: calc(100% - 3.65mm); display: grid; grid-auto-rows: minmax(0, 1fr); padding: .3mm .4mm; }
.acronym-row { display: grid; grid-template-columns: 2.75mm minmax(0, 1fr); gap: .38mm; align-items: center; min-height: 0; }
.acronym-key {
  height: 2.55mm; border-radius: .52mm; background: var(--accent); color: #fff; display: grid; place-items: center;
  font-size: 1.42mm; line-height: 1; font-weight: 900;
}
.acronym-label { min-width: 0; font-size: 1.05mm; line-height: 1.02; font-weight: 700; overflow-wrap: anywhere; }

.module-selfProtection { --accent: var(--c-red); --bg: #fff0f1; }
.module-consciousness { --accent: #176ea5; --bg: #eef8fd; }
.module-neurology { --accent: var(--c-green); --bg: #eefaf3; }
.module-orientation { --accent: var(--c-blue); --bg: #eef9fd; }
.module-injury, .module-pain { --accent: var(--c-orange); --bg: #fff5e9; }
.module-history { --accent: var(--c-violet); --bg: #faeffd; }
.module-bodycheck { --accent: var(--c-yellow); --bg: #fffde8; }
.module-bodycheck .module-title { color: #17242e; }
.module-history .acronym-label { font-size: .91mm; }

.module-xabcde {
  --accent: var(--c-blue);
  --bg: var(--c-soft);
  display: grid;
  grid-template-rows: 3.2mm minmax(0, 1fr) 14mm;
}
.module-xabcde .module-title { height: 3.2mm; font-size: 1.18mm; }
.x-rows { display: grid; grid-template-rows: .82fr 1.15fr 1.08fr 1.35fr 1.16fr 1.25fr; min-height: 0; }
.x-row { display: grid; grid-template-columns: 4.7mm minmax(0, 1fr); min-height: 0; border-bottom: .16mm solid #8ccfe8; overflow: hidden; }
.x-key { background: var(--c-red); color: #fff; display: grid; place-items: center; font-size: 2.8mm; font-weight: 900; }
.x-text { display: flex; align-items: center; min-width: 0; padding: .35mm .48mm; font-size: 1.06mm; line-height: 1.08; overflow-wrap: anywhere; }
.x-decision { min-height: 0; display: grid; grid-template-columns: 4.7mm minmax(0, 1fr); }
.warning-mark { display: grid; place-items: end center; padding-bottom: 1.4mm; color: #fff; background: var(--c-red); font-size: 5mm; line-height: 1; }
.decision-body { display: grid; grid-template-columns: 9mm minmax(0, 1fr); grid-template-rows: 1fr 1fr; align-items: center; gap: 0 .5mm; padding: .75mm; text-align: center; }
.ten-for-ten {
  grid-row: 1 / span 2; width: 8.5mm; height: 8.5mm; display: grid; place-content: center; color: #fff; background: var(--c-red);
  clip-path: polygon(28% 0,72% 0,100% 28%,100% 72%,72% 100%,28% 100%,0 72%,0 28%);
  filter: drop-shadow(0 0 .2mm #fff);
}
.ten-for-ten::before { content: ""; position: absolute; }
.ten-for-ten span { font-size: 2.5mm; font-weight: 900; line-height: .9; }
.ten-for-ten small { font-size: 1.55mm; font-weight: 900; line-height: 1; }
.decision-body > b { font-size: 1.45mm; line-height: 1; align-self: end; }
.decision-body > b:last-child { align-self: start; }

.body-main { height: calc(100% - 3.65mm); display: grid; grid-template-columns: 3.2mm minmax(0, 1fr); padding: .3mm; }
.body-direction { position: relative; min-height: 0; display: flex; align-items: center; justify-content: center; }
.body-direction span { writing-mode: vertical-rl; transform: rotate(180deg); font-size: .82mm; font-weight: 800; line-height: 1; }
.body-direction b { position: absolute; right: -.2mm; bottom: .3mm; color: var(--c-red); font-size: 3mm; line-height: 1; }
.body-list { min-height: 0; display: grid; grid-template-rows: repeat(7, 1fr) 2.8mm; text-align: center; }
.body-list div { display: grid; place-items: center; min-height: 0; font-size: 1.18mm; line-height: 1; font-weight: 800; }
.body-list .back { color: var(--c-red); font-size: .92mm; }

.injury-groups { height: calc(100% - 3.65mm); display: grid; grid-template-rows: 3fr 4fr; min-height: 0; }
.injury-group { min-height: 0; }
.injury-group .acronym-rows { height: 100%; }
.pech-group { border-top: .22mm solid #9a6094; }
.module-pain .acronym-rows { grid-template-rows: repeat(6, 1fr); }
.module-history .acronym-rows { grid-template-rows: repeat(7, 1fr); }

.module-normal { --accent: var(--c-dark); }
.unit-heading { margin-left: auto; font-size: .9mm; padding-right: .4mm; }
.normal-grid { height: calc(100% - 3.65mm); display: grid; grid-template-rows: repeat(7, minmax(0, 1fr)); padding: .2mm .4mm; }
.normal-row { min-height: 0; display: grid; grid-template-columns: 3.1mm minmax(0, 1.3fr) .75fr .58fr; align-items: center; border-bottom: .11mm solid #b9e3f2; font-size: .94mm; line-height: 1.02; }
.normal-row:last-child { border-bottom: 0; }
.normal-row b { font-size: 1mm; }
.normal-row > span:nth-child(3) { text-align: center; white-space: pre-line; }
.normal-row > span:last-child { text-align: right; white-space: pre-line; }
.vital-icon { width: 2.4mm; height: 2.4mm; display: block; color: var(--c-dark); }
.normal-row:nth-child(3) .vital-icon, .normal-row:nth-child(5) .vital-icon { color: var(--c-red); }

.module-hypothermia, .module-oxygen, .module-spo2 { --accent: var(--c-blue); --bg: var(--c-soft); }
.module-hypothermia .module-title, .module-oxygen .module-title, .module-spo2 .module-title { height: 3.25mm; font-size: 1.05mm; }
.module-hypothermia .module-title > span:not(.module-icon), .module-spo2 .module-title > span:not(.module-icon) { white-space: normal; line-height: .9; }
.hypo-grid { height: calc(100% - 3.25mm); display: grid; grid-template-rows: repeat(4, 1fr); padding: .15mm .35mm; }
.hypo-row { display: grid; grid-template-columns: 2.4mm 5.2mm minmax(0, 1fr); align-items: center; min-height: 0; font-size: .82mm; }
.o2-body { height: calc(100% - 3.25mm); display: grid; grid-template-columns: 1fr 1fr; }
.o2-body > div { display: flex; align-items: center; justify-content: center; gap: .7mm; border-right: .1mm solid #8ccfe8; font-size: 1.15mm; }
.o2-body > div:last-child { border-right: 0; }
.oxygen-person { width: 3.3mm; height: 3.7mm; fill: none; stroke: #07558c; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.oxygen-person .oxygen-mask { fill: #92b9c9; }
.spo-body { height: calc(100% - 3.25mm); display: grid; grid-template-rows: 1fr 1fr; padding: .1mm .4mm; }
.spo-row { min-height: 0; display: flex; align-items: center; justify-content: space-between; gap: .4mm; font-size: .75mm; line-height: 1; }
.spo-row b { font-size: .9mm; }

.module-painScale { --accent: var(--c-dark); }
.module-painScale .module-title { justify-content: center; height: 3.35mm; font-size: 1.65mm; }
.scale-body { height: calc(100% - 3.35mm); display: grid; grid-template-columns: repeat(11, minmax(0, 1fr)); }
.scale-cell { min-width: 0; display: grid; grid-template-rows: 2.2mm 1fr 2.4mm; place-items: center; border-right: .1mm solid #fff; background: #fff; color: #16365d; overflow: hidden; }
.scale-cell:last-child { border-right: 0; }
.scale-cell > b { width: 100%; height: 100%; display: grid; place-items: center; color: #fff; font-size: 1.12mm; }
.scale-0 > b { background: #0a8a36; } .scale-1 > b { background: #45a13c; } .scale-2 > b { background: #85b93a; }
.scale-3 > b { background: #c4c43a; } .scale-4 > b { background: #e6c530; } .scale-5 > b { background: #ecad2a; }
.scale-6 > b { background: #ef8d22; } .scale-7 > b { background: #ef6e20; } .scale-8 > b { background: #ec4d23; }
.scale-9 > b { background: #e9252c; } .scale-10 > b { background: #cf1427; }
.pain-face { font-size: 2.55mm; line-height: 1; filter: saturate(.9); }
.scale-cell small { font-size: .52mm; line-height: .86; font-weight: 900; text-align: center; overflow-wrap: anywhere; }

.module-sinnhaft { --accent: var(--c-dark); }
.module-sinnhaft .module-title { height: 3.65mm; font-size: 1.5mm; }
.sinn-grid { height: calc(100% - 3.65mm); display: grid; grid-template-rows: 1.18fr .75fr 1.35fr 1.05fr 1.08fr .9fr 1.18fr .8fr; gap: .18mm; padding: .22mm; }
.sinn-row { min-height: 0; display: grid; grid-template-columns: 3.5mm 11.5mm minmax(0, 1fr); align-items: stretch; background: var(--c-soft); border-radius: .35mm; overflow: hidden; }
.sinn-letter { display: grid; place-items: center; background: var(--c-dark); color: #fff; font-size: 1.32mm; }
.sinn-title { display: flex; align-items: center; padding: .18mm .42mm; font-size: .86mm; line-height: 1; }
.sinn-text { display: flex; align-items: center; min-width: 0; padding: .14mm .35mm; font-size: .72mm; line-height: 1.02; overflow-wrap: anywhere; }

@container (min-width: 22mm) {
  .acronym-label { font-size: 1.2mm; }
  .module-history .acronym-label { font-size: 1.05mm; }
  .module-title { font-size: 1.5mm; }
}
@container (min-height: 38mm) {
  .acronym-row { grid-template-columns: 3.2mm minmax(0, 1fr); }
  .acronym-key { height: 2.9mm; }
}
