:root{
  --br-bg:#ececea;
  --br-panel:#111318;
  --br-panel2:#17191f;
  --br-line:#2d3038;
  --br-red:#73070B;
  --br-red2:#970a10;
  --br-text:#fff;
  --br-muted:#a4a9b2;
  --br-green:#48e985;
}

*{
  box-sizing:border-box;
}

body{
  margin:0;
  background:var(--br-bg);
}

.br-page{
  width:min(1220px,94vw);
  margin:0 auto;
  padding:28px 0 70px;
}

.br-hero{
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:34px;
  background:
    linear-gradient(
      110deg,
      #07080b 0%,
      #111318 55%,
      #300407 100%
    );
  border-top:3px solid var(--br-red);
  color:#fff;
}

.br-hero h1{
  margin:4px 0 10px;
  font-size:42px;
  line-height:1;
}

.br-hero p{
  max-width:720px;
  margin:0;
  color:#b8bdc7;
  line-height:1.55;
}

.br-eyebrow{
  display:block;
  color:#b80c13;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
}

.br-tabs{
  display:flex;
  margin-top:16px;
  border:1px solid #cacaca;
  background:#fff;
}

.br-tab{
  border:0;
  border-right:1px solid #d3d3d3;
  padding:14px 20px;
  background:#fff;
  color:#17181c;
  font-weight:900;
  cursor:pointer;
}

.br-tab.active{
  background:linear-gradient(
    105deg,
    #69060A,
    #78070B 40%,
    #100F12
  );
  color:#fff;
}

.br-panel,
.br-detail{
  margin-top:18px;
  background:var(--br-panel);
  color:#fff;
  border-top:3px solid var(--br-red);
}

.br-panel{
  padding:22px;
}

.br-panel-head,
.br-toolbar,
.br-detail-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

.br-panel-head h2,
.br-toolbar h2,
.br-detail h2{
  margin:3px 0 0;
}

.br-icon-btn{
  width:38px;
  height:38px;
  border:1px solid #474b55;
  background:#17191e;
  color:#fff;
  font-size:24px;
  cursor:pointer;
}

.br-form{
  margin-top:22px;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.br-field{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.br-wide{
  grid-column:1 / -1;
}

.br-field label{
  color:#cdd0d7;
  font-size:11px;
  font-weight:900;
}

.br-field input,
.br-field textarea,
.br-search input,
.br-proposal-form input,
.br-proposal-form textarea{
  width:100%;
  border:1px solid #3b3f48;
  background:#090a0d;
  color:#fff;
  padding:11px 12px;
  outline:none;
}

.br-field input:focus,
.br-field textarea:focus,
.br-search input:focus,
.br-proposal-form input:focus,
.br-proposal-form textarea:focus{
  border-color:var(--br-red2);
}

.br-form-actions{
  display:flex;
  gap:10px;
}

.br-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  border:1px solid #444954;
  padding:9px 14px;
  font-weight:900;
  cursor:pointer;
}

.br-primary{
  background:linear-gradient(
    105deg,
    #69060A 0%,
    #78070B 35%,
    #450408 70%,
    #100F12 100%
  );
  border-color:#85090e;
  color:#fff;
}

.br-secondary{
  background:#17191f;
  color:#fff;
}

.br-danger{
  background:#3b080a;
  color:#fff;
  border-color:#73070B;
}

.br-toolbar{
  margin-top:22px;
  padding:18px;
  background:#111318;
  color:#fff;
  border-left:4px solid var(--br-red);
}

.br-search{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.br-search input{
  width:190px;
}

.br-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-top:14px;
}

.br-card{
  display:flex;
  flex-direction:column;
  min-height:270px;
  background:#111318;
  border-top:3px solid #73070B;
  color:#fff;
}

.br-card-body{
  padding:18px;
  flex:1;
}

.br-card-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.br-card h3{
  margin:5px 0 4px;
  font-size:18px;
}

.br-card p{
  color:#aeb3bd;
  line-height:1.45;
  font-size:13px;
}

.br-status{
  display:inline-flex;
  padding:5px 7px;
  border:1px solid #454a54;
  background:#191b21;
  color:#fff;
  text-transform:uppercase;
  font-size:9px;
  font-weight:900;
  letter-spacing:.05em;
}

.br-status.accepted{
  border-color:#176b3d;
  color:#5ef59a;
}

.br-status.shortlisted{
  border-color:#8b6800;
  color:#ffd55c;
}

.br-status.declined,
.br-status.cancelled,
.br-status.withdrawn{
  border-color:#7a2026;
  color:#ff7a84;
}

.br-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:14px;
}

