/* A compact window into a larger shared page. All marks share the same coordinates. */
body.design-combined .note-wall {
  min-height:0;
  height:390px;
  width:100%;
  max-width:none;
  margin-inline:0;
  overflow:hidden;
  isolation:isolate;
  cursor:grab;
  touch-action:none;
  background:#fdfdfb;
}
body.design-combined .board-mark {
  width: max-content;
  max-width: none;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: keep-all;
}
body.design-combined .board-mark-text { display: block; white-space: nowrap; }
body.design-combined .board-mark-meta {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 4px;
  white-space: nowrap;
}
body.design-combined .board-mark small {
  display: inline;
  margin: 0;
  font: 11px/1.5 'Poppins', sans-serif;
  color: #697986;
  overflow-wrap: normal;
}
body.design-combined .board-mark--reaction { width: max-content; }
body.design-combined .board-mark--reaction .board-mark-text { font: 32px/1.5 'Poppins', sans-serif; }
.note-sign {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #879099;
  font: 11px/1.5 'Poppins', sans-serif;
  cursor: default;
}
.note-sign input {
  width: 118px;
  min-width: 0;
  border: 0;
  border-bottom: 1px solid #c6d3dc;
  background: transparent;
  padding: 2px 0;
  color: #22313b;
  font: inherit;
}
.note-sign--inline > span:first-child { display: none; }
body.design-combined .note-toolbar {
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  border-radius: 18px;
  padding: 6px 8px 8px;
}
.note-toolbar-marks { display: flex; align-items: center; gap: 1px; }
body.design-combined .note-inline {
  width: max-content;
  min-width: 180px;
}
body.design-combined .note-inline textarea {
  width: 12ch;
  max-width: min(70vw, 520px);
  white-space: nowrap;
  overflow-x: hidden;
  overflow-wrap: normal;
}
.note-composer-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}
.note-sign-prefix { color: #879099; font: 11px/1.5 'Poppins', sans-serif; }
#noteSubmit {
  margin: 0 0 0 auto;
  border: 0;
  background: none;
  color: #087db6;
  padding: 0;
  font: 11px/1.5 'Poppins', sans-serif;
  cursor: pointer;
}
.board-mark-action {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #8aa0ad;
  font: 10px/1.5 'Poppins', sans-serif;
  cursor: pointer;
}
.board-mark.is-mine .board-mark-action { opacity: 0; }
.board-mark.is-mine:hover .board-mark-action,
.board-mark.is-mine:focus-within .board-mark-action { opacity: 1; }
@media (hover: none) {
  .board-mark.is-mine .board-mark-action { opacity: 1; }
}
@media(max-width:700px){body.design-combined .note-page-label{max-width:100%;}}
.note-canvas-surface {
  position:absolute;
  top:0;left:0;
  width:1400px;
  height:1100px;
  background:radial-gradient(circle,#bcc4c94a .7px,transparent .9px) 0 0 / 24px 24px;
  will-change:transform;
}
body.design-combined .note-wall.is-dragging,
body.design-combined .note-wall.is-dragging * {cursor:grabbing;user-select:none;}
body.design-combined .note-page-label {z-index:5;background:#fdfdfbe8;padding:4px 8px;left:12px;top:10px;}
.note-canvas-controls {
  position:absolute;z-index:5;bottom:10px;left:14px;right:14px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  color:#91989d;font:10px/1.5 'Poppins',sans-serif;
  pointer-events:none;
}
.note-canvas-controls span {background:#fdfdfbe8;padding:5px;}
.note-canvas-controls button {
  pointer-events:auto;background:#fff;border:1px solid #e1e4e5;border-radius:20px;
  color:#646e74;font:inherit;padding:6px 12px;cursor:pointer;
}
.note-canvas-controls button:hover {border-color:#0099fd;color:#0099fd;}
body.design-combined .note-feedback {z-index:6;bottom:48px;background:#fdfdfbe8;}
body.design-combined .note-inline textarea {touch-action:auto;}
@media(max-width:700px){body.design-combined .note-wall{height:330px;}}
@media(prefers-reduced-motion:reduce){.note-canvas-surface{will-change:auto;}}
.board-mark[data-save-state="pending"] { opacity: .6; }
.board-mark[data-save-state="failed"] { outline: 1px dashed #7c858e; outline-offset: 5px; }
.board-mark button.board-mark-action { display: inline; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; color: #8aa0ad; font: 10px/1.5 'Poppins', sans-serif; }
