/* Ceritera V8.5 — Editorial Content Engine */

#editorialToolsBtn { position: relative; }
#editorialToolsBtn.has-editorial-items::after {
  content: attr(data-count); position:absolute; top:-5px; right:-5px; min-width:17px; height:17px;
  padding:0 4px; display:grid; place-items:center; border-radius:999px; background:var(--action-primary);
  color:#fff; font:700 10px/1 var(--font-ui); border:2px solid var(--surface-paper);
}

.editorial-selection-toolbar {
  position:fixed; z-index:1200; display:flex; align-items:center; gap:4px; padding:6px;
  border:1px solid color-mix(in srgb,var(--text-primary) 20%,transparent); border-radius:12px;
  background:color-mix(in srgb,var(--surface-paper) 96%,transparent); box-shadow:0 12px 34px rgba(25,20,18,.2);
  backdrop-filter:blur(12px); opacity:0; transform:translateY(5px) scale(.98); pointer-events:none;
  transition:opacity 120ms ease,transform 120ms ease;
}
.editorial-selection-toolbar[hidden]{display:none!important;}
.editorial-selection-toolbar.is-visible{opacity:1;transform:none;pointer-events:auto;}
.editorial-selection-toolbar button{min-width:34px;min-height:32px;padding:0 9px;border:0;border-radius:8px;background:transparent;box-shadow:none;font:700 12px/1 var(--font-ui);}
.editorial-selection-toolbar button:hover{background:var(--surface-muted);}
.editorial-selection-toolbar button:disabled{opacity:.35;cursor:not-allowed;}
.highlight-color-dot{width:16px;height:16px;min-width:16px!important;min-height:16px!important;padding:0!important;border-radius:50%!important;box-shadow:0 0 0 2px var(--surface-paper),0 0 0 3px var(--border-subtle)!important;}
.highlight-color-dot[data-highlight-color="amber"]{background:#f4d87a!important;}
.highlight-color-dot[data-highlight-color="rose"]{background:#efb7c4!important;}
.highlight-color-dot[data-highlight-color="blue"]{background:#a9d6e8!important;}

.reader-highlight { padding:.04em .08em; border-radius:.18em; color:inherit; cursor:pointer; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.reader-highlight--amber { background:color-mix(in srgb,#f4d87a 72%,transparent); }
.reader-highlight--rose { background:color-mix(in srgb,#efb7c4 70%,transparent); }
.reader-highlight--blue { background:color-mix(in srgb,#a9d6e8 72%,transparent); }
.reader-highlight:focus-visible { outline:2px solid var(--focus-ring); outline-offset:2px; }

.editorial-inline-image { margin:1.6em 0; break-inside:avoid-column; overflow:hidden; border:1px solid var(--border-subtle); background:var(--surface-muted); }
.editorial-inline-image img { display:block; width:100%; max-height:70vh; object-fit:contain; background:var(--surface-muted); }
.editorial-inline-image figcaption { padding:.8rem 1rem; font:600 var(--text-xs)/1.5 var(--font-ui); color:var(--text-secondary); border-top:1px solid var(--border-subtle); }
.editorial-inline-image.is-broken::before { content:'Imej tidak dapat dipaparkan'; display:grid; place-items:center; min-height:12rem; color:var(--text-secondary); }
.editorial-inline-image.is-broken img { display:none; }

.chapter-ending-page {
  break-before:column; break-inside:avoid-column; min-height:24rem; margin:0; padding:clamp(2rem,5vw,4rem);
  display:flex; flex-direction:column; justify-content:center; border:1px solid var(--border-subtle);
  background:linear-gradient(145deg,var(--action-primary-soft),var(--surface-paper) 60%); text-align:left;
}
.chapter-ending-kicker { font:700 var(--text-2xs)/1 var(--font-label); letter-spacing:.14em; text-transform:uppercase; color:var(--action-primary); }
.chapter-ending-title { margin:.8rem 0 1rem!important; font:700 clamp(2rem,5vw,3.8rem)/1.02 var(--font-display)!important; break-after:auto!important; }
.chapter-ending-copy { max-width:42ch; color:var(--text-secondary); }
.chapter-ending-actions { display:flex; flex-wrap:wrap; gap:.65rem; margin-top:1.2rem; }
.chapter-ending-actions button { min-height:40px; padding:.7rem 1rem; }
.chapter-ending-actions .chapter-ending-primary { background:var(--action-primary); color:var(--action-on-primary); }
.reading-mode-scroll .chapter-ending-page { margin-top:3rem; min-height:clamp(24rem,58vh,38rem); }

.editorial-quote-page { min-height:inherit; padding:clamp(2rem,7vw,6rem); display:flex; flex-direction:column; justify-content:center; background:linear-gradient(145deg,var(--action-primary-soft),var(--surface-paper) 65%); }
.editorial-quote-mark { height:.65em; font:700 clamp(8rem,22vw,17rem)/.7 var(--font-display); color:var(--action-primary); opacity:.75; }
.editorial-quote-page blockquote { max-width:22ch; margin:1rem 0 1.8rem; border:0; padding:0; background:none; font:600 clamp(2rem,5vw,4.5rem)/1.14 var(--font-display); color:var(--text-primary); }
.editorial-quote-source { font:700 var(--text-sm)/1.5 var(--font-ui); color:var(--text-secondary); }
.editorial-page-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.editorial-page-actions button:first-child { background:var(--action-primary); color:var(--action-on-primary); }

.editorial-image-page { min-height:inherit; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); background:var(--surface-ink); color:#fff; }
.editorial-image-hero { margin:0; min-height:inherit; display:grid; grid-template-rows:minmax(0,1fr) auto; background:#151312; }
.editorial-image-hero img { width:100%; height:100%; min-height:30rem; object-fit:cover; }
.editorial-image-hero figcaption { padding:.8rem 1rem; font:500 var(--text-xs)/1.5 var(--font-ui); color:rgba(255,255,255,.72); }
.editorial-image-fallback { position:relative; min-height:inherit; overflow:hidden; display:grid; place-items:center; background:radial-gradient(circle at 75% 22%,color-mix(in srgb,var(--action-primary) 65%,#fff),transparent 28%),linear-gradient(145deg,var(--action-primary),#24201e 72%); }
.editorial-image-fallback::after { content:''; position:absolute; inset:8%; border:1px solid rgba(255,255,255,.35); }
.editorial-image-masthead { position:absolute; left:8%; top:7%; font:700 clamp(2.5rem,7vw,6rem)/1 var(--font-display); }
.editorial-image-emoji { font-size:clamp(7rem,18vw,15rem); filter:drop-shadow(0 30px 40px rgba(0,0,0,.25)); }
.editorial-image-folio { position:absolute; right:8%; bottom:6%; font:700 clamp(4rem,10vw,8rem)/1 var(--font-display); opacity:.5; }
.editorial-image-caption { padding:clamp(2rem,5vw,4.5rem); display:flex; flex-direction:column; justify-content:flex-end; background:#24201e; }
.editorial-image-caption>span { font:700 var(--text-2xs)/1 var(--font-label); letter-spacing:.14em; text-transform:uppercase; color:color-mix(in srgb,var(--action-primary-soft) 80%,#fff); }
.editorial-image-caption h2 { margin:.8rem 0 1rem; font:700 clamp(2.2rem,5vw,4.5rem)/1 var(--font-display); }
.editorial-image-caption p { color:rgba(255,255,255,.68); }
.editorial-image-caption .editorial-page-actions button { border-color:rgba(255,255,255,.3); color:#fff; background:transparent; }
.editorial-image-caption .editorial-page-actions button:first-child { background:#fff; color:#24201e; }

.editorial-tools-modal { max-width:660px; }
.editorial-tools-intro { margin:-.2rem 0 1.2rem; color:var(--text-secondary); }
.editorial-tools-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.editorial-tool-card { min-height:112px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; gap:.25rem .8rem; text-align:left; padding:1rem; border:1px solid var(--border-subtle); background:var(--surface-paper); box-shadow:none; }
.editorial-tool-card:hover { border-color:var(--action-primary); transform:translateY(-1px); }
.editorial-tool-icon { grid-row:1/3; align-self:center; width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:var(--action-primary-soft); color:var(--action-primary); font-size:1.3rem; }
.editorial-tool-card strong { align-self:end; font:700 var(--text-sm)/1.2 var(--font-ui); }
.editorial-tool-card small { color:var(--text-secondary); }

.editorial-note-modal { max-width:620px; }
.editorial-note-quote { margin:.5rem 0 1rem; padding:1rem 1.2rem; border-left:4px solid var(--action-primary); background:var(--action-primary-soft); font:italic 500 var(--text-sm)/1.6 var(--font-reading); }
.editorial-note-input { width:100%; min-height:180px; resize:vertical; padding:1rem; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); background:var(--surface-paper); color:var(--text-primary); font:500 var(--text-sm)/1.65 var(--font-ui); }

.editorial-library-overlay { justify-content:flex-end; padding:0; }
.editorial-library-drawer { width:min(520px,100%); height:100dvh; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; background:var(--surface-paper); box-shadow:-20px 0 50px rgba(20,16,14,.18); }
.editorial-library-header { display:flex; align-items:center; justify-content:space-between; padding:1.25rem; border-bottom:1px solid var(--border-subtle); }
.editorial-library-header div { display:grid; gap:.25rem; }
.editorial-library-header span { font:700 var(--text-2xs)/1 var(--font-label); letter-spacing:.12em; text-transform:uppercase; color:var(--action-primary); }
.editorial-library-header strong { font:700 var(--text-lg)/1.15 var(--font-display); }
.editorial-library-tabs { display:grid; grid-template-columns:1fr 1fr; padding:.55rem; gap:.4rem; background:var(--surface-muted); }
.editorial-library-tabs button { min-height:38px; background:transparent; box-shadow:none; border:0; }
.editorial-library-tabs button.is-active { background:var(--surface-paper); color:var(--action-primary); box-shadow:var(--shadow-subtle); }
.editorial-library-list { overflow:auto; padding:1rem; display:grid; align-content:start; gap:.8rem; }
.editorial-library-item { padding:1rem; border:1px solid var(--border-subtle); background:var(--surface-paper); }
.editorial-library-meta { font:700 var(--text-2xs)/1 var(--font-label); letter-spacing:.08em; text-transform:uppercase; color:var(--action-primary); }
.editorial-library-item p,.editorial-library-item blockquote { margin:.75rem 0; font:500 var(--text-sm)/1.6 var(--font-reading); }
.editorial-library-item blockquote { border-left:3px solid var(--action-primary); padding-left:.8rem; }
.editorial-library-quote { display:block; color:var(--text-secondary); font-style:italic; }
.editorial-library-actions { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.8rem; }
.editorial-library-actions button { min-height:34px; padding:.45rem .7rem; font-size:.72rem; }
.editorial-library-actions button.danger { color:#a53333; }
.editorial-library-empty { min-height:50vh; display:grid; place-items:center; align-content:center; text-align:center; color:var(--text-secondary); }
.editorial-library-empty span { font-size:2.5rem; }
.editorial-library-empty strong { color:var(--text-primary); margin-top:.6rem; }
.editorial-library-empty p { max-width:28ch; }
.editorial-library-footer { padding:1rem; border-top:1px solid var(--border-subtle); }
.editorial-library-footer button { width:100%; }

.editorial-share-modal { max-width:650px; }
.editorial-share-canvas { display:block; width:min(100%,430px); height:auto; margin:0 auto; border-radius:8px; box-shadow:0 16px 38px rgba(25,20,18,.2); background:var(--surface-muted); }
.editorial-share-caption { text-align:center; color:var(--text-secondary); font-size:.78rem; }
.editorial-share-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:.65rem; }

@media (max-width:760px){
  .editorial-image-page { grid-template-columns:1fr; }
  .editorial-image-hero,.editorial-image-fallback { min-height:52vh; }
  .editorial-image-caption { min-height:34vh; }
  .editorial-tools-grid { grid-template-columns:1fr; }
  .chapter-ending-page { min-height:22rem; padding:2rem 1.4rem; }
}
@media (max-width:680px){
  .editorial-selection-toolbar { max-width:calc(100vw - 12px); overflow-x:auto; }
  .editorial-quote-page { padding:2.2rem 1.4rem; }
  .editorial-quote-page blockquote { font-size:clamp(1.8rem,8.5vw,3rem); }
  .editorial-image-hero img { min-height:46vh; }
}
@media (prefers-reduced-motion:reduce){
  .editorial-selection-toolbar,.editorial-tool-card { transition:none!important; }
}

/* Phase 5 final editorial polish. */
.editorial-image-page { background:#24201e; grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr); }
.editorial-image-caption h2 { font-size:clamp(2rem,4vw,3.65rem); line-height:1.02; word-break:normal; overflow-wrap:normal; hyphens:none; }
.editorial-quote-page blockquote { text-wrap:balance; }
@media (max-width:760px){ .editorial-image-page { grid-template-columns:1fr; } }
.reading-mode-scroll .chapter-ending-page { break-before:auto; break-inside:auto; }