.br-meta span{
  padding:6px 8px;
  border:1px solid #30333b;
  background:#0b0c10;
  color:#c6cad2;
  font-size:10px;
}

.br-card-foot{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border-top:1px solid #292c34;
  padding:12px 18px;
  background:#0c0d11;
}

.br-price{
  color:#fff;
  font-weight:900;
}

.br-empty{
  grid-column:1 / -1;
  padding:36px 24px;
  border:1px dashed #b9b9b9;
  background:#f7f7f5;
  color:#3a3a3a;
  text-align:center;
}

.br-notice{
  margin-top:16px;
  padding:12px 15px;
  background:#111318;
  border-left:4px solid #73070B;
  color:#fff;
}

.br-detail{
  padding:22px;
}

.br-detail-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:18px;
  margin-top:18px;
}

.br-detail-main,
.br-detail-side{
  padding:18px;
  background:#0b0c10;
  border:1px solid #2b2e35;
}

.br-detail-main p{
  color:#b9bdc6;
  line-height:1.6;
}

.br-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}

.br-proposal-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.br-proposal-form label{
  color:#cfd2d9;
  font-size:11px;
  font-weight:900;
}

.br-submissions{
  margin-top:20px;
}

.br-submission{
  margin-top:10px;
  padding:16px;
  border:1px solid #2f323a;
  background:#0b0c10;
}

.br-submission-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
}

.br-submission p{
  color:#b5bac3;
  line-height:1.5;
}

.br-submission-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}

.br-back{
  margin-bottom:14px;
}

@media(max-width:980px){

  .br-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .br-detail-grid{
    grid-template-columns:1fr;
  }

  .br-hero{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:650px){

  .br-page{
    width:100%;
    padding:0 12px 50px;
  }

  .br-hero{
    margin:0 -12px;
    padding:24px 16px;
  }

  .br-hero h1{
    font-size:32px;
  }

  .br-tabs{
    overflow-x:auto;
  }

  .br-tab{
    flex:0 0 auto;
    padding:12px 14px;
    font-size:11px;
  }

  .br-grid{
    grid-template-columns:1fr;
  }

  .br-form{
    grid-template-columns:1fr;
  }

  .br-wide{
    grid-column:auto;
  }

  .br-toolbar{
    flex-direction:column;
  }

  .br-search{
    width:100%;
  }

  .br-search input,
  .br-search button{
    width:100%;
  }

  .br-form-actions{
    flex-direction:column;
  }

  .br-form-actions .br-btn{
    width:100%;
  }

  .br-card-foot{
    align-items:stretch;
    flex-direction:column;
  }

  .br-card-foot .br-btn{
    width:100%;
  }
}

/* =========================================================
   OSBEATS BEAT REQUESTS — FULL ACTIVE TAB FILL
   Prevent shared button styles from creating inset active tabs.
   ========================================================= */

.br-tabs{
  display:flex !important;
  align-items:stretch !important;
  gap:0 !important;
  padding:0 !important;
}

.br-tabs .br-tab{
  align-self:stretch !important;
  margin:0 !important;
  min-height:46px !important;
  padding:0 20px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border:0 !important;
  border-right:1px solid #d3d3d3 !important;
  border-radius:0 !important;

  box-shadow:none !important;
  background:#ffffff !important;
  color:#17181c !important;
}

.br-tabs .br-tab.active{
  margin:0 !important;
  padding:0 20px !important;

  background:
    linear-gradient(
      105deg,
      #69060A 0%,
      #78070B 35%,
      #450408 70%,
      #100F12 100%
    ) !important;

  color:#ffffff !important;

  border:0 !important;
  border-right:1px solid #4b0508 !important;
  border-radius:0 !important;

  box-shadow:none !important;
}

@media(max-width:650px){

  .br-tabs .br-tab,
  .br-tabs .br-tab.active{
    min-height:44px !important;
    padding:0 14px !important;
  }
}


/* =========================================================
   OSBEATS BEAT REQUESTS — SHORT PAGE FOOTER FIX
   Keeps footer at bottom of viewport without fixing/overlaying it.
   ========================================================= */

html{
  min-height:100%;
}

body{
  min-height:100vh !important;
  display:flex !important;
  flex-direction:column !important;
}

.br-page{
  flex:1 0 auto !important;
}

.os-global-footer{
  flex-shrink:0 !important;
}

.osb-legal-links{
  flex-shrink:0 !important;
}


/* =========================================================
   OSBEATS BEAT REQUESTS — PRIVATE DEMO UI 20260904
   ========================================================= */

.br-demo-panel{
  margin-top:18px;
  padding:14px;
  border:1px solid #30343c;
  background:#111318;
}

.br-demo-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.br-demo-heading h4{
  margin:3px 0 0;
  color:#fff;
  font-size:15px;
}

.br-demo-private{
  padding:5px 7px;
  border:1px solid #444954;
  background:#090a0d;
  color:#aeb3bd;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
}

.br-demo-empty{
  padding:14px;
  border:1px dashed #3a3e47;
  background:#0b0c10;
  color:#8f949f;
  font-size:12px;
}

.br-demo-latest{
  padding:12px;
  border:1px solid #333741;
  background:#090a0d;
}

.br-demo-latest-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
  color:#fff;
}

