*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden}
body{background:#f4f5f3;color:#1d2326;font:13px Arial,sans-serif}
header{height:52px;display:flex;align-items:center;gap:18px;padding:7px 14px;
  border-bottom:1px solid #aeb5b7;background:#fff}
strong{font-size:17px;white-space:nowrap}
label{display:flex;align-items:center;gap:7px}
select{width:112px;height:32px;border:1px solid #899295;background:#fff}
nav{display:flex;height:32px}
button{height:32px;padding:0 14px;border:1px solid #899295;border-right:0;
  background:#fff;color:#1d2326;cursor:pointer}
button:last-child{border-right:1px solid #899295}
button.active{background:#1d292c;color:#fff}
button:disabled{background:#eef0ef;color:#8a9294;cursor:not-allowed}
a{margin-left:auto;color:#006d77;text-decoration:none;font-weight:600}
main{width:100%;height:calc(100vh - 52px)}
iframe{display:block;width:100%;height:100%;border:0;background:#fff}
@media(max-width:760px){
  header{height:126px;display:grid;grid-template-columns:1fr auto;
    grid-template-rows:26px 32px 32px;gap:5px 10px}
  strong{font-size:15px}a{grid-column:2;grid-row:1;margin-left:0}
  label{grid-column:1/3;grid-row:2}select{flex:1;width:auto}
  nav{grid-column:1/3;grid-row:3;width:100%}
  nav button{flex:1;padding:0 5px}
  main{height:calc(100vh - 126px)}
}