/* Article reading surface and image library. Keep all other dialogs on the dark theme. */
#article-dialog {
  width:min(900px,calc(100% - 24px)); max-height:min(92svh,1100px);
  border:1px solid #d9e0ea; border-radius:18px; color:#203049;
  background:#fff; box-shadow:0 35px 110px #061225b8;
}
#article-dialog>header { padding:44px clamp(24px,6vw,66px) 26px; background:#fff; border-bottom:1px solid #e8edf3; }
#article-dialog .eyebrow { display:inline-flex; padding:6px 11px; border-radius:20px; color:#906421; background:#fff1d8; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
#article-dialog h2 { margin:17px 44px 16px 0; color:#182943; font-size:clamp(26px,4vw,39px); line-height:1.28; letter-spacing:-.035em; }
#article-dialog header p { color:#7c899b; font-size:12px; }
#article-dialog .community-close { position:sticky; z-index:3; top:14px; float:right; margin:14px 14px -48px 0; border-color:#d8e1ed; color:#4b5d72; background:#f7f9fc; }
#article-dialog .community-close:hover { color:#182943; background:#e9eef5; }
.article-document { color:#26364d; font-size:16px; line-height:1.85; overflow-wrap:anywhere; }
#article-body { padding:30px clamp(24px,6vw,66px) 56px; white-space:normal; }
.article-document>*:first-child { margin-top:0; }
.article-document p { margin:0 0 18px; }
.article-document h2,.article-document h3,.article-document h4 { color:#192f4c; line-height:1.35; letter-spacing:-.025em; }
.article-document h2 { margin:28px 0 14px; font-size:25px; }
.article-document h3 { margin:24px 0 12px; font-size:21px; }
.article-document h4 { margin:20px 0 10px; font-size:18px; }
.article-document ul,.article-document ol { margin:0 0 22px; padding-left:25px; }
.article-document li { padding-left:5px; margin:6px 0; }
.article-document li::marker { color:#d4a45d; }
.article-document a { color:#1262b7; text-decoration:underline; text-underline-offset:3px; }
.article-document a:hover { color:#0c427e; }
.article-document strong { color:#172740; font-weight:800; }
.article-document .post-colored strong,.article-document .post-colored a { color:inherit; }
.article-document code { background:#edf3fa; border-radius:4px; padding:2px 5px; font-size:.9em; }
.article-document hr { border:0; height:1px; background:#dce4ee; margin:30px 0; }
.article-gallery { padding:28px clamp(24px,6vw,66px) 8px; }
.article-gallery[hidden] { display:none; }
.article-gallery-frame { position:relative; display:grid; place-items:center; min-height:180px; border:1px solid #e5eaf2; border-radius:13px; overflow:hidden; background:#f5f7fa; }
.article-gallery-frame img { display:block; width:100%; max-height:min(59svh,560px); object-fit:contain; }
.article-gallery-nav { position:absolute; top:50%; transform:translateY(-50%); width:40px; height:44px; border:0; border-radius:9px; color:#fff; background:#192c48ca; font-size:34px; line-height:1; cursor:pointer; }
.article-gallery-nav:hover { background:#132847; }
.article-gallery-nav[hidden] { display:none; }
.article-gallery-nav.is-prev { left:12px; }.article-gallery-nav.is-next { right:12px; }
.article-gallery-footer { display:flex; align-items:center; justify-content:space-between; min-height:31px; gap:12px; color:#748399; font-size:12px; }
.article-image-dots { display:flex; flex-wrap:wrap; gap:5px; }
.article-image-dot { width:9px; height:9px; padding:0; border:0; border-radius:50%; background:#cbd5e2; cursor:pointer; }
.article-image-dot[aria-current=true] { background:#ca944b; }
#editor-dialog { width:min(850px,calc(100% - 24px)); }
.post-format-toolbar { display:flex; flex-wrap:wrap; gap:3px; padding:5px; border:1px solid #bfcddf; border-bottom:0; border-radius:8px 8px 0 0; background:#f8fafc; }
.post-format-toolbar button { min-width:36px; height:34px; padding:0 8px; border:0; border-radius:5px; color:#344861; background:transparent; cursor:pointer; font:700 13px/1 Inter,"Segoe UI",sans-serif; }
.post-format-toolbar button:hover,.post-format-toolbar button:focus-visible { color:#13355a; background:#e6edf6; }
.post-toolbar-separator { align-self:stretch; width:1px; margin:4px 6px; background:#d4deea; }
#editor-dialog .post-format-toolbar .post-color-label { align-self:center; margin:0 2px 0 1px; color:#344861; font-size:12px; font-weight:750; white-space:nowrap; }
#editor-dialog .post-format-toolbar input[type=color] { align-self:center; width:32px; min-height:0; height:28px; padding:2px; border:1px solid #aebdd1; border-radius:5px; background:#fff; cursor:pointer; }
#editor-dialog .post-format-toolbar #post-apply-color { padding-inline:9px; font-size:11px; white-space:nowrap; }
#editor-dialog .post-format-toolbar .post-color-swatch { align-self:center; min-width:0; width:20px; height:20px; margin-inline:1px; padding:0; border:1px solid #ffffff; border-radius:50%; background:var(--swatch); box-shadow:0 0 0 1px #9aaec5; }
#editor-dialog .post-format-toolbar .post-color-swatch:hover,#editor-dialog .post-format-toolbar .post-color-swatch:focus-visible { box-shadow:0 0 0 2px #315e99; }
#editor-dialog .post-format-toolbar #post-icons-toggle { border-left:1px solid #d4deea; border-radius:0; margin-left:4px; padding-left:12px; white-space:nowrap; }
.post-icon-picker { max-height:230px; overflow:auto; padding:12px 14px; border:1px solid #bfcddf; border-bottom:0; background:#fff; }
.post-icon-picker[hidden] { display:none; }
.post-icon-group+.post-icon-group { margin-top:11px; }
.post-icon-group>strong { display:block; margin-bottom:6px; color:#425672; font-size:11px; }
.post-icon-grid { display:flex; flex-wrap:wrap; gap:5px; }
.post-icon-grid button { width:35px; height:35px; padding:0; border:1px solid #e0e7ef; border-radius:6px; background:#f8fafc; cursor:pointer; font-size:21px; line-height:1; }
.post-icon-grid button:hover,.post-icon-grid button:focus-visible { border-color:#d8ab68; background:#fff5e6; }
#editor-dialog .editor-body #post-body { min-height:210px; border-color:#bfcddf; border-radius:0 0 8px 8px; color:#22344f; background:#fff; font:14px/1.7 Inter,"Segoe UI",sans-serif; }
.post-format-help,.post-image-help { margin:7px 0 12px; color:#b2c1d3; font-size:11px; line-height:1.55; }
.post-image-help code { color:#f1cb8e; }
.post-image-heading,.post-preview-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; }
.post-image-heading label { margin:0!important; }
.post-image-heading button { border:1px solid #556a87; border-radius:6px; padding:6px 10px; color:#e5c58a; background:#223650; cursor:pointer; font-size:11px; }
.post-image-heading button:disabled { opacity:.5; cursor:wait; }
.post-image-library { display:grid; grid-template-columns:repeat(auto-fill,minmax(115px,1fr)); gap:9px; max-height:245px; overflow:auto; padding:10px; border:1px solid #405572; border-radius:8px; background:#102035; }
.post-image-library>p { grid-column:1/-1; color:#9db0c9; font-size:12px; }
.post-library-item { min-width:0; padding:4px; border:2px solid #3d516b; border-radius:7px; color:#cbd8e9; background:#172b43; cursor:pointer; text-align:left; }
.post-library-item[aria-pressed=true] { border-color:#e3b979; background:#314056; }
.post-library-item img { display:block; width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:4px; background:#0d1b2b; }
.post-library-item span { display:block; margin:5px 2px 1px; font-size:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.post-image-selected { display:flex; flex-wrap:wrap; gap:7px; margin:10px 0; }
.post-image-selected>p { color:#92a7c3; font-size:11px; }
.post-selected-image { display:flex; align-items:center; gap:7px; max-width:100%; padding:4px 6px; border:1px solid #526680; border-radius:6px; color:#dce6f3; background:#22354d; font-size:11px; }
.post-selected-image img { width:33px; height:29px; object-fit:cover; border-radius:3px; }
.post-selected-image span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.post-selected-image button { border:0; color:#e8c48b; background:transparent; cursor:pointer; font-size:18px; }
.post-selected-image button:disabled { opacity:.35; }
.post-preview-heading { margin:22px 0 8px; color:#e3ebf5; font-size:13px; }.post-preview-heading span { color:#9aacc3; font-size:11px; }
.post-preview { min-height:95px; max-height:340px; overflow:auto; padding:19px 22px; border:1px solid #d9e0ea; border-radius:8px; background:#fff; font-size:13px; line-height:1.7; }
.post-preview h2 { font-size:20px; }.post-preview h3 { font-size:17px; }.post-preview h4 { font-size:15px; }
@media(max-width:600px) {
  #article-dialog { width:calc(100% - 12px); max-height:94svh; }
  #article-dialog>header { padding-top:35px; }
  #article-body { padding-top:22px; padding-bottom:38px; }
  .article-document { font-size:15px; line-height:1.75; }
  .article-gallery-nav { width:33px; height:38px; font-size:28px; }
  .post-preview-heading { align-items:flex-start; flex-direction:column; gap:2px; }
}