.br-demo-latest-head > div{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.br-demo-latest-head > span{
  color:#9fa4ae;
  font-size:10px;
}

.br-demo-label{
  color:#8f0a10;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}

.br-demo-audio{
  display:block;
  width:100%;
  height:42px;
}

.br-demo-note-view{
  margin:10px 0 0 !important;
  color:#b5bac3 !important;
  font-size:11px !important;
}

.br-demo-versions{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:7px;
}

.br-demo-version-title{
  color:#cfd2d9;
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.br-demo-version{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:9px 10px;
  border:1px solid #292d35;
  background:#0b0c10;
}

.br-demo-version-info{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.br-demo-version-info strong{
  color:#fff;
  font-size:11px;
}

.br-demo-version-info span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#c5c9d0;
  font-size:11px;
}

.br-demo-version-info small{
  color:#858b95;
  font-size:9px;
}

.br-demo-version-note{
  white-space:normal;
  color:#aeb3bd !important;
}

.br-demo-download{
  flex:0 0 auto;
  min-height:34px;
  padding:6px 10px;
  text-decoration:none;
  font-size:10px;
}

.br-demo-upload{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.br-demo-upload label{
  color:#cfd2d9;
  font-size:10px;
  font-weight:900;
}

.br-demo-upload input[type="file"],
.br-demo-upload textarea{
  width:100%;
  border:1px solid #3b3f48;
  background:#090a0d;
  color:#fff;
  padding:10px 11px;
}

.br-demo-upload input[type="file"]::file-selector-button{
  margin-right:10px;
  border:1px solid #4a4f59;
  background:#17191f;
  color:#fff;
  padding:7px 10px;
  cursor:pointer;
}

.br-demo-upload textarea{
  resize:vertical;
  min-height:64px;
}

.br-demo-upload small{
  color:#858b95;
  font-size:9px;
}

.br-demo-upload .br-btn{
  align-self:flex-start;
}

.br-demo-upload .br-btn:disabled{
  opacity:.6;
  cursor:wait;
}

.br-demo-closed{
  margin-top:10px;
  padding:9px 10px;
  border-left:3px solid #73070B;
  background:#0b0c10;
  color:#999ea8;
  font-size:10px;
}

.br-demo-owner{
  margin-bottom:12px;
}

@media(max-width:650px){

  .br-demo-heading,
  .br-demo-version{
    align-items:stretch;
    flex-direction:column;
  }

  .br-demo-private{
    align-self:flex-start;
  }

  .br-demo-download,
  .br-demo-upload .br-btn{
    width:100%;
  }

  .br-demo-audio{
    width:100%;
  }
}


/* OSBEATS BEAT REQUEST DEMO INLINE STATUS 20260904 */

.br-demo-inline-status{
  padding:9px 10px;
  border-left:3px solid #73070B;
  background:#090a0d;
  color:#fff;
  font-size:10px;
  line-height:1.4;
}

.br-demo-inline-status[data-type="error"]{
  border-left-color:#b20d15;
  color:#ff9ca2;
}

.br-demo-inline-status[data-type="info"]{
  border-left-color:#777;
  color:#c7cbd2;
}


/* OSBEATS BEAT REQUESTS — WITHDRAW PROPOSAL 20260904 */

.br-proposal-foot-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.br-withdraw-btn{
  border:1px solid #4a4d54 !important;
  background:#111318 !important;
  color:#fff !important;
}

.br-withdraw-btn:hover{
  border-color:#b20d15 !important;
  background:#1a0b0e !important;
}

@media(max-width:650px){
  .br-proposal-foot-actions{
    width:100%;
    flex-direction:column;
  }

  .br-proposal-foot-actions .br-btn{
    width:100%;
  }
}


/* OSBEATS ONE-STEP PROPOSAL UX 20260904 */
.br-proposal-intro{
  margin:8px 0 18px;
  font-size:12px;
  line-height:1.55;
  color:#a9adb5;
}

.br-proposal-demo{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px;
  margin:0 0 16px;
  border:1px solid #343741;
  background:#090a0e;
}

.br-proposal-demo input[type="file"]{
  width:100%;
  box-sizing:border-box;
  padding:10px;
  border:1px solid #393d47;
  background:#111319;
  color:#fff;
}

.br-proposal-demo small{
  color:#8f939e;
  font-size:10px;
  line-height:1.45;
}

.br-proposal-form label{
  margin-top:12px;
}

.br-proposal-form #proposalSubmitButton{
  width:100%;
  margin-top:4px;
}

.br-proposal-form #proposalSubmitButton:disabled{
  opacity:.65;
  cursor:wait;
}

/* OSBEATS EXISTING PROPOSAL UX 20260904 */
.br-existing-proposal{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  border:1px solid #343741;
  background:#090a0e;
}

.br-existing-proposal h3{
  margin:0;
  color:#fff;
  font-size:16px;
  line-height:1.35;
}

.br-existing-proposal p{
  margin:0;
  color:#a9adb5;
  font-size:12px;
  line-height:1.55;
}

.br-existing-proposal-status{
  display:flex;
  align-items:center;
}

.br-existing-proposal .br-btn{
  width:100%;
}


/* OSBEATS BEAT REQUEST PAYMENT PANEL 20260904 */

.br-project-action-panel{
  margin-top:20px;
  padding:16px;
  border:1px solid #343741;
  background:#090a0e;
}

.br-project-action-panel h3{
  margin:6px 0 14px;
  color:#fff;
  font-size:18px;
}

.br-project-price-row,
.br-project-status-row,
.br-payment-total{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
  border-top:1px solid #292c34;
}

.br-project-price-row span,
.br-project-status-row span,
.br-payment-total span{
  color:#a9adb5;
  font-size:12px;
}

.br-project-price-row strong,
.br-project-status-row strong,
.br-payment-total strong{
  color:#fff;
  font-size:16px;
}

.br-payment-required{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #292c34;
}

.br-payment-required p,
.br-action-help{
  color:#a9adb5;
  font-size:12px;
  line-height:1.55;
}

.br-payment-total{
  margin:10px 0 14px;
}

.br-payment-total strong{
  font-size:22px;
}

.br-project-action-panel .br-btn{
  width:100%;
}

.br-funded-panel{
  border-color:#255c3b;
}

.br-funded-panel .br-project-status-row strong{
  color:#69e698;
}


/* OSBEATS BEAT REQUEST DELIVERY WORKSPACE 20260905 */

.br-workspace-panel{
  margin-top:14px;
  padding:16px;
  border:1px solid #343741;
  background:#090a0e;
}

.br-workspace-panel h3{
  margin:6px 0 12px;
  color:#fff;
  font-size:18px;
}

.br-workspace-panel label{
  display:block;
  margin:14px 0 6px;
  color:#fff;
  font-size:11px;
  font-weight:800;
}

.br-workspace-panel input[type="file"],
.br-workspace-panel textarea{
  box-sizing:border-box;
  width:100%;
  border:1px solid #343741;
  border-radius:0;
  background:#101217;
  color:#fff;
}

.br-workspace-panel input[type="file"]{
  padding:10px;
}

.br-workspace-panel textarea{
  padding:10px;
  resize:vertical;
}

.br-delivery-help{
  display:block;
  margin-top:6px;
  color:#8f949f;
  font-size:9px;
  line-height:1.45;
}

.br-workspace-panel form .br-btn{
  width:100%;
  margin-top:14px;
}

.br-delivery-files{
  display:grid;
  gap:10px;
  margin-top:12px;
}

.br-delivery-file{
  padding:10px;
  border:1px solid #30343d;
  background:#0c0e13;
}

.br-delivery-file-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.br-delivery-file-head strong{
  display:block;
  color:#fff;
  font-size:11px;
}

.br-delivery-file-head small{
  display:block;
  margin-top:3px;
  color:#8e949e;
  font-size:9px;
}

.br-delivery-file audio{
  display:block;
  width:100%;
  margin-top:10px;
}

.br-delivery-download{
  width:auto !important;
  min-width:82px;
  text-align:center;
}

.br-delivery-note,
.br-revision-note{
  margin:12px 0;
  padding:10px;
  border-left:2px solid #ed1639;
  background:#101217;
}

.br-delivery-note strong{
  color:#fff;
  font-size:10px;
}

.br-delivery-note p,
.br-revision-note p{
  margin:6px 0 0;
  color:#b0b4bd;
  font-size:11px;
  line-height:1.5;
}

.br-delivery-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:12px;
}

.br-delivery-ready{
  border-color:#584b27;
}

.br-project-complete{
  border-color:#255c3b;
}

@media(max-width:700px){

  .br-delivery-file-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .br-delivery-download{
    width:100% !important;
  }

  .br-delivery-actions{
    grid-template-columns:1fr;
  }
}


/* OSBEATS REVISION ATTENTION UX 20260905 */

.br-status.revision_requested{
  border-color:#ed1639;
  background:#ed1639;
  color:#fff;
}

.br-revision-attention{
  display:flex;
  gap:16px;
  margin:18px 0 20px;
  padding:18px;
  border:2px solid #ed1639;
  background:
    linear-gradient(
      135deg,
      rgba(237,22,57,.18),
      rgba(237,22,57,.04)
    );
  box-shadow:
    0 0 0 1px rgba(237,22,57,.12) inset;
}

.br-revision-attention-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 46px;
  width:46px;
  height:46px;
  border:2px solid #ed1639;
  background:#ed1639;
  color:#fff;
  font-size:28px;
  font-weight:900;
  line-height:1;
}

