
.notice-letter-main {
  display: flex; align-items: baseline; gap: var(--sp-100);
  min-width: 0; overflow: hidden;
}
.notice-letter-title {
  flex: 0 1 auto; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-weight: var(--fw-med);
}

.notice-letter-peek {
  flex: 1 1 0; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: var(--fs-s); line-height: var(--lh-s); color: var(--ink3);
}

.notice-letter-marks {
  display: inline-flex; align-items: center; gap: var(--sp-050);
  flex: none; min-width: 0;
}

.notice-view {
  display: flex; flex-direction: column;
}

.notice-view-from {
  display: flex; align-items: center; gap: var(--sp-100);
  padding: var(--sp-150) var(--gap);
  border-bottom: var(--bw) solid var(--line);
  font-size: var(--fs-s); line-height: var(--lh-s); color: var(--ink3);
}
.notice-view-title { font-size: var(--fs-l); line-height: var(--lh-l); }

.notice-parts { display: flex; flex-direction: column;
                gap: var(--gap); padding: var(--gap); }

.notice-words {
  display: flex; flex-direction: column; gap: var(--sp-150);
  flex: 1 1 auto; min-width: 0;
}
.notice-block, .qc-card:not(.qc-paper) {
  --wb-grey: var(--a-100);        --wb-grey-2: var(--a-200);
  --wb-stone: #ECEEF1;            --wb-stone-2: #DBDFE5;
  --wb-accent: var(--acc-weak);   --wb-accent-2: var(--acc-weak-2);
  --wb-mint: var(--good-weak);    --wb-mint-2: var(--good-weak-2);
  --wb-sand: var(--warn-weak);    --wb-sand-2: var(--warn-weak-2);
  --wb-peach: #FFF0E4;            --wb-peach-2: #FFDCC4;
  --wb-sky: var(--info-weak);     --wb-sky-2: var(--info-weak-2);
  --wb-teal: #E4F3F3;             --wb-teal-2: #C9E8E8;
  --wb-rose: var(--danger-weak);  --wb-rose-2: var(--danger-weak-2);
  --wb-lilac: #F0EAFA;            --wb-lilac-2: #E0D6F3;
  --wb-olive: #F0F3DE;            --wb-olive-2: #DFE6BF;
  --wb-own-ink: var(--ink3);      --wb-own-base: var(--card);
  --wb-pat-base: var(--block-fill);
  --wb-grad-angle: 180deg;  --wb-grad-end: var(--block-fill-2);  --wb-grad-stop: 100%;
  --wb-hatch-2: var(--block-fill-2);  --wb-hatch-step: 6px;
  --wb-dots-ink: var(--block-fill-2); --wb-dots-gap: transparent;
  --wb-dots-r: 1.5px;  --wb-dots-edge: 1.5px;  --wb-dots-size: 10px;
  --wb-dots-ink-b: var(--block-fill-b-2);  --wb-dots-ink-c: var(--block-fill-c-2);
  --wb-dots-ink-d: var(--block-fill-d-2);  --wb-dots-ink-e: var(--block-fill-e-2);
  --ln-base: var(--bw);
  --ln-inset: var(--sp-075);
}
:root[data-theme="dark"] .notice-block,
:root[data-theme="dark"] .qc-card:not(.qc-paper) {
  --wb-stone: #262A2E;  --wb-stone-2: #2E3338;
  --wb-peach: #3B2A1C;  --wb-peach-2: #472F1F;
  --wb-teal: #14312F;   --wb-teal-2: #1A3B39;
  --wb-lilac: #2B2440;  --wb-lilac-2: #342C4C;
  --wb-olive: #2B3018;  --wb-olive-2: #33391D;
}

.notice-block {
  display: flex; flex-direction: column; gap: var(--sp-150);
  min-width: 0;
}

