body{margin:0;font-family:sans-serif;background:#dff1fb}
#app{display:grid;grid-template-columns:45% 55%;height:100vh}
#seaPanel{position:relative;padding:20px;background:linear-gradient(#dff1fb,#cbe8fa)}
#observationArea{position:relative;height:calc(100vh - 90px)}
.observation{
position:absolute;width:150px;height:150px;border-radius:50%;
background:rgba(255,255,255,.9);
display:flex;align-items:center;justify-content:center;
text-align:center;padding:10px;cursor:pointer;
box-shadow:0 10px 25px rgba(0,0,0,.15)}
.selected{outline:4px solid #7ec3ff}
#detailPanel{padding:24px}
textarea,input{width:100%;box-sizing:border-box;margin-bottom:16px}
textarea{height:90px}