/* Application chrome only: authored document, table and editor alignment stays
   under the writer's control. Keep the existing type scale and compact gaps. */
.btn { line-height:1.4; text-align:center; }
.text-link { line-height:1.4; text-align:left; }
.tag { align-items:center; line-height:1.4; vertical-align:middle; }
:is(.view-heading>p,.section-desc,.form-help,.storage-help,.community-recent-title-text,.notification-copy,.drawing-lobby .section-heading p) {
 word-break:keep-all; overflow-wrap:anywhere;
}
:is(.board-head,.section-heading,.modal-header,.music-section-heading)>.icon { flex:none; }
:is(.btn,.text-link,.studio-tab,.board-head h2)>.icon { align-self:center; }

/* Titles and their dates share the first line, rather than centring dates
   against a two-line title + reading-count block. */
.post-row { align-items:baseline; }
.post-row-title { display:block; white-space:normal; }
.post-row-title-text { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.post-row time { flex:none; text-align:right; }
.board-list-row>.tag { justify-self:start; align-self:baseline; }
.board-list-row>small:last-child { text-align:right; }
.community-recent-title-text { flex:1; text-align:left; }
.community-recent-name,.writing-nav-link>span { text-align:left; }

/* Give labels and actions their own groups so extra permissions do not spread
   buttons across a reader header or squeeze its badges into narrow columns. */
.post-heading { align-items:center; flex-wrap:wrap; gap:8px 12px; }
.post-heading>.post-labels { flex:1 1 180px; min-width:0; }
.post-heading-actions { display:flex; flex:0 1 auto; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:6px; margin-left:auto; min-width:0; }
.post-heading-actions .btn { flex:none; }
.post-heading-actions:empty { display:none; }
.reader-byline { min-width:0; overflow-wrap:anywhere; }
.reader-updated { min-width:0; }
.reader-meta { line-height:1.4; }
.comment-chat .chat-heading { flex-wrap:wrap; align-items:baseline; gap:6px 12px; }
.chat-heading-actions { margin-left:auto; }

/* Equal control boxes and a shared lower edge tolerate labels that wrap. */
.form-row { align-items:end; }
.form-field>input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
.form-field>select:not([multiple]) { height:40px; min-height:40px; line-height:1.4; padding-block:8px; }
.form-field>span,.field-label { line-height:1.4; text-align:left; }
.form-field>textarea { line-height:1.5; }
.entity-kind-row>.btn { min-height:40px; }
.point-reward-grid { align-items:end; }
.check-label>input[type=checkbox],.check-label>input[type=radio],.entity-custom-check>input[type=checkbox] { flex:none; width:14px; height:14px; margin:0; }

/* Numeric columns remain stable when values change; descriptive copy wraps. */
:is(.post-stats,.storage-metrics dd,.storage-item-size,.point-history-amount,.point-pagination,.music-track-row time,.music-mini-progress,.music-mini-volume output,.drawing-tool-options output,[data-workspace-size],[data-opacity],[data-map-size]) { font-variant-numeric:tabular-nums; }
.music-track-row time { flex:none; min-width:4ch; text-align:right; }
.music-mini-volume output { text-align:right; }
.drawing-tool-options [data-workspace-size],.map-options-strip input[type=number] { text-align:right; }
.drawing-tool-options [data-opacity] { min-width:4ch; text-align:right; }
.map-options-strip [data-map-size] { min-width:6ch; text-align:right; }
.point-history article,.point-request,.admin-audit p { align-items:baseline; }
.admin-audit p { flex-wrap:wrap; gap:4px 12px; }
.admin-audit time { font-variant-numeric:tabular-nums; white-space:nowrap; }
.storage-breakdown span { align-items:baseline; }
.storage-breakdown span>small { flex:none; text-align:right; font-variant-numeric:tabular-nums; }

@media(max-width:650px) {
 .post-heading>.post-labels { flex-basis:100%; }
 .post-heading-actions { justify-content:flex-start; margin-left:0; }
 .form-field>input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),
 .form-field>select:not([multiple]) { height:44px; min-height:44px; }
 .entity-kind-row>.btn { min-height:44px; }
}