:root{
  --mb-bg:#071924;
  --mb-panel:#0b1d28;
  --mb-panel2:#08151e;
  --mb-line:rgba(255,255,255,.16);
  --mb-soft:rgba(255,255,255,.08);
  --mb-text:#eef3f6;
  --mb-muted:#9eabb4;
  --mb-faint:#71808a;
  --mb-orange:#ff8a00;
  --mb-gold:#ffe6a7;
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;max-width:100%;overflow-x:hidden}
body{
  background:var(--mb-bg);
  color:var(--mb-text);
  font-family:Arial,Helvetica,sans-serif;
  padding:18px;
}
button,input,a{font:inherit}

.mb-workstation{
  min-height:calc(100vh - 36px);
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  border:1px solid var(--mb-line);
  border-radius:14px;
  overflow:hidden;
  background:var(--mb-panel);
  box-shadow:0 20px 55px rgba(0,0,0,.28);
}

.mb-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:15px 18px;
  border-bottom:1px solid var(--mb-line);
  background:linear-gradient(180deg,rgba(11,29,40,.99),rgba(7,22,31,.99));
}
.mb-kicker{
  margin:0 0 4px;
  color:var(--mb-gold);
  font-size:.62rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.mb-header h1{margin:0;color:var(--mb-orange);font-size:1.18rem;font-weight:600}
.mb-header p{margin:5px 0 0;color:var(--mb-muted);font-size:.72rem}
.mb-back{
  color:var(--mb-muted);
  border:1px solid var(--mb-line);
  border-radius:7px;
  padding:7px 10px;
  text-decoration:none;
  font-size:.66rem;
  white-space:nowrap;
}
.mb-back:hover{color:var(--mb-orange);border-color:rgba(255,138,0,.55)}

.mb-search-stage{
  padding:42px 24px 38px;
  border-bottom:1px solid var(--mb-line);
  background:
    radial-gradient(circle at 50% 0,rgba(43,57,66,.42),rgba(7,21,30,0) 68%);
}
.mb-search-wrap{width:min(860px,100%);margin:0 auto}
.mb-search-wrap label{
  display:block;
  margin-bottom:7px;
  color:#fff;
  font-size:.96rem;
  font-weight:600;
}
.mb-search-help{
  margin:0 0 17px;
  color:var(--mb-muted);
  font-size:.7rem;
  line-height:1.45;
}
.mb-search-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px;
  gap:10px;
}
.mb-search-row input{
  width:100%;
  min-width:0;
  height:46px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:8px;
  background:#06141d;
  color:#fff;
  padding:0 15px;
  outline:none;
  font-size:.8rem;
}
.mb-search-row input:focus{
  border-color:rgba(255,138,0,.72);
  box-shadow:0 0 0 2px rgba(255,138,0,.08);
}
.mb-search-row button{
  height:46px;
  border:1px solid rgba(255,138,0,.7);
  border-radius:8px;
  background:rgba(255,138,0,.11);
  color:#fff;
  cursor:pointer;
  font-size:.72rem;
}
.mb-search-row button:hover{color:var(--mb-orange);border-color:var(--mb-orange)}

