/* Split-screen reference viewer (assets/refpane.js). */
:root{--refpane-w:50vw}
.refpane{display:none;position:fixed;top:0;right:0;bottom:0;width:var(--refpane-w);z-index:50;flex-direction:column;background:#fff;border-left:1px solid var(--rule,#e6e6e6);box-shadow:-2px 0 8px rgba(0,0,0,.06)}
body.refpane-shown .refpane{display:flex}
html body.refpane-shown{padding-right:var(--refpane-w)}
.refpane-grip{position:absolute;left:-4px;top:0;bottom:0;width:8px;cursor:col-resize}
.refpane-dragging .refpane-frame{pointer-events:none}
.refpane-head{display:flex;align-items:center;gap:12px;padding:8px 12px;border-bottom:1px solid var(--rule,#e6e6e6);font-size:var(--small,12.5px)}
.refpane-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.refpane-open,.refpane-close{flex-shrink:0}
.refpane-close{border:0;background:none;font-size:20px;line-height:1;cursor:pointer;padding:0 4px}
.refpane-body{flex:1;min-height:0;overflow:auto}
.refpane-frame{display:block;width:100%;height:100%;border:0}
.refpane-body img{display:block;width:100%;height:auto;border-bottom:1px solid var(--rule,#e6e6e6)}
.refpane-missing{padding:12px;font-size:var(--small,12.5px)}
body.refpane-shown .cg-hint{right:calc(var(--refpane-w) + 14px)}
a.refpane-current{background:rgba(51,139,222,.12);border-radius:2px}
/* Phones: the pane becomes a bottom sheet over the page. */
@media (max-width:760px){
  .refpane{top:auto;left:0;width:auto;height:65vh;border-left:0;border-top:1px solid var(--rule,#e6e6e6)}
  html body.refpane-shown{padding-right:0;padding-bottom:65vh}
  .refpane-grip{display:none}
  body.refpane-shown .cg-hint{right:14px;bottom:calc(65vh + 14px)}
}
