/* Bi'DTF v5.3 – synchronized centimetre rulers and width-fitted film.
   Presentation only: placement, pricing and production dimensions stay unchanged. */
.bt-dtf-workspace-page .btdtf-workarea{padding-left:16px;padding-right:16px;scrollbar-gutter:stable}
.bt-dtf-workspace-page .btdtf-ruler-stage{
  display:grid;grid-template-columns:44px max-content;grid-template-rows:27px max-content;
  align-items:start;justify-items:start;max-width:none;width:max-content;
  margin:0 auto;padding:0;isolation:isolate
}
.bt-dtf-workspace-page .btdtf-ruler-corner{
  grid-column:1;grid-row:1;position:sticky;top:0;left:0;z-index:14;
  width:44px;height:27px;display:flex;align-items:center;justify-content:center;
  color:#93aac9;background:#202937;border-right:1px solid #3b4e66;border-bottom:1px solid #3b4e66;
  font-size:10px;font-weight:800;letter-spacing:.04em
}
.bt-dtf-workspace-page .btdtf-top-ruler{
  grid-column:2;grid-row:1;position:sticky;top:0;z-index:13;
  display:block!important;height:27px!important;min-height:27px!important;
  padding:0!important;margin:0!important;border:0!important;border-bottom:1px solid #47586f!important;
  color:#b9c8db!important;background-color:#202937!important;
  background-image:repeating-linear-gradient(to right, #50647b 0px,#50647b 1px,transparent 1px,transparent var(--btdtf-cm-px,10px));
  background-position:left bottom;background-size:auto 7px;background-repeat:repeat-x;
  overflow:visible;font-size:10px;box-sizing:border-box
}
.bt-dtf-workspace-page .btdtf-left-ruler{
  grid-column:1;grid-row:2;position:sticky;left:0;z-index:8;
  display:block;width:44px;min-width:44px;align-self:start;
  padding:0;margin:0;border-right:1px solid #47586f;
  color:#b9c8db;background-color:#202937;
  background-image:repeating-linear-gradient(to bottom, #50647b 0px,#50647b 1px,transparent 1px,transparent var(--btdtf-cm-px,10px));
  background-position:right top;background-size:7px auto;background-repeat:repeat-y;
  font-size:10px;box-sizing:border-box
}
.bt-dtf-workspace-page .btdtf-ruler-mark{
  position:absolute;display:block;white-space:nowrap;color:#bfcee1!important;
  font-size:10px;font-weight:650;line-height:1;pointer-events:none
}
.bt-dtf-workspace-page .btdtf-top-ruler .btdtf-ruler-mark{bottom:8px;transform:translateX(-50%)}
.bt-dtf-workspace-page .btdtf-top-ruler .btdtf-ruler-mark.is-zero{transform:none;left:2px!important}
.bt-dtf-workspace-page .btdtf-top-ruler .btdtf-ruler-mark.is-end{transform:translateX(-100%);padding-right:2px}
.bt-dtf-workspace-page .btdtf-left-ruler .btdtf-ruler-mark{right:10px;transform:translateY(-50%);text-align:right}
.bt-dtf-workspace-page .btdtf-left-ruler .btdtf-ruler-mark.is-zero{transform:none;top:3px!important}
.bt-dtf-workspace-page .btdtf-left-ruler .btdtf-ruler-mark.is-end{transform:translateY(-100%);padding-bottom:2px}
.bt-dtf-workspace-page .btdtf-ruler-stage>.btdtf-canvas-wrap{
  grid-column:2;grid-row:2;min-width:0!important;max-width:none!important;
  width:max-content!important;justify-self:start!important;
  margin:0!important;padding:0!important
}
.bt-dtf-workspace-page .btdtf-ruler-stage .btdtf-film{margin:0!important;max-width:none!important;}
.bt-dtf-workspace-page .btdtf-ruler-stage .btdtf-film-end{margin:0!important;}
@media(max-width:1040px){
 .bt-dtf-workspace-page .btdtf-workarea{padding-left:9px;padding-right:9px}
 .bt-dtf-workspace-page .btdtf-ruler-stage{grid-template-columns:37px max-content}
 .bt-dtf-workspace-page .btdtf-ruler-corner,.bt-dtf-workspace-page .btdtf-left-ruler{width:37px;min-width:37px}
 .bt-dtf-workspace-page .btdtf-top-ruler .btdtf-ruler-mark,.bt-dtf-workspace-page .btdtf-left-ruler .btdtf-ruler-mark{font-size:9px}
}
@media(max-width:580px){
 .bt-dtf-workspace-page .btdtf-workarea{padding-left:5px;padding-right:5px}
 .bt-dtf-workspace-page .btdtf-ruler-stage{grid-template-columns:35px max-content}
 .bt-dtf-workspace-page .btdtf-ruler-corner,.bt-dtf-workspace-page .btdtf-left-ruler{width:35px;min-width:35px}
 .bt-dtf-workspace-page .btdtf-top-ruler .btdtf-ruler-mark{font-size:8px}
}
/* Preserve usable canvas width on compact desktop displays without hiding controls. */
@media(min-width:1041px) and (max-width:1499px){
 .bt-dtf-workspace-page .btdtf-columns{
  grid-template-columns:50px minmax(240px,268px) minmax(350px,1fr) minmax(255px,280px)!important;
 }
}