/* Terry.ism v33 — immediately visible metadata settings and collision-safe output */

.frame-meta-controls{
  position:relative;
  scroll-margin-top:74px;
  outline:none;
}

.frame-meta-inline-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:start!important;
  gap:8px!important;
}

.frame-meta-heading-actions{
  display:inline-flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  white-space:nowrap;
}

.frame-meta-heading-actions .count-pill{
  flex:0 0 auto;
}

.customise-drawer-close{
  display:inline-grid;
  width:34px;
  height:34px;
  flex:0 0 34px;
  place-items:center;
  padding:0;
  border:1px solid #d8dde3;
  border-radius:9px;
  background:#fff;
  color:#313842;
  font:500 20px/1 Inter,system-ui,sans-serif;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}

.customise-drawer-close:hover{
  border-color:#adb6c1;
  background:#f5f7f9;
  color:#11161d;
}

.customise-drawer-close:active{transform:scale(.96)}

.customise-drawer-close:focus-visible,
.action-customise-toggle:focus-visible,
.drawer-toggle-pill:focus-visible{
  outline:2px solid #c96b3c!important;
  outline-offset:2px!important;
}

.frame-meta-inline-heading .metadata-edit-shortcut{
  grid-column:1/-1!important;
  width:100%;
  min-width:0;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px;
}

.action-customise-toggle[aria-expanded="true"]{
  border-color:#171c24!important;
  background:#171c24!important;
  color:#fff!important;
}

.frame-meta-controls.drawer-arrival{
  animation:metadata-drawer-arrival 1.05s cubic-bezier(.2,.75,.25,1) both;
}

@keyframes metadata-drawer-arrival{
  0%{border-color:#c96b3c;box-shadow:0 0 0 4px rgba(201,107,60,.20),0 18px 42px rgba(25,31,39,.15);transform:translateY(7px)}
  42%{border-color:#d9875e;box-shadow:0 0 0 3px rgba(201,107,60,.12),0 14px 34px rgba(25,31,39,.11)}
  100%{transform:translateY(0)}
}

.metadata-placement-control .label-row{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
}

.metadata-placement-control .label-row label{
  white-space:nowrap;
}

.metadata-placement-control .label-row small{
  display:block;
  min-width:0;
  max-width:none!important;
  overflow:hidden;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap!important;
}

@media(max-width:720px){
  .frame-meta-controls{scroll-margin-top:62px}
  .customise-drawer-close{width:38px;height:38px;flex-basis:38px;border-radius:10px}
  .frame-meta-heading-actions{gap:5px}
  .frame-meta-inline-heading .metadata-edit-shortcut{min-height:44px!important}
  .metadata-placement-control .label-row{gap:7px}
  .metadata-placement-control .label-row small{font-size:8.5px!important}
}

@media(max-width:360px){
  .frame-meta-heading-actions .count-pill{padding-inline:7px!important}
  .metadata-placement-control .label-row small{font-size:8px!important}
}

@media(prefers-reduced-motion:reduce){
  .frame-meta-controls.drawer-arrival{animation:none;box-shadow:0 0 0 3px rgba(201,107,60,.14)}
  .customise-drawer-close{transition:none}
}