.notice-block.ln-green, .notice-block.dv-ln-green { --block-line: var(--acc); }
.notice-block.ln-ink,   .notice-block.dv-ln-ink   { --block-line: var(--ink); }
.notice-block.ln-grey,  .notice-block.dv-ln-grey  { --block-line: var(--ink3); }
.notice-block.ln-amber, .notice-block.dv-ln-amber { --block-line: var(--warn-ink); }
.notice-block.ln-blue,  .notice-block.dv-ln-blue  { --block-line: var(--info-ink); }
.notice-block.ln-rose,  .notice-block.dv-ln-rose  { --block-line: var(--danger-ink); }
.notice-block.ln-plum,  .notice-block.dv-ln-plum  { --block-line: #6A4A93; }
.notice-block.ln-teal,  .notice-block.dv-ln-teal  { --block-line: #2E8189; }
.notice-block.ln-olive, .notice-block.dv-ln-olive { --block-line: #74872F; }
.notice-block.ln-clay,  .notice-block.dv-ln-clay  { --block-line: #B05A32; }
.notice-block.ln-steel, .notice-block.dv-ln-steel { --block-line: #5E7791; }
.notice-block.ln-own,   .notice-block.dv-ln-own {
  --block-line: var(--block-own-line, var(--ink));
}
:root[data-theme="dark"] .notice-block.ln-own,
:root[data-theme="dark"] .notice-block.dv-ln-own {
  --block-line: var(--block-own-line-lit, var(--ink));
}
.notice-block.bd-line {
  border: var(--ln-fw, var(--bw)) var(--block-stroke, solid) var(--block-line, var(--line));
}
.notice-block.bd-under {
  padding-bottom: calc(var(--sp-150) + var(--ln-t, var(--bw)));
}
.notice-block.bd-under:not(.fill-none) { --ln-ends: var(--r-s); }
.notice-block.bd-line,
.notice-block.bd-left,
.notice-block:not(.fill-none) { padding: var(--sp-150); border-radius: var(--r-s); }

.notice-divider {
  position: relative;
  height: var(--ln-t, var(--bw));
  margin: var(--dv-gap, var(--sp-100)) 0;
}

.notice-edit .notice-block.st-none .notice-divider {
  border-top: var(--bw) dashed var(--line);
}
.notice-link, .notice-reply { display: flex; }
.notice-link[data-at="center"], .notice-reply[data-at="center"] {
  justify-content: center;
}
.notice-link[data-at="right"], .notice-reply[data-at="right"] {
  justify-content: flex-end;
}
.notice-polls { display: flex; flex-direction: column; gap: var(--sp-150); }

.notice-shots {
  display: flex; flex-direction: column; gap: var(--sp-100); min-width: 0;
  --pic-w: 100%; --pic-h: auto; --pic-fit: cover;
}
.notice-shots[data-at="left"]   { align-items: flex-start; }
.notice-shots[data-at="center"] { align-items: center; }
.notice-shots[data-at="right"]  { align-items: flex-end; }
.notice-shot { width: var(--pic-w); max-width: 100%; min-width: 0; }
.notice-shot img {
  display: block; width: 100%; height: var(--pic-h);
  object-fit: var(--pic-fit); border-radius: var(--r);
}

.notice-actions {
  display: flex; align-items: center; justify-content: flex-end;
  gap: var(--sp-100);
  padding: 0 var(--gap) var(--gap);
}

.notice-poll {
  display: flex; flex-direction: column; gap: var(--sp-100);
  padding: var(--sp-150);
  background: var(--a-100);
  border-radius: calc(var(--r-l) - var(--gap));
}
.notice-poll-title { font-weight: var(--fw-semi); }
.notice-poll-options { display: flex; flex-direction: column; gap: var(--sp-050); }
.notice-poll-options.as-buttons {
  flex-direction: row; flex-wrap: wrap; gap: var(--sp-100);
}
.notice-poll-option { display: flex; align-items: center; min-height: var(--h-row); }
.notice-poll-state {
  font-size: var(--fs-s); line-height: var(--lh-s); color: var(--ink3);
}

.notice-edit .notice-block {
  border-radius: var(--r-s);
  cursor: var(--cur-grab);
}
.notice-edit .empty-state { padding: var(--sp-200) var(--gap); }
.notice-edit .notice-block:hover { background: var(--a-100); }
.notice-edit .notice-block.picked { background: var(--acc-weak); }
.notice-edit .notice-block.dragging { cursor: var(--cur-hold); }

.notice-sums {
  border: var(--bw) solid var(--line); border-radius: var(--r-l);
  background: var(--card);
}
.notice-answer {
  display: flex; flex-wrap: wrap; gap: var(--sp-100);
  font-size: var(--fs-s); line-height: var(--lh-s);
}
.notice-answer-q { color: var(--ink3); }
.notice-answer-a { color: var(--ink); font-weight: var(--fw-med); }