.mb-results-stage{padding:16px;min-width:0}
.mb-results-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  margin-bottom:12px;
}
.mb-results-title{font-size:.78rem;font-weight:600}
.mb-results-summary{margin-top:3px;color:var(--mb-faint);font-size:.61rem}
.mb-filters{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.mb-filter{
  border:1px solid var(--mb-line);
  border-radius:999px;
  background:transparent;
  color:var(--mb-muted);
  padding:5px 9px;
  cursor:pointer;
  font-size:.59rem;
}
.mb-filter.is-active{color:var(--mb-orange);border-color:rgba(255,138,0,.55)}

.mb-results-layout{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:12px;
}
.mb-results,.mb-detail{
  min-width:0;
  border:1px solid var(--mb-line);
  border-radius:9px;
  background:var(--mb-panel2);
}
.mb-results{padding:7px}
.mb-result{
  width:100%;
  border:0;
  border-bottom:1px solid var(--mb-soft);
  background:transparent;
  color:inherit;
  text-align:left;
  padding:11px;
  cursor:pointer;
}
.mb-result:last-child{border-bottom:0}
.mb-result:hover,.mb-result.is-selected{background:rgba(255,255,255,.035)}
.mb-result.is-selected{box-shadow:inset 2px 0 var(--mb-orange)}
.mb-result-top{display:flex;justify-content:space-between;gap:12px}
.mb-result-title{font-size:.72rem;font-weight:600;color:#fff}
.mb-result-type{
  flex:0 0 auto;
  color:var(--mb-gold);
  font-size:.54rem;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.mb-result-meta{margin-top:5px;color:var(--mb-muted);font-size:.61rem;line-height:1.4}
.mb-result-match{margin-top:5px;color:var(--mb-faint);font-size:.58rem}

.mb-detail{padding:16px}
.mb-detail-empty{color:var(--mb-faint);font-size:.65rem;line-height:1.5}
.mb-detail-type{color:var(--mb-gold);font-size:.56rem;text-transform:uppercase;letter-spacing:.06em}
.mb-detail h2{margin:7px 0 6px;font-size:.86rem}
.mb-detail-location{color:var(--mb-muted);font-size:.61rem;line-height:1.45;word-break:break-word}
.mb-detail-description{
  margin:14px 0;
  padding-top:12px;
  border-top:1px solid var(--mb-soft);
  color:var(--mb-muted);
  font-size:.64rem;
  line-height:1.5;
}
.mb-tags{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0 15px}
.mb-tag{border:1px solid var(--mb-line);border-radius:999px;padding:4px 7px;color:var(--mb-muted);font-size:.55rem}
.mb-detail-action{
  width:100%;
  min-height:34px;
  border:1px solid rgba(255,138,0,.62);
  border-radius:7px;
  background:rgba(255,138,0,.10);
  color:#fff;
  cursor:pointer;
  font-size:.65rem;
}
.mb-detail-action:hover{color:var(--mb-orange)}
.mb-no-results{padding:28px;color:var(--mb-muted);font-size:.68rem;text-align:center}

.mb-footer{
  min-height:45px;
  padding:8px 14px;
  border-top:1px solid var(--mb-line);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  color:var(--mb-faint);
  font-size:.61rem;
}
.mb-footer strong{color:var(--mb-gold);font-weight:600}

@media(max-width:1024px){
  body{padding:12px}
  .mb-workstation{min-height:calc(100vh - 24px)}
  .mb-search-stage{padding:34px 20px 31px}
  .mb-results-layout{grid-template-columns:minmax(0,1fr) 310px}
}
@media(max-width:820px){
  .mb-results-layout{grid-template-columns:1fr}
  .mb-detail{min-height:150px}
}
@media(max-width:640px){
  body{padding:0}
  .mb-workstation{min-height:100vh;border:0;border-radius:0;box-shadow:none}
  .mb-header{align-items:flex-start;padding:13px 12px}
  .mb-search-stage{padding:27px 12px 25px}
  .mb-search-row{grid-template-columns:1fr}
  .mb-search-row button{height:39px}
  .mb-results-stage{padding:11px}
  .mb-results-head{align-items:flex-start;flex-direction:column}
  .mb-filters{justify-content:flex-start}
  .mb-footer{align-items:flex-start;flex-direction:column;gap:4px}
}
@media(max-width:420px){
  .mb-header{display:grid;grid-template-columns:1fr}
  .mb-back{justify-self:start}
  .mb-search-stage{padding-top:22px}
  .mb-search-row input{height:44px}
  .mb-result-top{display:block}
  .mb-result-type{display:block;margin-top:4px}
}