.br-revision-attention-copy{
  min-width:0;
}

.br-revision-attention-label{
  display:block;
  margin-bottom:5px;
  color:#ff3655;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.br-revision-attention h2{
  margin:0 0 12px;
  color:#fff;
  font-size:19px;
  line-height:1.25;
}

.br-revision-attention-message{
  padding:11px 12px;
  border-left:3px solid #ed1639;
  background:#0b0d12;
}

.br-revision-attention-message strong{
  display:block;
  margin-bottom:5px;
  color:#fff;
  font-size:10px;
}

.br-revision-attention-message p{
  margin:0;
  color:#fff;
  font-size:13px;
  line-height:1.5;
}

.br-revision-attention-next{
  margin:10px 0 0;
  color:#b7bbc4;
  font-size:11px;
  line-height:1.5;
}

@media(max-width:700px){

  .br-revision-attention{
    flex-direction:column;
  }

  .br-revision-attention-icon{
    width:40px;
    height:40px;
    flex-basis:40px;
  }
}


/* OSBEATS BEAT REQUEST FINAL WORKSPACE POLISH 20260905 */

.br-revision-attention.is-requester{
  border-color:#3b404a;
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.015)
    );
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset;
}

.br-revision-attention.is-requester
.br-revision-attention-icon{
  border-color:#4f5662;
  background:#20242b;
}

