* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
html, body { margin: 0; padding: 0; }
body { background: #5c6c7c; font-family: 'Barlow', sans-serif; }
a.qr-link, a.qr-link:hover { color: inherit; }

.bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
  padding: 12px 16px; background: #0b1826; color: #eaf6fb;
  font-family: 'Barlow', sans-serif; font-size: 15px; line-height: 1.35;
}
.bar a { color: #ffb020; }
.bar .act {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
  border: 0; border-radius: 4px; background: #ffb020; color: #07131c;
  font: 600 16px/1 'Barlow', sans-serif; text-decoration: none; cursor: pointer;
}
.bar .act.alt { background: transparent; color: #eaf6fb; box-shadow: inset 0 0 0 2px #9fb3c2; }
.bar .hint { flex-basis: 100%; color: #9fb3c2; font-size: 14px; }

.stage { padding: 24px 16px 40px; }
.sheet {
  position: relative; box-sizing: border-box; margin: 0 auto; overflow: hidden;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .35);
}
.trim {
  position: absolute; inset: 12px; border: 1px dashed #ff3b3b; pointer-events: none;
}

body:target { background: #ffffff; }
body:target .bar, body:target .trim { display: none; }
body:target .stage { padding: 0; }
body:target .sheet { margin: 0; box-shadow: none; }

@media print {
  body { background: none; }
  .bar, .trim { display: none !important; }
  .stage { padding: 0 !important; }
  .sheet { margin: 0 !important; box-shadow: none !important; zoom: 1 !important; }
}