@layer components {
  .page-breadcrumbs { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin:0 0 16px; color:#b8ab92; font-size:12px; }
  .page-breadcrumbs button,.entry-back { background:transparent; border:0; color:inherit; padding:5px 2px; text-align:left; }
  .page-breadcrumbs button:hover { color:var(--gold-light); }
  .entry-back { font-size:11px; margin:0 0 10px; color:var(--gold); }
  .entry-link-row { display:flex; min-width:0; }
  .entry-link-row>button:first-child { flex:1; min-width:0; }
  .entry-links .entry-link-row>.subpage-link { width:30px; flex:0 0 30px; justify-content:center; padding:5px; }
  .entry-index-heading h2 { overflow-wrap:anywhere; }
  .page-settings { display:flex; gap:22px; flex-wrap:wrap; margin:20px 0; align-items:flex-end; }
  .page-settings>div:first-child { flex:1; }
  .page-settings small { display:block; margin-top:5px; font-size:10px; color:var(--muted); }
  .rich-editor { border:1px solid #514937; border-radius:5px; overflow:hidden; background:#161917; }
  .rich-toolbar { padding:8px; background:#24251f; display:flex; align-items:center; gap:4px; flex-wrap:wrap; border-bottom:1px solid #514937; }
  .rich-toolbar button { font-size:11px; color:#d9c6a0; border:1px solid transparent; border-radius:3px; background:transparent; min-height:33px; padding:5px 9px; }
  .rich-toolbar button:hover,.rich-toolbar button[aria-pressed=true] { background:#b69c6926; border-color:#a18a525c; }
  .toolbar-divider { width:1px; height:22px; background:#5a513f; margin:0 4px; }
  .toolbar-spacer { flex:1; }
  .rich-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rich-source,.rich-preview { min-width:0; }
  .rich-source { background:#111613; border-right:1px solid #4c4738; }
  .rich-pane-label { display:block; color:#aaa28c; font-size:8px; letter-spacing:1.3px; padding:12px 16px; border-bottom:1px solid #414334; }
  .entry-reader .rich-source textarea { border:0; box-shadow:none; background:transparent; min-height:480px; border-radius:0; padding:18px; font:13px/1.9 var(--sans); }
  .rich-preview { background:radial-gradient(ellipse at top,#a9986c09,transparent 70%),#1b201a; }
  .rich-preview article { padding:24px 23px; min-height:480px; }
  .reading-mode .rich-source { display:none; }
  .reading-mode .rich-columns { grid-template-columns:minmax(0,1fr); }
  .reading-mode .rich-preview article { max-width:850px; margin:auto; padding:32px; }
  .prose,.entry-text>.prose { display:flow-root; white-space:normal; color:#ddd9cb; font:14px/1.85 var(--sans); overflow-wrap:anywhere; }
  .prose .legacy-text { white-space:pre-wrap; }
  .prose p { margin:0 0 1em; }
  .prose h2,.prose h3,.prose h4,.prose h5 { font-family:var(--serif); color:#eadcbd; font-weight:400; line-height:1.3; margin:1.2em 0 .55em; }
  .prose h2 { font-size:28px; border-bottom:1px solid #75604366; padding-bottom:10px; }
  .prose h3 { font-size:23px; }
  .prose h4 { font-size:19px; }
  .prose h5 { font-size:17px; }
  .prose strong { color:#eee1c7; font-weight:650; }
  .prose em { color:inherit; font-style:italic; }
  .prose ul,.prose ol { padding-left:24px; margin:0 0 20px; }
  .prose li { padding:3px 0 3px 5px; }
  .prose li::marker { color:var(--gold); }
  .prose blockquote { margin:20px 0; border-left:2px solid #b99a61; padding:13px 18px; background:#b69a610e; font-family:var(--serif); font-size:18px; color:#d3c7b0; }
  .prose a { color:#e3bd7e; text-decoration:underline; text-underline-offset:3px; }
  .prose hr { border:0; border-top:1px solid #71624677; margin:27px 0; }
  .prose code { background:#101710; border:1px solid #3a4639; border-radius:3px; padding:1px 4px; font-size:.9em; }
  .prose pre { white-space:pre-wrap; background:#111812; padding:15px; overflow:auto; }
  .prose pre code { border:0; padding:0; }
  .table-scroll { max-width:100%; overflow:auto; margin:23px 0; clear:both; border:1px solid #71604466; border-radius:3px; }
  .prose table { border-collapse:collapse; width:100%; font-size:13px; }
  .prose th,.prose td { padding:10px 14px; border:1px solid #655a423d; text-align:left; min-width:95px; vertical-align:top; }
  .prose th { background:#a88c5220; color:#e6c992; font-size:11px; font-weight:600; }
  .prose tbody tr:nth-child(even) { background:#b7a47a07; }
  .text-art { margin:22px auto; max-width:80%; }
  .text-art img { display:block; width:100%; height:auto; border:1px solid #7c684b80; border-radius:3px; }
  .text-art figcaption { font-size:11px; line-height:1.6; color:#bcb399; text-align:center; padding-top:9px; }
  .text-art.art-left { float:left; width:42%; max-width:42%; margin:6px 22px 15px 0; }
  .text-art.art-right { float:right; width:42%; max-width:42%; margin:6px 0 15px 22px; }
  .text-art.art-wide { max-width:100%; clear:both; }
  .artwork-section { margin:25px 0; border-top:1px solid #5c55393d; padding-top:18px; }
  .artwork-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; }
  .artwork-heading p { font-size:11px; color:#b2b09e; margin:6px 0 13px; }
  .artwork-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(135px,1fr)); gap:12px; }
  .artwork-grid figure { margin:0; border:1px solid #6d5f454f; background:#101612; border-radius:4px; overflow:hidden; max-width:370px; }
  .artwork-image { display:block; width:100%; border:0; padding:0; background:transparent; }
  .artwork-image img { display:block; width:100%; height:190px; object-fit:contain; }
  .artwork-grid figcaption { padding:7px 9px; display:flex; justify-content:space-between; align-items:center; color:#c6ae7b; font-size:10px; }
  .artwork-grid figcaption button { background:transparent; border:0; color:#c6ae7b; padding:3px; font-size:10px; }
  .artwork-grid figcaption button:last-child { font-size:19px; }
  .artwork-full { display:block; width:100%; max-height:70vh; object-fit:contain; }
  dialog:has(#rich-table-form),dialog:has(#rich-image-form) { width:min(850px,calc(100vw - 32px)); max-width:850px; }
  .table-size { display:flex; gap:15px; align-items:flex-end; flex-wrap:wrap; margin:16px 0; }
  .table-size label { flex:1; min-width:95px; margin:0; }
  .table-size input { margin-top:6px; }
  .table-builder { max-width:100%; overflow:auto; max-height:48vh; }
  .table-builder table { border-collapse:collapse; width:100%; }
  .table-builder td { padding:3px; min-width:135px; }
  .table-builder tr:first-child input { background:#3d3626; border-color:#827044; }
  .table-builder input { font-size:12px; padding:10px; }
  .image-upload { position:relative; overflow:hidden; width:fit-content; cursor:pointer; }
  .image-upload input { position:absolute; inset:0; width:100%; opacity:0; cursor:pointer; }
  .image-upload:focus-within { outline:2px solid var(--gold-light); outline-offset:3px; }
  .media-library { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; max-height:36vh; overflow:auto; margin:20px 0; }
  .media-choice { min-width:0; border:1px solid #4a4e3b; border-radius:4px; background:#121912; color:#b9b69f; padding:5px; text-align:left; }
  .media-choice.selected { border-color:#d5b67b; background:#a38e4c27; box-shadow:0 0 0 1px #d5b67b; }
  .media-choice img { width:100%; height:105px; object-fit:contain; background:#101510; display:block; }
  .media-choice span { display:block; font-size:10px; padding:5px 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
}
@layer responsive {
  @media(max-width:1150px) {
    .rich-columns { grid-template-columns:minmax(0,1fr); }
    .rich-source { border-right:0; border-bottom:1px solid #4c4738; }
    .entry-reader .rich-source textarea { min-height:300px; }
    .rich-preview article { min-height:180px; }
  }
  @media(max-width:760px) {
    .rich-toolbar { gap:2px; padding:5px; }
    .rich-toolbar button { padding:5px 7px; }
    .rich-preview article { padding:20px 15px; }
    .artwork-heading { flex-wrap:wrap; }
    .artwork-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .media-library { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .text-art.art-left,.text-art.art-right { float:none; max-width:100%; width:100%; margin:16px 0; }
    .text-art { max-width:100%; }
    .page-settings { display:block; }
  }
}