.br-revision-attention.is-requester
.br-revision-attention-label{
  color:#d8dbe1;
}

.br-delivery-history{
  margin-top:20px;
  padding-top:18px;
  border-top:1px solid #2c3038;
}

.br-delivery-history-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}

.br-delivery-history-head h4{
  margin:5px 0 0;
  color:#fff;
  font-size:15px;
}

.br-delivery-history-count{
  flex:0 0 auto;
  padding:5px 8px;
  border:1px solid #363a43;
  color:#aeb3bd;
  font-size:9px;
  font-weight:800;
  text-transform:uppercase;
}

.br-delivery-history-list{
  display:grid;
  gap:12px;
}

.br-delivery-history-item{
  padding:13px;
  border:1px solid #2e323a;
  background:#0c0e13;
}

.br-delivery-history-meta{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:10px;
}

.br-delivery-history-meta > div{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.br-delivery-history-meta strong{
  color:#fff;
  font-size:12px;
}

.br-delivery-history-meta span{
  padding:3px 6px;
  border:1px solid #3a3f49;
  color:#b9bec8;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
}

.br-delivery-history-meta small{
  color:#858b96;
  font-size:9px;
}

.br-delivery-history-note{
  margin:8px 0 10px;
  padding:9px 10px;
  border-left:2px solid #575d68;
  background:#111319;
}

.br-delivery-history-note.br-history-revision{
  border-left-color:#ed1639;
}

.br-delivery-history-note strong{
  display:block;
  margin-bottom:4px;
  color:#fff;
  font-size:9px;
  text-transform:uppercase;
}

.br-delivery-history-note p{
  margin:0;
  color:#b5bac4;
  font-size:11px;
  line-height:1.5;
}

@media(max-width:700px){

  .br-delivery-history-head,
  .br-delivery-history-meta{
    flex-direction:column;
  }

}